﻿/* ============================================================
   ch04「有限状态机：状态的舞蹈」章节专属样式
   境界：炼气四层·状态之舞 · 翠绿 var(--accent)
   全部色值走 tokens 变量；状态爆炸之雾赤红、顿悟金、毛刺琥珀为章节专用变量。
   类名体系与 ch01/ch02 对齐（.scene/.narr-box/.stage/.glass/.btn/.data-row 等）。
   ============================================================ */

/* ---------- 章节境界色覆写：翠绿炼气 ---------- */
:root, :root[data-theme="light"] {
  --accent: #10B981;
  --accent-ink: #059669;
  --accent-soft: rgba(16, 185, 129, 0.10);
  --glass-line: rgba(16, 185, 129, 0.20);
  --glow: 0 0 18px rgba(16, 185, 129, 0.26);
  --on-accent: #FFFFFF;
}
/* ---------- 章节专用叙事色（之雾/毛刺/顿悟/幽灵） ---------- */
:root {
  --ch-boss: var(--ch-boss);          /* 状态爆炸之雾 · 赤红 */
  --ch-boss-ink: #DC2626;
  --ch-boss-soft: rgba(239, 68, 68, 0.14);
  --ch-amber: var(--ch-amber);         /* 状态裂变/毛刺琥珀 */
  --ch-amber-soft: rgba(245, 158, 11, 0.14);
  --ch-epiphany: var(--ch-epiphany);      /* 顿悟金 */
  --ch-epiphany-soft: rgba(251, 191, 36, 0.16);
  --ch-noise: #6B7280;         /* 雾墙/幽灵灰 */
  --ch-noise-soft: rgba(107, 114, 128, 0.16);
  --ch-merge: #6366F1;         /* 状态合并靛蓝 */
  --ch-merge-soft: rgba(99, 102, 241, 0.14);
  --ch-state-node: var(--accent);    /* 状态节点翠绿 */
  --ch-state-accept: #34D399;  /* 接受态翠绿辅色 */
  --ch-state-initial: var(--ch-amber); /* 初始态琥珀 */
  --ch-edge: rgba(52, 211, 153, 0.6); /* 转移边翠绿 */
  --ch-ghost: #6B7280;         /* 幽灵状态灰 */
}
.dim.small { font-size: 0.72rem; }
.op-hint {
  position: absolute; bottom: 5vh; left: 0; right: 0;
  font-size: 0.68rem; letter-spacing: 0.3em; color: var(--text-3); opacity: 0;
  font-family: var(--font-mono);
}
/* ---------- 物品栏（本命符 / 状态账 / 排除刻痕） ---------- */
#inventory {
  position: fixed; left: var(--sp-3); bottom: var(--sp-3); z-index: 110;
  display: flex; gap: var(--sp-2); align-items: flex-end;
}
/* ---------- 场景通用 ---------- */
.narr { max-width: var(--content-w); }
.stage h4 { align-self: flex-start; margin-top: var(--sp-3); color: var(--accent-ink); }
/* 通用画布 */
.timing-cv, .wave-cv, .kmap-cv, .vtc-cv, .boss-cv {
  width: 100%; max-width: 640px; border-radius: var(--r-md);
  background: var(--bg-sunk); border: 1px solid var(--line);
  touch-action: none;
}

.seq-row { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
.input-grow-row { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
.convert-controls { display: flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
.forge-controls { display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: center; }
.impl-controls { display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: center; }

/* ---------- S0 STD 合法性 + 五元组 ---------- */
.std-zone, .tuple-zone {
  margin-top: var(--sp-4); padding: var(--sp-4);
  border: 1px solid var(--glass-line); border-radius: var(--r-md);
  background: var(--accent-soft);
  animation: simIn 600ms var(--ease-out);
}
.std-check-grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-2); width: 100%; }
.std-check-item {
  display: flex; align-items: center; gap: var(--sp-3); min-height: 56px;
  padding: var(--sp-2) var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg-elev); cursor: pointer; text-align: left;
  transition: all var(--dur-fast) var(--ease-out);
}
.std-check-item:hover { border-color: var(--accent); transform: translateX(2px); }
.std-check-item .check-ico { font-size: 1.2rem; color: var(--ch-boss); }
.std-check-item .check-name { font-weight: 600; color: var(--text-1); }
.std-check-item .check-hint { font-size: 0.72rem; color: var(--text-3); }
.std-check-item.fixed { border-color: var(--accent); background: var(--accent-soft); }
.std-check-item.fixed .check-ico { color: var(--accent); }
.std-check-item.fail { border-color: var(--ch-boss); background: var(--ch-boss-soft); }

.tuple-grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-2); width: 100%; }
.tuple-slot {
  display: flex; align-items: center; gap: var(--sp-3); min-height: 56px;
  padding: var(--sp-2) var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: rgba(52, 211, 153, 0.06); transition: all var(--dur-fast) var(--ease-out);
}
.tuple-slot .slot-key { font-family: var(--font-mono); font-weight: 700; color: var(--accent-ink); min-width: 2.5em; }
.tuple-slot .slot-desc { font-size: 0.78rem; color: var(--text-3); flex: 1; }
.tuple-slot .slot-val { font-family: var(--font-mono); color: var(--text-2); font-size: var(--fs-small); }
.tuple-slot.filled { border-color: var(--accent); background: rgba(16, 185, 129, 0.16); }
.tuple-slot.filled .slot-val { color: var(--accent); }

/* ---------- S1/S2 Moore/Mealy STD 展示 ---------- */
.moore-std, .mealy-std {
  width: 100%; max-width: 560px; padding: var(--sp-3);
  border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg-sunk);
  display: flex; flex-wrap: wrap; gap: var(--sp-2); justify-content: center;
  min-height: 80px; align-items: center;
}
.state-node {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-width: 56px; min-height: 56px; padding: var(--sp-1) var(--sp-2);
  border: 2px solid var(--ch-state-node); border-radius: 999px;
  background: var(--bg-elev); color: var(--text-1); font-family: var(--font-mono); font-size: var(--fs-small);
  position: relative; transition: all var(--dur-fast) var(--ease-out);
}
.state-node.initial { border-color: var(--ch-state-initial); }
.state-node.accept { border: 2px double var(--ch-state-accept); }
.state-node .node-out { font-size: 0.6rem; color: var(--accent); margin-top: 2px; }
.state-node.active { box-shadow: 0 0 0 3px var(--accent-soft), var(--glow); transform: scale(1.1); }
.state-node.accept.active { box-shadow: 0 0 0 3px var(--ch-epiphany-soft), 0 0 18px var(--ch-epiphany-soft); }
.trans-arrow {
  display: flex; align-items: center; gap: 2px; color: var(--ch-edge);
  font-family: var(--font-mono); font-size: 0.7rem;
}
.trans-arrow .edge-label { color: var(--ch-amber); font-weight: 600; }

/* ---------- S3 转换天平 ---------- */
.convert-display {
  width: 100%; min-height: 60px; padding: var(--sp-3);
  border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg-sunk);
  font-family: var(--font-mono); font-size: var(--fs-small); text-align: center; color: var(--text-2);
}
.balance-row { display: flex; align-items: center; gap: var(--sp-3); width: 100%; justify-content: center; margin-top: var(--sp-3); }
.balance-pan {
  display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 120px;
  padding: var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg-elev); transition: transform var(--dur-slow) var(--ease-out);
}
.balance-pan .readout { font-size: var(--fs-title); font-family: var(--font-mono); }
#s3-pan-moore { border-color: var(--accent); }
#s3-pan-mealy { border-color: var(--ch-amber); }
.balance-pan.heavy { transform: translateY(8px); box-shadow: var(--shadow); }
.balance-beam {
  flex: 1; max-width: 120px; height: 8px; border-radius: 4px;
  background: linear-gradient(90deg, var(--accent), var(--ch-amber));
  transition: transform var(--dur-slow) var(--ease-out);
  transform-origin: center;
}

/* ---------- S4 矩阵 ---------- */
.tt-table { width: 100%; max-width: 520px; border-collapse: collapse; font-family: var(--font-mono); font-size: var(--fs-small); margin: var(--sp-3) 0; }
.tt-table th, .tt-table td { border: 1px solid var(--line-strong); padding: var(--sp-1) var(--sp-2); text-align: center; }
.tt-table th { color: var(--accent); }
.tt-row-1 { background: var(--accent-soft); }
.matrix-viz {
  width: 100%; min-height: 60px; padding: var(--sp-3); margin-top: var(--sp-3);
  border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg-sunk);
  display: flex; align-items: center; justify-content: center; gap: 2px; flex-wrap: wrap;
}
.matrix-cell {
  width: 14px; height: 14px; border-radius: 2px;
  background: var(--accent-soft); border: 1px solid var(--line);
  transition: all var(--dur-fast) var(--ease-out);
}
.matrix-cell.filled { background: var(--accent); }
.matrix-cell.explode { background: var(--ch-boss); }

/* ---------- S5 编码 ---------- */
.encode-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--sp-3); width: 100%; }
@media (max-width: 560px) { .encode-row { grid-template-columns: 1fr; } }
.encode-card {
  padding: var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: transparent; cursor: pointer; text-align: center;
  transition: all var(--dur-fast) var(--ease-out);
}
.encode-card:hover { border-color: var(--accent); transform: translateY(-3px); }
.encode-card.active { border-color: var(--accent); background: var(--accent-soft); box-shadow: var(--glow); }
.encode-card .e-name { font-family: var(--font-serif); font-size: var(--fs-sub); }
.encode-card .e-bits { font-family: var(--font-mono); color: var(--accent); font-size: var(--fs-small); margin-top: 4px; }
.ff-slider-row { display: flex; align-items: center; gap: var(--sp-3); width: 100%; margin-top: var(--sp-3); }
.ff-slider-row input[type="range"] { flex: 1; }
.wave-cv { height: 120px; }

/* ---------- S6 隐含表 ---------- */
.impl-table-wrap { display: flex; gap: var(--sp-4); flex-wrap: wrap; justify-content: center; align-items: flex-start; }
.impl-table { display: grid; gap: 2px; }
.impl-cell {
  display: flex; align-items: center; justify-content: center;
  min-width: 40px; min-height: 40px;
  border: 1px solid var(--line-strong); border-radius: var(--r-sm);
  background: rgba(52, 211, 153, 0.06); font-family: var(--font-mono); font-size: var(--fs-small);
  color: var(--text-3); cursor: pointer; transition: all var(--dur-fast) var(--ease-out);
}
.impl-cell:hover { border-color: var(--accent); }
.impl-cell.eq { background: rgba(16, 185, 129, 0.4); color: var(--accent-ink); border-color: var(--accent); font-weight: 700; }
.impl-cell.neq { background: var(--ch-boss-soft); color: var(--ch-boss); border-color: var(--ch-boss); font-weight: 700; }
.impl-cell.cond { background: var(--ch-amber-soft); color: var(--ch-amber); border-color: var(--ch-amber); font-weight: 700; }
.impl-cell.prop { background: rgba(239, 68, 68, 0.22); color: var(--ch-boss); border-color: rgba(239, 68, 68, 0.4); }
.impl-cell.diag { background: transparent; border: none; cursor: default; color: var(--accent-ink); font-weight: 700; }
.impl-legend { display: flex; flex-direction: column; gap: var(--sp-1); font-size: var(--fs-small); }
.lg { padding: 2px 8px; border-radius: 999px; font-family: var(--font-mono); }
.lg-eq { background: rgba(16, 185, 129, 0.4); color: var(--accent-ink); }
.lg-neq { background: var(--ch-boss-soft); color: var(--ch-boss); }
.lg-cond { background: var(--ch-amber-soft); color: var(--ch-amber); }
.irreducible-label {
  margin-top: var(--sp-3); padding: var(--sp-2) var(--sp-4);
  border: 1px solid var(--ch-boss); border-radius: 999px;
  background: var(--ch-boss-soft); color: var(--ch-boss);
  font-weight: 700; text-align: center; animation: pulseRed 1.2s var(--ease-out) 2;
}
@keyframes pulseRed { 0%,100% { box-shadow: 0 0 0 0 var(--ch-boss-soft); } 50% { box-shadow: 0 0 0 8px transparent; } }

/* ---------- S7 三段式电路 ---------- */
.circuit-three-stage {
  width: 100%; max-width: 560px; padding: var(--sp-3); margin-top: var(--sp-3);
  border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg-sunk);
  display: flex; flex-direction: column; gap: var(--sp-2);
}
.circuit-stage {
  display: flex; align-items: center; gap: var(--sp-2); min-height: 52px;
  padding: var(--sp-2) var(--sp-3); border: 1px dashed var(--line-strong); border-radius: var(--r-md);
  background: transparent; color: var(--text-3); font-family: var(--font-mono); font-size: var(--fs-small);
  opacity: 0.45; transition: all var(--dur-mid) var(--ease-out);
}
.circuit-stage .stage-ico { font-size: 1.1rem; }
.circuit-stage.lit { opacity: 1; border-style: solid; border-color: var(--accent); background: var(--accent-soft); color: var(--accent); box-shadow: var(--glow); }
.circuit-stage .stage-desc { flex: 1; }
.counter-result, .ghost-result {
  margin-top: var(--sp-2); padding: var(--sp-3); border-radius: var(--r-md);
  background: var(--bg-sunk); font-size: var(--fs-small); color: var(--text-2); min-height: 2em;
}
.ghost-result.bad { border: 1px solid var(--ch-boss); background: var(--ch-boss-soft); color: var(--ch-boss); }
.ghost-result.good { border: 1px solid var(--accent); background: var(--accent-soft); color: var(--accent); }

/* ---------- S8 综合之台 ---------- */
.work-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--sp-3); width: 100%; }
@media (max-width: 720px) { .work-grid { grid-template-columns: 1fr; } }
.work-card {
  padding: var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg-elev); display: flex; flex-direction: column; gap: var(--sp-2);
  transition: all var(--dur-fast) var(--ease-out);
}
.work-card.done { border-color: var(--accent); background: var(--accent-soft); }
.work-card.explode { border-color: var(--ch-boss); background: var(--ch-boss-soft); }
.work-head { font-weight: 600; color: var(--accent-ink); font-size: var(--fs-small); }
.work-result { font-size: 0.78rem; color: var(--text-2); min-height: 2.5em; }
.state-explode-meter {
  display: flex; align-items: center; gap: var(--sp-3); width: 100%; justify-content: center; margin-top: var(--sp-3);
  flex-wrap: wrap;
}
.state-explode-meter .readout.big { color: var(--ch-boss); }

/* ---------- S9 Boss 战 · 排除法收网器 ---------- */
.boss-stage { width: 100%; display: flex; flex-direction: column; gap: var(--sp-4); align-items: center; }
.boss-entity {
  width: 100%; padding: var(--sp-4); border: 1px solid var(--ch-boss); border-radius: var(--r-md);
  background: var(--ch-boss-soft); text-align: center; position: relative; overflow: hidden;
  transition: opacity var(--dur-slow) var(--ease-out);
}
.boss-wave { font-family: var(--font-mono); color: var(--ch-boss); letter-spacing: 0.2em; font-size: 1.3rem; }
.boss-entity.cracked .boss-wave { color: var(--accent); }
.boss-entity.disintegrated { opacity: 0.3; }
.q-option.eliminated { border-color: var(--ch-noise); color: var(--ch-noise); text-decoration: line-through; opacity: 0.5; }
.q-refute { margin-top: var(--sp-3); padding: var(--sp-3); border-left: 3px solid var(--ch-boss); background: var(--ch-boss-soft); border-radius: 0 var(--r-sm) var(--r-sm) 0; font-size: var(--fs-small); color: var(--text-2); }
.scar-grid { display: flex; gap: var(--sp-2); justify-content: center; flex-wrap: wrap; }
.scar-card {
  min-height: 44px; padding: var(--sp-2) var(--sp-3); border: 1px solid var(--ch-noise-soft); border-radius: var(--r-md);
  background: transparent; color: var(--text-3); font-size: 0.78rem; text-align: center;
  opacity: 0.5; transition: all var(--dur-mid) var(--ease-out);
}
/* ---------- S10 知识图谱点亮 ---------- */
.frag-pool { display: flex; flex-wrap: wrap; gap: var(--sp-2); justify-content: center; }
.chain-slot {
  min-height: 40px; padding: var(--sp-1) var(--sp-3);
  border: 1px dashed var(--line-strong); border-radius: var(--r-sm);
  display: flex; align-items: center; gap: var(--sp-2);
  font-size: 0.82rem; color: var(--text-3);
  transition: all var(--dur-fast) var(--ease-out);
}
.gate-text {
  font-family: var(--font-mono); font-size: clamp(1.4rem, 4.5vw, 2.2rem);
  letter-spacing: 0.15em; text-align: center; margin: var(--sp-5) 0;
}
.gate-text span { color: var(--text-3); transition: color var(--dur-slow) var(--ease-out), text-shadow var(--dur-slow); }
@media (prefers-reduced-motion: reduce) {
  .stage.collapse, .irreducible-label { animation: none; }
}

/* ---------- S0 下注按钮 ---------- */
.bet-row { display: flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; width: 100%; }
.bet-item {
  min-height: 48px; padding: var(--sp-2) var(--sp-4);
  border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg-elev); color: var(--text-1); cursor: pointer;
  font-family: var(--font-serif); font-size: var(--fs-small);
  transition: all var(--dur-fast) var(--ease-out);
}
.bet-item:hover { border-color: var(--accent); transform: translateY(-2px); }
.bet-item.faded { opacity: 0.4; border-color: var(--ch-boss); color: var(--ch-boss); }
.bet-item.lit { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); box-shadow: var(--glow); }

/* ---------- S0 STD 检查卡片 ---------- */
.std-check-grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-2); width: 100%; }
.check-card {
  display: flex; flex-direction: column; gap: 4px; min-height: 56px;
  padding: var(--sp-2) var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg-elev); cursor: pointer;
  transition: all var(--dur-fast) var(--ease-out);
}
.check-card:hover { border-color: var(--accent); }
.check-card .check-label { font-weight: 600; color: var(--text-1); font-size: var(--fs-small); }
.check-card .check-desc { color: var(--text-3); font-size: 0.72rem; }
.check-card .check-fix { color: var(--ch-boss); font-size: 0.72rem; font-family: var(--font-mono); }
.check-card.fixed { border-color: var(--accent); background: var(--accent-soft); }
.check-card.fixed .check-fix { color: var(--accent); }
.check-card .check-fix.fixed-text { color: var(--accent); font-weight: 600; }

/* ---------- S0 五元组槽位 ---------- */
.tuple-grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-2); width: 100%; }
.tuple-slot {
  display: flex; align-items: center; gap: var(--sp-3); min-height: 56px;
  padding: var(--sp-2) var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: rgba(52, 211, 153, 0.06); transition: all var(--dur-fast) var(--ease-out);
}
.tuple-slot .tuple-sym { font-family: var(--font-mono); font-weight: 700; color: var(--accent-ink); min-width: 1.5em; font-size: 1.1rem; }
.tuple-slot .tuple-label { font-size: 0.78rem; color: var(--text-3); flex: 1; }
.tuple-slot .tuple-hint { font-family: var(--font-mono); color: var(--text-2); font-size: var(--fs-small); flex: 1; }
.tuple-slot .tuple-btn { min-height: 36px; padding: 4px 12px; font-size: var(--fs-small); }
.tuple-slot.filled { border-color: var(--accent); background: rgba(16, 185, 129, 0.16); }
.tuple-slot.filled .tuple-hint { color: var(--accent); }
.tuple-slot .tuple-hint.filled-text { color: var(--accent); font-weight: 600; }

/* ---------- S1/S2 SVG 状态转移图 ---------- */
.std-node { cursor: default; }
.std-circle { fill: var(--bg-elev); stroke: var(--ch-state-node); stroke-width: 2; }
.std-label { fill: var(--text-1); font-family: var(--font-mono); font-size: 11px; }
.std-out { fill: var(--accent-ink); font-family: var(--font-mono); font-size: 10px; }
.std-edge { fill: none; stroke: var(--ch-edge); stroke-width: 1.5; }
.std-edge.self { stroke-dasharray: none; }
.std-edge-label { fill: var(--ch-amber); font-family: var(--font-mono); font-size: 9px; }

/* ---------- S4 矩阵单元状态 ---------- */
.matrix-cell.ok { background: var(--accent-soft); border-color: var(--accent); }
.matrix-cell.warn { background: var(--ch-amber-soft); border-color: var(--ch-amber); }
.matrix-cell.bad { background: var(--ch-boss-soft); border-color: var(--ch-boss); }

/* ---------- S5 编码按钮 ---------- */
.encode-btn {
  min-height: 48px; padding: var(--sp-2) var(--sp-3);
  border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: transparent; color: var(--text-1); cursor: pointer;
  font-family: var(--font-serif); font-size: var(--fs-small);
  transition: all var(--dur-fast) var(--ease-out);
}
.encode-btn:hover { border-color: var(--accent); transform: translateY(-2px); }
.encode-btn.active { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); box-shadow: var(--glow); }

/* ---------- S6 隐含表行布局 ---------- */
.impl-table { display: flex; flex-direction: column; gap: 2px; }
.impl-row { display: flex; gap: 2px; }

/* ---------- S7 三段式电路 SVG ---------- */
.forge-box { fill: var(--bg-sunk); stroke: var(--line-strong); stroke-width: 1.5; stroke-dasharray: 4 3; }
.forge-box.lit { fill: var(--accent-soft); stroke: var(--accent); stroke-dasharray: none; filter: drop-shadow(0 0 6px var(--accent-soft)); }
.forge-box.pending { opacity: 0.4; }
.forge-label { fill: var(--text-2); font-family: var(--font-mono); font-size: 11px; }
.forge-box.lit + .forge-label, .forge-label { fill: var(--text-2); }
.forge-arrow { stroke: var(--accent); stroke-width: 1.5; fill: none; color: var(--accent); }
.forge-arrow.feedback { stroke: var(--ch-amber); stroke-dasharray: 3 2; }
.counter-result, .ghost-result {
  margin-top: var(--sp-2); padding: var(--sp-3); border-radius: var(--r-md);
  background: var(--bg-sunk); font-size: var(--fs-small); color: var(--text-2); min-height: 2em;
}
.result-line { padding: 2px 0; }
.result-line.ok { color: var(--accent); }
.result-line.warn { color: var(--ch-amber); }

/* ---------- S8 工作结果 ---------- */
.work-result .result-line { padding: 2px 0; font-size: 0.78rem; }
.work-result .result-line.ok { color: var(--accent); }
.work-result .result-line.warn { color: var(--ch-amber); }

/* ---------- 转换步骤显示 ---------- */
.convert-step { padding: 4px 0; font-size: var(--fs-small); color: var(--text-2); }
.convert-step.warn { color: var(--ch-amber); font-weight: 600; }

/* ---------- 顿悟框 ---------- */
.insight {
  margin-top: var(--sp-4); padding: var(--sp-3) var(--sp-4);
  border: 1px solid var(--ch-epiphany); border-radius: var(--r-md);
  background: var(--ch-epiphany-soft); color: var(--text-1);
  font-family: var(--font-serif); font-size: var(--fs-small); line-height: 1.7;
  opacity: 0; transform: translateY(12px); transition: all var(--dur-slow) var(--ease-out);
}
/* ---------- 焦点呼吸（解锁按钮） ---------- */
.focus-breath { animation: focusBreath 2s var(--ease-in-out) infinite; }
@keyframes focusBreath { 0%,100% { box-shadow: 0 0 0 0 var(--accent-soft); } 50% { box-shadow: 0 0 0 6px transparent; } }

/* 移动端触摸目标兜底 */
button, .q-option, .std-check-item, .encode-btn, .encode-card, .impl-cell, .frag-node, .chain-slot, .scar-card, .work-card, .bet-item, .check-card, .tuple-btn {
  min-height: 44px;
}
.impl-cell { min-height: 40px; }
