/* 金泱 SaaS · 公共组件（复用；页面不得自造样式）
 * 全部使用 tokens.css 的令牌，禁止写死 hex。
 */

/* ---------- 卡片 ---------- */
.hd-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);
  box-shadow:var(--sh-1);overflow:hidden}
.hd-card-hd{padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border);
  font-weight:700;font-size:var(--fs-3);display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2)}
.hd-card-bd{padding:var(--sp-4)}

/* ---------- 工具栏 ---------- */
.hd-toolbar{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:flex-end;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);
  padding:var(--sp-3) var(--sp-4);box-shadow:var(--sh-1);margin-bottom:var(--sp-4)}
.hd-field{display:flex;flex-direction:column;gap:2px}
.hd-field>label{font-size:var(--fs-1);color:var(--faint);margin:0}

/* ---------- 徽标 ---------- */
.hd-badge{display:inline-flex;align-items:center;gap:var(--sp-1);padding:2px var(--sp-2);
  border-radius:var(--r-pill);font-size:var(--fs-1);line-height:18px;font-weight:600;
  background:var(--neutral-bg);color:var(--muted)}
.hd-badge.ok{background:var(--ok-bg);color:var(--ok)}
.hd-badge.warn{background:var(--warn-bg);color:var(--warn)}
.hd-badge.danger{background:var(--danger-bg);color:var(--danger)}
.hd-badge.info{background:var(--info-bg);color:var(--info)}
.hd-badge.brand{background:var(--brand);color:var(--ink-on-brand)}

/* ---------- 表格 ---------- */
.hd-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;font-size:var(--fs-3)}
.hd-table th{background:var(--surface-2);color:var(--muted);font-weight:600;font-size:var(--fs-1);
  text-align:left;padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--border);white-space:nowrap}
.hd-table td{padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--border);vertical-align:middle}
.hd-table tr:last-child td{border-bottom:0}
.hd-table tbody tr:hover{background:var(--surface-2)}
.hd-table tr.row-danger{background:var(--danger-bg)}
.hd-table tr.row-warn{background:var(--warn-bg)}

/* ---------- 空状态 ---------- */
.hd-empty{padding:var(--sp-7) var(--sp-4);text-align:center;color:var(--faint);font-size:var(--fs-3)}
.hd-empty .ic{font-size:34px;display:block;margin-bottom:var(--sp-2);opacity:.6}

/* ---------- 统计块 ---------- */
.hd-stat{display:flex;flex-direction:column;gap:2px}
.hd-stat .n{font-size:var(--fs-6);font-weight:800;color:var(--text);line-height:1.1}
.hd-stat .l{font-size:var(--fs-1);color:var(--faint)}

/* ---------- 进度条 ---------- */
.hd-progress{height:8px;background:var(--surface-3);border-radius:var(--r-pill);overflow:hidden}
.hd-progress>i{display:block;height:100%;background:var(--brand);border-radius:var(--r-pill);transition:width .3s}

/* ---------- 页面标题 ---------- */
.hd-page-hd{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);
  margin-bottom:var(--sp-4);flex-wrap:wrap}
.hd-page-hd h4{margin:0;font-weight:800;letter-spacing:.2px}
.hd-page-hd .sub{color:var(--muted);font-size:var(--fs-2)}

/* =====================================================================
   课堂大屏（PPT 式）
   ===================================================================== */
.hd-class{display:flex;gap:var(--sp-4);align-items:stretch;min-height:calc(100vh - 150px)}

/* 左侧加分栏 */
.hd-score{width:210px;flex:0 0 210px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-md);box-shadow:var(--sh-1);display:flex;flex-direction:column;overflow:hidden}
.hd-score-hd{padding:var(--sp-2) var(--sp-3);background:var(--surface-2);border-bottom:1px solid var(--border);
  font-weight:700;font-size:var(--fs-2);display:flex;justify-content:space-between;align-items:center}
.hd-score-bd{overflow:auto;flex:1;padding:var(--sp-1)}
.hd-score-row{display:grid;grid-template-columns:1fr 28px 34px 28px;align-items:center;gap:var(--sp-1);
  padding:var(--sp-1) var(--sp-2);border-radius:var(--r-sm)}
.hd-score-row:hover{background:var(--surface-2)}
.hd-score-row .nm{font-size:var(--fs-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-score-row .val{text-align:center;font-weight:800;font-size:var(--fs-4);color:var(--text)}
.hd-score-btn{width:28px;height:28px;padding:0;border-radius:var(--r-sm);border:1px solid var(--border-strong);
  background:var(--surface);font-weight:800;line-height:1;cursor:pointer;color:var(--text)}
.hd-score-btn.plus{border-color:var(--ok);color:var(--ok)}
.hd-score-btn.plus:hover{background:var(--ok);color:var(--ink-on-brand)}
.hd-score-btn.minus{border-color:var(--danger);color:var(--danger)}
.hd-score-btn.minus:hover{background:var(--danger);color:var(--ink-on-brand)}

/* 右侧舞台 */
.hd-stage{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--sp-3)}

/* 七步进度条 */
.hd-stepbar{display:flex;gap:var(--sp-1);flex-wrap:wrap;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--r-md);padding:var(--sp-2);box-shadow:var(--sh-1)}
.hd-step{flex:1;min-width:92px;display:flex;flex-direction:column;gap:1px;align-items:flex-start;
  line-height:1.25;padding:var(--sp-2) var(--sp-3);border-radius:var(--r-sm);
  font-size:var(--fs-2);color:var(--muted);background:var(--surface-2);cursor:pointer;
  border:1px solid transparent;transition:all .15s;user-select:none}
.hd-step:hover{border-color:var(--border-strong)}
.hd-step.active{background:var(--brand);color:var(--ink-on-brand);font-weight:700;box-shadow:var(--sh-2)}
.hd-step.done{background:var(--ok-bg);color:var(--ok)}
.hd-step.skipped{background:var(--warn-bg);color:var(--warn)}

/* 课件页（投影区） */
.hd-slide-stage{flex:1;background:var(--slide-bg);border:1px solid var(--border);
  border-radius:var(--slide-radius);box-shadow:var(--sh-2);position:relative;overflow:hidden;
  display:flex;flex-direction:column}
.hd-slide{flex:1;padding:var(--slide-pad);display:flex;flex-direction:column;gap:var(--sp-4);
  color:var(--slide-ink);animation:hdSlideIn .22s ease-out}
@keyframes hdSlideIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.hd-slide-tag{font-size:var(--fs-2);color:var(--slide-accent);font-weight:800;letter-spacing:1px}
.hd-slide-title{font-size:var(--slide-fs-title);font-weight:800;line-height:1.25;margin:0}
.hd-slide-body{font-size:var(--slide-fs-body);line-height:1.7;flex:1;overflow:auto;
  display:flex;flex-direction:column;gap:var(--sp-3);min-height:0}
.hd-slide-cover{align-items:center;justify-content:center;text-align:center;
  background:var(--slide-grad);color:var(--ink-on-brand)}
.hd-slide-cover .hd-slide-title{color:var(--ink-on-brand);font-size:calc(var(--slide-fs-title) * 1.15)}
.hd-slide-cover .hd-slide-tag,
.hd-slide-cover .hd-kicker{color:var(--ink-on-brand);opacity:.85}
.hd-slide-cover .hd-note{color:var(--ink-on-brand);opacity:.7}

/* 选项（大屏大按钮） */
.hd-opts{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);margin-top:var(--sp-3);
  flex:1;grid-auto-rows:minmax(78px,1fr);align-content:stretch}
.hd-opt{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4) var(--sp-5);
  border:2px solid var(--border);border-radius:var(--r-md);background:var(--surface);
  font-size:var(--slide-fs-option);cursor:pointer;transition:all .15s}
.hd-opt:hover{border-color:var(--slide-accent);box-shadow:var(--sh-2);transform:translateY(-1px)}
.hd-opt .k{width:44px;height:44px;flex:0 0 44px;border-radius:var(--r-sm);background:var(--surface-3);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:var(--fs-5)}
.hd-opt.right{border-color:var(--ok);background:var(--ok-bg)}
.hd-opt.wrong{border-color:var(--danger);background:var(--danger-bg)}
.hd-opt.locked{pointer-events:none;opacity:.85}

/* 翻页条 */
.hd-pager{display:flex;align-items:center;gap:var(--sp-2);background:var(--surface);
  border:1px solid var(--border);border-radius:var(--r-md);padding:var(--sp-2) var(--sp-3);box-shadow:var(--sh-1)}
.hd-pager .pg{font-size:var(--fs-3);color:var(--muted);min-width:96px;text-align:center;font-weight:600}

/* 白板工具条 */
.hd-board-tools{display:flex;flex-wrap:wrap;gap:var(--sp-1);align-items:center;
  padding:var(--sp-2);background:var(--surface-2);border-bottom:1px solid var(--border)}
.hd-board-tool{width:34px;height:34px;border-radius:var(--r-sm);border:1px solid var(--border-strong);
  background:var(--surface);cursor:pointer;font-size:var(--fs-4);line-height:1;display:flex;
  align-items:center;justify-content:center}
.hd-board-tool.on{background:var(--brand);color:var(--ink-on-brand);border-color:var(--brand)}
.hd-board-wrap{flex:1;position:relative;overflow:hidden;background:var(--slide-bg)}
.hd-board-wrap canvas{position:absolute;inset:0;touch-action:none}

/* 通用小工具 */
.hd-row{display:flex;align-items:center;gap:var(--sp-2)}
.hd-row.wrap{flex-wrap:wrap}
.hd-grow{flex:1;min-width:0}
.hd-dim{color:var(--muted);font-size:var(--fs-2)}
.hd-hint{color:var(--faint);font-size:var(--fs-1)}

/* =====================================================================
   讲课台专用
   ===================================================================== */
/* 全屏授课：隐藏外壳（.ws-top/.ws-side 是本壳真实类名），只留课件 */
body.hd-fs{overflow:hidden;
  --slide-pad:56px;--slide-fs-title:56px;--slide-fs-body:30px;--slide-fs-option:30px;
  --slide-radius:0}
body.hd-fs .ws-top,
body.hd-fs .ws-side,
body.hd-fs .hd-page-hd,
body.hd-fs #c_pick,
body.hd-fs #c_modal,
body.hd-fs footer{display:none!important}
/* 关键：把壳的左/上让位彻底归零，否则内容会被顶出去 */
body.hd-fs .ws-shell{min-height:100vh}
body.hd-fs .ws-main{margin-left:0!important;margin-top:0!important;min-height:100vh}
body.hd-fs .ws-main>.container-fluid{padding:0!important;height:100vh;overflow:hidden}
body.hd-fs .hd-class{height:100vh;min-height:0;gap:0;border-radius:0}
body.hd-fs .hd-score{border-radius:0;border-top:0;border-bottom:0;border-left:0;
  width:236px;flex:0 0 236px}
body.hd-fs .hd-score-hd{padding:var(--sp-3) var(--sp-4);font-size:var(--fs-4)}
body.hd-fs .hd-score-bd{padding:var(--sp-2)}
body.hd-fs .hd-score-row{padding:var(--sp-2) var(--sp-3)}
body.hd-fs .hd-score-row .nm{font-size:var(--fs-4)}
body.hd-fs .hd-score-btn{width:34px;height:34px;font-size:var(--fs-4)}
body.hd-fs .hd-stage{gap:0}
body.hd-fs .hd-slide-stage{border-radius:0;border:0;box-shadow:none}
body.hd-fs .hd-stepbar,
body.hd-fs .hd-pager{border-radius:0;border-left:0;border-right:0;box-shadow:none}
body.hd-fs .hd-stepbar{border-top:0}
body.hd-fs .hd-pager{border-bottom:0}
body.hd-fs .hd-slide-cover .hd-slide-title{font-size:calc(var(--slide-fs-title) * 1.15)}

/* 当前答题人 */
.hd-score-row.cur{background:var(--info-bg);box-shadow:inset 0 0 0 1px var(--info)}
.hd-score-row .nm{cursor:pointer}
.hd-score-row.cur .nm{font-weight:800;color:var(--info)}

/* 课件页内小元素 */
.hd-kicker{font-size:var(--fs-2);font-weight:800;letter-spacing:2px;color:var(--slide-accent);
  text-transform:uppercase}
.hd-figure{max-height:34vh;border-radius:var(--r-md);border:1px solid var(--border);background:var(--surface-2)}
.hd-note{font-size:var(--fs-3);color:var(--muted)}
.hd-big{font-size:var(--fs-8);font-weight:800;line-height:1.2}
.hd-center{align-items:center;justify-content:center;text-align:center}
.hd-slide-scroll{overflow:auto}
.hd-board-host{flex:1;display:flex;flex-direction:column;min-height:0;
  border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;background:var(--surface)}
.hd-video{width:100%;max-height:60vh;background:var(--media-bg);border-radius:var(--r-md)}
.hd-toast-ok{color:var(--ok);font-weight:700}
.hd-toast-bad{color:var(--danger);font-weight:700}

/* ---------- 照片归档墙 ---------- */
.hd-photo-grid{display:flex;flex-wrap:wrap;gap:var(--sp-3)}
.hd-photo-cell{width:180px;border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;background:var(--surface)}
.hd-photo-cell img{width:100%;height:130px;object-fit:cover;background:var(--media-bg);cursor:zoom-in;display:block}
.hd-photo-cell .cap{padding:var(--sp-1) var(--sp-2);font-size:var(--fs-1)}

/* ---------- 桌贴码（学员二维码打印：一页一娃 · 3列 × 4行） ----------
 * 卡片 56mm 宽（≤6cm）；二维码含自带静默区(白边) + 卡片白底；
 * 整页高度留足下边距（4 行排完仅占 ~267mm），避免打印机下边不可打印区把末行姓名裁掉。
 * 图片取原生像素 size=290（version1 = 21模块×10px + 4模块白边），放大不糊。
 */
.hd-qr-sheet{display:grid;grid-template-columns:repeat(3,56mm);gap:8mm;
  justify-content:center;align-content:start;margin:0 auto var(--sp-5)}
.hd-qr-head{grid-column:1/-1;text-align:center;font-weight:900;letter-spacing:3px;
  font-size:var(--fs-6);color:var(--brand);padding-bottom:var(--sp-2)}
.hd-qr-cell{width:56mm;height:56mm;background:#fff;border:1px dashed var(--border-strong);
  border-radius:var(--r-md);padding:2.5mm;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:1.5mm;overflow:hidden;
  page-break-inside:avoid;break-inside:avoid}
.hd-qr-cell img{width:44mm;height:44mm;display:block;background:#fff}
.hd-qr-cell .nm{font-weight:800;font-size:var(--fs-4);line-height:1.2;color:var(--text);
  letter-spacing:1px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
@media screen and (max-width:820px){ .hd-qr-sheet{grid-template-columns:repeat(2,56mm)} }
@media screen and (max-width:560px){ .hd-qr-sheet{grid-template-columns:56mm} }

@media print{
  /* 打印：隐藏应用外壳（顶栏/侧栏/面包屑/页脚/工具条），内容区铺满纸面 */
  .no-print,.hd-page-hd,.hd-toolbar,.navbar,.sidebar,.ws-side,.ws-top,.ws-nav-row,footer{display:none!important}
  html,body{background:#fff!important;background-image:none!important}
  .ws-shell{display:block!important;min-height:0!important}
  .ws-main{margin:0!important;min-height:0!important}
  .ws-content{padding:0!important}
  .hd-qr-sheet{grid-template-columns:repeat(3,56mm);gap:8mm;justify-content:center;margin:0 auto}
  .hd-qr-sheet+.hd-qr-sheet{break-before:page;page-break-before:always}
  .hd-qr-head{color:#000;font-size:18pt;padding:0 0 3mm}
  .hd-qr-cell{border:1px dashed #c8ccd4;border-radius:6px;box-shadow:none;background:#fff;
    -webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ---------- 媒体弹窗（新窗口里只有内联样式可用，用命名色） ---------- */
.hd-popup{margin:0;background:black;text-align:center}
.hd-popup video,.hd-popup img{max-width:100%;max-height:100vh}

/* ---------- 录制台画布 ---------- */
.hd-board-canvas{width:100%;background:var(--board-bg);border-radius:var(--r-md);
  border:1px solid var(--border);touch-action:none;display:block}

/* ---------- 章节引导页（与封面同一视觉语言） ---------- */
.hd-slide-section{flex-direction:row;align-items:center;gap:var(--sp-7);
  background:var(--slide-grad);color:var(--ink-on-brand)}
.hd-section-no{font-size:170px;font-weight:900;line-height:.82;letter-spacing:-8px;
  color:var(--on-brand-soft);flex:0 0 auto;font-variant-numeric:tabular-nums;user-select:none}
@supports (-webkit-text-stroke:1px currentColor){
  .hd-section-no{color:transparent;-webkit-text-stroke:3px var(--on-brand-line)}
}
.hd-section-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--sp-3)}
.hd-slide-section .hd-kicker,
.hd-slide-section .hd-slide-title,
.hd-slide-section .hd-note{color:var(--ink-on-brand)}
.hd-slide-section .hd-note{opacity:.88}
.hd-section-chips{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:var(--sp-2)}
.hd-chip{background:var(--on-brand-soft);border:1px solid var(--on-brand-line);
  color:var(--ink-on-brand);padding:var(--sp-2) var(--sp-4);border-radius:var(--r-pill);
  font-size:var(--fs-4);font-weight:600}

/* ---------- 步骤条：步号 / 名称 / 状态 ---------- */
.hd-step .r1{display:flex;align-items:center;gap:var(--sp-1);font-weight:700;font-size:var(--fs-2);white-space:nowrap}
.hd-step .r2{display:flex;align-items:center;gap:var(--sp-1);font-size:var(--fs-1);opacity:.6;white-space:nowrap}
.hd-step .idx{display:inline-flex;align-items:center;justify-content:center;
  width:17px;height:17px;flex:0 0 17px;border-radius:50%;opacity:1;
  background:var(--surface-3);color:var(--muted);font-size:11px;font-weight:800;
  font-variant-numeric:tabular-nums}
.hd-step.active .idx{background:var(--on-brand-soft);color:var(--ink-on-brand)}
.hd-step.done .idx{background:var(--ok-bg);color:var(--ok)}
.hd-step.skipped .idx{background:var(--warn-bg);color:var(--warn)}
.hd-step.done .r2{color:var(--ok);opacity:1}
.hd-step.skipped .r2{color:var(--warn);opacity:1}
.hd-step.active .r2{color:var(--ink-on-brand);opacity:.9}
.hd-step .cnt{padding:0 5px;border-radius:var(--r-pill);background:var(--brand-soft);
  color:var(--brand);font-weight:700;font-size:10px}
.hd-step.active .cnt{background:var(--on-brand-soft);color:var(--ink-on-brand)}
.hd-step.done .cnt{background:var(--ok-bg);color:var(--ok)}
.hd-step.skipped .cnt{background:var(--warn-bg);color:var(--warn)}

/* ---------- 翻页条：主次分明 ---------- */
.hd-pager .btn{padding:var(--sp-2) var(--sp-4);font-weight:600}
.hd-pager .btn-main{padding:var(--sp-2) var(--sp-5);font-weight:800;box-shadow:var(--sh-2)}
.hd-pager .pg{font-size:var(--fs-4);font-weight:700;color:var(--text);min-width:110px}
.hd-pager .hd-tool{background:transparent;border:0;color:var(--muted);padding:var(--sp-1) var(--sp-2)}
.hd-pager .hd-tool:hover{color:var(--brand);background:var(--brand-soft);border-radius:var(--r-sm)}
.hd-pager .hd-sep{width:1px;height:22px;background:var(--border);margin:0 var(--sp-1)}

/* ---------- 加分栏空状态 ---------- */
.hd-score-empty{padding:var(--sp-4) var(--sp-3);text-align:center;color:var(--faint);font-size:var(--fs-2)}
.hd-score-empty .ic{font-size:30px;display:block;margin-bottom:var(--sp-2);opacity:.5}

/* ---------- 游戏页（B 类答题挑战 / A 类演示） ---------- */
.hd-game-host{display:flex;flex-direction:column;min-height:0;gap:var(--sp-2)}
.hg-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap}
.hg-head b{font-size:var(--fs-7);font-weight:800;color:var(--slide-ink)}
.hg-meta{font-size:var(--fs-3);color:var(--muted)}
.hg-meta b{color:var(--brand);font-size:var(--fs-5)}
.hg-body{flex:1;display:flex;flex-direction:column;gap:var(--sp-2);min-height:0}
.hg-card{flex:1;display:flex;flex-direction:column;gap:var(--sp-3);background:var(--surface);
  border:1px solid var(--border);border-radius:var(--r-md);padding:var(--sp-5);min-height:0}
.hg-stem{font-size:var(--slide-fs-body);font-weight:700;line-height:1.5}
.hg-figure{max-height:26vh;align-self:center;border-radius:var(--r-md);border:1px solid var(--border)}
.hg-grid{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);
  grid-auto-rows:minmax(78px,1fr);min-height:0}
.hg-opt{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4) var(--sp-5);
  border:2px solid var(--border);border-radius:var(--r-md);background:var(--surface);
  color:var(--slide-ink);font-size:var(--slide-fs-option);text-align:left;cursor:pointer;transition:all .15s}
.hg-opt:hover{border-color:var(--slide-accent);box-shadow:var(--sh-2);transform:translateY(-1px)}
.hg-opt .k{width:44px;height:44px;flex:0 0 44px;border-radius:var(--r-sm);background:var(--surface-3);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:var(--fs-5)}
.hg-opt.right{border-color:var(--ok);background:var(--ok-bg)}
.hg-opt.right .k{background:var(--ok);color:var(--ink-on-brand)}
.hg-opt.wrong{border-color:var(--danger);background:var(--danger-bg)}
.hg-opt.wrong .k{background:var(--danger);color:var(--ink-on-brand)}
.hg-tip{padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);font-weight:700}
.hg-tip.ok{background:var(--ok-bg);color:var(--ok)}
.hg-tip.bad{background:var(--warn-bg);color:var(--warn)}
.hg-done{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:var(--sp-2);background:var(--ok-bg);color:var(--ok);border-radius:var(--r-md);font-size:var(--fs-5)}
.hg-done .big{font-size:var(--fs-8);font-weight:800}
.hg-foot{font-size:var(--fs-2);color:var(--muted)}

/* ---------- 轻提示浮层（HD.toast） ---------- */
.hd-toast{position:fixed;top:var(--top-h);right:var(--sp-4);z-index:3000;
  margin-top:var(--sp-3);max-width:340px;padding:var(--sp-3) var(--sp-4);
  border-radius:var(--r-md);box-shadow:var(--sh-3);font-size:var(--fs-3);
  color:var(--ink-on-brand);background:var(--info);opacity:1;transition:opacity .3s ease;
  animation:hdToastIn .2s ease-out}
.hd-toast.out{opacity:0}
.hd-toast--ok{background:var(--ok)}
.hd-toast--warn{background:var(--warn)}
.hd-toast--danger{background:var(--danger)}
.hd-toast--info{background:var(--brand)}
@keyframes hdToastIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* ---------- 讲课台：开课前与历史课堂 ---------- */
.hd-prep-pick{width:220px}
.hd-modal-card{margin-top:var(--sp-3)}
.hd-hist-row{justify-content:space-between;border-bottom:1px solid var(--border);padding:var(--sp-2) 0}
.hd-hist-row:last-child{border-bottom:0}

/* ---------- 讲课台开课启动页 ---------- */
.hd-start-card{margin-bottom:var(--sp-4)}
.hd-start-card .hd-card-hd{gap:var(--sp-3)}
.hd-today-row{display:grid;grid-template-columns:132px 1.1fr 1.3fr 92px 84px 104px;
  align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-3);
  border-bottom:1px solid var(--border)}
.hd-today-row:last-child{border-bottom:0}
.hd-today-row:hover{background:var(--surface-2)}
.hd-today-row .tm{font-weight:800;font-variant-numeric:tabular-nums;color:var(--brand);
  white-space:nowrap}
.hd-today-row .cls{font-weight:700}
.hd-today-row .co{color:var(--muted)}
.hd-today-row .rn{text-align:right}
.hd-today-row .act{text-align:right}
@media (max-width:900px){
  .hd-today-row{grid-template-columns:1fr 1fr;gap:var(--sp-1) var(--sp-3)}
}

/* ---------- 题目页：题干 + 讲解回放按钮 ---------- */
.hd-q-hd{display:flex;align-items:flex-start;gap:var(--sp-4)}
.hd-q-hd .hd-grow{min-width:0}
.hd-explain-btn{flex:0 0 auto;margin-top:var(--sp-2);font-weight:700;padding:var(--sp-2) var(--sp-4)}

/* ---------- 讲解回放（课件页内联，不弹窗） ---------- */
.hd-explain-wrap{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;
  gap:var(--sp-3);padding:var(--sp-5);background:var(--media-bg)}
.hd-explain-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);
  color:var(--ink-on-brand)}
.hd-explain-bar .hd-kicker{color:var(--ink-on-brand);opacity:.85}
.hd-explain-video{flex:1;width:100%;min-height:0;background:var(--media-bg);
  border-radius:var(--r-md);object-fit:contain}

/* ---------- 白板工具栏（可外挂到底栏） ---------- */
.hd-board-sep{width:1px;height:22px;background:var(--border);margin:0 var(--sp-1);flex:0 0 auto}
.hd-board-dot{font-size:17px;line-height:1}
.hd-board-tools.on{display:flex}
#c_boardtools{display:none}
#c_boardtools.on{display:flex;align-items:center;gap:var(--sp-1);flex-wrap:nowrap}
#c_boardtools .hd-board-tool{width:30px;height:30px;font-size:14px}
#c_boardtools .hd-board-dot{font-size:15px}
.hd-pager .hd-board-sep{height:20px;margin:0 var(--sp-2)}
/* 老师用的分隔符 || */
.hd-pager .hd-bar{color:var(--border-strong);font-weight:700;user-select:none;margin:0 var(--sp-1)}

/* ---------- 板书讲解页：题干置顶 / 图置左 / 剩余最大区域手写 ---------- */
.hd-board-page{position:absolute;inset:0;display:flex;flex-direction:column;
  gap:var(--sp-3);padding:var(--sp-4);background:var(--slide-bg)}
.hd-board-q{flex:0 0 auto;max-height:26%;overflow:auto}
.hd-board-q .hd-slide-title{font-size:calc(var(--slide-fs-title) * .62);line-height:1.3}
.hd-board-main{flex:1;display:flex;gap:var(--sp-3);min-height:0}
.hd-board-fig{flex:0 0 28%;max-width:28%;display:flex;align-items:flex-start;justify-content:center;
  overflow:auto;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-md);
  padding:var(--sp-2)}
.hd-board-fig img{max-width:100%;max-height:100%;object-fit:contain}
.hd-board-fig-empty{flex:0 0 0;display:none}
.hd-board-main .hd-board-host{flex:1;min-width:0}

/* ---------- 录制台画布（与讲课台同一套白板） ---------- */
.hd-board-host--rec{aspect-ratio:5 / 3;min-height:320px;background:var(--board-bg);
  border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden}
.hd-board-host--rec .hd-board-tools{padding:var(--sp-2);border-bottom:1px solid var(--border);
  background:var(--surface-2)}
.hd-prep-pick{width:240px}
.hd-item-pick{width:420px}

/* ---------- 底栏：板书模式下收紧，保证一行放得下 ---------- */
.hd-pager{flex-wrap:nowrap;overflow-x:auto}
.hd-pager .hd-step-acts{display:flex;align-items:center;gap:var(--sp-2)}
.hd-pager.board-on .hd-step-acts{display:none}
.hd-pager.board-on{gap:var(--sp-1)}
.hd-pager.board-on .btn{padding:var(--sp-1) var(--sp-2)}
.hd-pager.board-on .pg{min-width:64px;font-size:var(--fs-3)}
.hd-pager .hd-tool.on{color:var(--brand);background:var(--brand-soft);border-radius:var(--r-sm)}
#c_boardtools .hd-board-tool{width:28px;height:28px;font-size:13px}
#c_boardtools .hd-board-dot{font-size:14px}
#c_boardtools .hd-board-sep{height:18px;margin:0 2px}

/* 底栏子项一律不压缩：宁可横向滚动，也不要挤成一团 */
.hd-pager>*{flex:0 0 auto}
.hd-pager .hd-grow{flex:1 1 auto;min-width:var(--sp-2)}
.hd-pager.board-on .lbl{display:none}
.hd-pager.board-on .pg{min-width:56px}
#c_boardtools{gap:2px}

/* ---------- 教学计划 ---------- */
.hd-col-ops{width:220px}
.hd-class-pick{width:300px}
.hd-term{width:150px}
.hd-kind{width:150px}
.hd-course{width:150px}
.hd-grade{width:140px}
.hd-lessons{width:90px}
.hd-bulk{font-family:ui-monospace,Consolas,"PingFang SC",monospace;font-size:var(--fs-3);line-height:1.7}

/* ---------- 白板·数学文字输入浮层 ---------- */
.hd-math-edit{position:fixed;z-index:2600;width:560px;max-width:96vw;background:var(--card-bg);
  border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-3);padding:var(--sp-3);
  display:flex;flex-direction:column;gap:var(--sp-2)}
.hd-math-edit-hd{font-weight:800;font-size:var(--fs-3);color:var(--text)}
.hd-math-edit-in{width:100%;padding:var(--sp-2) var(--sp-3);font-size:var(--fs-5);
  font-family:ui-monospace,Consolas,"PingFang SC",monospace;
  border:1px solid var(--border-strong);border-radius:var(--r-sm);outline:none}
.hd-math-edit-in:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.hd-math-edit-pv{width:100%;height:120px;border:1px solid var(--border);border-radius:var(--r-sm);
  background:var(--surface-2)}
.hd-math-edit-syms{display:flex;flex-wrap:wrap;gap:var(--sp-1)}
.hd-math-edit-syms button{min-width:38px;padding:var(--sp-1) var(--sp-2);font-size:var(--fs-4);
  border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--surface);
  color:var(--text);cursor:pointer}
.hd-math-edit-syms button:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
.hd-math-edit-tip{font-size:var(--fs-1);color:var(--faint);line-height:1.6}
.hd-math-edit-ops{display:flex;justify-content:flex-end;gap:var(--sp-2)}
.hd-math-edit-ops button{padding:var(--sp-2) var(--sp-4);border-radius:var(--r-sm);
  border:1px solid var(--border-strong);background:var(--surface);color:var(--text);cursor:pointer;
  font-weight:600}
.hd-math-edit-ops button.primary{background:var(--brand);border-color:var(--brand);color:var(--ink-on-brand)}