/* ==========================================================================
   铜匠实验室 · 课件统一换肤 v2
   --------------------------------------------------------------------------
   课件运行时会把自己的 CSS 注入 <head>；本文件由 </body> 前引入，文档顺序在
   其后，同优先级下自然生效。换肤只重定义课件自带的 :root 设计变量 +
   讲义视图(.sec)的少量硬编码色，不改结构、不改文案、不改 3D 内容。
   全部包在 @media screen 内，保证讲义打印仍是原来的白纸黑字。
   ========================================================================== */
@media screen {

:root {
  /* 字体沿用课件原有栈，避免破坏紧凑排版 */
  --font: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", "Hiragino Sans GB", system-ui, sans-serif;
  --num: "SF Pro Display", "DIN Alternate", "Helvetica Neue", "PingFang SC", system-ui, sans-serif;

  /* 底与面板：深色磨砂玻璃 */
  --glass: rgba(18, 24, 44, .86);
  --glass-bar: rgba(12, 17, 34, .92);
  --glass-2: rgba(24, 31, 56, .84);
  --glass-back: rgba(8, 12, 26, .96);
  --glass-solid: #111827;
  --glass-blur: blur(18px) saturate(135%);
  --glass-edge: 1px solid rgba(150, 166, 220, .18);
  --glass-glow: inset 0 1px 0 rgba(255, 255, 255, .07);
  --shadow-1: 0 6px 18px rgba(0, 0, 0, .40);
  --shadow-2: 0 22px 56px rgba(0, 0, 0, .58);
  --tint: #0a0f1e;
  --line: rgba(150, 166, 220, .16);
  --line-2: rgba(150, 166, 220, .34);
  --line-soft: rgba(150, 166, 220, .09);

  /* 文字：深色面板上是浅字 */
  --ink: #eef2fb;
  --ink2: #b9c5de;
  --ink3: #8d9bb9;

  /* 主色 / 状态色：靛紫 → 青，与门户一致，彻底告别原来的科技蓝 */
  --sci: #818cf8;
  --cyan: #22d3ee;
  --violet: #c084fc;
  --grad: linear-gradient(100deg, #818cf8 0%, #22d3ee 100%);
  --grad-soft: linear-gradient(100deg, rgba(129, 140, 248, .18) 0%, rgba(34, 211, 238, .14) 100%);
  --ok: #34d399;
  --warn: #fbbf24;
  --bad: #fb7185;
  --heat: linear-gradient(90deg, #fbbf24, #fb7185);

  --sci-30: rgba(129, 140, 248, .30);
  --sci-12: rgba(129, 140, 248, .14);
  --sci-8: rgba(129, 140, 248, .10);
  --sci-4: rgba(129, 140, 248, .05);
  --sci-0: rgba(129, 140, 248, 0);
  --sci-28: rgba(129, 140, 248, .28);
  --sci-26: rgba(129, 140, 248, .26);
  --sci-22: rgba(129, 140, 248, .22);
  --warn-60: rgba(251, 191, 36, .60);
  --ok-12: rgba(52, 211, 153, .14);
  --warn-10: rgba(251, 191, 36, .12);
  --bad-12: rgba(251, 113, 133, .14);
  --ok-35: rgba(52, 211, 153, .35);
  --ok-30: rgba(52, 211, 153, .30);
  --ok-0: rgba(52, 211, 153, 0);
  --warn-40: rgba(251, 191, 36, .40);
  --warn-30: rgba(251, 191, 36, .30);
  --bad-30: rgba(251, 113, 133, .30);
  --breathe: var(--ok-35);

  --white-22: rgba(255, 255, 255, .22);
  --white-92: rgba(255, 255, 255, .92);
  --shade-1: rgba(0, 0, 0, .22);
  --shade-2: rgba(0, 0, 0, .42);
  --sw-off: rgba(180, 195, 235, .20);

  /* 五个工段识别色：换成深色底上更通透的一组 */
  --u1-halo: rgba(129, 140, 248, .22);
  --u2-halo: rgba(34, 211, 238, .22);
  --u3-halo: rgba(192, 132, 252, .22);
  --u4-halo: rgba(251, 191, 36, .22);
  --u5-halo: rgba(52, 211, 153, .22);
  --u1: #818cf8;
  --u2: #22d3ee;
  --u3: #c084fc;
  --u4: #fbbf24;
  --u5: #34d399;
  --u1s: #4f46e5;
  --u2s: #0e7490;
  --u3s: #7e22ce;
  --u4s: #b45309;
  --u5s: #047857;

  /* 深色面板上的「文字用彩色变体」必须是亮版，否则看不清 */
  --sci-d: #c7d2fe;
  --cyan-d: #67e8f9;
  --ok-d: #6ee7b7;
  --warn-d: #fcd34d;
  --bad-d: #fda4af;

  --uc: var(--sci);
  --ucs: var(--sci);
  --ucg: var(--grad);
  --ucsg: var(--grad);
  --uh: var(--sci-8);

  /* 形状：更大更柔和的圆角 */
  --r-panel: 22px;
  --r-card: 16px;
  --r-ctrl: 12px;
  --r-pill: 999px;

  /* 尺寸沿用，避免破坏 3D 视口与面板几何 */
  --top-h: 78px;
  --steps-h: 46px;
  --foot-h: 52px;
  --panelw-l: clamp(320px, 22vw, 404px);
  --panelw-r: clamp(300px, 20.5vw, 348px);
  --fs-main: 34px;
  --fs-sub: 20px;
  --fs-t: 13px;
  --fs-b: 13px;
  --fs-xs: 12px;
}

/* 细滚动条（纯装饰，无副作用） */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(150, 166, 220, .22);
  border-radius: 99px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover { background: rgba(150, 166, 220, .40); background-clip: padding-box; }

/* --------------------------------------------------------------------------
   讲义 / 学案视图：这个子系统的色值是硬编码的，单独覆盖
   -------------------------------------------------------------------------- */
.sec {
  --s-ink: #eef2fb;
  --s-ink2: #b9c5de;
  --s-line: rgba(150, 166, 220, .18);
  --s-amber: #fbbf24;
  --s-teal: #22d3ee;
  --s-red: #fb7185;
  color: var(--s-ink);
  background: #0d1426;
  border-radius: 18px;
}
.sec-bar,
.sec-read,
.sec-ctrl,
.sec-voice,
.sec-legend,
.sec-togs,
.sec-apartbar,
.sec-lab,
.sec-sheet-hd,
.sec-nav,
.sec.sec-lean .sec-stage .sec-legend,
.sec[data-chrome="lean"] .sec-bar {
  background: rgba(19, 26, 48, .90);
  border-color: rgba(150, 166, 220, .18);
}
.sec-tabs button,
.sec-nav button {
  background: rgba(255, 255, 255, .06);
  border-color: rgba(150, 166, 220, .24);
  color: var(--s-ink2);
}
.sec-tabs button.on,
.sec-nav button.on {
  background: rgba(129, 140, 248, .20);
  border-color: rgba(129, 140, 248, .55);
  color: #c7d2fe;
}
.sec-sheet { background: #0d1426; color: var(--s-ink); }
.sec-sheet-hd, .sec-sheet-read, .sec-sheet-note, .sec-sheet-none,
.sec-k, .sec-cap, .sec-basis, .sec-tip, .sec-intent, .sec-aparttag { color: var(--s-ink2); }
.sec-idx { color: #67e8f9; }
.sec-cell.hot .sec-v b { color: #fcd34d; }
.sec-top .sec-hint, .sec-apartbar i { color: #8d9bb9; }
.sec-sw { border-color: rgba(150, 166, 220, .28); }
.sec-alarm { color: #fff; }

}

/* ==========================================================================
   v3 · 工作台式简版（由 course-skin.js 给 body 加 .wb 类后生效）
   --------------------------------------------------------------------------
   目标：把「8 步流水线 + 满屏文字」收成「左选模块 / 中大场景 / 右调参数」。
   只做减法和重排，不动 3D 场景、不动每步的判定与文案。
   ========================================================================== */
@media screen {

/* ---------- 1. 顶栏瘦身：去掉主线问题长句与因果链 ---------- */
body.wb { --top-h: 58px; }

body.wb #top {
  height: var(--top-h);
  padding: 0 14px;
  justify-content: center;
}
body.wb #top .mq,
body.wb #top .chain5 { display: none !important; }
body.wb #top .brand h1 { font-size: 17px; }
body.wb #top .brand .eq { font-size: 12px; padding: 2px 7px; }
body.wb #top .row1 { gap: 8px; }
body.wb #top .hud { gap: 5px; }
body.wb #top .hud .btn { padding: 4px 9px; font-size: 12px; }

/* ---------- 2. 方程式浮卡（压在舞台正中）不再显示 ---------- */
body.wb #eqb { display: none !important; }

/* ---------- 3. 底部翻页条收掉：用左侧模块列表导航 ---------- */
body.wb #foot { display: none !important; }

/* ---------- 4. 步骤条 → 左侧纵向「实验模块」列表 ---------- */
body.wb #steps {
  top: calc(var(--top-h) + 18px);
  left: 10px;
  right: auto;
  width: var(--panelw-l);
  height: auto;
  flex-direction: column;
  align-items: stretch;
  gap: 3px;
  z-index: 19;
}
body.wb #steps .sb {
  margin: 0 0 6px 3px;
  font-size: 10.5px;
  letter-spacing: .2em;
  color: var(--ink3);
}
body.wb #steps .chip {
  flex: 0 0 auto;
  height: 33px;
  padding: 0 10px 0 8px;
  border-radius: 10px;
  border: 1px solid transparent;
  background: rgba(255, 255, 255, .035);
  transition: background .16s ease, border-color .16s ease;
}
body.wb #steps .chip::before { display: none; }
body.wb #steps .chip .nm {
  flex: 1 1 auto;
  font-size: 12.5px;
  color: var(--ink2);
}
body.wb #steps .chip .nm::after { display: none; }
body.wb #steps .chip:hover { background: rgba(255, 255, 255, .075); border-color: var(--line-2); }
body.wb #steps .chip.on {
  background: linear-gradient(100deg, rgba(129, 140, 248, .22), rgba(34, 211, 238, .10));
  border-color: rgba(129, 140, 248, .52);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07);
}
body.wb #steps .chip.on .nm { color: var(--ink); font-weight: 600; }
body.wb #steps .chip .node,
body.wb #steps .chip.on .node {
  width: 20px;
  height: 20px;
  font-size: 11px;
  box-shadow: none;
}
body.wb #steps .chip.done .node { background: rgba(150, 166, 220, .32); color: #fff; }

/* ---------- 5. 左栏下移到模块列表下方；右栏上提占满 ---------- */
body.wb #left {
  top: var(--left-top, 340px);
  bottom: 12px;
  border-radius: var(--r-panel) 0 0 var(--r-panel);
}
body.wb #right {
  top: calc(var(--top-h) + 18px);
  bottom: 12px;
  border-radius: 0 var(--r-panel) var(--r-panel) 0;
}

/* ---------- 6. 左栏减噪：标签行、面包屑、多余徽标收起来 ---------- */
body.wb #left .tagrow,
body.wb #left .crumb { display: none !important; }
body.wb #left .phead { padding: 11px 13px 7px; border-bottom: 1px solid var(--line-soft); }
body.wb #left .phead h2 { font-size: 13px; letter-spacing: .05em; }
body.wb #left .phead .sub { font-size: 11px; color: var(--ink3); }
body.wb #left .pbody { padding: 11px 13px 13px; }
body.wb #left .cardhead { margin-bottom: 9px; }
body.wb #left .block.act { margin-bottom: 9px; }

/* 右栏同样加留白，抬头换成和左栏一致的规格 */
body.wb #right .phead { padding: 11px 13px 7px; border-bottom: 1px solid var(--line-soft); }
body.wb #right .phead h2 { font-size: 13px; letter-spacing: .05em; }
body.wb #right .phead .sub { font-size: 11px; color: var(--ink3); }

/* ---------- 7. 舞台四角加一点内收，让 3D 画面别被两侧面板压住 ---------- */
body.wb #labels,
body.wb #anno { pointer-events: none; }

/* ---------- 8. 第二轮微调 ---------- */
/* 8.1 左栏贴合内容：内容少就贴着，内容多就在卡片内部滚（不留一大截空白） */
body.wb #left {
  bottom: auto;
  height: auto;
  max-height: calc(100vh - var(--left-top, 340px) - 12px);
}
body.wb #left .pbody {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
/* 「本步」抬头只留标题，去掉那行「问句 → 动手 → 结论…」的说明 */
body.wb #left .phead .sub { display: none; }

/* 8.2 模块列表更轻：常态不铺底色，只留序号与名字 */
body.wb #steps .chip { background: transparent; }
body.wb #steps .chip:hover { background: rgba(255, 255, 255, .06); }
body.wb #steps .chip.on {
  background: linear-gradient(100deg, rgba(129, 140, 248, .22), rgba(34, 211, 238, .10));
}

/* 8.3 当前步的核心问题放大一号，学生一眼看到「这一步要解决什么」 */
body.wb #left .cardhead .ct {
  font-size: 14.5px;
  line-height: 1.45;
  font-weight: 600;
}

/* 8.4 右栏实时读数：课件按读数个数写了内联 repeat(N,1fr)，四列时挤成一排读不清；
       这里用自适应列宽压成 2 列（读数少时自然一排排开），必须 !important 才能盖内联样式 */
body.wb #right .subs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)) !important;
  gap: 6px;
}
body.wb #right .subs > * { min-width: 0; }

/* 8.5 滑块标题里的「本步」是流内伪元素，会把 4 个字的标题挤成两行（槽码个/数）；
       滑块左上角还有一个绝对定位的「本步」角标，正好压在标题上。
       两处都去掉——左侧模块列表已经高亮当前步，这里再标一次纯属重复 */
body.wb #right .slh .lb::after,
body.wb #right .sl::after { display: none; }

}


/* ==========================================================================
   v4 · 参考 3D 课件风（深蓝底 + 金色小标题 + 青色读数）+ 继续减噪
   --------------------------------------------------------------------------
   样板：F:\小白课件\自制课件\...\00_燃料、能源与安全情境_3D.html
   只重排颜色与信息密度，不动 3D 场景、不改每步判定与文案。
   放在文件最后，同特异性下覆盖 v3。
   ========================================================================== */
@media screen {

/* ---------- 1. 配色对齐样板 ---------- */
body.wb {
  --glass: rgba(13, 32, 48, .95);
  --glass-bar: rgba(7, 19, 31, .97);
  --glass-2: rgba(18, 41, 59, .94);
  --glass-back: rgba(6, 18, 30, .98);
  --glass-solid: #0d2030;
  --glass-blur: blur(8px) saturate(120%);
  --glass-edge: 1px solid rgba(255, 255, 255, .11);
  --glass-glow: none;
  --shadow-1: 0 6px 18px rgba(0, 0, 0, .32);
  --shadow-2: 0 18px 44px rgba(0, 0, 0, .45);
  --tint: #06121e;
  --line: rgba(255, 255, 255, .11);
  --line-2: rgba(255, 255, 255, .22);
  --line-soft: rgba(255, 255, 255, .07);
  --ink: #e7eff4;
  --ink2: #b7c9d6;
  --ink3: #8aa0b3;
  --sci: #f6c078;
  --cyan: #7ae7e1;
  --violet: #c9a2ff;
  --grad: linear-gradient(100deg, #f6c078 0%, #7ae7e1 100%);
  --grad-soft: linear-gradient(100deg, rgba(246,192,120,.16), rgba(122,231,225,.12));
  --ok: #67d6a5;
  --warn: #e0b060;
  --bad: #e0604c;
  --sci-30: rgba(246,192,120,.30);
  --sci-12: rgba(246,192,120,.12);
  --sci-8: rgba(246,192,120,.08);
  --sci-4: rgba(246,192,120,.04);
  --sci-0: rgba(246,192,120,0);
  --sci-28: rgba(246,192,120,.28);
  --sci-26: rgba(246,192,120,.26);
  --sci-22: rgba(246,192,120,.22);
  --ok-12: rgba(103,214,165,.14);
  --warn-10: rgba(224,176,96,.12);
  --bad-12: rgba(224,96,76,.14);
  --ok-35: rgba(103,214,165,.35);
  --ok-30: rgba(103,214,165,.30);
  --ok-0: rgba(103,214,165,0);
  --warn-40: rgba(224,176,96,.40);
  --warn-30: rgba(224,176,96,.30);
  --bad-30: rgba(224,96,76,.30);
  --white-22: rgba(255,255,255,.22);
  --white-92: rgba(255,255,255,.92);
  --sw-off: rgba(180,205,220,.20);
  --sci-d: #f8d6a6;
  --cyan-d: #a6f0ec;
  --ok-d: #9be6c4;
  --warn-d: #f0cf93;
  --bad-d: #f0a596;
  --r-panel: 12px;
  --r-card: 9px;
  --r-ctrl: 8px;
}

/* ---------- 2. 顶栏：只留目录 / 课题 / 必要按钮 ---------- */
body.wb #top {
  background: linear-gradient(180deg, #12293b, #07131f);
  border-bottom: 1px solid rgba(255, 255, 255, .11);
}
body.wb #top .hud .stat,
body.wb #top .hud .score,
body.wb #top .hud .btn.k-icon { display: none !important; }
body.wb #top .brand h1 { color: #e7eff4; font-size: 16px; font-weight: 600; }
body.wb #top .brand .eq {
  color: #7ae7e1; background: transparent; border: 0;
  font-size: 11.5px; padding: 0; font-weight: 400;
}
body.wb #top .hud .btn {
  background: rgba(18, 41, 59, .92);
  border: 1px solid rgba(255, 255, 255, .16);
  color: #e7eff4; border-radius: 7px;
}
body.wb #top .hud .btn:hover { border-color: rgba(246, 192, 120, .5); }
body.wb #top a.home { color: #b7c9d6; }

/* ---------- 3. 左侧模块列表：参考里的「实验模块」 ---------- */
body.wb #steps {
  background: rgba(13, 32, 48, .93);
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: 12px;
  padding: 9px 8px 10px;
}
body.wb #steps .sb {
  color: #f6c078; font-size: 10.5px; letter-spacing: .2em; margin-left: 6px;
}
body.wb #steps .chip { height: 31px; border-radius: 8px; }
body.wb #steps .chip .nm { font-size: 12.5px; color: var(--ink2); }
body.wb #steps .chip.on {
  background: rgba(246, 192, 120, .15);
  border-color: rgba(246, 192, 120, .50);
  box-shadow: none;
}
body.wb #steps .chip.on .nm { color: #f6c078; font-weight: 600; }
body.wb #steps .chip .node {
  border-radius: 6px; background: rgba(255, 255, 255, .07); color: var(--ink2);
}
body.wb #steps .chip.on .node { background: #f6c078; color: #0d2030; font-weight: 700; }
body.wb #steps .chip.done .node { background: rgba(103, 214, 165, .30); color: #0d2030; }

/* ---------- 4. 左右面板：深蓝卡片、金色小标题 ---------- */
body.wb #left,
body.wb #right {
  background: rgba(13, 32, 48, .95);
  border: 1px solid rgba(255, 255, 255, .10);
  box-shadow: 0 10px 34px rgba(0, 0, 0, .36);
}
body.wb #left .phead,
body.wb #right .phead { border-bottom-color: rgba(255, 255, 255, .08); }
body.wb #left .phead h2,
body.wb #right .phead h2 {
  color: #f6c078; font-size: 11px; letter-spacing: .18em; font-weight: 600;
}
body.wb #right .phead .sub { display: none !important; }

/* ---------- 5. 减法：来源注释、状态行、次要文字 ---------- */
body.wb #right .kpi .cal,
body.wb #right .subs .sub .cal { display: none !important; }

body.wb #right .kpi {
  background: rgba(255, 255, 255, .035);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 9px; padding: 9px 11px;
}
body.wb #right .kpi .lb { color: var(--ink2); font-size: 11px; letter-spacing: .05em; }
body.wb #right .kpi .vv { color: #f6c078; }
body.wb #right .subs { gap: 6px; }
body.wb #right .subs .sub {
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 8px; padding: 6px 8px;
}
body.wb #right .subs .sub .lb { color: var(--ink3); font-size: 10.5px; }
body.wb #right .subs .sub b { color: #7ae7e1; }

/* ---------- 6. 滑块：本步高亮用金框，读数用青 ---------- */
body.wb #right .sl { background: transparent; border: 0; padding: 4px 0; }
body.wb #right .sl.hi {
  background: rgba(246, 192, 120, .07);
  border: 1px solid rgba(246, 192, 120, .22);
  border-radius: 9px; padding: 7px 9px;
}
body.wb #right .slh .lb { color: var(--ink2); }
body.wb #right .slh b { color: #7ae7e1; }
body.wb #right .slx .cal { color: var(--ink3); font-size: 10px; }
body.wb #right .trk i.fill { background: linear-gradient(90deg, #7ae7e1, #f6c078); }
body.wb #right input[type="range"] { accent-color: #7ae7e1; }

/* ---------- 7. 实验条件开关：两列紧凑排布，不再一长条 ---------- */
body.wb #right .sws {
  border-top: 1px solid rgba(255, 255, 255, .08);
  padding-top: 6px; margin-top: 4px;
}
body.wb #right .sws .sw { height: 22px; min-width: 0; }
body.wb #right .sws .sw .nm {
  font-size: 11px; color: var(--ink2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
body.wb #right .sws .sw .st { font-size: 10px; color: var(--ink3); }
/* 不能改成两列：有的课件一行里是「时相 / 物镜」这种一组分段按钮，
   列宽不够会把按钮挤到下一行甚至压到别的内容上。只把行高压紧。 */

/* ---------- 8. 左栏：核心问题突出，长说明默认收两行 ---------- */
body.wb #left .cardhead {
  background: rgba(255, 255, 255, .035);
  border-left: 3px solid #f6c078;
  border-radius: 0 9px 9px 0;
  padding: 8px 10px;
}
body.wb #left .cardhead .ct { color: var(--ink); font-size: 14.5px; }
body.wb #left .block.act {
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 9px; padding: 9px 10px;
}
body.wb #left .block.act .lb { color: #f6c078; font-size: 11px; letter-spacing: .05em; }
body.wb #left .block.act .atxt { color: var(--ink2); font-size: 12px; }
body.wb #left .block.act .etxt {
  color: var(--ink3); font-size: 11.5px; line-height: 1.55;
  max-height: 3.1em; overflow: hidden;
  -webkit-mask-image: linear-gradient(#000 55%, transparent);
  mask-image: linear-gradient(#000 55%, transparent);
  transition: max-height .22s ease;
}
body.wb #left .block.act:hover .etxt,
body.wb #left .block.act:focus-within .etxt {
  max-height: 300px;
  -webkit-mask-image: none; mask-image: none;
}

/* ---------- 9. 舞台左上角：当前第几步 / 步进名称（JS 生成） ---------- */
body.wb .wb-stage {
  position: fixed;
  top: calc(var(--top-h) + 14px);
  left: calc(var(--panelw-l) + 26px);
  z-index: 14; pointer-events: none; max-width: 360px;
}
body.wb .wb-stage-box {
  display: inline-block;
  background: rgba(6, 18, 30, .86);
  border: 1px solid rgba(246, 192, 120, .34);
  border-left: 3px solid #f6c078;
  border-radius: 0 10px 10px 0;
  padding: 7px 16px 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
}
body.wb .wb-stage-k { display: block; font-size: 10px; letter-spacing: .2em; color: #f6c078; }
body.wb .wb-stage-t {
  margin: 3px 0 0; font-size: 17px; font-weight: 600;
  color: #e7eff4; letter-spacing: .02em;
}
@media (max-width: 1100px) { body.wb .wb-stage { display: none; } }

/* ---------- 10. 3D 标注统一成深底浅字，别跟浅色舞台糊在一起 ---------- */
body.wb #labels .lab,
body.wb #anno .anno {
  background: rgba(6, 18, 30, .78);
  border-color: rgba(122, 231, 225, .30);
  color: #dceaf0; font-size: 10.5px; border-radius: 6px;
  box-shadow: none;
}
body.wb ::-webkit-scrollbar-thumb { background: rgba(122, 231, 225, .22); }

}

/* ==========================================================================
   v4b · 右栏贴合内容（避免面板底部一大截空白）
   ========================================================================== */
@media screen {
body.wb #right {
  bottom: auto;
  height: auto;
  max-height: calc(100vh - var(--top-h) - 30px);
}
body.wb #right .pbody { overflow-y: auto; }
}

/* v4c · .sws 回退单列紧凑排布 */