/* ============================================================
   ch29「硅光同辉」章节样式
   化神四层·硅光同辉（化神圆满·炼器阁终章）
   境界主色：玄青 #3D3B4F（化神期底色，verify-chapter 期望）
   终章高光：纯白 #FFFFFF（硅光原色 · 道纹中心"光"字）
   三宗三色：炼器阁翠绿 #2E8B57 / 天机门靛蓝 #4B0082 / 蕴灵宗朱红 #C0392B
   道纹（第二十九痕）：sp³ 晶格 + MOSFET + FinFET + 量子丝 + 脉冲纹 + 光波导
   ============================================================ */
:root {
  --realm-color: #3D3B4F;            /* 化神期玄青——verify-chapter 期望色 */
  --realm-glow: #3D3B4F55;
  --silicon-light: #FFFFFF;          /* 终章硅光原色（道纹中心"光"字） */
  --silicon-light-glow: #FFFFFF66;
  --silicon-amber: #FFD700;          /* 硅光粒子金 */
  --silicon-ir: #8B0000;             /* 1.55μm 红外辉光（暗红） */
  --wave-geo: #3A3A3A;               /* Ge 探测灰黑 */
  --wave-iii-v: #FF6B35;             /* III-V 激光金红 */
  --wdm-rainbow-1: #FF0000;
  --wdm-rainbow-2: #FF7F00;
  --wdm-rainbow-3: #FFFF00;
  --wdm-rainbow-4: #00FF00;
  --wdm-rainbow-5: #0000FF;
  --wdm-rainbow-6: #4B0082;
  --wdm-rainbow-7: #9400D3;
  --mzi-cyan: #00CED1;             /* MZI 调制器青色 */
  --elec-blue: #4169E1;              /* 电互连蓝 */
  --opt-gold: #FFD700;               /* 光互连金 */
  --heat-grey: #3A3A3A;              /* 热寂灰 */
  --heat-sea: #1a1a1a;               /* 热寂海深灰 */
  --dawn-blue: #87CEEB;              /* S10 破晓蓝 */
  --gate-green: #2E8B57;             /* 炼器阁翠绿 */
  --gate-indigo: #4B0082;            /* 天机门靛蓝 */
  --gate-vermilion: #C0392B;         /* 蕴灵宗朱红 */
}

/* 开场标题（终章硅光·玄青底浮纯白） */
.op-title span,
.op-sub {
  color: var(--silicon-light);
  text-shadow: 0 0 14px #FFFFFF44, 0 0 24px #3D3B4F88;
}
.op-quote {
  border-left-color: var(--silicon-light);
}

/* 化神期·玄青底 + 硅光纯白点缀：开场与场景头 */
.op-kicker,
.scene-kicker {
  color: var(--silicon-light);
}

/* 顿悟框边色（硅光白） */
.insight {
  border-left-color: var(--silicon-light);
}

/* focus-breath 呼吸光晕（下一场景按钮引导） */
.focus-breath {
  box-shadow: 0 0 0 0 #FFFFFF66;
  animation: ch29Breath 2s ease-in-out infinite;
}
@keyframes ch29Breath {
  0%, 100% { box-shadow: 0 0 0 0 #FFFFFF66; }
  50% { box-shadow: 0 0 16px 4px #FFFFFF44; }
}

/* S9 Boss 战触发按钮：玄青描边 + 硅光白光晕（化神圆满临界） */
#s9-start {
  border-color: var(--silicon-light);
  color: var(--silicon-light);
  position: relative;
}
#s9-start::after {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(circle at 50% 50%, #FFFFFF22, transparent 70%);
  animation: ch29BossPulse 2.4s ease-in-out infinite;
}
@keyframes ch29BossPulse {
  0%, 100% { opacity: .4; }
  50% { opacity: 1; }
}
#s9-start:hover {
  background: var(--silicon-light);
  color: var(--heat-sea);
}

/* S0 透射率扫描·硅光粒子琥珀色 */
.scene[data-scene="s0"] .scene-kicker {
  color: var(--opt-gold);
}
.scene[data-scene="s0"] .insight {
  border-left-color: var(--opt-gold);
}

/* S1 光波导·TIR 金光 */
.scene[data-scene="s1"] .scene-kicker {
  color: var(--opt-gold);
}

/* S2 调制器·MZI 金 + 微环青双色 */
.scene[data-scene="s2"] .scene-kicker {
  background: linear-gradient(90deg, var(--silicon-amber) 0%, var(--mzi-cyan) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* S3 探测器与激光器·Ge 灰黑 + III-V 金红 */
.scene[data-scene="s3"] .scene-kicker {
  background: linear-gradient(90deg, var(--heat-grey) 0%, var(--wave-iii-v) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* S4 WDM 彩虹 */
.scene[data-scene="s4"] .scene-kicker {
  background: linear-gradient(90deg, var(--wdm-rainbow-1), var(--wdm-rainbow-2), var(--wdm-rainbow-3), var(--wdm-rainbow-4), var(--wdm-rainbow-5), var(--wdm-rainbow-6), var(--wdm-rainbow-7));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* S5 光的账本·电蓝 / 光金双色 */
.scene[data-scene="s5"] .scene-kicker {
  background: linear-gradient(90deg, var(--elec-blue) 0%, var(--opt-gold) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* S6 光脑·金蓝融合 */
.scene[data-scene="s6"] .scene-kicker {
  background: linear-gradient(90deg, var(--opt-gold) 0%, var(--elec-blue) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* S7 热寂之海·深灰 */
.scene[data-scene="s7"] .scene-kicker {
  color: var(--heat-sea);
  text-shadow: 0 0 4px var(--heat-grey);
}
.scene[data-scene="s7"] .insight {
  border-left-color: var(--heat-grey);
}

/* S8 九力汇聚·二十九色渐亮 */
.scene[data-scene="s8"] .scene-kicker {
  background: linear-gradient(90deg, var(--gate-green), var(--opt-gold), var(--silicon-light));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* S9 三问台·玄青与硅光白交战（终章临界） */
.scene[data-scene="s9"] .scene-title {
  background: linear-gradient(90deg, var(--realm-color) 0%, var(--silicon-light) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* S10 三宗山门·破晓蓝 + 三宗三色 */
.scene[data-scene="s10"] .scene-kicker {
  background: linear-gradient(90deg, var(--dawn-blue) 0%, var(--gate-green) 33%, var(--gate-indigo) 66%, var(--gate-vermilion) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* ============================================================
   道纹（S10 本命石第二十九痕·终章）
   sp³ 晶格底 + MOSFET + FinFET + 量子纠缠丝 + 脉冲神经元纹 + 光波导金光
   五元素融合 · 中心"光"字纯白
   ============================================================ */
.s10-scar-daowen {
  display: inline-block;
  position: relative;
  width: 110px;
  height: 64px;
  vertical-align: middle;
  margin: 0 0.4rem;
}
.s10-scar-daowen svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}
/* sp³ 晶格棱线（玄青底纹） */
.s10-scar-daowen .dw-lattice {
  stroke: var(--realm-color);
  stroke-width: 1.0;
  fill: none;
  opacity: 0.7;
}
/* MOSFET 三栅（金色） */
.s10-scar-daowen .dw-mosfet {
  stroke: var(--opt-gold);
  stroke-width: 1.4;
  fill: none;
  filter: drop-shadow(0 0 2px #FFD70066);
}
/* FinFET 三栅围拢（雌黄） */
.s10-scar-daowen .dw-finfet {
  stroke: #E6C35C;
  stroke-width: 1.2;
  fill: none;
}
/* 量子纠缠丝（七彩） */
.s10-scar-daowen .dw-quantum {
  stroke: #B57BFF;
  stroke-width: 0.9;
  fill: none;
  stroke-dasharray: 2 2;
  animation: ch29QEntangle 4s linear infinite;
}
@keyframes ch29QEntangle {
  to { stroke-dashoffset: -16; }
}
/* 脉冲神经元纹（暖金） */
.s10-scar-daowen .dw-pulse {
  stroke: #F0C070;
  stroke-width: 0.9;
  fill: none;
  stroke-dasharray: 1.5 1.5;
  animation: ch29Pulse 2.4s linear infinite;
}
@keyframes ch29Pulse {
  to { stroke-dashoffset: -12; }
}
/* 光波导金光沿棱线流淌 */
.s10-scar-daowen .dw-waveguide {
  stroke: var(--silicon-light);
  stroke-width: 1.2;
  fill: none;
  filter: drop-shadow(0 0 3px #FFFFFF88);
  animation: ch29Flow 2.6s ease-in-out infinite;
}
@keyframes ch29Flow {
  0%, 100% { opacity: 0.55; }
  50% { opacity: 1; }
}
/* 中心"光"字（纯白） */
.s10-scar-daowen .dw-glyph {
  font-family: var(--font-serif, serif);
  font-size: 13px;
  font-weight: 800;
  fill: var(--silicon-light);
  text-anchor: middle;
  filter: drop-shadow(0 0 5px #FFFFFFCC);
  animation: ch29GlyphGlow 3s ease-in-out infinite;
}
@keyframes ch29GlyphGlow {
  0%, 100% { filter: drop-shadow(0 0 4px #FFFFFF99); }
  50% { filter: drop-shadow(0 0 8px #FFFFFFEE); }
}

/* S10 碎片归位容器（K29-01~K29-16） */
.s10-curve-host {
  margin: 1.2rem 0;
  padding: 1rem;
  border: 1px solid var(--glass-border, rgba(255,255,255,0.08));
  border-radius: 12px;
  background: rgba(0,0,0,0.2);
}
.s10-curve-host .frag-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.5rem;
}
.frag-node {
  padding: 0.5rem 0.7rem;
  border: 1px solid var(--glass-border, rgba(255,255,255,0.1));
  border-radius: 8px;
  background: transparent;
  color: var(--text-3, #75878A);
  font-family: var(--font-mono, monospace);
  font-size: 0.74rem;
  cursor: pointer;
  transition: all 0.25s var(--ease-out, ease);
}
.frag-node:hover {
  border-color: var(--silicon-light);
  color: var(--silicon-light);
}
.frag-node.lit {
  border-color: var(--silicon-light);
  background: rgba(255,255,255,0.10);
  color: var(--silicon-light);
  box-shadow: 0 0 12px rgba(255,255,255,0.3);
}

/* 境界突破铭刻（化神圆满·炼器阁终章） */
.inscription {
  margin-top: 1rem;
  padding: 0.8rem 1rem;
  border: 1px solid var(--silicon-light);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(61,59,79,0.32), rgba(255,255,255,0.10));
  color: var(--silicon-light);
  font-family: var(--font-serif, serif);
  text-align: center;
  animation: ch29Inscription 1.2s var(--ease-out, ease);
}
@keyframes ch29Inscription {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

/* S10 三宗山门（炼器阁翠绿 / 天机门靛蓝 / 蕴灵宗朱红） */
.s10-trigate {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.8rem;
  margin: 1.2rem 0;
}
.s10-trigate .gate {
  padding: 1rem 0.5rem;
  border: 1px solid;
  border-radius: 10px 10px 0 0;
  text-align: center;
  font-family: var(--font-serif, serif);
  position: relative;
  overflow: hidden;
}
.s10-trigate .gate .gate-name {
  font-size: 0.95rem;
  letter-spacing: 0.15em;
  margin-bottom: 0.3rem;
}
.s10-trigate .gate .gate-desc {
  font-size: 0.72rem;
  font-family: var(--font-mono, monospace);
  opacity: 0.85;
}
.s10-trigate .gate.green {
  border-color: var(--gate-green);
  background: linear-gradient(180deg, rgba(46,139,87,0.32), rgba(46,139,87,0.08));
  color: var(--gate-green);
  box-shadow: 0 0 18px rgba(46,139,87,0.30);
}
.s10-trigate .gate.indigo {
  border-color: var(--gate-indigo);
  background: linear-gradient(180deg, rgba(75,0,130,0.32), rgba(75,0,130,0.08));
  color: #8B5FBF;
  box-shadow: 0 0 18px rgba(75,0,130,0.30);
}
.s10-trigate .gate.vermilion {
  border-color: var(--gate-vermilion);
  background: linear-gradient(180deg, rgba(192,57,43,0.32), rgba(192,57,43,0.08));
  color: #E9675A;
  box-shadow: 0 0 18px rgba(192,57,43,0.30);
}
/* 已开启的炼器阁山门：金光门洞 */
.s10-trigate .gate.green::after {
  content: '已 开';
  position: absolute;
  top: 4px;
  right: 6px;
  font-size: 0.62rem;
  font-family: var(--font-mono, monospace);
  color: var(--opt-gold);
  letter-spacing: 0.2em;
}
/* 远景山门：云海中若隐若现 */
.s10-trigate .gate.indigo,
.s10-trigate .gate.vermilion {
  opacity: 0.78;
  filter: blur(0.3px);
}

/* S10 化神印（玄青圆印·"光"字纯白） */
.s10-huashen-seal {
  display: block;
  margin: 1.2rem auto;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  border: 2px solid var(--silicon-light);
  background: radial-gradient(circle, rgba(61,59,79,0.85), rgba(61,59,79,0.4));
  box-shadow: 0 0 28px #FFFFFF66, inset 0 0 18px #3D3B4F88;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-serif, serif);
  font-size: 1.6rem;
  color: var(--silicon-light);
  text-shadow: 0 0 12px #FFFFFFCC;
  animation: ch29SealGlow 3.2s ease-in-out infinite;
}
@keyframes ch29SealGlow {
  0%, 100% { box-shadow: 0 0 20px #FFFFFF44, inset 0 0 14px #3D3B4F88; }
  50% { box-shadow: 0 0 36px #FFFFFF99, inset 0 0 18px #3D3B4F66; }
}

/* S10 六位导师列阵铭牌 */
.s10-mentors {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: center;
  margin: 1rem 0;
}
.s10-mentors .mentor {
  padding: 0.4rem 0.8rem;
  border: 1px solid var(--glass-border, rgba(255,255,255,0.18));
  border-radius: 8px;
  background: rgba(0,0,0,0.3);
  font-family: var(--font-serif, serif);
  font-size: 0.78rem;
  color: var(--text-2, #B8C0C4);
}
.s10-mentors .mentor .epithet {
  display: block;
  font-size: 0.62rem;
  font-family: var(--font-mono, monospace);
  color: var(--text-3, #75878A);
  margin-top: 0.15rem;
}
.s10-mentors .mentor:nth-child(1) { border-color: var(--gate-green); color: var(--gate-green); }
.s10-mentors .mentor:nth-child(2) { border-color: #C97A4A; color: #C97A4A; }
.s10-mentors .mentor:nth-child(3) { border-color: #2E7D32; color: #2E7D32; }
.s10-mentors .mentor:nth-child(4) { border-color: #E6C35C; color: #E6C35C; }
.s10-mentors .mentor:nth-child(5) { border-color: #D6ECF0; color: #D6ECF0; }
.s10-mentors .mentor:nth-child(6) { border-color: var(--realm-color); color: #B57BFF; box-shadow: 0 0 12px #3D3B4F66; }

/* S10 章末返回炼器阁链接：从玄青渐变到纯白（终章收束） */
.s10-next-link {
  display: inline-block;
  padding: 0.5rem 1.4rem;
  border-radius: 8px;
  border: 1px solid;
  border-image: linear-gradient(90deg, var(--realm-color), var(--silicon-light)) 1;
  background: linear-gradient(90deg, rgba(61,59,79,0.30), rgba(255,255,255,0.18));
  color: var(--silicon-light);
  text-decoration: none;
  transition: all 0.3s var(--ease-out, ease);
}
.s10-next-link:hover {
  background: linear-gradient(90deg, rgba(61,59,79,0.50), rgba(255,255,255,0.32));
  box-shadow: 0 0 22px #FFFFFF66;
}
/* S10 终章箴言带 */
.s10-creed {
  margin: 1rem 0;
  padding: 0.9rem 1.2rem;
  border-left: 3px solid var(--silicon-light);
  background: linear-gradient(90deg, rgba(255,255,255,0.08), transparent);
  font-family: var(--font-serif, serif);
  color: var(--silicon-light);
  font-size: 0.95rem;
  line-height: 1.8;
  text-shadow: 0 0 8px #FFFFFF66;
}

/* ============================================================
   交互组件通用样式（cmp-* 体系 · 硅光白/金主题）
   ============================================================ */

/* 组件头 */
.cmp-head { margin-bottom: 0.6rem; }
/* 控件区 */
.cmp-ctrl {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 0.6rem; margin-bottom: 0.6rem;
  padding: 0.6rem 0.8rem;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 8px;
  background: rgba(30,25,35,0.4);
}
.cmp-val {
  font-size: 0.85rem; font-weight: bold;
  color: var(--opt-gold); min-width: 4rem; text-align: right;
}
.cmp-slider {
  flex: 1; min-width: 120px; max-width: 220px;
  accent-color: var(--opt-gold); cursor: pointer;
}
.cmp-pill {
  padding: 0.3rem 0.6rem;
  border: 1px solid var(--line-strong, #475569);
  border-radius: 999px;
  background: rgba(30,25,35,0.5);
  color: var(--text-3, #94A3B8);
  cursor: pointer; font-size: 0.78rem;
  transition: all 200ms ease-out;
}
.cmp-pill:hover { border-color: var(--opt-gold); }
.cmp-pill.active {
  border-color: var(--opt-gold);
  background: rgba(255,215,0,0.15);
  color: var(--opt-gold);
}

/* 画布容器 */
.cmp-canvas-box {
  margin: 0.6rem 0;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 8px;
  padding: 0.5rem;
  background: #1A1520;
  overflow: hidden;
}
/* 读数面板 */
.cmp-readout {
  display: flex; flex-wrap: wrap; gap: 0.8rem;
  padding: 0.5rem 0.8rem;
  border: 1px solid var(--line-strong, #475569);
  border-radius: 8px;
  background: rgba(30,25,35,0.3);
  margin-bottom: 0.5rem; font-size: 0.85rem;
}
.ro-item b { color: var(--opt-gold); font-size: 0.95rem; }

/* 警告/弯路提示 */
.cmp-warn {
  padding: 0.5rem 0.8rem; border-radius: 8px;
  font-size: 0.82rem; margin: 0.4rem 0;
  border: 1px solid rgba(255,215,0,0.25);
  background: rgba(255,215,0,0.08);
  color: var(--opt-gold);
}
.cmp-warn.danger {
  border-color: rgba(239,68,68,0.35);
  background: rgba(239,68,68,0.10);
  color: #EF4444;
}

/* 刻痕条目 */
.carve-item {
  padding: 0.3rem 0.5rem; margin: 0.2rem 0;
  border-left: 2px solid #EF4444;
  font-size: 0.8rem; color: var(--text-2, #B8C0C4);
}
.carve-item.used {
  border-left-color: var(--opt-gold);
  color: var(--opt-gold);
  opacity: 0.85;
}

/* ============================================================
   S0 预测挑战样式
   ============================================================ */
.pp-predict-stage {
  margin-bottom: 0.8rem;
}
.pp-question {
  font-size: 0.95rem; font-weight: bold;
  color: var(--silicon-light); margin-bottom: 0.6rem;
}
.pp-prediction-options {
  display: flex; flex-direction: column; gap: 0.4rem;
}
.pp-option {
  padding: 0.5rem 0.8rem; text-align: left;
  border: 1px solid var(--line-strong, #475569);
  border-radius: 8px;
  background: rgba(30,25,35,0.4);
  color: var(--text-2, #B8C0C4);
  cursor: pointer; font-size: 0.85rem;
  transition: all 200ms ease-out;
}
.pp-option:hover { border-color: var(--opt-gold); color: var(--silicon-light); }
.pp-option.picked {
  border-color: var(--opt-gold);
  background: rgba(255,215,0,0.15);
  color: var(--opt-gold);
}
.pp-submit {
  margin-top: 0.6rem; width: 100%;
}
.pp-predict-verdict {
  margin-top: 0.6rem; padding: 0.5rem 0.8rem;
  border-radius: 8px; font-size: 0.82rem;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(61,59,79,0.3);
  color: var(--text-2, #B8C0C4);
}
.pp-scan-stage { margin-top: 0.8rem; }
.pp-refract-stage { margin-top: 0.8rem; }
.pp-refract-bars {
  display: flex; flex-direction: column; gap: 0.4rem;
}
.pp-refract-bar {
  display: flex; align-items: center; gap: 0.6rem;
}
.pp-refract-bar .rb-label {
  font-size: 0.82rem; color: var(--text-3, #94A3B8);
  min-width: 3rem;
}
.pp-refract-bar .rb-track {
  flex: 1; height: 14px; border-radius: 7px;
  background: rgba(255,255,255,0.08);
  overflow: hidden;
}
.pp-refract-bar .rb-fill {
  height: 100%; border-radius: 7px;
  transition: width 0.4s ease;
}
.pp-refract-bar .rb-val {
  font-size: 0.82rem; font-weight: bold;
  color: var(--opt-gold); min-width: 4rem;
}
.pp-delta-readout {
  margin-top: 0.4rem; padding: 0.4rem 0.6rem;
  border-radius: 6px; font-size: 0.78rem;
  background: rgba(255,215,0,0.08);
  color: var(--opt-gold);
}
.pp-result-panel { margin-top: 0.8rem; }
.pp-verdict {
  padding: 0.6rem 0.8rem; border-radius: 8px;
  font-size: 0.85rem; margin-bottom: 0.5rem;
}
.pp-verdict.ok {
  border: 1px solid rgba(16,185,129,0.35);
  background: rgba(16,185,129,0.10);
  color: var(--realm-5);
}
.pp-verdict.bad {
  border: 1px solid rgba(239,68,68,0.35);
  background: rgba(239,68,68,0.10);
  color: #EF4444;
}
.pp-window-marker {
  padding: 0.4rem 0.6rem; margin: 0.3rem 0;
  border-radius: 6px; font-size: 0.82rem;
  background: rgba(255,215,0,0.10);
  color: var(--opt-gold);
}
.pp-comm-band-marker {
  padding: 0.4rem 0.6rem; font-size: 0.78rem;
  color: var(--text-2, #B8C0C4);
}

/* ============================================================
   S2 调制器曲线追踪器样式
   ============================================================ */
.mt-mode-tabs {
  display: flex; flex-wrap: wrap; gap: 0.4rem;
  margin-bottom: 0.6rem;
}
.mt-tab {
  padding: 0.35rem 0.7rem;
  border: 1px solid var(--line-strong, #475569);
  border-radius: 6px;
  background: rgba(30,25,35,0.5);
  color: var(--text-3, #94A3B8);
  cursor: pointer; font-size: 0.8rem;
  transition: all 200ms ease-out;
}
.mt-tab:hover { border-color: var(--opt-gold); color: var(--silicon-light); }
.mt-tab.active {
  border-color: var(--opt-gold);
  background: rgba(255,215,0,0.15);
  color: var(--opt-gold);
}
.mt-main {
  display: flex; flex-wrap: wrap; gap: 0.6rem;
}
.mt-structure-view { flex: 1; min-width: 200px; }
.mt-curve-panel { flex: 1; min-width: 200px; }
.mt-readout-panel {
  flex: 1; min-width: 140px;
  display: flex; flex-wrap: wrap; gap: 0.4rem;
  align-content: flex-start;
}

/* ============================================================
   S5 功耗三旋钮实验台样式
   ============================================================ */
.lb-zone-map {
  margin: 0.6rem 0;
}
.lb-zone-item {
  display: flex; flex-wrap: wrap; gap: 0.4rem;
  padding: 0.4rem 0.6rem; margin: 0.2rem 0;
  border: 1px solid var(--line-strong, #475569);
  border-radius: 6px;
  background: rgba(30,25,35,0.3);
  font-size: 0.8rem; transition: all 200ms ease;
}
.lb-zone-item.active {
  border-color: var(--opt-gold);
  background: rgba(255,215,0,0.10);
  box-shadow: 0 0 12px rgba(255,215,0,0.15);
}
.lb-zone-range { font-weight: bold; color: var(--text-1, #F1F5F9); }
.lb-zone-winner { color: var(--opt-gold); }
.lb-zone-reason { color: var(--text-3, #94A3B8); flex-basis: 100%; }
.lb-equation-panel {
  margin: 0.6rem 0; padding: 0.6rem 0.8rem;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 8px;
  background: rgba(30,25,35,0.3);
}
.lb-equation-steps { display: flex; flex-direction: column; gap: 0.2rem; }
.eq-step {
  font-size: 0.8rem; color: var(--text-2, #B8C0C4);
  font-family: var(--font-mono, monospace);
}

/* ============================================================
   S10 知识图谱点亮样式
   ============================================================ */
.fg-knowledge-map {
  position: relative;
}
.fg-answer-stage {
  text-align: center;
}
.fg-answer-stage .btn {
  font-size: 0.85rem; line-height: 1.5;
}

/* ============================================================
   响应式
   ============================================================ */
@media (max-width: 640px) {
  .cmp-ctrl { flex-direction: column; align-items: stretch; }
  .cmp-slider { max-width: 100%; }
  .mt-main { flex-direction: column; }
  .cmp-canvas { height: 200px; }
  .lb-zone-item { font-size: 0.74rem; }
}
