/* ============================================================
   ch05「算法复杂度：效率的度量」章节专属样式
   境界：炼气五层·算法观澜 · 翠绿 var(--accent)
   Boss：停机之渊（不可判定性化身，紫黑漩涡）
   导师：诺依曼老祖（执渐近之尺）
   三条贯穿机制：①停机账本 ②排除刻痕 ③复杂度曲线
   全部色值走 tokens 变量；Boss 紫黑/赤红、顿悟金、退化琥珀为章节专用变量。
   类名体系与 ch01/ch02 对齐（.scene/.narr-box/.stage/.glass/.btn/.data-row 等）。
   ============================================================ */

/* ---------- 章节境界色覆写：翠绿炼气（与 ch01 同境界色） ---------- */
: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-abyss: #1E1B4B;         /* 深渊紫黑漩涡 */
  --ch-abyss-soft: rgba(30, 27, 75, 0.55);
  --ch-abyss-still: #C0C0C0;   /* 接纳后深渊化镜银灰 */
  --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-mirror: #8B5CF6;        /* 递归之镜紫 */
  --ch-mirror-soft: rgba(139, 92, 246, 0.18);
  --ch-noise: #6B7280;         /* 噪声/边角灰 */
  --ch-noise-soft: rgba(107, 114, 128, 0.16);
  --ch-curve-clean: var(--accent);   /* 复杂度曲线翠绿 */
  --ch-curve-mid: #06B6D4;     /* 复杂度曲线靛青 */
  --ch-curve-bad: var(--ch-boss);     /* 复杂度曲线赤红 */
  --ch-reduction: var(--ch-amber);     /* 归约箭头琥珀 */
  --ch-sat-core: var(--ch-epiphany);      /* SAT 核心金 */
}
.dlg.abyss { border-left-color: var(--ch-mirror); box-shadow: var(--shadow), 0 0 18px var(--ch-mirror-soft); }
.dlg.abyss .who { background: var(--ch-mirror); color: #FFF; }
.dlg.abyss .avatar { border-color: var(--ch-mirror); }
.dlg.abyss p { font-style: italic; color: var(--text-2); }

/* ---------- 物品栏（本命符·算法之眼 / 停机账 / 刻痕） ---------- */
#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); }
/* 通用画布 */
.chain-cv, .curve-cv, .tree-cv, .race-cv, .hash-cv, .graph-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;
}

/* ---------- S0 三令牌反直觉下注 ---------- */
.token-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--sp-3); width: 100%; }
@media (max-width: 560px) { .token-row { grid-template-columns: 1fr; } }
.token-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);
  display: flex; flex-direction: column; gap: var(--sp-1);
}
.token-card:hover { border-color: var(--accent); transform: translateY(-3px); }
.token-card[data-token="A"] { border-color: var(--accent); }
.token-card[data-token="B"] { border-color: var(--ch-noise); }
.token-card[data-token="C"] { border-color: var(--ch-amber); }
.token-card.chosen { box-shadow: var(--glow); }
.token-card.exec-wrong { border-color: var(--ch-boss); background: var(--ch-boss-soft); }
.token-card.exec-slow { border-color: var(--ch-amber); background: var(--ch-amber-soft); }
.token-card.exec-overflow { border-color: var(--ch-boss); background: var(--ch-amber-soft); }
.token-name { font-family: var(--font-serif); font-size: var(--fs-sub); color: var(--text-1); }
.token-pseudocode { font-family: var(--font-mono); font-size: 0.72rem; color: var(--text-3); min-height: 3em; }
.token-complexity { font-family: var(--font-mono); font-size: 0.7rem; color: var(--accent); }
.token-bet-btn {
  min-height: 36px; padding: var(--sp-1) var(--sp-2);
  border: 1px solid var(--line-strong); border-radius: 999px;
  background: transparent; color: var(--text-2); cursor: pointer;
  font-size: 0.72rem; transition: all var(--dur-fast);
}
.token-bet-btn:hover { border-color: var(--accent); color: var(--accent); }
.token-bet-btn:disabled { opacity: 0.5; cursor: default; }

.result-panel { margin-top: var(--sp-3); padding: var(--sp-3); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg-sunk); text-align: center; min-height: 2.5em; }
.result-panel.wrong { border-color: var(--ch-boss); color: var(--ch-boss); background: var(--ch-boss-soft); }
.result-panel.slow { border-color: var(--ch-amber); color: var(--ch-amber); background: var(--ch-amber-soft); }
.result-panel.overflow { border-color: var(--ch-boss); color: var(--ch-boss); background: var(--ch-amber-soft); }

.meter-bar { width: 100%; height: 10px; border-radius: 5px; background: var(--bg-sunk); border: 1px solid var(--line); overflow: hidden; margin-top: var(--sp-1); }
.meter-fill { height: 100%; width: 0%; background: var(--accent); border-radius: 5px; transition: width var(--dur-mid) var(--ease-out), background var(--dur-fast); }
.meter-fill.warn { background: var(--ch-amber); }
.meter-fill.bad { background: var(--ch-boss); }

/* S0 三槽定义发现 */
.def-slots { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--sp-3); width: 100%; margin-top: var(--sp-3); }
@media (max-width: 560px) { .def-slots { grid-template-columns: 1fr; } }
.def-slot {
  min-height: 80px; padding: var(--sp-3); border: 1px dashed var(--line-strong); border-radius: var(--r-md);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  text-align: center; transition: all var(--dur-fast) var(--ease-out);
}
.def-slot.filled { border-style: solid; border-color: var(--accent); background: var(--accent-soft); box-shadow: var(--glow); }
.def-slot .slot-label { font-size: 0.72rem; color: var(--text-3); }
.def-slot.filled .slot-label { color: var(--accent); }
.def-cost-row { display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: center; margin-top: var(--sp-2); }
.cost-chip {
  min-height: 36px; padding: var(--sp-1) var(--sp-3); border: 1px solid var(--line-strong); border-radius: 999px;
  background: transparent; color: var(--text-2); cursor: pointer; font-size: 0.72rem;
  transition: all var(--dur-fast);
}
.cost-chip:hover { border-color: var(--accent); color: var(--accent); }
.cost-chip.used { opacity: 0.4; pointer-events: none; }
.cost-chip.placed { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }

.inscription { margin-top: var(--sp-3); padding: var(--sp-4); border: 1px solid var(--accent); border-radius: var(--r-md); background: var(--accent-soft); color: var(--accent); font-family: var(--font-serif); text-align: center; }

/* ---------- S1 渐近之尺 · 九函数排序 ---------- */
.func-pool { display: flex; flex-wrap: wrap; gap: var(--sp-2); justify-content: center; }
.func-chip {
  min-height: 44px; padding: var(--sp-2) var(--sp-3); border: 1px solid var(--line-strong); border-radius: 999px;
  background: transparent; color: var(--text-2); cursor: pointer; font-family: var(--font-mono); font-size: var(--fs-small);
  transition: all var(--dur-fast) var(--ease-out);
}
.func-chip:hover { border-color: var(--accent); color: var(--accent); }
.func-chip.placed { color: var(--accent); border-color: var(--accent); background: var(--accent-soft); opacity: 0.5; pointer-events: none; }
.scale-rail { display: flex; flex-direction: column; gap: var(--sp-1); width: 100%; max-width: 480px; }
.scale-slot {
  min-height: 40px; padding: var(--sp-2) var(--sp-3); border: 1px dashed var(--line-strong); border-radius: var(--r-sm);
  display: flex; align-items: center; gap: var(--sp-2); font-family: var(--font-mono); font-size: var(--fs-small);
  color: var(--text-3); transition: all var(--dur-fast) var(--ease-out);
}
.scale-slot.filled { border-style: solid; border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.scale-slot.error { border-color: var(--ch-boss); color: var(--ch-boss); background: var(--ch-boss-soft); animation: shake 0.4s var(--ease-out); }
.symbol-row { display: flex; gap: var(--sp-3); justify-content: center; flex-wrap: wrap; margin-top: var(--sp-3); }
.symbol-slot {
  min-height: 60px; min-width: 120px; padding: var(--sp-2); border: 1px dashed var(--line-strong); border-radius: var(--r-md);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-align: center;
  transition: all var(--dur-fast);
}
.symbol-slot.filled { border-style: solid; border-color: var(--ch-epiphany); background: var(--ch-epiphany-soft); }
.symbol-slot .sym-name { font-family: var(--font-mono); font-size: 0.72rem; color: var(--text-3); }
.symbol-slot.filled .sym-name { color: var(--ch-epiphany); }

/* ---------- S2 量劫仪 · 三面棱镜 ---------- */
.prism-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--sp-3); width: 100%; }
@media (max-width: 560px) { .prism-row { grid-template-columns: 1fr; } }
.prism-face {
  padding: var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  text-align: center; cursor: pointer; transition: all var(--dur-fast) var(--ease-out);
}
.prism-face:hover { border-color: var(--accent); transform: translateY(-2px); }
.prism-face.lit { box-shadow: var(--glow); }
.prism-face[data-face="worst"] { border-color: var(--ch-boss); }
.prism-face[data-face="avg"] { border-color: var(--ch-curve-mid); }
.prism-face[data-face="best"] { border-color: var(--accent); }
.prism-face .pf-name { font-family: var(--font-serif); font-size: var(--fs-sub); }
.prism-face .pf-complex { font-family: var(--font-mono); font-size: var(--fs-small); }
.input-feed-row { display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: center; margin-top: var(--sp-3); }
.feed-btn {
  min-height: 44px; 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-size: var(--fs-small);
  transition: all var(--dur-fast);
}
.feed-btn:hover { border-color: var(--accent); color: var(--accent); }
.feed-btn.active { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }

/* ---------- S3 分形塔 · 递归树 + Master 定理 ---------- */
.master-controls { display: flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
.preset-row { display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: center; }
.preset-btn {
  min-height: 36px; padding: var(--sp-1) var(--sp-3); border: 1px solid var(--line-strong); border-radius: 999px;
  background: transparent; color: var(--text-2); cursor: pointer; font-family: var(--font-mono); font-size: 0.72rem;
  transition: all var(--dur-fast);
}
.preset-btn:hover { border-color: var(--accent); color: var(--accent); }
.preset-btn.active { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.tree-cv { height: 280px; }
.case-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--sp-2); width: 100%; }
@media (max-width: 560px) { .case-row { grid-template-columns: 1fr; } }
.case-region {
  padding: var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  text-align: center; opacity: 0.5; transition: all var(--dur-mid) var(--ease-out);
}
.case-region[data-case="1"] { border-color: var(--accent); }
.case-region[data-case="2"] { border-color: var(--ch-amber); }
.case-region[data-case="3"] { border-color: var(--ch-boss); }
.case-region.active { opacity: 1; box-shadow: var(--glow); }
.case-region[data-case="1"].active { background: var(--accent-soft); }
.case-region[data-case="2"].active { background: var(--ch-amber-soft); }
.case-region[data-case="3"].active { background: var(--ch-boss-soft); }
.case-name { font-family: var(--font-serif); font-size: var(--fs-small); color: var(--text-1); }
.case-cond { font-family: var(--font-mono); font-size: 0.7rem; color: var(--text-3); }
.case-res { font-family: var(--font-mono); font-size: var(--fs-small); color: var(--accent); }
.proof-box { 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: 0.78rem; line-height: 1.7; }
.proof-box.closed { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }

/* ---------- S4 排序刑场 · 五排序竞速 + 判定树 ---------- */
.race-cv { height: 260px; }
.legend-row { display: flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
.legend-item { display: flex; align-items: center; gap: 4px; font-size: 0.72rem; color: var(--text-2); font-family: var(--font-mono); }
.legend-swatch { width: 14px; height: 4px; border-radius: 2px; }
.leaf-counter { display: flex; gap: var(--sp-4); flex-wrap: wrap; justify-content: center; align-items: center; }
.leaf-formula { font-family: var(--font-mono); color: var(--ch-epiphany); font-size: var(--fs-small); }
.stirling-step { font-family: var(--font-mono); color: var(--ch-epiphany); font-size: 0.82rem; line-height: 1.7; padding: var(--sp-2) 0; }

/* ---------- S5 散列阁 · 哈希表模拟 ---------- */
.hash-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 4px; width: 100%; max-width: 480px; margin: 0 auto; }
@media (max-width: 560px) { .hash-grid { grid-template-columns: repeat(6, 1fr); } }
.hash-cell {
  min-height: 44px; border: 1px solid var(--line-strong); border-radius: var(--r-sm);
  display: flex; align-items: center; justify-content: center; flex-direction: column;
  font-family: var(--font-mono); font-size: 0.7rem; color: var(--text-3);
  background: var(--bg-sunk); transition: all var(--dur-fast) var(--ease-out);
}
.hash-cell.filled { color: var(--accent); border-color: var(--accent); background: var(--accent-soft); }
.hash-cell.collision { color: var(--ch-boss); border-color: var(--ch-boss); background: var(--ch-boss-soft); }
.hash-cell .chain-len { font-size: 0.6rem; color: var(--ch-amber); }
.method-row { display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: center; }
.amort-panel { padding: var(--sp-3); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg-sunk); font-size: var(--fs-small); line-height: 1.7; }

/* ---------- S6 贪心迷阵 · 三关 ---------- */
.greedy-stage { display: flex; flex-direction: column; gap: var(--sp-3); }
.activity-row { display: flex; gap: 4px; flex-wrap: wrap; justify-content: center; }
.activity-bar {
  min-height: 44px; min-width: 28px; padding: var(--sp-1); border: 1px solid var(--line-strong); border-radius: var(--r-sm);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  font-size: 0.6rem; color: var(--text-3); cursor: pointer; transition: all var(--dur-fast);
  background: var(--bg-sunk);
}
.activity-bar.selected { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.activity-bar.conflict { border-color: var(--ch-boss); color: var(--ch-boss); background: var(--ch-boss-soft); }
.knapsack-row { display: flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
.treasure-card {
  min-height: 80px; min-width: 80px; padding: var(--sp-2); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  cursor: pointer; transition: all var(--dur-fast); background: var(--bg-sunk);
}
.treasure-card:hover { border-color: var(--accent); transform: translateY(-2px); }
.treasure-card.greedy-pick { border-color: var(--ch-amber); background: var(--ch-amber-soft); }
.treasure-card.optimal-pick { border-color: var(--accent); background: var(--accent-soft); }
.treasure-card .t-weight { font-family: var(--font-mono); color: var(--text-2); font-size: 0.7rem; }
.treasure-card .t-value { font-family: var(--font-mono); color: var(--accent); font-size: 0.82rem; }
.compare-panel { display: flex; gap: var(--sp-4); justify-content: center; flex-wrap: wrap; }
.compare-cell { padding: var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md); text-align: center; min-width: 120px; }
.compare-cell.greedy { border-color: var(--ch-amber); }
.compare-cell.optimal { border-color: var(--accent); }
.compare-cell .cc-label { font-size: 0.72rem; color: var(--text-3); }
.compare-cell .cc-val { font-family: var(--font-mono); font-size: var(--fs-title); }

/* ---------- S7 记忆之殿 · DP 表格 + TSP 爆炸 ---------- */
.dp-table { display: grid; gap: 2px; font-family: var(--font-mono); font-size: 0.7rem; max-width: 100%; overflow-x: auto; }
.dp-cell {
  min-width: 40px; min-height: 32px; padding: 2px 4px; border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center; background: var(--bg-sunk); color: var(--text-3);
  transition: all var(--dur-fast);
}
.dp-cell.header { background: var(--accent-soft); color: var(--accent); font-weight: 700; }
.dp-cell.filled { background: var(--accent-soft); color: var(--accent); }
.dp-cell.optimal { background: var(--accent); color: var(--on-accent); font-weight: 700; }
.tsp-meter { display: flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; align-items: center; }
.state-count { font-family: var(--font-mono); font-size: var(--fs-title); color: var(--ch-boss); transition: color var(--dur-mid); }
.state-count.safe { color: var(--accent); }
.mirror-stage { padding: var(--sp-3); border: 1px solid var(--ch-mirror); border-radius: var(--r-md); background: var(--ch-mirror-soft); text-align: center; color: var(--ch-mirror); font-family: var(--font-mono); font-size: var(--fs-small); }

/* ---------- S8 迷图深渊 · 图遍历 + 最短路径 ---------- */
.graph-cv { height: 320px; }
.algo-tabs { display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: center; }
.algo-tab {
  min-height: 40px; padding: var(--sp-1) var(--sp-3); border: 1px solid var(--line-strong); border-radius: 999px;
  background: transparent; color: var(--text-2); cursor: pointer; font-family: var(--font-mono); font-size: 0.78rem;
  transition: all var(--dur-fast);
}
.algo-tab:hover { border-color: var(--accent); color: var(--accent); }
.algo-tab.active { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.algo-tab.fail { border-color: var(--ch-boss); color: var(--ch-boss); background: var(--ch-boss-soft); }
.edge-toggle-row { display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: center; }

/* ---------- 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-abyss); border-radius: var(--r-md);
  background: var(--ch-abyss-soft); text-align: center; position: relative; overflow: hidden;
  transition: opacity var(--dur-slow) var(--ease-out), background var(--dur-slow);
}
.boss-vortex { font-family: var(--font-mono); color: var(--ch-mirror); letter-spacing: 0.3em; font-size: 1.4rem; }
.boss-entity.cracked .boss-vortex { color: var(--accent); }
.boss-entity.dissolving { background: rgba(192, 192, 192, 0.25); border-color: var(--ch-abyss-still); }
.boss-entity.dissolved { opacity: 0.5; }
.boss-entity.dissolved .boss-vortex { color: var(--ch-abyss-still); }
.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); }
.q-refute.ok { border-left-color: var(--accent); background: var(--accent-soft); color: var(--accent); }

/* 归约链 / 停机判定器构造 */
.reduction-chain { display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: center; align-items: center; padding: var(--sp-3); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg-sunk); }
.np-node {
  min-height: 44px; min-width: 64px; padding: var(--sp-2); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  display: flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 0.72rem;
  color: var(--text-2); background: var(--bg-elev); transition: all var(--dur-mid);
}
.np-node.core { border-color: var(--ch-sat-core); color: var(--ch-sat-core); background: var(--ch-epiphany-soft); box-shadow: 0 0 12px var(--ch-epiphany-soft); }
.reduction-arrow { color: var(--ch-reduction); font-family: var(--font-mono); }

.halting-steps { display: flex; flex-direction: column; gap: var(--sp-2); }
.halt-step {
  padding: var(--sp-2) var(--sp-3); border: 1px solid var(--line); border-radius: var(--r-sm);
  font-family: var(--font-mono); font-size: 0.78rem; color: var(--text-2); background: var(--bg-sunk);
  transition: all var(--dur-fast);
}
.halt-step.active { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.halt-step.contradict { border-color: var(--ch-boss); color: var(--ch-boss); background: var(--ch-boss-soft); }
.halt-step .h-frame-h { color: var(--ch-epiphany); }
.halt-step .h-frame-d { color: var(--ch-mirror); }

.mirror-nest { padding: var(--sp-3); border: 1px solid var(--ch-mirror); border-radius: var(--r-md); background: var(--ch-mirror-soft); text-align: center; }
.mirror-nest.shattered { border-color: var(--ch-boss); background: var(--ch-boss-soft); }

.scar-grid { display: flex; gap: var(--sp-3); justify-content: center; flex-wrap: wrap; }
.scar-card {
  min-height: 44px; padding: var(--sp-3) var(--sp-4); border: 1px solid var(--ch-noise-soft); border-radius: var(--r-md);
  background: transparent; color: var(--text-3); font-size: var(--fs-small); text-align: center;
  opacity: 0.5; transition: all var(--dur-mid) var(--ease-out);
}
.abyss-whisper { font-family: var(--font-serif); font-style: italic; color: var(--ch-abyss-still); text-align: center; padding: var(--sp-3); }

/* ---------- S10 知识图谱点亮 ---------- */
.frag-pool { display: flex; flex-wrap: wrap; gap: var(--sp-2); justify-content: center; }
.chain-slots { display: flex; flex-direction: column; gap: var(--sp-1); width: 100%; max-width: 560px; }
.chain-slot {
  min-height: 44px; padding: var(--sp-2) 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: var(--fs-small); color: var(--text-3);
  transition: all var(--dur-fast) var(--ease-out);
}
.boundary-map { display: flex; flex-direction: column; gap: var(--sp-2); margin: var(--sp-4) 0; }
.boundary-layer {
  padding: var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  display: flex; align-items: center; gap: var(--sp-3); opacity: 0.5; transition: all var(--dur-slow) var(--ease-out);
}
.boundary-layer.lit { opacity: 1; box-shadow: var(--glow); }
.boundary-layer[data-layer="inner"] { border-color: var(--accent); }
.boundary-layer[data-layer="inner"].lit { background: var(--accent-soft); color: var(--accent); }
.boundary-layer[data-layer="mid"] { border-color: var(--ch-amber); }
.boundary-layer[data-layer="mid"].lit { background: var(--ch-amber-soft); color: var(--ch-amber); }
.boundary-layer[data-layer="outer"] { border-color: var(--ch-mirror); }
.boundary-layer[data-layer="outer"].lit { background: var(--ch-mirror-soft); color: var(--ch-mirror); }
.bl-name { font-family: var(--font-serif); font-size: var(--fs-sub); min-width: 9em; }
.bl-theorem { font-family: var(--font-mono); font-size: 0.78rem; }

.mirror-recall-row { display: flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; margin: var(--sp-3) 0; }
.mirror-stage-recall {
  min-height: 44px; padding: var(--sp-2) var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--r-md);
  font-family: var(--font-mono); font-size: 0.78rem; color: var(--text-3); transition: all var(--dur-mid);
}
.mirror-stage-recall[data-stage="tree"].lit { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.mirror-stage-recall[data-stage="graph"].lit { border-color: var(--ch-curve-mid); color: var(--ch-curve-mid); background: rgba(6,182,212,0.12); }
.mirror-stage-recall[data-stage="self"].lit { border-color: var(--ch-mirror); color: var(--ch-mirror); background: var(--ch-mirror-soft); }

.gate-text {
  font-family: var(--font-serif); font-size: clamp(1.6rem, 5vw, 2.4rem);
  letter-spacing: 0.3em; 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); }
/* 移动端触摸目标兜底 */
button, .q-option, .token-card, .token-bet-btn, .cost-chip, .func-chip, .prism-face, .feed-btn, .preset-btn, .activity-bar, .treasure-card, .algo-tab, .frag-node, .chain-slot, .scar-card, .np-node, .mirror-stage-recall, .boundary-layer, .legend-item {
  min-height: 44px;
}