/* 动效（克制、少量） */
@keyframes blink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes wave { 0%, 100% { height: 22%; } 50% { height: 100%; } }
@keyframes drawLine { to { stroke-dashoffset: 0; } }

/* 打字机光标 */
.typewriter .caret { display: inline-block; width: .55em; height: 1em; background: var(--accent); margin-left: 3px; vertical-align: -1px; animation: blink 1.1s steps(2, start) infinite; }

/* 滚动揭示 */
.reveal { opacity: 0; transform: translateY(14px); transition: opacity .55s var(--ease), transform .55s var(--ease); }
.reveal.is-visible { opacity: 1; transform: none; }

/* 页面进入 */
.page-enter { animation: fadeIn .4s var(--ease) both; }

/* 连线绘制 */
.draw { stroke-dasharray: var(--len, 200); stroke-dashoffset: var(--len, 200); animation: drawLine 1.4s var(--ease) forwards; }

/* 命令面板 */
.cmd-panel { position: fixed; inset: 0; z-index: 100; display: none; align-items: flex-start; justify-content: center; padding-top: 16vh; background: rgba(0, 0, 0, .6); }
.cmd-panel.open { display: flex; animation: fadeIn .15s var(--ease); }
.cmd-box { width: min(560px, 92vw); background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md); box-shadow: 0 24px 80px rgba(0, 0, 0, .55); overflow: hidden; animation: fadeUp .2s var(--ease); }
.cmd-input { display: flex; align-items: center; gap: 11px; padding: 15px 18px; border-bottom: 1px solid var(--border-subtle); }
.cmd-input .prompt { flex-shrink: 0; }
.cmd-input input { flex: 1; background: transparent; border: 0; outline: 0; color: var(--text); font-family: var(--mono); font-size: 15px; caret-color: var(--accent); }
.cmd-list { max-height: 340px; overflow-y: auto; padding: 8px; }
.cmd-item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 7px; cursor: pointer; color: var(--muted); font-size: 14px; }
.cmd-item .k { color: var(--accent); width: 18px; text-align: center; font-family: var(--mono); }
.cmd-item .d { color: var(--faint); font-size: 12.5px; font-family: var(--mono); }
.cmd-item:hover, .cmd-item.sel { background: var(--surface-hover); color: var(--text); }
.cmd-empty { padding: 20px; color: var(--faint); text-align: center; font-size: 13.5px; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}
