/* ===========================================================
 * 七年级信息科技教学评测平台 — 样式
 * 默认：学生端 浅色明亮大气风
 * 教师端：加 body.is-teacher 切换为深色"庄重"风
 * =========================================================== */

:root {
  /* === 浅色主基调 === */
  --bg-page: linear-gradient(180deg, #eef3ff 0%, #f5f7fb 45%, #fafbff 100%);
  --bg-soft: #f6f8fc;
  --surface: #ffffff;
  --surface-2: #f4f7fc;
  --border: rgba(30, 50, 90, 0.08);
  --border-strong: rgba(30, 50, 90, 0.16);
  --text-primary: #1a2342;
  --text-secondary: #5d6b88;
  --text-muted: #8e9ab5;

  /* === 册（年级）主色 === */
  --book-7a: #ff7a45;          /* 活力橙 七年级上册 */
  --book-7a-light: #ff9a6b;
  --book-7b: #4a90e2;          /* 天空蓝 七年级下册 */
  --book-7b-light: #6ba9e8;

  /* 2~9 年级册色（占位用，可按主题重新配） */
  --book-2a: #b573e8;  --book-2b: #b573e8;        /* 梦幻紫 */
  --book-3a: #ff85b3;  --book-3b: #ff85b3;        /* 樱花粉 */
  --book-4a: #19c39a;  --book-4b: #19c39a;        /* 薄荷绿 */
  --book-5a: #f4b400;  --book-5b: #f4b400;        /* 向阳黄 */
  --book-6a: #46c8e0;  --book-6b: #46c8e0;        /* 科技青 */
  --book-8a: #e74c3c;  --book-8b: #e74c3c;        /* 石榴红 */
  --book-9a: #ff5e8a;  --book-9b: #ff5e8a;        /* 玫瑰红 */
  --book-2a-light: #c893ee; --book-3a-light: #ff9bc0;
  --book-4a-light: #2ed1ab; --book-5a-light: #ffc233;
  --book-6a-light: #5cd0e8; --book-8a-light: #ff6b5c;
  --book-9a-light: #ff7a9c;

  /* === 单元 8 色（橙/蓝/紫/绿/金/青/红/深紫） === */
  --unit-orange: #ff7a45;
  --unit-blue:   #4a90e2;
  --unit-purple: #9b59b6;
  --unit-green:  #27ae60;
  --unit-gold:   #f39c12;
  --unit-teal:   #16a085;
  --unit-red:    #e74c3c;
  --unit-deep:   #673ab7;

  /* === 语义色 === */
  --green:  #27ae60;
  --yellow: #f39c12;
  --red:    #e74c3c;
  --gold:   #ffc107;
  --cyan:   #46c8e0;

  /* === 阴影 === */
  --shadow-sm: 0 2px 8px rgba(30, 50, 90, 0.06);
  --shadow-md: 0 6px 24px rgba(30, 50, 90, 0.08);
  --shadow-lg: 0 12px 40px rgba(30, 50, 90, 0.14);

  /* === 渐变 === */
  --grad-orange: linear-gradient(135deg, #ff7a45 0%, #ff9a6b 100%);
  --grad-blue:   linear-gradient(135deg, #4a90e2 0%, #6ba9e8 100%);
  --grad-purple: linear-gradient(135deg, #8e5cf6 0%, #b573e8 100%);
  --grad-pink:   linear-gradient(135deg, #ff7a45 0%, #ff5e8a 100%);
  --grad-magenta: linear-gradient(135deg, #e84a86 0%, #ff7aa2 100%);
  --title-orange: linear-gradient(95deg, #ff7a45 0%, #ff9a6b 60%, #ffb487 100%);
}

/* ===== Server 2008R2 emoji 兜底字体（2026-09-29） =====
   学校教师机（Win Server 2008R2 + 360极速浏览器）缺少 2010 年后 Unicode 的 emoji 字形，
   ⏱⏸⏳⏰🟢🟠🥊🪑🗑️🖼 等显示为方框/空白。此处内嵌 Noto Emoji 单色子集（485 个高风险码位，
   fonts/emoji-fix.woff2，158KB，服务器端长缓存），仅对下列 unicode-range 内的码位生效：
   现代系统（学生机 Win10 等）的常用彩色 emoji 不在范围内，仍走系统字体，不受影响。
   注意：若日后扩充码位，请重新生成字体并改名（如 emoji-fix-v2.woff2）以刷新缓存。 */
@font-face {
  font-family: 'EmojiFix';
  src: url('fonts/emoji-fix.woff2') format('woff2');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+23E9-23FA, U+26D4, U+2705, U+2728, U+274C, U+2795-2797, U+2B50, U+2B55,
    U+1F441, U+1F550-1F567, U+1F58A-1F58D, U+1F5A5, U+1F5A8, U+1F5B1-1F5B2, U+1F5BC,
    U+1F5C2-1F5C4, U+1F5D1-1F5D3, U+1F5E3, U+1F6AB, U+1F648-1F64A, U+1F6E1,
    U+1F7E0-1F7EB, U+1F900-1F9FF, U+1FA70-1FAFF;
}
/* 图标编辑框（加减分事项的 emoji 输入框）继承字体链，保证兜底字体生效 */
.beh-set-ico { font-family: inherit; }
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: "PingFang SC", "Microsoft YaHei", "EmojiFix", system-ui, sans-serif;
  background: var(--bg-page);
  color: var(--text-primary);
  min-height: calc(var(--vhpx, 1vh) * 100);
  overflow-x: hidden;
  /* —— 字体抗锯齿优化：解决 zoom 非整数缩放导致的文字发虚 —— */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-synthesis: none;
}
#app { min-height: calc(var(--vhpx, 1vh) * 100); }
button { font-family: inherit; cursor: pointer; border: none; }
button:disabled { opacity: .5; cursor: not-allowed; }
a { color: inherit; }

/* === 全局背景：浅点 + 柔和色晕 === */
.bg-deco {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(900px 500px at 15% 10%, rgba(255,122,69,0.06), transparent 55%),
    radial-gradient(800px 500px at 90% 90%, rgba(74,144,226,0.07), transparent 55%),
    radial-gradient(rgba(30,50,90,0.05) 1.2px, transparent 1.2px) 0 0 / 28px 28px;
}
.cloud-layer { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.cloud {
  position: absolute;
  background: rgba(255,255,255,0.7);
  border-radius: 50%;
  filter: blur(30px);
  animation: drift 60s linear infinite;
}
.cloud-1 { width: 280px; height: 90px; top: 8%;  left: -10%; animation-delay: 0s; }
.cloud-2 { width: 220px; height: 70px; top: 35%; right: -8%; animation-delay: -20s; }
.cloud-3 { width: 320px; height: 100px; top: 70%; left: -12%; animation-delay: -40s; }
@keyframes drift {
  0%   { transform: translateX(0); }
  50%  { transform: translateX(40px); }
  100% { transform: translateX(0); }
}
.app-wrap { position: relative; z-index: 1; min-height: calc(var(--vhpx, 1vh) * 100); }

/* ===========================================================
 * 登录页（明亮大色块）
 * =========================================================== */
.login-page {
  min-height: calc(var(--vhpx, 1vh) * 100);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 18px 24px 14px;
}
.login-container { max-width: 1080px; width: 100%; text-align: center; }

.login-header { margin-bottom: 14px; }
.robot-emoji {
  display: inline-block;
  font-size: 44px; line-height: 1; margin-bottom: 6px;
  filter: drop-shadow(0 6px 18px rgba(255,122,69,0.25));
  animation: float 3.5s ease-in-out infinite;
}
@keyframes float { 0%,100%{ transform: translateY(0) rotate(0); } 50%{ transform: translateY(-10px) rotate(-2deg); } }

.big-title {
  font-size: 36px; font-weight: 900;
  background: var(--title-orange);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  letter-spacing: 4px; margin-bottom: 6px; line-height: 1.1;
}
.sub { color: var(--text-secondary); font-size: 13px; margin-bottom: 4px; letter-spacing: 1px; }

/* 3 步进度条（圆形步骤+连线） */
.steps-bar {
  display: inline-flex; align-items: center; gap: 0;
  margin: 6px auto 14px;
  padding: 8px 24px;
  background: var(--surface);
  border-radius: 999px;
  box-shadow: var(--shadow-sm);
}
.step { display: flex; align-items: center; gap: 8px; padding: 0 14px; color: var(--text-muted); font-size: 14px; transition: 0.2s; }
.step.on { color: var(--text-primary); font-weight: 700; }
.step.clickable { cursor: pointer; }
.step.clickable:hover .step-lbl { color: var(--book-7a); }
.step-num {
  width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 13px;
  background: #e9eef6; color: var(--text-muted);
  transition: 0.2s;
}
.step.on .step-num { background: var(--book-7a); color: #fff; box-shadow: 0 0 0 4px rgba(255,122,69,0.18); }
.step-line { width: 30px; height: 2px; background: #e9eef6; }

/* 提问 */
.prompt-q {
  font-size: 34px; font-weight: 800; color: var(--text-primary);
  margin-bottom: 30px; letter-spacing: 1px;
}
.qmark { color: var(--book-7a); margin-left: 4px; }

/* 2 个大色块卡（选册/选班） */
.book-grid {
  display: flex; gap: 28px; justify-content: center; margin-bottom: 28px; flex-wrap: wrap;
}
.book-card {
  width: 320px; height: 180px; border-radius: 24px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  cursor: pointer; transition: all 0.2s ease; padding: 24px;
  background: var(--surface);
  color: #fff;
  font-family: inherit;
  position: relative; overflow: hidden;
  box-shadow: var(--shadow-md);
}
.book-card::before {
  content: ''; position: absolute; top: -20%; right: -20%; bottom: auto; left: auto;
  width: 220px; height: 220px; border-radius: 50%;
  background: rgba(255,255,255,0.12);
  z-index: 0;
}
.book-card::after {
  content: ''; position: absolute; top: auto; right: auto; bottom: -30%; left: -20%;
  width: 180px; height: 180px; border-radius: 50%;
  background: rgba(255,255,255,0.08);
  z-index: 0;
}
.book-card.book-orange { background: var(--grad-orange); }
.book-card.book-blue   { background: var(--grad-blue); }
.book-emoji { font-size: 56px; margin-bottom: 10px; position: relative; z-index: 1; filter: drop-shadow(0 2px 6px rgba(0,0,0,0.2)); }
.book-name { font-size: 30px; font-weight: 900; letter-spacing: 2px; position: relative; z-index: 1; }
.book-tag { font-size: 14px; opacity: 0.92; margin-top: 6px; position: relative; z-index: 1; letter-spacing: 0.5px; }
.book-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.book-card.selected { transform: translateY(-6px); box-shadow: 0 0 0 4px rgba(255,255,255,0.4), 0 12px 36px rgba(0,0,0,0.2); }

/* 班级卡（白色） */
.book-card.class-card {
  background: var(--surface); color: var(--text-primary);
  border: 2px solid var(--border);
  box-shadow: var(--shadow-sm);
}
.book-card.class-card::before, .book-card.class-card::after { display: none; }
.book-card.class-card .book-emoji { font-size: 48px; }
.book-card.class-card .book-name { font-size: 26px; }
.book-card.class-card .book-tag { color: var(--text-secondary); }
.book-card.class-card:hover { border-color: var(--book-7a); }

/* 名字网格 */
.name-grid {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px;
  max-width: 720px; margin: 0 auto 28px;
}
.name-pill {
  background: var(--surface); border: 2px solid var(--border);
  border-radius: 12px; padding: 14px 6px; text-align: center;
  cursor: pointer; transition: 0.15s; font-family: inherit;
  color: var(--text-primary);
}
.name-pill:hover { border-color: var(--book-7a); transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.name-pill.selected { border-color: var(--book-7a); background: rgba(255,122,69,0.06); }
.name-pill-name { font-size: 15px; font-weight: 600; }
.name-pill-no { color: var(--text-muted); font-size: 12px; margin-top: 2px; }

.login-actions { margin-top: 8px; }
.btn-back {
  background: transparent; color: var(--text-secondary);
  padding: 12px 26px; border-radius: 999px; font-size: 16px; cursor: pointer;
  font-family: inherit; font-weight: 600;
}
.btn-back:hover { color: var(--text-primary); background: rgba(0,0,0,0.04); }

.login-footer { margin-top: 36px; color: var(--text-muted); font-size: 13px; }
.login-footer a { color: var(--book-7a); text-decoration: none; font-weight: 600; }
.login-footer a:hover { text-decoration: underline; }

/* ===========================================================
 * 探险岛地图页
 * =========================================================== */
.map-page {
  height: calc(var(--vhpx, 1vh) * 100);
  min-height: 560px;
  padding: 10px 24px 0;
  display: flex; flex-direction: column;
  overflow-y: auto;
}

/* 顶栏 */
.island-topbar {
  display: flex; align-items: center; justify-content: space-between;
  background: var(--surface); border-radius: 14px; padding: 9px 18px;
  box-shadow: var(--shadow-sm); margin-bottom: 12px;
  gap: 14px; flex-wrap: wrap; flex-shrink: 0;
}
.island-topbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

.book-badge {
  background: var(--book-7a); color: #fff;
  border-radius: 12px; padding: 7px 14px;
  font-size: 14px; font-weight: 700; letter-spacing: 1px;
  box-shadow: 0 4px 12px rgba(255,122,69,0.3);
}
.book-badge.badge-orange { background: var(--grad-orange); }
.book-badge.badge-blue   { background: var(--grad-blue);   box-shadow: 0 4px 12px rgba(74,144,226,0.3); }
.book-badge.badge-purple { background: var(--grad-purple); box-shadow: 0 4px 12px rgba(181,115,232,0.3); }
.book-badge.badge-magenta { background: var(--grad-magenta); box-shadow: 0 4px 12px rgba(232,74,134,0.3); }

.island-title { font-size: 23px; font-weight: 800; color: var(--text-primary); letter-spacing: 1px; }

.student-info {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 18px; background: var(--surface-2);
  border-radius: 999px; font-size: 17px; font-weight: 700;
  box-shadow: 0 3px 10px rgba(47,58,91,0.10);
}
.student-avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--book-7a); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 19px; font-weight: 800;
  box-shadow: 0 3px 8px rgba(255,122,69,0.35);
}
.student-name { font-weight: 800; color: var(--text-primary); font-size: 21px; letter-spacing: 0.5px; }
.student-stars { color: var(--gold); font-weight: 800; font-size: 18px; }
/* —— 星星汇总组（地图页顶部，四个模块并排） —— */
.star-hub {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 6px; background: rgba(255,255,255,0.55);
  border-radius: 999px;
}
.star-chip {
  display: inline-flex; align-items: center; gap: 2px;
  padding: 3px 10px; border-radius: 999px;
  font-size: 13px; font-weight: 800;
  letter-spacing: 0.3px;
}
.star-chip b { font-size: 15px; }
.star-ch-book { background: #FFEEDD; color: #D96F1C; }
.star-ch-type { background: #E3EEFF; color: #2D6BD4; }
.star-ch-base { background: #E0F5EE; color: #2E8B6E; }
.star-ch-sim  { background: #EFE3F9; color: #7B4DB8; }
/* —— 百宝箱九宫格卡片星星角标（定位在图标右上角） —— */
.toolbox-icon { position: relative; }
.tbx-stars-corner {
  position: absolute; top: -4px; right: -4px;
  background: linear-gradient(135deg, #FFD54F, #FF8A00);
  color: #fff; font-size: 11px; font-weight: 800;
  padding: 1px 6px; border-radius: 999px;
  box-shadow: 0 2px 6px rgba(255,138,0,0.4);
  line-height: 1.5;
}

/* 胶囊导航 */
.pill-nav { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pill {
  background: transparent;
  border: 2px solid var(--pill-color, var(--text-muted));
  color: var(--pill-color, var(--text-muted));
  border-radius: 999px;
  padding: 8px 18px;
  font-size: 15px; font-weight: 700; cursor: pointer;
  font-family: inherit;
  transition: 0.15s;
  white-space: nowrap;
}
.pill:hover { background: var(--pill-color); color: #fff; transform: translateY(-1px); box-shadow: 0 4px 10px rgba(0,0,0,0.08); }
.pill-bronze   { --pill-color: #cd7f32; }
.pill-type     { --pill-color: #4a90e2; }
.pill-base     { --pill-color: #16a085; }
.pill-software { --pill-color: #9b59b6; }
.pill-grade    { --pill-color: #ff7a45; }
.pill-test     { --pill-color: #f39c12; }
.pill-works    { --pill-color: #e91e63; }
.pill-challenge{ --pill-color: #ffc107; }
.pill-errors   { --pill-color: #673ab7; }
.pill-exit     {
  --pill-color: #E7673C;
  background: #fff;
  border: 2px solid #E7673C;
  color: #E7673C;
  padding: 8px 20px;
  font-size: 15px;
  font-weight: 800;
  box-shadow: 0 3px 10px rgba(231,103,60,0.10);
}
.pill-exit:hover {
  background: #E7673C; border-color: #E7673C; color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(231,103,60,0.28);
}
.exit-ic { display: inline-block; margin-right: 4px; font-size: 14px; font-weight: 800; }

/* —— 学习百宝箱下拉按钮 —— */
.pill-toolbox {
  --pill-color: #E7673C;
  background: linear-gradient(135deg,#FF8A5C,#E7673C);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 14px rgba(231,103,60,0.28);
}
.pill-toolbox:hover { background: linear-gradient(135deg,#FF9C73,#F07348); color:#fff; transform: translateY(-1px); box-shadow: 0 6px 18px rgba(231,103,60,0.36); }
.pill-toolbox.on { background: linear-gradient(135deg,#F07348,#D45630); box-shadow: 0 3px 10px rgba(231,103,60,0.22); }
.toolbox-caret { display: inline-block; margin-left: 4px; transition: transform 0.2s; font-size: 12px; opacity: 0.9; }
.toolbox-caret.open { transform: rotate(180deg); }

/* —— 百宝箱外层容器 & 弹出面板 —— */
.toolbox-wrap { position: relative; }
.toolbox-popover {
  position: absolute; top: calc(100% + 12px); right: 0; z-index: 60;
  width: 480px; padding: 18px 18px 20px;
  background: #FFFBF3;
  border: 1px solid rgba(231,103,60,0.18);
  border-radius: 18px;
  box-shadow: 0 18px 48px rgba(47,58,91,0.18), 0 4px 14px rgba(231,103,60,0.08);
}
.toolbox-popover::before {
  /* 指向胶囊按钮的小三角 */
  content:''; position: absolute; top: -8px; right: 88px;
  width: 14px; height: 14px;
  background: #FFFBF3;
  border-left: 1px solid rgba(231,103,60,0.18);
  border-top: 1px solid rgba(231,103,60,0.18);
  transform: rotate(45deg);
}
.toolbox-title {
  font-size: 16px; font-weight: 800; color: #3A2C1C;
  margin: 2px 4px 14px; letter-spacing: 0.5px;
}
/* 百宝箱导航格：10 个入口 → 两行五列（r79：新增「我的作业」后由三列改为五列，避免孤行） */
.toolbox-grid {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px;
}
.toolbox-card {
  position: relative;  /* 容纳"正在这里"丝带 */
  border: none; background: #fff;
  border-radius: 14px;
  padding: 16px 8px 14px;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  cursor: pointer; font-family: inherit;
  box-shadow: 0 3px 10px rgba(47,58,91,0.06);
  transition: transform 0.18s, box-shadow 0.18s, background 0.18s, border-color 0.18s;
  border: 2px solid transparent;
}
.toolbox-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(47,58,91,0.12);
}
.toolbox-icon {
  width: 54px; height: 54px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; line-height: 1;
  transition: transform 0.2s;
}
.toolbox-card:hover .toolbox-icon { transform: scale(1.08); }
.toolbox-label {
  font-size: 14px; font-weight: 700; color: #3A2C1C;
}
/* 激活卡片（闯关地图 · 正在这里） */
.toolbox-card.active {
  background: #dbeafe;
  border-color: #3b82f6;
  box-shadow: 0 6px 18px rgba(255,138,92,0.22);
}
.toolbox-card.active .toolbox-label { color: #B4421A; }
.toolbox-here {
  position: absolute; top: -1px; left: -1px;
  background: linear-gradient(135deg,#FF8A5C,#E7673C);
  color: #fff; font-size: 11px; font-weight: 800;
  padding: 3px 10px 3px 9px;
  border-radius: 12px 0 10px 0;
  letter-spacing: 0.3px;
  box-shadow: 0 2px 6px rgba(231,103,60,0.25);
}
/* 各彩色卡片的 hover 细边（非激活时柔和高亮色） */
.toolbox-card.toolbox-map:hover      { border-color: #93c5fd; }
.toolbox-card.toolbox-base:hover     { border-color: #7FC9B4; }
.toolbox-card.toolbox-software:hover { border-color: #BFA0E8; }
.toolbox-card.toolbox-type:hover     { border-color: #90B8ED; }
.toolbox-card.toolbox-test:hover     { border-color: #EBBF85; }
.toolbox-card.toolbox-challenge:hover{ border-color: #CD9A6C; }
.toolbox-card.toolbox-grade:hover    { border-color: #85A8DF; }
.toolbox-card.toolbox-works:hover    { border-color: #F09FBF; }
.toolbox-card.toolbox-errors:hover   { border-color: #B39AE0; }

/* 过渡动画 */
.toolbox-enter-active, .toolbox-leave-active { transition: opacity 0.18s, transform 0.18s; }
.toolbox-enter-from, .toolbox-leave-to { opacity: 0; transform: translateY(-6px) scale(0.98); }

/* 窄屏自适应 */
@media (max-width: 720px) {
  .toolbox-popover { width: min(calc(var(--vwpx, 1vw) * 92), 480px); right: -12px; }
  .toolbox-grid { gap: 8px; }
  .toolbox-card { padding: 12px 4px 10px; border-radius: 12px; }
  .toolbox-icon { width: 44px; height: 44px; border-radius: 12px; font-size: 22px; }
  .toolbox-label { font-size: 12px; }
}

/* 册内学习提示：默认悬浮右上角（兼容未内嵌场景）；加 greeting-inline 后嵌入顶部栏中部空白区 */
.greeting-bubble {
  position: fixed; right: 24px; top: 22px; z-index: 30;
  display: flex; align-items: flex-start; gap: 10px;
  width: min(330px, calc(calc(var(--vwpx, 1vw) * 100) - 48px)); padding: 12px 40px 12px 14px;
  background: #fffdf8; border: 1px solid rgba(255,155,69,0.32); border-radius: 10px;
  box-shadow: 0 10px 28px rgba(47, 58, 91, 0.16);
  /* r153 低分屏可读性：问候语由中灰蓝 #5d6b88 加深到深藏青 */
  color: #33415f;
}
.greeting-bubble::after {
  content: ''; position: absolute; right: 34px; bottom: -8px; width: 14px; height: 14px;
  background: #fffdf8; border-right: 1px solid rgba(255,155,69,0.32); border-bottom: 1px solid rgba(255,155,69,0.32);
  transform: rotate(45deg);
}
/* —— 顶部栏内嵌模式：位于左右两组中间（红框区域） —— */
.greeting-bubble.greeting-inline {
  position: relative; right: auto; top: auto; z-index: 1;
  flex: 1 1 340px;
  width: auto; max-width: 400px; min-width: 280px;
  margin: 0 16px;
  box-shadow: 0 6px 18px rgba(47,58,91,0.12);
}
.greeting-bubble.greeting-inline::after { display: none; }
.greeting-robot { font-size: 26px; line-height: 1; }
.greeting-copy { display: grid; gap: 4px; font-size: 13px; line-height: 1.55; }
.greeting-copy strong { font-size: 15px; color: var(--text-primary); }
.greeting-close { position: absolute; right: 10px; top: 8px; width: 24px; height: 24px; background: transparent; color: #9da7ba; font-size: 22px; line-height: 1; }
.greeting-close:hover { color: var(--book-7a); }

/* 册内进度区 */
.progress-section {
  max-width: 1120px; margin: 0 auto 14px; padding: 13px 18px;
  display: grid; grid-template-columns: 170px minmax(180px, 1fr) auto; align-items: center; gap: 18px;
  background: rgba(255,255,255,0.86); border: 1px solid var(--border); border-radius: 10px;
  box-shadow: var(--shadow-sm);
}
.progress-heading { display: flex; align-items: baseline; gap: 8px; }
.progress-kicker { color: var(--book-7a); font-size: 10px; font-weight: 800; letter-spacing: 1px; }
.progress-label { font-size: 16px; font-weight: 800; color: var(--text-primary); }
.progress-bar { height: 8px; background: #eef1f7; border-radius: 999px; overflow: hidden; }
.progress-fill { height: 100%; background: linear-gradient(90deg, #ff9b45, #ff714d); border-radius: 999px; transition: width 0.4s ease; box-shadow: 0 0 8px rgba(255,122,69,0.3); }
.progress-text { font-size: 12px; color: var(--text-muted); font-weight: 600; white-space: nowrap; }

/* 探险岛地图：主路径串联单元 */
.island-map { position: relative; margin: 0 auto 12px; padding: 14px 8px 6px; max-width: 1120px; min-height: 430px; }
.map-path { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; opacity: .78; }
.unit-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 54px; padding: 30px 44px; }
.unit-card {
  background: rgba(255,255,255,0.96); border: 1px solid rgba(30,50,90,.08); border-left: 5px solid var(--unit-color, var(--book-7a));
  border-radius: 10px; padding: 15px 16px 14px; box-shadow: var(--shadow-md); transition: transform .2s, box-shadow .2s; position: relative;
}
.unit-card:nth-child(2), .unit-card:nth-child(4) { transform: translateY(20px); }
.unit-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.unit-card:nth-child(2):hover, .unit-card:nth-child(4):hover { transform: translateY(16px); }
.unit-card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.unit-order { color: var(--unit-color); font-size: 12px; font-weight: 800; letter-spacing: .5px; }
.unit-count { padding: 3px 7px; border-radius: 999px; background: color-mix(in srgb, var(--unit-color) 10%, white); color: var(--unit-color); font-size: 11px; font-weight: 700; }
.unit-main { display: flex; align-items: center; gap: 11px; }
.unit-icon-wrap { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 10px; background: color-mix(in srgb, var(--unit-color) 12%, transparent); }
.unit-icon { font-size: 28px; line-height: 1; }
.unit-title-wrap { min-width: 0; text-align: left; }
.unit-name { font-size: 17px; font-weight: 800; color: var(--text-primary); line-height: 1.35; }
.unit-progress { font-size: 12px; color: var(--text-muted); margin-top: 3px; }
.unit-tasks { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; margin-top: 13px; }
.unit-task-dot { min-height: 44px; background: var(--surface-2); color: var(--text-muted); display: grid; place-items: center; align-content: center; gap: 1px; font-weight: 800; font-size: 13px; border: 1px solid transparent; border-radius: 7px; transition: .15s; font-family: inherit; }
.unit-task-dot em { font-style: normal; font-size: 10px; font-weight: 600; opacity: .82; }
.unit-task-dot.open { background: color-mix(in srgb, var(--unit-color) 11%, white); border-color: color-mix(in srgb, var(--unit-color) 35%, white); color: var(--unit-color); box-shadow: 0 3px 8px color-mix(in srgb, var(--unit-color) 16%, transparent); }
.unit-task-dot.open:hover { background: var(--unit-color); color: #fff; transform: translateY(-2px); }
.unit-task-dot.locked { opacity: .4; cursor: not-allowed; }

/* ===========================================================
 * 章节式大单元带（v0.4 · 大气纵列导航 + 顺序解锁）
 * =========================================================== */
.island-map { max-width: 1120px; margin: 0 auto 12px; padding: 0; min-height: 0; }
.journey { display: flex; flex-direction: column; gap: 22px; position: relative; }
.journey::before {
  content: ''; position: absolute; left: 76px; top: 40px; bottom: 40px; width: 3px;
  background: repeating-linear-gradient(180deg, rgba(255,155,69,.45) 0 10px, transparent 10px 20px);
  z-index: 0;
}
.unit-band {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 152px 1fr; gap: 22px;
  background: rgba(255,255,255,0.97);
  border: 1px solid var(--border);
  border-radius: 20px;
  box-shadow: var(--shadow-md);
  padding: 24px 26px;
  transition: transform .2s, box-shadow .2s;
  overflow: hidden;
}
.unit-band::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 6px;
  background: linear-gradient(180deg, var(--unit-color), color-mix(in srgb, var(--unit-color) 55%, white));
}
.unit-band::after {
  content: ''; position: absolute; right: -70px; top: -70px; width: 220px; height: 220px; border-radius: 50%;
  background: color-mix(in srgb, var(--unit-color) 7%, transparent); pointer-events: none;
}
.unit-band:not(.is-locked):hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }

/* 左侧序号柱 */
.band-side {
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 10px;
  border-right: 1px dashed var(--border-strong); padding-right: 20px;
}
.band-num {
  font-size: 46px; font-weight: 900; line-height: 1; letter-spacing: 1px;
  color: color-mix(in srgb, var(--unit-color) 85%, white);
  text-shadow: 0 2px 0 #fff, 0 4px 14px color-mix(in srgb, var(--unit-color) 25%, transparent);
}
.band-emoji { font-size: 34px; line-height: 1; filter: drop-shadow(0 3px 8px rgba(30,50,90,.18)); }
.band-ring { width: 54px; height: 54px; transform: rotate(-90deg); }
.band-ring .ring-bg { fill: none; stroke: #eef1f7; stroke-width: 5; }
.band-ring .ring-fg { fill: none; stroke: var(--unit-color); stroke-width: 5; stroke-linecap: round; transition: stroke-dashoffset .5s ease; }
.band-ring-text { font-size: 12px; font-weight: 800; color: var(--unit-color); margin-top: -6px; }

/* 右侧主体 */
.band-main { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.band-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; }
.band-kicker { font-size: 11px; font-weight: 800; letter-spacing: 2px; color: var(--unit-color); margin-bottom: 5px; }
.band-title { font-size: 26px; font-weight: 900; color: var(--text-primary); line-height: 1.25; letter-spacing: 1px; }
.band-intro { font-size: 13.5px; color: var(--text-secondary); margin-top: 6px; line-height: 1.6; }
.band-state-chip {
  flex: 0 0 auto; font-size: 13px; font-weight: 700; padding: 6px 14px; border-radius: 999px;
  white-space: nowrap; border: 1.5px solid transparent;
}
.band-state-chip.chip-current  { background: color-mix(in srgb, var(--unit-color) 12%, white); color: var(--unit-color); border-color: color-mix(in srgb, var(--unit-color) 40%, white); }
.band-state-chip.chip-complete { background: rgba(39,174,96,.1); color: var(--green); border-color: rgba(39,174,96,.35); }
.band-state-chip.chip-locked   { background: #f1f3f8; color: var(--text-muted); border-color: var(--border-strong); }

/* 单元进度条 */
.band-progress { display: flex; align-items: center; gap: 12px; }
.band-progress-bar { flex: 1; height: 8px; background: #eef1f7; border-radius: 999px; overflow: hidden; }
.band-progress-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--unit-color), color-mix(in srgb, var(--unit-color) 55%, #ffb487)); transition: width .4s ease; }
.band-progress-text { font-size: 12px; font-weight: 700; color: var(--text-muted); white-space: nowrap; }

/* 任务节点路径 */
.band-tasks { display: flex; gap: 10px; position: relative; flex-wrap: wrap; }
.band-task-track {
  position: absolute; left: 24px; right: 24px; top: 25px; height: 3px;
  background: repeating-linear-gradient(90deg, var(--border-strong) 0 8px, transparent 8px 14px);
}
.band-task {
  position: relative; flex: 1; min-width: 118px;
  background: transparent; border: none; padding: 0;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  font-family: inherit; transition: transform .15s;
}
.band-task .bt-dot {
  width: 52px; height: 52px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 900; border: 3px solid #e4e9f2; background: #fff;
  color: var(--text-muted); transition: .15s; box-shadow: 0 2px 8px rgba(30,50,90,.06);
}
.band-task .bt-name { font-size: 12.5px; line-height: 1.45; color: var(--text-secondary); font-weight: 600; text-align: center; }
.band-task.open .bt-dot {
  background: color-mix(in srgb, var(--unit-color) 12%, white);
  border-color: var(--unit-color); color: var(--unit-color);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--unit-color) 12%, transparent);
}
.band-task.open:hover { transform: translateY(-3px); }
.band-task.open:hover .bt-dot { background: var(--unit-color); color: #fff; }
.band-task.done .bt-dot { background: var(--green); border-color: var(--green); color: #fff; }
.band-task.done .bt-name { color: var(--green); }
.band-task.locked .bt-dot, .band-task.draft .bt-dot { opacity: .5; cursor: not-allowed; }
.band-task.locked .bt-name, .band-task.draft .bt-name { opacity: .55; }

/* 锁定单元整体状态 */
.unit-band.is-locked { background: rgba(255,255,255,.75); box-shadow: var(--shadow-sm); }
.unit-band.is-locked .band-title, .unit-band.is-locked .band-num, .unit-band.is-locked .band-intro,
.unit-band.is-locked .band-emoji { opacity: .45; filter: grayscale(.6); }
.unit-band.is-locked .band-task { pointer-events: none; }
.band-lock-hint {
  display: flex; align-items: center; gap: 8px;
  background: #f6f7fa; border: 1.5px dashed var(--border-strong); border-radius: 10px;
  padding: 10px 14px; font-size: 13px; color: var(--text-secondary); font-weight: 600;
}
.lock-icon { font-size: 16px; }

/* 当前学习单元高亮 */
.unit-band.is-current { border-color: color-mix(in srgb, var(--unit-color) 35%, white); box-shadow: 0 10px 34px color-mix(in srgb, var(--unit-color) 16%, transparent); }
.unit-band.is-complete .band-side { border-right-color: rgba(39,174,96,.3); }

/* 示例册提示 */
.draft-book-tip {
  margin-top: 4px; text-align: center; color: var(--text-muted); font-size: 13px;
  background: var(--surface); border: 1.5px dashed var(--border-strong); border-radius: 10px; padding: 12px;
}

/* 播放器：完成按钮 */
.pager .finish-btn {
  background: linear-gradient(135deg, #27ae60, #2ecc71); border-color: transparent; color: #fff;
}
.pager .finish-btn:hover { filter: brightness(1.06); color: #fff; }

/* ===========================================================
 * 功能面板（九大版块）弹层
 * =========================================================== */
.panel-overlay {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 60;
  background: rgba(24, 33, 56, 0.45); backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center; padding: 24px;
}
.panel-box {
  width: min(760px, calc(var(--vwpx, 1vw) * 96)); max-height: calc(var(--vhpx, 1vh) * 86);
  background: #fff; border-radius: 20px; box-shadow: var(--shadow-lg);
  display: flex; flex-direction: column; overflow: hidden;
}
.panel-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 22px; border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, #fbfcff, #fff);
}
.panel-title { font-size: 19px; font-weight: 800; color: var(--text-primary); letter-spacing: .5px; }
.panel-close {
  width: 34px; height: 34px; border-radius: 50%; background: var(--surface-2);
  color: var(--text-secondary); font-size: 20px; line-height: 1; transition: .15s;
}
.panel-close:hover { background: #ffe9df; color: var(--book-7a); }
.panel-body { padding: 20px 22px; overflow-y: auto; }
.panel-tip { margin-top: 16px; font-size: 12.5px; color: var(--text-muted); line-height: 1.7; background: var(--surface-2); border-radius: 8px; padding: 10px 12px; }
.panel-empty { text-align: center; color: var(--text-secondary); font-size: 14.5px; padding: 46px 10px; line-height: 1.8; }
.panel-actions { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
.panel-btn {
  background: var(--surface-2); border: 1.5px solid var(--border-strong); color: var(--text-primary);
  border-radius: 999px; padding: 9px 22px; font-size: 14px; font-weight: 700; transition: .15s; font-family: inherit;
}
.panel-btn:hover:not(:disabled) { border-color: var(--book-7a); color: var(--book-7a); }
.panel-btn.primary { background: var(--grad-orange); border-color: transparent; color: #fff; }
.panel-btn.primary:hover:not(:disabled) { color: #fff; filter: brightness(1.05); }
.panel-btn.small { padding: 6px 14px; font-size: 12.5px; }

/* ① 青铜段位 */
.rank-hero { display: flex; align-items: center; gap: 16px; border-radius: 16px; padding: 18px 22px; margin-bottom: 14px; }
.rank-icon { font-size: 52px; line-height: 1; }
.rank-name { font-size: 26px; font-weight: 900; letter-spacing: 1px; }
.rank-next { font-size: 13px; color: var(--text-secondary); margin-top: 4px; }
.rank-ladder { display: flex; gap: 8px; flex-wrap: wrap; }
.rank-step {
  flex: 1; min-width: 108px; display: flex; flex-direction: column; align-items: center; gap: 4px;
  background: var(--surface-2); border-radius: 10px; padding: 10px 8px; font-size: 13px; font-weight: 700;
  color: var(--text-muted); border: 1.5px solid transparent;
}
.rank-step .rs-dot { width: 10px; height: 10px; border-radius: 50%; background: #d5dbe8; }
.rank-step .rs-need { font-size: 11px; font-weight: 500; }
.rank-step.reached { border-color: #ffc107; color: var(--text-primary); background: rgba(255,193,7,.08); }
.rank-step.reached .rs-dot { background: #ffc107; box-shadow: 0 0 8px rgba(255,193,7,.6); }

/* ② 打字练习：已升级为整页专区（见文件末尾 .typ-root 作用域样式） */

/* ③ 基础训练 */
.drill-unit { margin-bottom: 14px; }
.drill-unit-head { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 800; margin-bottom: 8px; }
.drill-count { margin-left: auto; font-size: 12px; color: var(--text-muted); font-weight: 700; }
.drill-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.drill-item { display: flex; align-items: center; gap: 8px; background: var(--surface-2); border-radius: 9px; padding: 9px 12px; font-size: 13.5px; }
.drill-flag { font-size: 15px; }
.drill-name { flex: 1; color: var(--text-primary); font-weight: 600; }
.drill-state { font-size: 11.5px; color: var(--text-muted); white-space: nowrap; }
.drill-item.st-done { background: rgba(39,174,96,.07); }
.drill-item.st-done .drill-state { color: var(--green); }
.drill-item.st-wrong { background: rgba(231,76,60,.07); }
.drill-item.st-wrong .drill-state { color: var(--red); }

/* ④ 软件实训：面板入口卡（桌面实训场在 #/sim 路由，样式见文件末尾 sim- 段） */
.sim-launch { display: flex; align-items: center; gap: 16px; background: linear-gradient(135deg, #fff4ec, #ffe9d4); border: 1px solid #ffd9b3; border-radius: 18px; padding: 16px 18px; }
.sim-launch-icon { font-size: 34px; line-height: 1; }
.sim-launch-title { font-size: 15.5px; font-weight: 800; color: var(--text-primary); }
.sim-launch-sub { font-size: 12px; color: #a07b52; margin-top: 3px; }
.sim-launch-apps { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.sim-launch-app { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: #5a6b7f; background: #fff; border: 1px solid #f2e3d2; border-radius: 999px; padding: 3px 9px 3px 4px; }
.sim-launch-app i { font-style: normal; width: 20px; height: 20px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; }
.sim-launch-btn {
  margin-left: auto; flex: 0 0 auto; border: none; cursor: pointer; font-family: inherit;
  background: linear-gradient(135deg, #ff8a4c, #ff6b35); color: #fff; font-size: 13.5px; font-weight: 700;
  padding: 11px 20px; border-radius: 999px; box-shadow: 0 4px 14px rgba(255,107,53,.30); transition: .15s;
}
.sim-launch-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(255,107,53,.38); }

/* ⑤ 我的成绩 */
.grade-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 16px; }
.grade-kpi { background: var(--surface-2); border-radius: 12px; padding: 14px 8px; text-align: center; }
.grade-kpi b { display: block; font-size: 24px; font-weight: 900; color: var(--book-7a); }
.grade-kpi span { font-size: 11.5px; color: var(--text-muted); }
.grade-row { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.gr-name { flex: 0 0 210px; font-size: 13.5px; font-weight: 700; color: var(--text-primary); }
.gr-bar { flex: 1; height: 9px; background: #eef1f7; border-radius: 999px; overflow: hidden; }
.gr-bar i { display: block; height: 100%; background: linear-gradient(90deg, #ff9b45, #ff714d); border-radius: 999px; }
.gr-val { flex: 0 0 128px; text-align: right; font-size: 12px; color: var(--text-muted); font-weight: 600; }
.grade-paper { margin-top: 16px; background: var(--surface-2); border-radius: 12px; padding: 14px 16px; }
.gp-title { font-size: 13px; font-weight: 800; color: var(--text-primary); margin-bottom: 8px; }
.gp-item { font-size: 13px; color: var(--text-secondary); padding: 4px 0; }
.gp-item b.good { color: var(--green); }

/* ⑥ 试卷测验 */
.paper-progress { font-size: 13px; font-weight: 700; color: var(--text-muted); margin-bottom: 12px; }
.paper-q { background: var(--surface-2); border-radius: 14px; padding: 18px 20px; }
.pq-lesson { font-size: 12px; color: var(--book-7a); font-weight: 700; margin-bottom: 8px; }
.pq-text { font-size: 16.5px; font-weight: 700; color: var(--text-primary); margin-bottom: 14px; line-height: 1.6; }
.q-opt.chosen { border-color: var(--book-7a); background: rgba(255,122,69,.08); color: var(--book-7a); font-weight: 700; }
.paper-score { text-align: center; padding: 24px 0 18px; }
.ps-num { font-size: 64px; font-weight: 900; line-height: 1; background: var(--title-orange); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ps-label { margin-top: 8px; color: var(--text-secondary); font-size: 14.5px; }
.paper-review { background: var(--surface-2); border-radius: 10px; padding: 12px 14px; margin-bottom: 8px; }
.pr-q { font-size: 14px; font-weight: 700; color: var(--text-primary); margin-bottom: 8px; }
.pr-opts { display: flex; flex-direction: column; gap: 4px; }
.pr-opt { font-size: 13px; padding: 5px 10px; border-radius: 7px; background: #fff; }
.pr-opt.ok { color: var(--green); }
.pr-opt.bad { color: var(--red); }

/* ⑦ 作品广场 */
.works-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.work-card-s { background: var(--surface-2); border-radius: 14px; padding: 16px 14px; text-align: center; transition: .15s; }
.work-card-s:hover { transform: translateY(-3px); box-shadow: var(--shadow-sm); }
.wc-emoji { font-size: 38px; line-height: 1; margin-bottom: 8px; }
.wc-title { font-size: 14.5px; font-weight: 800; color: var(--text-primary); }
.wc-meta { font-size: 11.5px; color: var(--book-7a); font-weight: 700; margin: 4px 0 6px; }
.wc-date { font-weight: 400; color: var(--text-secondary); opacity: .85; }
.wc-desc { font-size: 12.5px; color: var(--text-secondary); line-height: 1.6; min-height: 40px; }
.like-btn-s {
  margin-top: 8px; background: #fff; border: 1.5px solid var(--border-strong); border-radius: 999px;
  padding: 5px 14px; font-size: 12.5px; font-weight: 700; color: var(--text-secondary); transition: .15s;
}
.like-btn-s.liked { border-color: #ff5e8a; color: #ff5e8a; background: rgba(255,94,138,.07); }

/* ⑧ 挑战墙 */
.chal-card { background: var(--surface-2); border-radius: 12px; padding: 14px 16px; margin-bottom: 10px; cursor: pointer; transition: .15s; border: 1.5px solid transparent; }
.chal-card:hover { border-color: var(--book-7a); transform: translateY(-2px); }
.chal-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.chal-level { background: var(--red); color: #fff; font-size: 11px; font-weight: 700; border-radius: 6px; padding: 2px 8px; }
.chal-title { font-size: 14.5px; font-weight: 800; color: var(--text-primary); }
.chal-done { margin-left: auto; font-size: 12px; color: var(--green); font-weight: 700; }
.chal-unit { font-size: 12px; color: var(--text-muted); margin-top: 4px; }
.chal-body { font-size: 13.5px; color: var(--text-secondary); margin-top: 7px; line-height: 1.7; }

/* ⑨ 错题本 */
.wrong-card { background: var(--surface-2); border-radius: 12px; padding: 14px 16px; margin-bottom: 10px; }
.wrong-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.wrong-lesson { font-size: 13.5px; font-weight: 800; color: var(--text-primary); }
.wrong-del { background: rgba(39,174,96,.1); color: var(--green); border-radius: 999px; padding: 4px 12px; font-size: 12px; font-weight: 700; }
.wrong-q { font-size: 14px; font-weight: 600; color: var(--text-primary); margin-bottom: 8px; line-height: 1.6; }
.wrong-opts { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }

/* 面板响应式 */
@media (max-width: 860px) {
  .unit-band { grid-template-columns: 84px 1fr; gap: 14px; padding: 16px; }
  .band-side { padding-right: 10px; }
  .band-num { font-size: 30px; }
  .band-emoji { font-size: 26px; }
  .band-ring, .band-ring-text { display: none; }
  .band-title { font-size: 19px; }
  .journey::before { left: 42px; }
  .band-tasks { flex-wrap: wrap; }
  .band-task { min-width: 30%; }
  .band-task-track { display: none; }
  .drill-list, .works-grid { grid-template-columns: 1fr; }
  .grade-summary { grid-template-columns: repeat(2, 1fr); }
  .grade-row { flex-wrap: wrap; }
  .gr-name { flex: 1 1 100%; }
}

/* 底部册切换 */
.book-tabs { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; padding: 8px 0 0; }
.book-tab { border: 1px solid var(--tab-color); background: rgba(255,255,255,.92); color: var(--tab-color); border-radius: 9px; padding: 10px 28px; cursor: pointer; transition: .15s; font-family: inherit; min-width: 164px; text-align: center; box-shadow: var(--shadow-sm); }
.book-tab:hover { transform: translateY(-2px); }
.book-tab.active { background: var(--tab-color); color: #fff; box-shadow: 0 8px 22px color-mix(in srgb, var(--tab-color) 30%, transparent); }
.tab-name { font-size: 16px; font-weight: 800; letter-spacing: 1px; }
.tab-tag { font-size: 12px; opacity: .7; margin-top: 2px; }
.book-tab.active .tab-tag { opacity: .9; }
.tab-stars { font-size: 12px; margin-top: 4px; color: var(--gold); }
.book-tab.active .tab-stars { color: #fff; }
.book-tab.tab-orange { --tab-color: var(--book-7a); }
.book-tab.tab-blue { --tab-color: var(--book-7b); }

/* 胶囊 toast */
.pill-toast {
  position: fixed; left: 50%; bottom: 32px;
  transform: translateX(-50%);
  background: rgba(26,35,66,0.92);
  color: #fff;
  padding: 12px 24px;
  border-radius: 999px;
  font-size: 14px; font-weight: 500;
  box-shadow: 0 8px 24px rgba(0,0,0,0.18);
  z-index: 50;
  max-width: calc(var(--vwpx, 1vw) * 90);
}
/* 离焦警告：红底 + 闪烁动画，强制学生注意 */
.pill-toast.warn {
  background: rgba(220,53,69,0.96);
  font-size: 15px; font-weight: 700;
  padding: 14px 28px;
  box-shadow: 0 10px 30px rgba(220,53,69,0.45);
  animation: pillWarnPulse 1s ease-in-out infinite;
}
@keyframes pillWarnPulse {
  0%, 100% { box-shadow: 0 10px 30px rgba(220,53,69,0.45); }
  50% { box-shadow: 0 10px 40px rgba(220,53,69,0.85); }
}
.toast-enter-active, .toast-leave-active { transition: opacity 0.25s, transform 0.25s; }
.toast-enter-from, .toast-leave-to { opacity: 0; transform: translate(-50%, 10px); }

@media (max-width: 1120px) {
  .island-topbar { align-items: flex-start; }
  .island-topbar-right { width: 100%; }
  .pill-nav { gap: 6px; }
  .pill { padding: 5px 10px; font-size: 12px; }
  .star-hub { padding: 2px 4px; gap: 3px; }
  .star-chip { padding: 2px 7px; font-size: 12px; }
}
@media (max-width: 720px) {
  .map-page { padding: 12px; }
  .island-topbar { padding: 12px; border-radius: 10px; }
  .island-title { font-size: 18px; }
  .student-info { padding: 5px 9px; }
  .greeting-bubble { position: relative; right: auto; top: auto; width: 100%; margin: 0 0 12px; }
  .greeting-bubble.greeting-inline { flex: 1 1 100%; min-width: 0; max-width: none; margin: 0; }
  .progress-section { grid-template-columns: 1fr; gap: 8px; }
  .progress-heading { justify-content: space-between; }
  .island-map { min-height: auto; padding: 0; }
  .map-path { display: none; }
  .unit-grid { grid-template-columns: 1fr; padding: 6px 0; gap: 12px; }
  .unit-card:nth-child(2), .unit-card:nth-child(4), .unit-card:nth-child(2):hover, .unit-card:nth-child(4):hover { transform: none; }
  .unit-tasks { grid-template-columns: repeat(4, 1fr); }
  .book-tabs { padding-bottom: 14px; }
  .book-tab { min-width: 142px; padding: 9px 14px; }
  .big-title { font-size: 37px; letter-spacing: 2px; }
  .steps-bar { padding: 9px 5px; margin-bottom: 24px; }
  .step { padding: 0 7px; gap: 5px; font-size: 13px; }
  .step-line { width: 12px; }
  .step-num { width: 27px; height: 27px; }
}

/* ===========================================================
 * 播放器（沿用之前的 14-17 页内容，浅色样式）
 * =========================================================== */
.main { padding: 18px 28px 40px; margin: 0 auto; }
.crumb { color: var(--text-secondary); font-size: 14px; margin-bottom: 14px; }
.crumb a { color: var(--text-secondary); text-decoration: none; }
.crumb a:hover { color: var(--book-7a); }
.crumb b { color: var(--text-primary); font-weight: 700; }

.player { width: 100%; margin: 0 auto; }
.player-stage {
  background:
    radial-gradient(rgba(30,50,90,.045) 1px, transparent 1.2px) 0 0 / 26px 26px,
    radial-gradient(circle at 94% 2%, rgba(255,122,69,.09), transparent 40%),
    radial-gradient(circle at 2% 98%, rgba(74,144,226,.11), transparent 42%),
    linear-gradient(160deg, #ffffff 0%, #f7fafd 45%, #eff4fb 100%);
  border: 1px solid var(--border);
  border-radius: 24px;
  min-height: calc(calc(var(--vhpx, 1vh) * 100) - 230px);
  padding: 44px 56px;
  box-shadow: var(--shadow-md);
  position: relative;
  display: flex;
  flex-direction: column;
}
.player-stage .page-slide { flex: 1; display: flex; flex-direction: column; position: relative; }
.player-stage .ptitle { font-size: 28px; font-weight: 800; margin-bottom: 8px; color: var(--text-primary); }
.player-stage .psub { color: var(--text-secondary); margin-bottom: 20px; font-size: 15px; }
.player-stage .body { font-size: 16px; line-height: 1.9; color: var(--text-primary); white-space: pre-wrap; }
.player-stage .emo { font-size: 64px; margin-bottom: 16px; }

.core-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.core-chips span { background: rgba(255,122,69,0.12); color: var(--book-7a); border-radius: 999px; padding: 6px 14px; font-size: 13px; font-weight: 600; }

.q-opt {
  display: block; width: 100%; text-align: left;
  background: var(--surface-2); border: 2px solid var(--border);
  border-radius: 12px; padding: 14px 16px; margin-bottom: 10px;
  color: var(--text-primary); font-size: 15px; cursor: pointer;
  font-family: inherit; transition: 0.12s;
}
.q-opt:hover { border-color: var(--book-7a); }
.q-opt.right { border-color: var(--green); background: rgba(39,174,96,0.08); }
.q-opt.wrong { border-color: var(--red); background: rgba(231,76,60,0.08); }

.pager { display: flex; align-items: center; justify-content: space-between; margin-top: 24px; }
.pager .pg { color: var(--text-secondary); font-weight: 600; }
.pager button {
  background: var(--surface); border: 2px solid var(--border);
  color: var(--text-primary); padding: 10px 26px; border-radius: 999px;
  cursor: pointer; font-family: inherit; font-size: 14px; font-weight: 600;
  transition: 0.15s;
}
.pager button:hover:not(:disabled) { border-color: var(--book-7a); color: var(--book-7a); }

/* 扩展页型 */
.guess-card { background: linear-gradient(135deg, rgba(255,122,69,0.10), rgba(255,154,107,0.04)); border: 2px solid rgba(255,122,69,0.28); border-radius: 16px; padding: 22px 26px; margin-top: 8px; }
.guess-q { font-size: 18px; line-height: 1.8; color: var(--text-primary); }
.hint-box { margin-top: 14px; background: var(--surface-2); border: 1px dashed var(--border-strong); border-radius: 10px; padding: 12px 16px; color: var(--text-secondary); font-size: 14px; }
.hint-box summary { cursor: pointer; color: var(--book-7a); font-weight: 600; }
.hint-box[open] summary { margin-bottom: 8px; }
/* 答错前的锁定态：不可展开 */
.hint-box-locked { margin-top: 14px; background: var(--surface-2); border: 1px dashed var(--border); border-radius: 10px; padding: 12px 16px; color: var(--text-muted); font-size: 14px; text-align: center; letter-spacing: .5px; }

.discuss-card { background: linear-gradient(135deg, rgba(74,144,226,0.10), rgba(70,200,224,0.04)); border: 2px solid rgba(74,144,226,0.28); border-radius: 16px; padding: 22px 26px; }
.discuss-prompt { margin-top: 14px; padding: 12px 14px; background: rgba(255,122,69,0.08); border-left: 3px solid var(--book-7a); border-radius: 8px; font-size: 14px; color: var(--text-secondary); }

.read-card { background: var(--surface-2); border-left: 4px solid var(--cyan); border-radius: 0 12px 12px 0; padding: 20px 24px; }
.read-src { margin-top: 12px; color: var(--text-muted); font-size: 13px; font-style: italic; }

.sort-list { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.sort-item { background: var(--surface-2); border: 1px solid var(--border); border-radius: 10px; padding: 12px 16px; font-size: 15px; color: var(--text-primary); }
.sort-item::before { content: '│ '; color: var(--text-muted); }

.fill-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px 20px; margin-top: 12px; }
.fill-prompt { font-size: 15px; line-height: 1.9; white-space: pre-wrap; color: var(--text-primary); }

.steps-list { margin: 16px 0 0 0; padding-left: 0; counter-reset: step; list-style: none; }
.steps-list li { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 14px 18px 14px 56px; margin-bottom: 10px; position: relative; font-size: 15px; line-height: 1.7; color: var(--text-primary); }
.steps-list li::before { counter-increment: step; content: counter(step); position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border-radius: 50%; background: var(--book-7a); color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 14px; }

.challenge-card { background: linear-gradient(135deg, rgba(231,76,60,0.10), rgba(255,193,7,0.04)); border: 2px solid rgba(231,76,60,0.28); border-radius: 16px; padding: 22px 26px; }
.level-chip { display: inline-block; background: var(--red); color: #fff; font-size: 12px; padding: 3px 12px; border-radius: 999px; margin-left: 8px; vertical-align: middle; font-weight: 600; }

.summary3-wrap { display: flex; gap: 28px; margin-top: 14px; align-items: center; }
.summary3-img { flex: 0 0 42%; max-width: 42%; }
.summary3-img img { width: 100%; height: auto; max-height: 420px; object-fit: contain; border-radius: 16px; }
.summary3-list { flex: 1; display: flex; flex-direction: column; gap: 14px; }
.summary3-item { display: flex; align-items: flex-start; gap: 14px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 16px 18px; font-size: 15px; line-height: 1.7; color: var(--text-primary); }
.s3-num { flex: 0 0 36px; height: 36px; border-radius: 50%; background: var(--book-7a); color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 16px; }

/* 课后小任务页：内容紧跟标题下方，不垂直居中 */
.homework-page { display: flex; flex-direction: column; justify-content: flex-start; flex: 1; min-height: 0; }
.homework-card {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin-top: 10px;
  padding: 24px 36px;
  background: linear-gradient(135deg, rgba(39,174,96,0.10), rgba(74,144,226,0.04));
  border: 2px solid rgba(39,174,96,0.28);
  border-radius: 16px;
}
.homework-item {
  font-size: 23px;
  line-height: 1.75;
  color: var(--text-primary);
  padding: 14px 24px;
  background: rgba(255,255,255,0.72);
  border-radius: 12px;
  border-left: 5px solid #27ae60;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

/* ===========================================================
 * 教师端 浅色主题（body.is-teacher 切换）
 * =========================================================== */
body.is-teacher {
  background: #f1f5f9;
  color: #2d3748;
}
body.is-teacher .bg-deco, body.is-teacher .cloud-layer { display: none; }
body.is-teacher {
  --bg-page: #f1f5f9;
  --surface: #ffffff;
  --surface-2: #f4f7fd;
  --border: #e2e8f0;
  --border-strong: #cbd5e0;
  --text-primary: #2d3748;
  --text-secondary: #5a6b7f;
  --text-muted: #a0aec0;
  --book-7a: #4f8cff;
  --book-7a-light: #6ba9e8;
  --book-7b: #4f8cff;
  --book-7b-light: #6ba9e8;
  --green: #3fae8e;
  --yellow: #d9b45b;
  --red: #e07a7a;
  --gold: #c9a96a;
  --cyan: #46c8e0;
  --shadow-sm: 0 2px 8px rgba(15,23,42,.06);
  --shadow-md: 0 4px 16px rgba(15,23,42,.08);
  --shadow-lg: 0 8px 32px rgba(15,23,42,.12);
}

body.is-teacher .sidebar { background: #ffffff; border-right-color: #e2e8f0; }
body.is-teacher .sidebar .logo { color: #2d3748; }
body.is-teacher .sidebar .logo small { color: #5a6b7f; }
body.is-teacher .sidebar .nav-group { color: #64748b; }
body.is-teacher .sidebar .nav-item { color: #0f172a; }
body.is-teacher .sidebar .nav-item:hover { background: #eef2f9; }
body.is-teacher .sidebar .nav-item.active { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #ffffff; }
body.is-teacher .main { background: transparent; }

body.is-teacher .topbar .tb { background: #ffffff; border-color: #e2e8f0; color: #2d3748; }
body.is-teacher .topbar .tb.active { border-color: #4f8cff; color: #2d6cf2; }
body.is-teacher .kpi, body.is-teacher .card, body.is-teacher .modal { background: #ffffff; border-color: #e2e8f0; }
body.is-teacher .kpi .v, body.is-teacher .card h3, body.is-teacher .card .desc, body.is-teacher .modal h2 { color: #2d3748; }
body.is-teacher .kpi .l, body.is-teacher .card .desc { color: #5a6b7f; }
body.is-teacher select, body.is-teacher input[type=text] { background: #f4f7fd; color: #2d3748; border-color: #e2e8f0; }
body.is-teacher .crumb { color: #5a6b7f; }
body.is-te-teacher .crumb b, body.is-teacher .crumb b { color: #2d3748; }

body.is-teacher table th { background: #f7f9fc; color: #5a6b7f; }
body.is-teacher table td { color: #2d3748; border-bottom-color: #e2e8f0; }

body.is-teacher .map-unit { background: #ffffff; border-color: #e2e8f0; }
body.is-teacher .lesson-dot .circle { background: #f4f7fd; border-color: #e2e8f0; color: #5a6b7f; }
body.is-teacher .lesson-dot .circle.open { background: linear-gradient(135deg, #4f8cff, #46c8e0); color: #fff; border-color: transparent; }
body.is-teacher .lesson-dot .t { color: #2d3748; }

body.is-teacher .overlay { background: rgba(15,23,42,.45); }

body.is-teacher .report-item, body.is-teacher .train-card, body.is-teacher .work-card, body.is-teacher .roster-card, body.is-teacher .hw-item, body.is-teacher .paper-q { background: #ffffff; border-color: #e2e8f0; color: #2d3748; }
body.is-teacher .work-card .wc-meta, body.is-teacher .work-card .wc-desc, body.is-teacher .hw-item .hw-meta, body.is-teacher .hw-item .hw-note, body.is-teacher .roster-card .rc-meta { color: #5a6b7f; }
body.is-teacher .hw-item .hw-note, body.is-teacher .progress, body.is-teacher .weight-row .bar, body.is-teacher .train-bar, body.is-teacher .seat, body.is-teacher .podium, body.is-teacher .parent-link, body.is-teacher .tag, body.is-teacher .pq-opt, body.is-teacher .result-chip { background: #f4f7fd; border-color: #e2e8f0; }
body.is-teacher .stu-card { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 8px 10px; color: #2d3748; text-align: center; }
body.is-teacher .stu-card .av { width: 32px; height: 32px; line-height: 32px; border-radius: 50%; background: #2563eb; color: #ffffff; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }

body.is-teacher .seat.green { background: rgba(63,174,142,.18); border-color: #3fae8e; }
body.is-teacher .seat.yellow { background: rgba(217,180,91,.18); border-color: #d9b45b; }
body.is-teacher .seat.red { background: rgba(224,122,122,.20); border-color: #e07a7a; }

/* 教师端：补回侧栏/卡片/表格/作品/座位等所有类（深色） */
body.is-teacher .main { margin-left: 230px; padding: 22px 28px; min-height: calc(var(--vhpx, 1vh) * 100); max-width: none; }
body.is-teacher .sidebar { position: fixed; left: 0; top: 0; bottom: 0; width: 230px; background: #ffffff; border-right: 1px solid #e2e8f0; padding: 8px 10px 8px; overflow-y: auto; z-index: 5; display: flex; flex-direction: column; }
body.is-teacher .logo { font-size: 18px; font-weight: 800; padding: 2px 8px 8px; line-height: 1.3; color: #2d3748; flex-shrink: 0; }
body.is-teacher .logo small { display: block; font-size: 12px; color: #5a6b7f; font-weight: 400; }
body.is-teacher .sidebar .user-pill { flex-shrink: 0; }
body.is-teacher .nav-group { display: flex; align-items: center; gap: 8px; color: #64748b; font-size: 11px; font-weight: 700; margin: 7px 12px 3px; letter-spacing: 1px; flex-shrink: 0; }
body.is-teacher .nav-group::before { content: ''; width: 4px; height: 14px; border-radius: 2px; background: linear-gradient(180deg, #3b82f6, #2563eb); flex-shrink: 0; }
/* 菜单项 min/max-height 之间用 flex 自动伸缩：矮屏压缩到 28px 一屏放下，高屏舒展到 56px */
body.is-teacher .nav-item { display: flex; align-items: center; gap: 10px; padding: 6px 12px; border-radius: 10px; color: #0f172a; margin-bottom: 2px; transition: .12s; font-size: 15px; font-weight: 600; letter-spacing: .5px; cursor: pointer; flex: 1 1 auto; min-height: 28px; max-height: 56px; white-space: nowrap; }
/* 退出按钮贴底：侧边栏为纵向 flex，菜单项均分中间空间，从顶部 logo 一直铺到页面底部 */
body.is-teacher .sidebar-logout { margin-top: auto; padding: 4px 4px 2px; flex-shrink: 0; }
body.is-teacher .sidebar-logout .tb { width: 100%; display: flex; align-items: center; justify-content: center; box-sizing: border-box; }
body.is-teacher .nav-item:hover { background: #eef2f9; color: #0f172a; }
body.is-teacher .nav-item.active { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #ffffff; font-weight: 700; box-shadow: 0 4px 14px rgba(37,99,235,.38); }
body.is-teacher .nav-item.active:hover { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #ffffff; }
/* 菜单图标徽章：emoji 坐在浅色圆角方块里，给文字一个视觉锚点 */
body.is-teacher .nav-item .ni-ico { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 8px; background: #eff6ff; font-size: 13px; line-height: 1; flex-shrink: 0; transition: .12s; }
body.is-teacher .nav-item:hover .ni-ico { background: #dbeafe; }
body.is-teacher .nav-item.active .ni-ico { background: rgba(255,255,255,.28); }
body.is-teacher .crumb { color: #5a6b7f; font-size: 13px; margin-bottom: 14px; }
body.is-teacher .crumb b { color: #2d3748; }
/* 页面主标题+副标题（标准版式内容页头部格式） */
body.is-teacher .pg-title { font-size: 20px; font-weight: 700; color: #2d3748; margin: 0 0 8px; line-height: 32px; }
body.is-teacher .pg-sub { font-size: 14px; color: #5a6b7f; margin: 0 0 20px; line-height: 22.4px; }
body.is-teacher .topbar { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 18px; }
/* 课堂广播健康横幅（2026-09-29）：广播失败置顶警示（360极速 Chromium78 兼容：不用 inset/color-mix/gap） */
.live-fail-banner { position: fixed; top: 0; right: 0; left: 0; z-index: 9999; background: #d93025; color: #ffffff; font-size: 17px; font-weight: 700; line-height: 26px; text-align: center; padding: 12px 40px; box-shadow: 0 4px 14px rgba(217,48,37,.45); letter-spacing: .3px; }
/* 顶部栏（左面包屑 + 右模块标签/在线状态/学生视角） */
body.is-teacher .main-topbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: nowrap; background: #ffffff; border: none; border-bottom: 1px solid #edf2f7; border-radius: 0; box-shadow: none; min-height: 68px; padding: 0 28px; margin: -22px -28px 20px; position: sticky; top: 0; z-index: 10; overflow: visible; }
body.is-teacher .main-topbar .topbar-left { flex-shrink: 0; }
body.is-teacher .main-topbar .crumbs { display: flex; align-items: center; gap: 6px; font-size: 15px; color: #a0aec0; white-space: nowrap; }
body.is-teacher .main-topbar .crumbs .sep { color: #a0aec0; opacity: .5; }
body.is-teacher .main-topbar .crumbs .current { color: #2d3748; font-weight: 600; font-size: 15px; line-height: 24px; }
body.is-teacher .main-topbar .topbar-right { display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; min-width: 0; flex: 1 1 auto; justify-content: flex-end; }
body.is-teacher .main-topbar .tab-bar { display: flex; gap: 2px; flex-wrap: nowrap; align-items: center; padding: 5px; border-radius: 18px; background: #f7f9fc; overflow-x: auto; min-width: 0; -ms-overflow-style: none; scrollbar-width: none; }
body.is-teacher .main-topbar .tab-bar::-webkit-scrollbar { display: none; }
body.is-teacher .main-topbar .tab-btn { background: transparent; border: none; border-radius: 10px; padding: 8px 14px; color: #5a6b7f; font-size: 15px; font-weight: 600; cursor: pointer; transition: .15s; text-decoration: none; white-space: nowrap; }
body.is-teacher .main-topbar .tab-btn:hover { color: #2563eb; }
body.is-teacher .main-topbar .tab-btn.active { background: #ffffff; color: #2563eb; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
body.is-teacher .main-topbar .conn-pill { display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px; border-radius: 999px; font-size: 15px; font-weight: 600; background: #f1f3f7; color: #8a99ab; white-space: nowrap; line-height: 24px; flex-shrink: 0; }
body.is-teacher .main-topbar .user-pill,
body.is-teacher .sidebar .user-pill { display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px; border-radius: 999px; font-size: 15px; font-weight: 600; background: #e0f2fe; color: #0369a1; white-space: nowrap; line-height: 24px; }
body.is-teacher .sidebar .user-pill.sidebar-user { margin: -2px 8px 6px; }
body.is-teacher .main-topbar .conn-pill .conn-dot { width: 9px; height: 9px; border-radius: 50%; background: #b6c2d0; }
body.is-teacher .main-topbar .conn-pill.ok { background: #e8f8ef; color: #27ae60; }
body.is-teacher .main-topbar .conn-pill.ok .conn-dot { background: #27ae60; animation: t-conn-blink 1.6s infinite; }
body.is-teacher .main-topbar .student-view-btn { color: #5a6b7f; }
body.is-teacher .main-topbar .student-view-btn:hover { color: #2563eb; }
/* 册别锁定开关（顶栏，超管专用）：锁定=红色警示，开放=灰色中性 */
body.is-teacher .main-topbar .lock-pill { display: inline-flex; align-items: center; gap: 5px; padding: 7px 14px; border-radius: 999px; font-size: 15px; font-weight: 700; background: #f1f3f7; color: #8a99ab; border: 1.5px solid transparent; cursor: pointer; white-space: nowrap; line-height: 24px; flex-shrink: 0; transition: .15s; font-family: inherit; }
body.is-teacher .main-topbar .lock-pill:hover { border-color: currentColor; }
body.is-teacher .main-topbar .lock-pill.on { background: #fdecea; color: #c0392b; }
body.is-teacher .main-topbar .lock-pill.on:hover { background: #fbd9d5; }
@keyframes t-conn-blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
body.is-teacher .topbar .tb { background: #ffffff; border: 1px solid #2563eb; border-radius: 999px; padding: 7px 16px; color: #2563eb; font-size: 13px; font-weight: 600; cursor: pointer; }
body.is-teacher .topbar .tb.active { background: #2563eb; color: #ffffff; }
body.is-teacher .topbar .tb:hover { background: #eff6ff; }
/* 侧边栏底部退出按钮与菜单字号保持一致 */
body.is-teacher .sidebar-logout .tb { font-size: 14px; }
body.is-teacher .kpi-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
/* ===== 班级学情页（标准班级进度版式：字体/间距/配色按浏览器实测值） ===== */
body.is-teacher .dash-view { line-height: 1.6; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "EmojiFix", sans-serif; }
body.is-teacher .dash-view .view-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin: 0 0 20px; }
body.is-teacher .dash-view .view-title { font-size: 24px; font-weight: 700; color: #2d3748; line-height: 38.4px; }
body.is-teacher .dash-view .view-subtitle { font-size: 14px; font-weight: 400; color: #5a6b7f; line-height: 22.4px; margin-top: 2px; }
body.is-teacher .dash-view .filters { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0; padding: 0; }
body.is-teacher .dash-view .select-wrap { position: relative; }
body.is-teacher .dash-view .select-wrap select { appearance: none; -webkit-appearance: none; border-radius: 16px; border: 1px solid #e2e8f0; font-size: 14px; font-weight: 600; color: #2d3748; cursor: pointer; background: #ffffff; height: 38px; padding: 8px 36px 8px 14px; transition: .15s; }
body.is-teacher .dash-view .select-wrap select:hover { border-color: #3b82f6; }
body.is-teacher .dash-view .select-wrap select:focus { border-color: #2563eb; box-shadow: 0 0 0 3px #eff6ff; outline: none; }
body.is-teacher .dash-view .select-wrap::after { content: "▾"; color: #a0aec0; pointer-events: none; font-size: 12px; position: absolute; top: 50%; right: 12px; transform: translateY(-50%); }
body.is-teacher .dash-view .btn-ghost { border-radius: 9999px; font-size: 14px; cursor: pointer; border: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 36px; padding: 8px 18px; font-weight: 600; transition: .15s; color: #5a6b7f; border: 1px solid #e2e8f0; background: transparent; white-space: nowrap; }
body.is-teacher .dash-view .btn-ghost:hover { background: #f1f5f9; color: #2d3748; }
body.is-teacher .dash-view .btn-ghost.danger { color: #e05555; border-color: rgba(224,85,85,.3); }
body.is-teacher .dash-view .btn-ghost.danger:hover { background: rgba(224,85,85,.1); color: #cc3333; border-color: rgba(224,85,85,.5); }
body.is-teacher .dash-view .stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 20px; }
@media (max-width: 1200px) { body.is-teacher .dash-view .stat-row { grid-template-columns: repeat(2, 1fr); } }
body.is-teacher .stat-card { border-radius: 24px; box-shadow: 0 2px 8px rgba(0,0,0,.06); background: #ffffff; padding: 20px 22px; border-left: 4px solid #2563eb; }
body.is-teacher .stat-card.s-green { border-left-color: #27ae60; }
body.is-teacher .stat-card.s-blue { border-left-color: #3498db; }
body.is-teacher .stat-card.s-orange { border-left-color: #f39c12; }
body.is-teacher .stat-card.s-gray { border-left-color: #9ca3af; }
body.is-teacher .stat-label { font-size: 13px; font-weight: 500; color: #5a6b7f; margin-bottom: 6px; line-height: 20.8px; }
body.is-teacher .stat-value { font-size: 32px; font-weight: 800; color: #2d3748; line-height: 1.1; }
body.is-teacher .stat-value .unit { font-size: 16px; font-weight: 600; color: #a0aec0; margin-left: 4px; }
body.is-teacher .stat-value small { font-size: 14px; font-weight: 600; color: #a0aec0; margin-left: 4px; }
body.is-teacher .stat-trend { font-size: 12px; color: #a0aec0; margin-top: 6px; line-height: 19.2px; }
body.is-teacher .stat-trend.up { color: #27ae60; }
body.is-teacher .stat-trend.down { color: #e74c3c; }

/* ===== 课中实况（标准版式：LIVE 横幅 + 课堂指令 + 统计卡 + 学生网格） ===== */
body.is-teacher .live-view { line-height: 1.6; }
body.is-teacher .live-view .live-banner { display: flex; align-items: center; gap: 20px; padding: 18px 24px; background: #ffffff; border-radius: 24px; box-shadow: 0 2px 8px rgba(0,0,0,.06); margin-bottom: 16px; }
body.is-teacher .live-view .live-indicator { display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px; border-radius: 999px; background: #fff0f0; color: #e74c3c; font-size: 13px; font-weight: 700; letter-spacing: 1px; }
body.is-teacher .live-view .live-dot { width: 8px; height: 8px; border-radius: 50%; background: #e74c3c; animation: t-conn-blink 1.2s infinite; }
body.is-teacher .live-view .live-course { flex: 1; min-width: 0; }
body.is-teacher .live-view .live-course-name { font-size: 20px; font-weight: 700; color: #2d3748; line-height: 28px; }
body.is-teacher .live-view .live-course-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 4px; font-size: 13px; color: #5a6b7f; }
body.is-teacher .live-view .live-timer { font-size: 28px; font-weight: 800; color: #2563eb; font-variant-numeric: tabular-nums; letter-spacing: 1px; }
body.is-teacher .live-view .btn-end-class { background: #e74c3c; color: #ffffff; border: none; border-radius: 999px; padding: 10px 22px; font-size: 14px; font-weight: 600; cursor: pointer; white-space: nowrap; }
body.is-teacher .live-view .btn-end-class:hover { background: #c0392b; }
/* r127：跨班在线预警条——上课中检测到其他班级学生在线（广播班级可能选错，那些学生收不到同步） */
body.is-teacher .live-view .live-cls-warn { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 12px 18px; margin-bottom: 16px; background: #fff7e6; border: 1.5px solid #f5b951; border-radius: 16px; font-size: 14px; color: #8a5a00; line-height: 22px; box-shadow: 0 2px 6px rgba(245,185,81,.18); }
body.is-teacher .live-view .live-cls-warn b { color: #c2410c; }
body.is-teacher .live-view .cmd-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 14px 18px; background: #ffffff; border-radius: 24px; box-shadow: 0 2px 8px rgba(0,0,0,.06); margin-bottom: 16px; }
body.is-teacher .live-view 
.cmd-teach-mode {
  margin-left: auto;
  background: linear-gradient(135deg, #3b82f6, #8b5cf6);
  color: #fff;
  border: none;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  box-shadow: 0 2px 8px rgba(59,130,246,0.3);
}
.cmd-teach-mode:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(59,130,246,0.4);
}
.cmd-title { font-size: 14px; font-weight: 700; color: #2d3748; }
body.is-teacher .live-view .cmd-btns { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
body.is-teacher .live-view .cmd-btn { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 999px; padding: 7px 16px; font-size: 13px; font-weight: 600; color: #2d3748; cursor: pointer; }
body.is-teacher .live-view .cmd-btn.on { background: #e74c3c; border-color: #e74c3c; color: #ffffff; }
body.is-teacher .live-view .cmd-btn:disabled { opacity: .5; cursor: not-allowed; }
body.is-teacher .live-view .cmd-btn.go { background: #2563eb; border-color: #2563eb; color: #ffffff; }
body.is-teacher .live-view .cmd-btn.cmd-interact { background: #27ae60; border-color: #27ae60; color: #ffffff; }
body.is-teacher .live-view .cmd-btn.cmd-interact.on { background: #e74c3c; border-color: #e74c3c; animation: cmdInterPulse 1.3s ease-in-out infinite; }
body.is-teacher .live-view .cmd-btn.attend-btn { background: #f8fafc; border-color: #e2e8f0; color: #475569; }
body.is-teacher .live-view .cmd-btn.attend-btn:hover { background: #eff6ff; border-color: #3b82f6; color: #2563eb; }
@keyframes cmdInterPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(231,76,60,.45); } 50% { box-shadow: 0 0 0 8px rgba(231,76,60,0); } }
body.is-teacher .live-view .cmd-broadcast { display: inline-flex; align-items: center; gap: 8px; }
body.is-teacher .live-view .cmd-broadcast select { appearance: none; -webkit-appearance: none; border-radius: 16px; border: 1px solid #e2e8f0; font-size: 13px; font-weight: 600; color: #2d3748; background: #ffffff; height: 36px; padding: 6px 32px 6px 14px; cursor: pointer; }
body.is-teacher .live-view .cmd-hint { flex-basis: 100%; font-size: 12px; color: #a0aec0; }
body.is-teacher .live-view .live-stats-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 16px; }
/* 5 张统计卡强制一行显示（不换行）：压缩内边距与数字字号防溢出 */
body.is-teacher .live-view .live-stats-row .stat-card { padding: 12px 14px; border-radius: 16px; }
body.is-teacher .live-view .live-stats-row .stat-label { font-size: 12px; margin-bottom: 3px; white-space: nowrap; }
body.is-teacher .live-view .live-stats-row .stat-value { font-size: 24px; }
@media (max-width: 1200px) { body.is-teacher .live-view .live-stats-row { grid-template-columns: repeat(5, 1fr); gap: 8px; } body.is-teacher .live-view .live-stats-row .stat-label { font-size: 11px; } body.is-teacher .live-view .live-stats-row .stat-value { font-size: 20px; } }
/* 2026-09-29 修复：课堂雷达学生网格超出屏幕
   ① 1fr 改为 minmax(0,1fr)——原 1fr 列宽下限取卡片内容最小宽度，
     被「请假/表扬/提醒」三个不换行按钮撑到 ~230px/列，7 列总宽超出一屏导致右侧被裁；
     minmax(0,1fr) 让列宽严格均分、可收缩，任何视口都不再横向溢出。
   ② 新增 1900/1750 档断点——侧栏已加宽到 300px（--tsbw），
     1920 分辨率（系统缩放 125% 后视口约 1536px）原走 7 列必然放不下，按视口梯度自动降列数。 */
body.is-teacher .live-view .live-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 20px 14px; }
@media (max-width: 1900px) { body.is-teacher .live-view .live-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 1750px) { body.is-teacher .live-view .live-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 1400px) { body.is-teacher .live-view .live-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1050px) { body.is-teacher .live-view .live-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { body.is-teacher .live-view .live-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
body.is-teacher .live-view .student-card { background: #ffffff; border-radius: 18px; box-shadow: 0 2px 8px rgba(0,0,0,.06); padding: 14px 13px; display: flex; flex-direction: column; gap: 11px; position: relative; }
body.is-teacher .live-view .student-card.completed { box-shadow: 0 0 0 2px #27ae60 inset; }
body.is-teacher .live-view .student-card.doing { box-shadow: 0 0 0 2px #2563eb inset; }
body.is-teacher .live-view .student-card.online { box-shadow: 0 0 0 2px #2563eb inset; }
body.is-teacher .live-view .student-card.offline { background: #f3f6fa; }
body.is-teacher .live-view .sc-header { display: flex; align-items: center; gap: 11px; }
body.is-teacher .live-view .sc-info { min-width: 0; flex: 1; }
body.is-teacher .live-view .sc-avatar { box-sizing: border-box; position: relative; width: 52px; height: 52px; flex: 0 0 52px; border-radius: 50%; color: #ffffff; font-size: 23px; font-weight: 800; font-family: "Microsoft YaHei","微软雅黑",Arial,sans-serif; font-variant-numeric: tabular-nums; letter-spacing: -0.5px; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0,0,0,.22); }
body.is-teacher .live-view .sc-name { font-family: "Microsoft YaHei","微软雅黑",sans-serif; font-size: 18px; font-weight: 800; color: #1f2937; line-height: 25px; letter-spacing: 0.3px; padding-right: 102px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.is-teacher .live-view .sc-status { display: inline-block; margin-top: 4px; font-family: "Microsoft YaHei","微软雅黑",sans-serif; font-size: 13px; font-weight: 700; line-height: 21px; padding: 2px 11px; border-radius: 999px; white-space: nowrap; }
body.is-teacher .live-view .sc-status.completed { background: #e6f7ed; color: #15803d; }
body.is-teacher .live-view .sc-status.doing { background: #eff6ff; color: #1d4ed8; }
body.is-teacher .live-view .sc-status.online { background: #e7f0fe; color: #1d4ed8; }
body.is-teacher .live-view .sc-status.offline { background: #e9edf2; color: #64748b; }
body.is-teacher .live-view .sc-status.not-started { background: #f1f3f6; color: #64748b; }
/* 2026-09-28 学生卡徽章行：姓名下方整齐排列「完成状态 + 得分 + 在线状态」三个胶囊徽章 */
body.is-teacher .live-view .sc-badge-row { display: flex; align-items: center; margin-top: 6px; flex-wrap: wrap; }
body.is-teacher .live-view .sc-badge {
  display: inline-flex; align-items: center; white-space: nowrap;
  font-family: "Microsoft YaHei","微软雅黑",sans-serif;
  font-size: 12px; font-weight: 700; line-height: 1;
  padding: 5px 11px; border-radius: 999px;
  margin-right: 7px; margin-bottom: 3px;
}
body.is-teacher .live-view .sc-badge.badge-done { background: #dcfce7; color: #15803d; }
body.is-teacher .live-view .sc-badge.badge-todo { background: #fef3c7; color: #b45309; }
body.is-teacher .live-view .sc-badge.badge-score {
  position: absolute; top: 10px; right: 12px; z-index: 3;
  background: linear-gradient(135deg, #34d399 0%, #059669 100%);
  color: #fff; font-weight: 900; font-size: 13px;
  padding: 7px 14px; border-radius: 999px;
  box-shadow: 0 2px 8px rgba(5,150,105,.35), inset 0 1px 0 rgba(255,255,255,.28);
}
body.is-teacher .live-view .sc-badge.badge-score.score-high { background: linear-gradient(135deg, #34d399 0%, #059669 100%); box-shadow: 0 2px 8px rgba(5,150,105,.35), inset 0 1px 0 rgba(255,255,255,.28); }
body.is-teacher .live-view .sc-badge.badge-score.score-mid { background: linear-gradient(135deg, #60a5fa 0%, #2563eb 100%); box-shadow: 0 2px 8px rgba(37,99,235,.35), inset 0 1px 0 rgba(255,255,255,.28); }
body.is-teacher .live-view .sc-badge.badge-score.score-low { background: linear-gradient(135deg, #fb923c 0%, #ea580c 100%); box-shadow: 0 2px 8px rgba(234,88,12,.35), inset 0 1px 0 rgba(255,255,255,.28); }
body.is-teacher .live-view .sc-badge.badge-score em { font-size: 18px; font-weight: 900; font-style: normal; line-height: 1; text-shadow: 0 1px 1px rgba(0,0,0,.18); }
body.is-teacher .live-view .sc-badge.badge-score i { font-size: 11px; font-style: normal; opacity: .9; margin-left: 3px; }
body.is-teacher .live-view .sc-badge.badge-stat { background: #f1f5f9; color: #64748b; font-size: 11px; padding: 4px 9px; }
body.is-teacher .live-view .sc-badge.badge-stat.offline { background: #f1f5f9; color: #94a3b8; }
body.is-teacher .live-view .sc-badge.badge-stat.online { background: #dbeafe; color: #1d4ed8; }
body.is-teacher .live-view .sc-badge.badge-stat.doing { background: #eff6ff; color: #1d4ed8; }
body.is-teacher .live-view .sc-badge.badge-stat.completed { background: #e6f7ed; color: #15803d; }
/* 头像右上角"正在上课"绿色脉冲圆点（带白色描边，彩色头像上也清晰） */
body.is-teacher .live-view .sc-online-pin { position: absolute; top: -2px; right: -2px; color: #22c55e; font-size: 13px; line-height: 1; animation: seat-pulse 1.6s ease-in-out infinite; text-shadow: 0 0 3px #fff, 0 0 2px #fff, 0 0 4px rgba(34,197,94,.55); z-index: 2; }
@keyframes seat-pulse { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
body.is-teacher .live-view .sc-metrics { display: flex; gap: 6px; }
body.is-teacher .live-view .sc-metric { flex: 1; background: #f3f6fa; border-radius: 9px; padding: 9px 3px; text-align: center; min-width: 0; }
body.is-teacher .live-view .sc-metric-label { font-family: "Microsoft YaHei","微软雅黑",sans-serif; font-size: 12px; font-weight: 600; color: #7b8794; }
body.is-teacher .live-view .sc-metric-value { font-family: "Microsoft YaHei","微软雅黑",Arial,sans-serif; font-size: 21px; font-weight: 800; color: #1f2937; line-height: 1.3; font-variant-numeric: tabular-nums; }
body.is-teacher .live-view .sc-metric-value.green { color: #15803d; }
/* 2026-09-28 图3风格：答题/得分带分母显示、重试>0橙色提醒、指标分色更醒目 */
body.is-teacher .live-view .sc-metric-value.blue { color: #1d4ed8; }
body.is-teacher .live-view .sc-metric-value.orange { color: #ea580c; }
body.is-teacher .live-view .sc-metric-value.gold { color: #b45309; }
body.is-teacher .live-view .sc-metric-value em { font-style: normal; }
body.is-teacher .live-view .sc-metric-value i { font-style: normal; font-size: 12px; font-weight: 700; color: #94a3b8; margin-left: 1px; }
/* 做题进度条：答题数/总题数，颜色随状态 */
body.is-teacher .live-view .sc-progress { height: 5px; background: #e8edf3; border-radius: 99px; overflow: hidden; }
body.is-teacher .live-view .sc-progress-fill { height: 100%; border-radius: 99px; background: #cbd5e1; transition: width .4s; }
body.is-teacher .live-view .sc-progress-fill.online { background: #2563eb; }
body.is-teacher .live-view .sc-progress-fill.doing { background: #2563eb; }
body.is-teacher .live-view .sc-progress-fill.completed { background: #16a34a; }
body.is-teacher .live-view .sc-progress-fill.offline { background: #cbd5e1; }
body.is-teacher .live-view .sc-behavior { display: flex; gap: 6px; }
body.is-teacher .live-view .behavior-btn { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; border: none; border-radius: 999px; padding: 10px 4px; font-family: "Microsoft YaHei","微软雅黑",sans-serif; font-size: 14px; font-weight: 700; cursor: pointer; white-space: nowrap; }
body.is-teacher .live-view .behavior-btn.praise { background: #e8f8ef; color: #1e8449; }
body.is-teacher .live-view .behavior-btn.warn { background: #fef2f2; color: #c0392b; }
body.is-teacher .live-view .behavior-btn.leave { background: #dbeafe; color: #1d4ed8; border-color: #fbbf24; }
body.is-teacher .live-view .behavior-btn.leave:hover { background: #fde68a; }
body.is-teacher .live-view .behavior-btn.leave.on { background: #f59e0b; color: #fff; box-shadow: 0 2px 8px rgba(245,158,11,.5); border-color: #f59e0b; }
/* 请假学生卡片：琥珀警示斜纹 + 虚线边框 + 轻微呼吸脉动，一眼即可辨认 */
body.is-teacher .live-view .student-card.on-leave {
  opacity: 1;
  border: 2px dashed #f59e0b !important;
  background: repeating-linear-gradient(45deg, #fffbeb 0px, #fffbeb 10px, #fde68a 10px, #fde68a 20px) !important;
  box-shadow: 0 0 0 3px rgba(245,158,11,.22), 0 3px 12px rgba(245,158,11,.28);
  animation: leavePulse 2.2s ease-in-out infinite;
}
@keyframes leavePulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(245,158,11,.22), 0 3px 12px rgba(245,158,11,.28); }
  50% { box-shadow: 0 0 0 6px rgba(245,158,11,.38), 0 4px 16px rgba(245,158,11,.45); }
}
body.is-teacher .live-view .student-card.on-leave .sc-status,
body.is-teacher .live-view .student-card.on-leave .badge-stat { color: #b45309; font-weight: 700; }
body.is-teacher .live-view .student-card.on-leave .sc-name { color: #92400e; }
body.is-teacher .live-view .student-card.on-leave .sc-avatar { filter: grayscale(1); position: relative; }
body.is-teacher .live-view .sc-leave-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  background: #f59e0b;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
  z-index: 2;
  box-shadow: 0 2px 6px rgba(245,158,11,.4);
}
body.is-teacher .live-view .live-notice { position: sticky; bottom: 16px; margin: 12px auto 0; width: fit-content; max-width: 90%; background: #2d3748; color: #ffffff; font-size: 13px; padding: 8px 18px; border-radius: 999px; box-shadow: 0 4px 16px rgba(0,0,0,.18); }
/* 任务5/6：本班学生在线状态卡片 + 喊未上线按钮 */
body.is-teacher .live-view .stu-status-card { background: #ffffff; border-radius: 16px; padding: 16px 20px; margin-top: 16px; box-shadow: 0 2px 10px rgba(0,0,0,.06); }
body.is-teacher .live-view .stu-status-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
body.is-teacher .live-view .stu-status-title { font-size: 16px; font-weight: 700; color: #1f2937; }
body.is-teacher .live-view .stu-status-call-btn { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff; border: 0; border-radius: 999px; padding: 8px 18px; font-size: 13px; font-weight: 700; cursor: pointer; font-family: inherit; box-shadow: 0 4px 12px rgba(255,113,77,.3); transition: 0.15s; }
body.is-teacher .live-view .stu-status-call-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(255,113,77,.42); }
/* 在线状态卡片：彩色圆圈座号 + 姓名 + 姓名下方状态文字（圆圈颜色即状态色：绿=正在上课 橙=离线 红=未上线） */
body.is-teacher .live-view .stu-status-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 10px; }
body.is-teacher .live-view .stu-status-row { display: flex; align-items: center; padding: 9px 10px; border-radius: 12px; background: #f7f9fc; font-size: 13px; border: 1px solid #edf2f7; }
body.is-teacher .live-view .stu-status-row.online { background: #ecfdf5; border-color: #a7f3d0; }
body.is-teacher .live-view .stu-status-row.offline { background: #fff7ed; border-color: #fde6c8; }
body.is-teacher .live-view .stu-status-row.missing { background: #fee2e2; border-color: #f87171; box-shadow: 0 0 0 2px rgba(239,68,68,.18); }
body.is-teacher .live-view .stu-status-row .stu-seat-ball { width: 36px; height: 36px; min-width: 36px; border-radius: 50%; margin-right: 10px; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; color: #ffffff; background: #9ca3af; }
body.is-teacher .live-view .stu-status-row.online .stu-seat-ball { background: #10b981; }
body.is-teacher .live-view .stu-status-row.offline .stu-seat-ball { background: #f59e0b; }
body.is-teacher .live-view .stu-status-row.missing .stu-seat-ball { background: #ef4444; }
body.is-teacher .live-view .stu-status-row .stu-info { flex: 1; min-width: 0; }
body.is-teacher .live-view .stu-status-row .stu-name { font-size: 15px; font-weight: 600; color: #1f2937; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.is-teacher .live-view .stu-status-row .stu-state { font-size: 12px; color: #6b7280; line-height: 1.3; margin-top: 2px; white-space: nowrap; }
body.is-teacher .live-view .stu-status-row.online .stu-state { color: #047857; }
body.is-teacher .live-view .stu-status-row.offline .stu-state { color: #b45309; }
body.is-teacher .live-view .stu-status-row.missing .stu-state { color: #b91c1c; font-weight: 700; }
body.is-teacher .live-view .stu-status-row .stu-ago { font-style: normal; font-size: 11px; color: #9ca3af; margin-left: 4px; }
/* 头部图例 */
body.is-teacher .live-view .stu-status-legend { display: flex; align-items: center; margin-left: auto; margin-right: 16px; }
body.is-teacher .live-view .stu-status-legend .lg { font-size: 12px; color: #6b7280; margin-left: 14px; }
body.is-teacher .live-view .stu-status-legend .lg::before { content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 5px; vertical-align: -1px; }
body.is-teacher .live-view .stu-status-legend .lg-online::before { background: #10b981; }
body.is-teacher .live-view .stu-status-legend .lg-offline::before { background: #f59e0b; }
body.is-teacher .live-view .stu-status-legend .lg-missing::before { background: #ef4444; }
body.is-teacher .dash-view .grid-table-wrap { border-radius: 24px; box-shadow: 0 2px 8px rgba(0,0,0,.06); background: #ffffff; margin-bottom: 20px; overflow-x: auto; overflow-y: hidden; }
body.is-teacher .dash-view table.grid-table { border-collapse: collapse; width: 100%; font-size: 13px; }
body.is-teacher .dash-view table.grid-table thead th { font-weight: 600; font-size: 12px; color: #5a6b7f; line-height: 19.2px; text-align: center; border-bottom: 1px solid #edf2f7; white-space: nowrap; background: #f7f9fc; padding: 10px 8px; position: sticky; top: 0; }
body.is-teacher .dash-view table.grid-table thead th.student-col { text-align: left; z-index: 2; background: #f7f9fc; width: 150px; min-width: 150px; padding-left: 16px; position: sticky; left: 0; }
body.is-teacher .dash-view table.grid-table thead th.unit-header { background: #eff6ff; color: #2563eb; font-weight: 700; font-size: 13px; padding: 8px; }
body.is-teacher .dash-view table.grid-table thead th.avg-col { background: #ebf5fb; color: #3498db; }
body.is-teacher .dash-view table.grid-table tbody td { text-align: center; border-bottom: 1px solid #edf2f7; padding: 6px 4px; }
body.is-teacher .dash-view table.grid-table tbody td.student-col { text-align: left; z-index: 1; border-right: 1px solid #edf2f7; background: #ffffff; padding: 8px 16px; font-weight: 600; position: sticky; left: 0; }
body.is-teacher .dash-view table.grid-table tbody tr:hover td { background: #eff6ff; }
body.is-teacher .dash-view table.grid-table .student-avatar { color: #ffffff; width: 40px; height: 40px; font-size: 20px; font-weight: 800; vertical-align: middle; border-radius: 50%; flex-shrink: 0; display: inline-flex; justify-content: center; align-items: center; margin-right: 10px; }
body.is-teacher .dash-view table.grid-table .student-info { display: block; padding: 0; background: transparent; border-radius: 0; }
body.is-teacher .dash-view table.grid-table .student-name { font-size: 13px; font-weight: 600; color: #2d3748; vertical-align: middle; display: inline-block; }
body.is-teacher .dash-view table.grid-table .student-id { font-size: 12px; font-weight: 400; color: #a0aec0; vertical-align: middle; margin-left: 4px; display: inline-block; line-height: 19.2px; }
body.is-teacher .dash-view .score-cell { border-radius: 8px; min-width: 46px; height: 32px; font-weight: 700; font-size: 13px; color: #2d3748; display: inline-flex; justify-content: center; align-items: center; position: relative; }
body.is-teacher .dash-view .score-cell.s-green { background: #e8f8ef; color: #1e8449; }
body.is-teacher .dash-view .score-cell.s-yellow { background: #fef5e7; color: #d68910; }
body.is-teacher .dash-view .score-cell.s-red { background: #fdeceb; color: #c0392b; }
body.is-teacher .dash-view .score-cell.s-gray { color: #a0aec0; border: 2px dashed #e2e8f0; background: transparent; }
body.is-teacher .dash-view .avg-cell { border-radius: 8px; min-width: 50px; height: 32px; font-weight: 700; font-size: 13px; background: #ebf5fb; color: #3498db; justify-content: center; align-items: center; display: inline-flex; }
body.is-teacher .dash-view .avg-cell.s-green { background: #e8f8ef; color: #1e8449; }
body.is-teacher .dash-view .avg-cell.s-yellow { background: #fef5e7; color: #d68910; }
body.is-teacher .dash-view .avg-cell.s-red { background: #fdeceb; color: #c0392b; }
body.is-teacher .dash-view .avg-cell.s-gray { background: #ebf5fb; color: #3498db; }
body.is-teacher .dash-view .personal-avg { border-radius: 8px; min-width: 50px; height: 32px; font-weight: 700; font-size: 13px; justify-content: center; align-items: center; display: inline-flex; }
body.is-teacher .dash-view .personal-avg.s-green { background: #e8f8ef; color: #1e8449; }
body.is-teacher .dash-view .personal-avg.s-yellow { background: #fef5e7; color: #d68910; }
body.is-teacher .dash-view .personal-avg.s-red { background: #fdeceb; color: #c0392b; }
body.is-teacher .dash-view .personal-avg.s-gray { background: #ebf5fb; color: #3498db; }
body.is-teacher .dash-view .bottom-stats { border-radius: 24px; box-shadow: 0 2px 8px rgba(0,0,0,.06); background: #ffffff; flex-wrap: wrap; align-items: center; gap: 32px; padding: 16px 24px; display: flex; }
body.is-teacher .dash-view .bottom-stat { align-items: center; gap: 10px; display: flex; }
body.is-teacher .dash-view .bs-icon { border-radius: 16px; justify-content: center; align-items: center; width: 40px; height: 40px; font-size: 20px; display: flex; flex-shrink: 0; }
body.is-teacher .dash-view .bs-green { background: #e8f8ef; color: #27ae60; }
body.is-teacher .dash-view .bs-yellow { background: #fef5e7; color: #f39c12; }
body.is-teacher .dash-view .bs-red { background: #fdeceb; color: #e74c3c; }
body.is-teacher .dash-view .bs-blue { background: #ebf5fb; color: #3498db; }
body.is-teacher .dash-view .bs-label { font-size: 12px; color: #5a6b7f; }
body.is-teacher .dash-view .bs-value { font-size: 20px; font-weight: 800; color: #2d3748; line-height: 1.2; }
body.is-teacher .dash-view .bs-value small { font-size: 13px; font-weight: 600; color: #a0aec0; margin-left: 2px; }
body.is-teacher .dash-view .bs-value.bs-time { font-size: 15px; font-weight: 600; color: #5a6b7f; }
body.is-teacher .kpi { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 24px; padding: 20px 22px; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
body.is-teacher .kpi .v { font-size: 32px; font-weight: 800; color: #2d3748; line-height: 35.2px; }
body.is-teacher .kpi .l { color: #5a6b7f; font-size: 13px; font-weight: 500; margin-top: 4px; }
body.is-teacher .card { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 24px; padding: 18px 20px; margin: 0 0 16px; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
body.is-teacher .card h3 { font-size: 13.5px; font-weight: 700; margin-bottom: 12px; color: #2d3748; line-height: 21.6px; }
body.is-teacher .card .desc { color: #5a6b7f; font-size: 12.5px; margin-bottom: 12px; line-height: 20.6px; }
body.is-teacher select, body.is-teacher input[type=text] { background: #ffffff; color: #2d3748; border: 1px solid #e2e8f0; border-radius: 16px; padding: 8px 36px 8px 14px; font-size: 14px; font-weight: 600; }
body.is-teacher .map-unit { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 24px; padding: 16px 18px; margin: 0 0 16px; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
body.is-teacher .map-unit .uh { display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 700; margin-bottom: 12px; color: #2d3748; }
body.is-teacher .map-unit .badge { margin-left: auto; font-size: 12px; color: #5a6b7f; }
body.is-teacher .lesson-dot { display: inline-flex; flex-direction: column; align-items: center; gap: 6px; width: 120px; vertical-align: top; margin: 6px 4px; }
body.is-teacher .lesson-dot .circle { width: 54px; height: 54px; border-radius: 50%; background: #f4f7fd; border: 2px solid #e2e8f0; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 18px; color: #5a6b7f; cursor: pointer; transition: .12s; }
body.is-teacher .lesson-dot .circle.open { background: linear-gradient(135deg, #4f8cff, #46c8e0); color: #fff; border-color: transparent; }
body.is-teacher .lesson-dot .circle.lock { opacity: .4; }
body.is-teacher .lesson-dot .t { font-size: 12px; text-align: center; color: #2d3748; line-height: 1.3; max-width: 120px; }
body.is-teacher .draft-flag { color: #d9b45b; font-size: 11px; }
body.is-teacher .overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(15,23,42,.45); display: flex; align-items: center; justify-content: center; z-index: 9999; }
body.is-teacher .overlay.overlay-top { z-index: 10001; }
body.is-teacher .modal { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 18px; padding: 26px; width: 360px; }
body.is-teacher .modal h2 { margin-bottom: 14px; color: #2d3748; }
body.is-teacher .modal input { width: 100%; margin-bottom: 12px; }
body.is-teacher .row { display: flex; gap: 10px; align-items: center; }
body.is-teacher .tag { background: #e8f8ef; border: 1px solid #a7f3d0; border-radius: 999px; padding: 3px 10px; font-size: 11.5px; font-weight: 600; color: #1e8449; }
body.is-teacher .tag.tag-super { background: #eff6ff; border-color: #ffb74d; color: #1e40af; }
body.is-teacher .coming { text-align: center; color: #5a6b7f; padding: 50px 0; }
body.is-teacher table { width: 100%; border-collapse: collapse; font-size: 13px; }
body.is-teacher th, body.is-teacher td { padding: 8px 16px; border-bottom: 1px solid #e2e8f0; text-align: center; color: #2d3748; line-height: 20.8px; }
body.is-teacher th { color: #5a6b7f; font-weight: 600; font-size: 12px; background: #f7f9fc; position: sticky; top: 0; padding: 10px 8px 10px 16px; }
body.is-teacher td.left { text-align: left; }
body.is-teacher .score-pill { display: inline-block; min-width: 38px; padding: 3px 8px; border-radius: 8px; font-weight: 700; }
body.is-teacher .score-pill.hi { background: rgba(63,174,142,.16); color: #3fae8e; }
body.is-teacher .score-pill.mid { background: rgba(217,180,91,.16); color: #d9b45b; }
body.is-teacher .score-pill.lo { background: rgba(224,122,122,.16); color: #e07a7a; }
body.is-teacher .report-list { display: flex; flex-direction: column; gap: 10px; }
body.is-teacher .report-item { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 12px 14px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
body.is-teacher .report-item .ri-main { flex: 1; min-width: 200px; }
body.is-teacher .report-item .ri-lesson { font-weight: 600; font-size: 13px; color: #2d3748; line-height: 20.8px; }
body.is-teacher .report-item .ri-meta { color: #5a6b7f; font-size: 12px; margin-top: 4px; line-height: 19.2px; }
body.is-teacher .report-item .ri-hl { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
body.is-teacher .badge-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 5px; }
body.is-teacher .st-done { color: #3fae8e; } body.is-teacher .st-todo { color: #d9b45b; } body.is-teacher .st-late { color: #e07a7a; }
body.is-teacher .train-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px,1fr)); gap: 12px; }
body.is-teacher .train-card { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 12px 16px; }
body.is-teacher .train-bar { height: 8px; background: #f4f7fd; border-radius: 999px; overflow: hidden; margin-top: 8px; }
body.is-teacher .train-bar > i { display: block; height: 100%; background: linear-gradient(90deg, #4f8cff, #46c8e0); }
body.is-teacher .cert { font-size: 11px; color: #3fae8e; border: 1px solid #3fae8e; border-radius: 6px; padding: 1px 6px; }
body.is-teacher .paper-q { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 12px 16px; margin-bottom: 12px; }
body.is-teacher .paper-q .pq-head { display: flex; justify-content: space-between; font-size: 13px; color: #5a6b7f; margin-bottom: 8px; }
body.is-teacher .paper-q .pq-opts { display: flex; flex-direction: column; gap: 6px; }
body.is-teacher .pq-opt { padding: 6px 10px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 14px; color: #2d3748; }
body.is-teacher .pq-opt.ok { border-color: #3fae8e; background: rgba(63,174,142,.12); }
body.is-teacher .result-chip { display: inline-flex; align-items: center; gap: 6px; background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 4px 10px; font-size: 13px; color: #2d3748; }
body.is-teacher .work-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); gap: 14px; }
body.is-teacher .work-card { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 12px 16px; transition: .15s; }
body.is-teacher .work-card:hover { transform: translateY(-3px); border-color: #4f8cff; }
body.is-teacher .work-card .wc-type { font-size: 11px; color: #4f8cff; border: 1px solid #4f8cff; border-radius: 6px; padding: 1px 7px; }
body.is-teacher .work-card .wc-title { font-size: 13.5px; font-weight: 700; margin: 8px 0 6px; color: #2d3748; }
body.is-teacher .work-card .wc-meta { color: #5a6b7f; font-size: 12px; }
body.is-teacher .work-card .wc-desc { font-size: 13px; color: #5a6b7f; margin: 8px 0; line-height: 1.5; }
body.is-teacher .like-btn { background: #f4f7fd; border: 1px solid #e2e8f0; border-radius: 999px; padding: 5px 12px; color: #e07a7a; font-size: 13px; cursor: pointer; }
body.is-teacher .roster-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px,1fr)); gap: 10px; }
body.is-teacher .roster-card { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 12px 16px; display: flex; justify-content: space-between; align-items: center; }
body.is-teacher .roster-card .rc-name { font-weight: 600; color: #2d3748; font-size: 13px; }
body.is-teacher .roster-card .rc-meta { color: #5a6b7f; font-size: 12px; margin-top: 3px; }
body.is-teacher .state-sel { background: #f4f7fd; color: #2d3748; border: 1px solid #e2e8f0; border-radius: 8px; padding: 4px 8px; font-size: 12px; }
body.is-teacher .state-在读 { color: #3fae8e; } body.is-teacher .state-转出 { color: #d9b45b; } body.is-teacher .state-毕业 { color: #e07a7a; }
body.is-teacher .hw-list { display: flex; flex-direction: column; gap: 12px; }
body.is-teacher .hw-item { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 12px 16px; }
body.is-teacher .hw-item .hw-title { font-weight: 600; font-size: 13px; color: #2d3748; line-height: 20.8px; }
body.is-teacher .hw-item .hw-meta { color: #5a6b7f; font-size: 12px; margin: 6px 0; }
body.is-teacher .hw-item .hw-note { font-size: 13px; color: #5a6b7f; line-height: 1.6; margin-top: 8px; background: #f4f7fd; border-radius: 8px; padding: 8px 10px; }
body.is-teacher .progress { height: 8px; background: #e5e7eb; border-radius: 999px; overflow: hidden; margin-top: 8px; }
body.is-teacher .progress > i { display: block; height: 100%; background: linear-gradient(90deg, #2563eb, #60a5fa); }
body.is-teacher .btn-coze { background: linear-gradient(135deg, #4f8cff, #46c8e0); color: #fff; border-radius: 999px; padding: 6px 16px; font-size: 13px; cursor: pointer; }
body.is-teacher .weight-row { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
body.is-teacher .weight-row .bar { flex: 1; height: 8px; border-radius: 999px; background: #e5e7eb; overflow: hidden; }
body.is-teacher .weight-row .bar i { display: block; height: 100%; background: linear-gradient(90deg, #2563eb, #60a5fa); }
body.is-teacher .stu-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: 12px; }
/* 课中实况 · 开课空状态卡（标准版式 start-class-card） */
body.is-teacher .card.start-card { text-align: center; padding: 48px 40px; }
body.is-teacher .start-card .sc-icon { font-size: 48px; line-height: 76.8px; margin-bottom: 12px; }
body.is-teacher .start-card h2 { font-size: 20px; font-weight: 700; color: #2d3748; margin: 0 0 8px; line-height: 32px; }
body.is-teacher .start-card .empty-sub { font-size: 14px; color: #5a6b7f; margin: 0 0 24px; line-height: 22.4px; }
body.is-teacher .parent-link { background: #f4f7fd; border: 1px dashed #4f8cff; border-radius: 12px; padding: 12px; font-size: 13px; color: #5a6b7f; margin-top: 12px; word-break: break-all; }
body.is-teacher .podium { background: #f4f7fd; border: 1px dashed #e2e8f0; border-radius: 10px; padding: 8px; text-align: center; color: #5a6b7f; font-size: 12px; margin-bottom: 10px; }
body.is-teacher .live-dot { width: 9px; height: 9px; border-radius: 50%; background: #3fae8e; display: inline-block; margin-right: 6px; }
body.is-teacher .seat { aspect-ratio: 1.4/1; border-radius: 10px; background: #f4f7fd; border: 1px solid #e2e8f0; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 13px; color: #2d3748; transition: .2s; }
body.is-teacher .seat .sn { color: #5a6b7f; font-size: 11px; }
body.is-teacher .seat-grid { display: grid; gap: 8px; margin: 14px 0; }
@keyframes pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(224,122,122,.5);} 50% { box-shadow: 0 0 0 6px rgba(224,122,122,0);} }

/* 课后报告（标准版式 history-card / report-table） */
body.is-teacher .report-view .start-card { margin: 0 0 20px; }
body.is-teacher .report-page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
body.is-teacher .rpt-toolbar { display: flex; align-items: center; gap: 10px; padding-top: 4px; }
body.is-teacher .history-card { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 24px; box-shadow: 0 2px 8px rgba(0,0,0,.06); margin: 0 0 20px; overflow: hidden; }
body.is-teacher .history-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 20px 12px; }
body.is-teacher .history-head h3 { font-size: 16px; font-weight: 700; color: #2d3748; line-height: 25.6px; margin: 0; }
body.is-teacher .report-view .btn-ghost { border-radius: 9999px; font-size: 14px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 36px; padding: 8px 18px; font-weight: 600; transition: .15s; color: #5a6b7f; border: 1px solid #e2e8f0; background: transparent; white-space: nowrap; }
body.is-teacher .report-view .btn-ghost:hover { background: #f1f5f9; color: #2d3748; }
body.is-teacher .report-view .btn-ghost.mini { font-size: 12px; min-height: 0; padding: 4px 12px; }
body.is-teacher .hist-cls { border-radius: 9999px; border: 1px solid #e2e8f0; background: #ffffff; color: #2d3748; font-size: 13px; font-weight: 600; padding: 6px 12px; cursor: pointer; font-family: inherit; }
body.is-teacher .hist-cls:hover { border-color: #3b82f6; }
body.is-teacher .report-table { width: 100%; border-collapse: collapse; font-size: 13px; color: #2d3748; }
body.is-teacher .report-table th { font-size: 13px; font-weight: 600; color: #5a6b7f; background: #f7f9fc; padding: 12px 14px; text-align: left; border-bottom: 1px solid #edf2f7; white-space: nowrap; vertical-align: middle; }
body.is-teacher .report-table td { font-size: 13px; color: #2d3748; padding: 12px 14px; border-bottom: 1px solid #edf2f7; white-space: nowrap; vertical-align: middle; text-align: left; }
body.is-teacher .report-table th.r, body.is-teacher .report-table td.r { text-align: right; }
body.is-teacher .badge-report { font-size: 12px; font-weight: 700; border-radius: 9999px; padding: 4px 10px; display: inline-flex; align-items: center; vertical-align: middle; }
body.is-teacher .badge-report.blue { color: #3498db; background: #ebf5fb; }
body.is-teacher .badge-report.green { color: #1e8449; background: #e8f8ef; }
body.is-teacher .report-view .btn-ghost.mini { vertical-align: middle; }
body.is-teacher .report-view .btn-ghost.mini-on { background: #2563eb; border-color: #2563eb; color: #ffffff; }
body.is-teacher .report-view .btn-ghost.mini.danger { color: #e05555; border-color: rgba(224,85,85,.3); }
body.is-teacher .report-view .btn-ghost.mini.danger:hover { background: rgba(224,85,85,.1); color: #cc3333; border-color: rgba(224,85,85,.5); }
body.is-teacher .report-view .report-table td.r { white-space: nowrap; }
body.is-teacher .report-view .report-table td.r .btn-ghost.mini { margin-left: 4px; }
body.is-teacher .tbl-wrap { overflow-x: auto; }
body.is-teacher .history-card .report-table { table-layout: fixed; }
body.is-teacher .report-table td.ht-lesson { overflow: hidden; text-overflow: ellipsis; }
body.is-teacher .rpt-card .rd-table { min-width: 1120px; }

/* —— 课后报告 · 报告详情卡（标准版式） —— */
body.is-teacher .rpt-card { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 24px; box-shadow: 0 2px 8px rgba(0,0,0,.06); padding: 28px 32px; margin: 0 0 20px; scroll-margin-top: 16px; animation: rptFlashIn .9s ease; }
@keyframes rptFlashIn {
  0% { border-color: #ffb08f; box-shadow: 0 0 0 4px rgba(255,107,53,.18), 0 2px 8px rgba(0,0,0,.06); transform: translateY(-3px); opacity: .6; }
  60% { border-color: #ffb08f; box-shadow: 0 0 0 4px rgba(255,107,53,.12), 0 2px 8px rgba(0,0,0,.06); transform: translateY(0); opacity: 1; }
  100% { border-color: #e2e8f0; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
}
body.is-teacher .rpt-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 4px; }
body.is-teacher .rpt-info { display: flex; align-items: flex-start; gap: 16px; }
body.is-teacher .rpt-ico { flex: none; width: 52px; height: 52px; border-radius: 14px; background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff; font-size: 26px; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 16px rgba(37,99,235,.28); }
body.is-teacher .rpt-title { margin: 0; font-size: 26px !important; font-weight: 700; color: #1f2d3d; line-height: 1.25; }
body.is-teacher .rpt-meta { margin-top: 8px; font-size: 15px !important; color: #5a6b7f; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
body.is-teacher .rpt-side { display: flex; flex-direction: column; align-items: flex-end; gap: 14px; }
body.is-teacher .rpt-kpis { display: flex; gap: 26px; }
body.is-teacher .rpt-kpi-item { display: flex; align-items: baseline; gap: 7px; white-space: nowrap; }
body.is-teacher .rpt-num { font-size: 36px !important; font-weight: 800; line-height: 1; }
body.is-teacher .rpt-num.co { color: #2563eb; }
body.is-teacher .rpt-num.cg { color: #27ae60; }
body.is-teacher .rpt-num.ca { color: #f39c12; }
body.is-teacher .rpt-kpi-label { font-size: 14px !important; color: #5a6b7f; font-weight: 700; }
body.is-teacher .rpt-actions { display: flex; gap: 10px; }
body.is-teacher .rpt-btn-csv { border: 1px solid #e2e8f0; background: #ffffff; color: #5a6b7f; font-size: 14px !important; font-weight: 600; padding: 8px 16px; border-radius: 999px; cursor: pointer; font-family: inherit; }
body.is-teacher .rpt-btn-csv:hover:not(:disabled) { border-color: #3b82f6; color: #2563eb; }
body.is-teacher .rpt-btn-csv:disabled { opacity: .55; cursor: not-allowed; }
body.is-teacher .rpt-btn-print { border: none; background: #2563eb; color: #fff; font-size: 14px !important; font-weight: 700; padding: 8px 18px; border-radius: 999px; cursor: pointer; font-family: inherit; box-shadow: 0 4px 12px rgba(37,99,235,.3); }
body.is-teacher .rpt-btn-print:hover { background: #1d4ed8; }
/* 学生表现表（复用 rd-table 基础样式） */
body.is-teacher .rd-table { width: 100%; border-collapse: collapse; font-size: 16px; color: #1f2d3d; }
body.is-teacher .rd-table th { font-size: 20px !important; font-weight: 800; color: #4338ca; background: linear-gradient(180deg, #f7fafe, #eef3fb); padding: 14px 16px; text-align: left; letter-spacing: .5px; border-bottom: 2px solid #bfdbfe; white-space: nowrap; box-shadow: inset 0 -3px 0 #2563eb; }
body.is-teacher .rd-table td { font-size: 16px !important; color: #1f2d3d; padding: 13px 16px; border-bottom: 1px solid #edf2f7; text-align: left; }
body.is-teacher .rd-table th.r, body.is-teacher .rd-table td.r { text-align: center; font-variant-numeric: tabular-nums; }
body.is-teacher .rd-table th.c, body.is-teacher .rd-table td.c { text-align: center; }
body.is-teacher .rd-table td.r { font-size: 17px !important; font-weight: 600; }
body.is-teacher .rd-table tbody tr:hover { background: #fafbff; }
body.is-teacher .rpt-table { margin-top: 14px; }
body.is-teacher .rpt-table td { white-space: nowrap; }
body.is-teacher .rpt-th-okbad { letter-spacing: 1px; }
body.is-teacher .rpt-th-okbad .rpt-ok { background: linear-gradient(135deg, #2ecc71, #27ae60); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 800; }
body.is-teacher .rpt-th-okbad .rpt-all { background: linear-gradient(135deg, #5ea0ff, #3f6af5); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 800; }
body.is-teacher .rpt-th-okbad .rpt-slash { color: #9aa5b5; font-weight: 400; margin: 0 2px; }
body.is-teacher .rpt-okbad-cell { font-weight: 700 !important; }
body.is-teacher .rpt-frac { display: inline-flex; align-items: baseline; background: #f2f6fc; border: 1px solid #dfe7f3; border-radius: 999px; padding: 2px 12px 3px; line-height: 1.2; font-variant-numeric: tabular-nums; }
body.is-teacher .rpt-frac.is-full { background: #e8f8ef; border-color: #c2e9d1; }
body.is-teacher .rpt-frac-ok { color: #1f9d55; font-weight: 800; font-size: 18px; }
body.is-teacher .rpt-frac-slash { color: #a9b7c9; font-weight: 600; margin: 0 3px; }
body.is-teacher .rpt-frac-all { color: #5a6b7f; font-weight: 700; font-size: 15px; }
body.is-teacher .rpt-name { font-weight: 700; }
body.is-teacher .rd-stu { display: flex; align-items: center; gap: 12px; }
body.is-teacher .rd-avatar { flex: none; min-width: 40px; width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff; font-size: 22px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 3px 8px rgba(37,99,235,.30); font-variant-numeric: tabular-nums; }
body.is-teacher .rd-stu > span:not(.rd-avatar) { font-size: 17px !important; font-weight: 700; color: #1f2d3d; }
body.is-teacher .rpt-rate { display: flex; align-items: center; justify-content: center; gap: 8px; }
body.is-teacher .rpt-ratebar { flex: 1; min-width: 70px; max-width: 150px; height: 8px; background: #edf2f7; border-radius: 999px; overflow: hidden; }
body.is-teacher .rpt-ratebar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #2ecc71, #27ae60); transition: width .3s ease; }
body.is-teacher .rpt-rate-num { font-size: 15px !important; font-weight: 800; color: #1f2d3d; }
body.is-teacher .rpt-dash { color: #9aa5b5; }
body.is-teacher .rpt-empty { text-align: center; color: #9aa5b5; padding: 26px 0 !important; }
body.is-teacher .rpt-avg td { background: #f7f9fc; font-weight: 700; border-top: 2px solid #e2e8f0; border-bottom: none; }
body.is-teacher .rpt-avg td:first-child { color: #2563eb; }
body.is-teacher .rpt-banner { margin-top: 16px; background: #eff6ff; border: 1px solid #dbeafe; border-radius: 14px; padding: 12px 18px; font-size: 15px !important; color: #2d3748; }
body.is-teacher .rd-score { font-weight: 800; font-size: 18px !important; color: #1f2d3d; }
body.is-teacher .rd-score-full { font-size: 13px !important; color: #9aa5b5; font-weight: 600; margin-left: 2px; }
body.is-teacher .rd-level { font-size: 14px !important; font-weight: 700; border-radius: 999px; padding: 4px 12px; display: inline-block; }
body.is-teacher .rd-level.lv-ex { color: #1e8449; background: #e8f8ef; }
body.is-teacher .rd-level.lv-good { color: #27ae60; background: #eafaf1; }
body.is-teacher .rd-level.lv-ok { color: #8a6d00; background: #fdf6e3; }
body.is-teacher .rd-level.lv-warn { color: #c0392b; background: #fdecea; }
body.is-teacher .rd-level.lv-none { color: #9aa5b5; background: #f1f3f6; }

/* ============ 上课记录（教师手写复盘 · tlog） ============ */
body.is-teacher .tlog-view { padding: 4px 0 32px; }
body.is-teacher .tlog-list { display: flex; flex-direction: column; gap: 18px; margin-top: 8px; }
body.is-teacher .tlog-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 18px; box-shadow: 0 2px 8px rgba(0,0,0,.05); padding: 22px 26px; transition: box-shadow .2s, transform .2s; }
body.is-teacher .tlog-card:hover { box-shadow: 0 6px 18px rgba(0,0,0,.09); transform: translateY(-1px); }
body.is-teacher .tlog-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
body.is-teacher .tlog-info { display: flex; align-items: flex-start; gap: 14px; flex: 1; min-width: 0; }
body.is-teacher .tlog-ico { width: 46px; height: 46px; flex: 0 0 46px; border-radius: 12px; background: linear-gradient(135deg, #eff6ff, #dbeafe); display: flex; align-items: center; justify-content: center; font-size: 24px; }
body.is-teacher .tlog-title { margin: 0 0 6px; font-size: 19px; font-weight: 700; color: #1f2d3d; line-height: 1.35; word-break: break-word; }
body.is-teacher .tlog-meta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 14px; color: #5a6b7f; }
body.is-teacher .tlog-rating { display: inline-block; padding: 3px 12px; border-radius: 999px; font-size: 13px; font-weight: 700; }
body.is-teacher .tlog-rating.rt-ok { color: #1e8449; background: #e8f8ef; }
body.is-teacher .tlog-rating.rt-mid { color: #8a6d00; background: #fdf6e3; }
body.is-teacher .tlog-rating.rt-warn { color: #c0392b; background: #fdecea; }
body.is-teacher .tlog-actions { display: flex; gap: 6px; flex: 0 0 auto; }
body.is-teacher .tlog-section { margin-top: 14px; padding: 12px 14px; background: #f7f9fc; border-radius: 12px; border-left: 3px solid #c8d6e8; }
body.is-teacher .tlog-section-label { font-size: 14px; font-weight: 700; color: #2d3748; margin-bottom: 6px; }
body.is-teacher .tlog-section-text { font-size: 15px; color: #2d3748; line-height: 1.6; white-space: pre-wrap; word-break: break-word; }

/* 弹窗：上课记录 */
body.is-teacher .tlog-modal { min-width: 560px; max-width: 92vw; }
body.is-teacher .tlog-field { margin-bottom: 14px; }
body.is-teacher .tlog-field > label { display: block; font-size: 15px; font-weight: 700; color: #2d3748; margin-bottom: 6px; }
body.is-teacher .tlog-field select,
body.is-teacher .tlog-field textarea,
body.is-teacher .tlog-field input { width: 100%; padding: 10px 12px; font-size: 15px; border: 1px solid #cbd5e0; border-radius: 8px; background: #fff; box-sizing: border-box; font-family: inherit; }
body.is-teacher .tlog-field textarea { resize: vertical; min-height: 72px; line-height: 1.5; }
body.is-teacher .tlog-field select:focus,
body.is-teacher .tlog-field textarea:focus,
body.is-teacher .tlog-field input:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.15); }
body.is-teacher .tlog-req { color: #c0392b; margin-left: 2px; }
body.is-teacher .tlog-rating-pick { display: flex; gap: 10px; flex-wrap: wrap; }
body.is-teacher .tlog-rating-opt { position: relative; display: inline-flex; align-items: center; padding: 8px 18px; border-radius: 999px; border: 2px solid #e2e8f0; background: #fff; font-size: 15px; font-weight: 700; color: #5a6b7f; cursor: pointer; transition: all .15s; user-select: none; }
body.is-teacher .tlog-rating-opt input { position: absolute; opacity: 0; width: 0; height: 0; }
body.is-teacher .tlog-rating-opt:hover { border-color: #cbd5e0; }
body.is-teacher .tlog-rating-opt.rt-ok.on { color: #1e8449; background: #e8f8ef; border-color: #1e8449; }
body.is-teacher .tlog-rating-opt.rt-mid.on { color: #8a6d00; background: #fdf6e3; border-color: #d4a800; }
body.is-teacher .tlog-rating-opt.rt-warn.on { color: #c0392b; background: #fdecea; border-color: #c0392b; }

/* 弹窗：请假考勤（新版） */
body.is-teacher .attend-modal { min-width: 520px; max-width: 92vw; max-height: 85vh; display: flex; flex-direction: column; }
body.is-teacher .attend-tabs { display: flex; gap: 4px; padding: 0 20px; border-bottom: 1px solid #e2e8f0; }
body.is-teacher .attend-tab { flex: 1; padding: 12px 0; background: none; border: none; border-bottom: 2px solid transparent; color: #64748b; font-size: 14px; cursor: pointer; transition: all .2s; }
body.is-teacher .attend-tab:hover { color: #334155; }
body.is-teacher .attend-tab.on { color: #2563eb; border-bottom-color: #2563eb; font-weight: 600; }
body.is-teacher .attend-body,
body.is-teacher .attend-modal .modal-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
body.is-teacher .attend-section { margin-bottom: 20px; }
body.is-teacher .attend-section:last-child { margin-bottom: 0; }
body.is-teacher .attend-sec-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; font-size: 14px; font-weight: 600; color: #334155; }
body.is-teacher .attend-clear { background: none; border: none; color: #ef4444; font-size: 12px; cursor: pointer; padding: 2px 6px; border-radius: 4px; }
body.is-teacher .attend-clear:hover { background: #fef2f2; }

/* 请假学生列表 */
body.is-teacher .attend-leave-list { display: flex; flex-direction: column; gap: 6px; }
body.is-teacher .attend-leave-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: #eff6ff; border: 1px solid #fbbf24; border-radius: 8px; }
body.is-teacher .ali-avatar { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; font-size: 14px; flex-shrink: 0; }
body.is-teacher .ali-info { flex: 1; }
body.is-teacher .ali-name { font-size: 14px; font-weight: 500; color: #1e293b; }
body.is-teacher .ali-no { font-size: 12px; color: #94a3b8; }
body.is-teacher .ali-remove { width: 24px; height: 24px; border-radius: 50%; border: none; background: #bfdbfe; color: #1d4ed8; cursor: pointer; font-size: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
body.is-teacher .ali-remove:hover { background: #93c5fd; }

/* 空状态 */
body.is-teacher .attend-empty { text-align: center; padding: 30px 0; color: #94a3b8; }
body.is-teacher .attend-empty.small { padding: 20px 0; font-size: 13px; }
body.is-teacher .attend-empty-ico { font-size: 32px; margin-bottom: 8px; }

/* 搜索框 */
body.is-teacher .attend-search { position: relative; margin-bottom: 10px; }
body.is-teacher .attend-search-ico { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); font-size: 14px; color: #94a3b8; }
body.is-teacher .attend-search-input { width: 100%; padding: 10px 36px 10px 36px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 14px; outline: none; transition: border-color .2s; box-sizing: border-box; }
body.is-teacher .attend-search-input:focus { border-color: #3b82f6; }
body.is-teacher .attend-search-clear { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; border-radius: 50%; border: none; background: #e2e8f0; color: #64748b; cursor: pointer; font-size: 11px; display: flex; align-items: center; justify-content: center; }
body.is-teacher .attend-search-clear:hover { background: #cbd5e1; }

/* 添加学生列表 */
body.is-teacher .attend-add-list { max-height: 280px; overflow-y: auto; display: flex; flex-direction: column; gap: 4px; }
body.is-teacher .attend-add-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 6px; cursor: pointer; transition: background .15s; }
body.is-teacher .attend-add-item:hover { background: #f1f5f9; }
body.is-teacher .aai-avatar { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 500; font-size: 13px; flex-shrink: 0; }
body.is-teacher .aai-info { flex: 1; }
body.is-teacher .aai-name { font-size: 13px; color: #1e293b; }
body.is-teacher .aai-no { font-size: 11px; color: #94a3b8; }
body.is-teacher .aai-add { font-size: 12px; color: #2563eb; opacity: 0; transition: opacity .15s; }
body.is-teacher .attend-add-item:hover .aai-add { opacity: 1; }
body.is-teacher .attend-tip { text-align: center; padding: 16px; color: #f59e0b; font-size: 13px; }

/* 历史记录筛选 */
body.is-teacher .attend-stats-filter { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }

/* 授课工具箱卡片 */
body.is-teacher .toolbox-card {
  background: #fff; border: 1px solid #e2e8f0; border-radius: 12px;
  padding: 16px 20px; margin-bottom: 16px;
}
body.is-teacher .toolbox-title { font-size: 15px; font-weight: 600; color: #1e293b; margin-bottom: 12px; }
body.is-teacher .toolbox-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
body.is-teacher .toolbox-item {
  display: flex; align-items: center; gap: 12px;
  padding: 14px; background: #f8fafc; border: 1px solid #e2e8f0;
  border-radius: 10px; cursor: pointer; transition: all .2s;
}
body.is-teacher .toolbox-item:hover { background: #eff6ff; border-color: #93c5fd; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(59,130,246,.12); }
body.is-teacher .tbi-ico { font-size: 28px; flex-shrink: 0; }
body.is-teacher .tbi-info { flex: 1; min-width: 0; }
body.is-teacher .tbi-name { font-size: 14px; font-weight: 600; color: #1e293b; margin-bottom: 2px; }
body.is-teacher .tbi-desc { font-size: 12px; color: #64748b; }

/* 倒计时弹窗 */
body.is-teacher .timer-modal { width: 420px; max-width: 92vw; text-align: center; }
body.is-teacher .timer-display { padding: 20px 0; }
body.is-teacher .timer-num { font-size: 72px; font-weight: 900; font-family: 'Courier New', monospace; color: #1e293b; letter-spacing: 4px; }
body.is-teacher .timer-display.urgent .timer-num { color: #ef4444; animation: timer-blink 1s ease-in-out infinite; }
@keyframes timer-blink { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }
body.is-teacher .timer-presets { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 14px; }
body.is-teacher .timer-preset {
  padding: 6px 14px; border: 2px solid #e2e8f0; background: #f8fafc;
  border-radius: 20px; cursor: pointer; font-size: 13px; font-weight: 600;
  color: #475569; transition: all .12s;
}
body.is-teacher .timer-preset:hover { border-color: #60a5fa; background: #eff6ff; color: #2563eb; }
body.is-teacher .timer-custom { display: flex; align-items: center; justify-content: center; gap: 6px; margin-bottom: 18px; font-size: 13px; color: #64748b; }
body.is-teacher .timer-input { width: 56px; padding: 6px 8px; border: 2px solid #e2e8f0; border-radius: 8px; text-align: center; font-size: 14px; font-weight: 700; }
body.is-teacher .timer-input:focus { outline: none; border-color: #60a5fa; }
body.is-teacher .timer-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* 随机点名弹窗 */
body.is-teacher .picker-modal { width: 460px; max-width: 92vw; text-align: center; }
body.is-teacher .picker-display { padding: 20px 0 10px; min-height: 90px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
body.is-teacher .picker-name { font-size: 56px; font-weight: 900; color: #1e293b; }
body.is-teacher .picker-display.rolling .picker-name { animation: pk-shake .08s ease-in-out infinite alternate; color: #60a5fa; }
@keyframes pk-shake { from { transform: scale(1); } to { transform: scale(1.05); } }
body.is-teacher .picker-no { font-size: 14px; color: #64748b; background: #f1f5f9; padding: 4px 12px; border-radius: 12px; margin-top: 8px; }
body.is-teacher .picker-settings { text-align: left; margin-bottom: 16px; padding: 10px 14px; background: #f8fafc; border-radius: 10px; }
body.is-teacher .picker-check { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 13.5px; color: #475569; }
body.is-teacher .picker-check input { cursor: pointer; }
body.is-teacher .picker-actions { display: flex; gap: 10px; justify-content: center; margin-bottom: 12px; }
body.is-teacher .picker-result-action { margin-bottom: 12px; }
body.is-teacher .picker-log { text-align: left; border-top: 1px solid #e2e8f0; padding-top: 14px; }
body.is-teacher .picker-log-title { font-size: 13px; color: #64748b; margin-bottom: 8px; font-weight: 600; }
body.is-teacher .picker-log-list { display: flex; flex-wrap: wrap; gap: 6px; max-height: 100px; overflow-y: auto; }
body.is-teacher .picker-log-item {
  display: inline-block; padding: 3px 10px; background: #eff6ff; color: #2563eb;
  border-radius: 12px; font-size: 12.5px; font-weight: 600;
}
body.is-teacher .btn-success { background: #10b981; border-color: #10b981; color: #fff; }
body.is-teacher .btn-success:hover { background: #059669; border-color: #059669; }
body.is-teacher .btn-sm { padding: 6px 14px; font-size: 13px; }
body.is-teacher .btn-lg { padding: 12px 28px; font-size: 16px; }

/* 弹窗：请假考勤（旧版样式保留兼容） */
body.is-teacher .leave-modal { min-width: 520px; max-width: 92vw; }
body.is-teacher .leave-tip { font-size: 14px; color: #64748b; margin-bottom: 14px; }
body.is-teacher .leave-list { max-height: 420px; overflow-y: auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
body.is-teacher .leave-item { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 8px 12px; border-radius: 10px; cursor: pointer; transition: background 0.15s; }
body.is-teacher .leave-item:hover { background: #f1f5f9; }
body.is-teacher .leave-list.disabled .leave-item { opacity: 0.5; cursor: not-allowed; pointer-events: none; }
body.is-teacher .leave-item input[type="checkbox"] { width: 18px; height: 18px; cursor: pointer; margin: 0; }
body.is-teacher .leave-no { width: 28px; height: 28px; line-height: 28px; text-align: center; background: #e0e7ff; color: #4338ca; border-radius: 50%; font-size: 13px; font-weight: 600; flex-shrink: 0; }
body.is-teacher .leave-name { font-size: 15px; color: #1e293b; }

/* 请假原因：两段式行结构（上行=勾选区，下行=原因标签区，勾选请假后出现） */
body.is-teacher .leave-main { display: flex; align-items: center; gap: 8px; min-width: 0; }
body.is-teacher .leave-reasons { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; flex: 1 1 100%; margin-top: 4px; }
body.is-teacher .leave-item .lr-chip { font-size: 13px; font-weight: 600; line-height: 1; padding: 5px 9px; border-radius: 999px; border: 1px solid #cbd5e1; background: #fff; color: #64748b; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all 0.15s; }
body.is-teacher .leave-item .lr-chip:hover { border-color: #93c5fd; color: #2563eb; background: #eff6ff; }
body.is-teacher .leave-item .lr-chip.on, body.is-teacher .leave-item .lr-chip.on:hover { background: #2563eb; border-color: #2563eb; color: #fff; }
body.is-teacher .leave-item .lr-input { flex: 1 1 80px; min-width: 80px; width: auto; margin: 0; font-size: 13px; font-family: inherit; line-height: 1; padding: 5px 9px; border-radius: 999px; border: 1px solid #cbd5e1; outline: none; color: #1e293b; }
body.is-teacher .leave-item .lr-input:focus { border-color: #2563eb; box-shadow: 0 0 0 2px rgba(37,99,235,.15); }
body.is-teacher .leave-item .lr-input::placeholder { color: #94a3b8; }

/* 请假弹窗：Tab 切换 */
body.is-teacher .leave-tabs { display: flex; gap: 4px; padding: 0 26px; border-bottom: 1px solid #e2e8f0; margin-bottom: 18px; }
body.is-teacher .leave-tab { padding: 10px 18px; border: none; background: none; font-size: 15px; font-weight: 600; color: #64748b; cursor: pointer; font-family: inherit; border-bottom: 2px solid transparent; margin-bottom: -1px; transition: all 0.15s; }
body.is-teacher .leave-tab:hover { color: #334155; }
body.is-teacher .leave-tab.on { color: #2563eb; border-bottom-color: #2563eb; }

/* 请假统计：筛选栏 */
body.is-teacher .leave-stats-filters { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
body.is-teacher .leave-export-btn { font-size: 13px; padding: 6px 14px; }

/* 请假统计：统计卡片 */
body.is-teacher .leave-stat-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 20px; }
body.is-teacher .leave-stat-card { background: #f8fafc; border-radius: 12px; padding: 14px; text-align: center; border: 1px solid #e2e8f0; }
body.is-teacher .lsc-label { font-size: 13px; color: #64748b; margin-bottom: 6px; }
body.is-teacher .lsc-value { font-size: 26px; font-weight: 800; color: #1e293b; }

/* 请假统计：排行 */
body.is-teacher .leave-rank-section { margin-bottom: 20px; }
body.is-teacher .leave-rank-title { font-size: 15px; font-weight: 700; color: #1e293b; margin-bottom: 10px; }
body.is-teacher .leave-rank-list { display: flex; flex-direction: column; gap: 6px; }
body.is-teacher .leave-rank-item { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 10px; background: #f8fafc; }
body.is-teacher .leave-rank-no { width: 22px; height: 22px; line-height: 22px; text-align: center; border-radius: 50%; font-size: 12px; font-weight: 700; background: #e2e8f0; color: #64748b; flex-shrink: 0; }
body.is-teacher .leave-rank-no.r1 { background: #dbeafe; color: #d97706; }
body.is-teacher .leave-rank-no.r2 { background: #e2e8f0; color: #475569; }
body.is-teacher .leave-rank-no.r3 { background: #bfdbfe; color: #1d4ed8; }
body.is-teacher .leave-rank-ava { width: 28px; height: 28px; line-height: 28px; text-align: center; border-radius: 50%; color: #fff; font-size: 13px; font-weight: 600; flex-shrink: 0; }
body.is-teacher .leave-rank-name { flex: 1; font-size: 14px; color: #1e293b; }
body.is-teacher .leave-rank-count { font-size: 14px; font-weight: 700; color: #ef4444; }
body.is-teacher .leave-rank-empty { text-align: center; padding: 20px; color: #94a3b8; font-size: 14px; }

/* 请假统计：按日趋势 */
body.is-teacher .leave-trend-section { }
body.is-teacher .leave-trend-title { font-size: 15px; font-weight: 700; color: #1e293b; margin-bottom: 10px; }
body.is-teacher .leave-trend-list { display: flex; flex-direction: column; gap: 6px; max-height: 200px; overflow-y: auto; }
body.is-teacher .leave-trend-item { display: flex; align-items: center; gap: 10px; font-size: 13px; }
body.is-teacher .lt-date { width: 55px; color: #64748b; flex-shrink: 0; }
body.is-teacher .lt-bar-wrap { flex: 1; height: 20px; background: #f1f5f9; border-radius: 10px; overflow: hidden; }
body.is-teacher .lt-bar { height: 100%; background: linear-gradient(90deg, #60a5fa, #3b82f6); border-radius: 10px; transition: width 0.3s; min-width: 2px; }
body.is-teacher .lt-count { width: 45px; text-align: right; color: #475569; font-weight: 600; flex-shrink: 0; }

/* 请假统计：双下拉筛选（范围 + 班级），窄屏自动换行 */
body.is-teacher .leave-stats-filters { flex-wrap: wrap; gap: 8px; }
body.is-teacher .leave-stats-selects { display: flex; gap: 8px; flex-wrap: wrap; }
/* 课堂雷达「请假」统计卡：可点击打开请假考勤弹窗 */
body.is-teacher .live-stats-row .stat-card.clickable { cursor: pointer; transition: transform .15s, box-shadow .15s, border-color .15s; }
body.is-teacher .live-stats-row .stat-card.clickable:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(37,99,235,.18); border-color: #bfdbfe; }

/* 历史会话：当前查看的会话行高亮 */
body.is-teacher .report-table tr.hist-active td { background: #eff6ff; }
/* 打印：仅输出报告详情卡 */
@media print {
  body.is-teacher * { visibility: hidden !important; }
  body.is-teacher #rptCard, body.is-teacher #rptCard * { visibility: visible !important; }
  body.is-teacher #rptCard { position: absolute; left: 0; top: 0; width: 100%; border: none; box-shadow: none; padding: 0; }
}

/* ===========================================================
 * 教师端 · v2 新增：迷你操作按钮 / 成绩单元格 / 弹窗表单
 * =========================================================== */
body.is-teacher .tb.mini { padding: 3px 8px; font-size: 12px; border-radius: 7px; line-height: 1.4; }
body.is-teacher .tb.mini.danger { border-color: rgba(224,122,122,.4); color: #e07a7a; }
body.is-teacher .tb.mini.danger:hover { background: rgba(224,122,122,.12); }
body.is-teacher .t-lc-field select {
  width: 100%; padding: 10px 14px; background: #f4f7fd; color: #2d3748;
  border: 1px solid #cbd5e0; border-radius: 12px; font-size: 14px; font-family: inherit;
}
body.is-teacher .modal .desc { color: #5a6b7f; font-size: 13px; }
body.is-teacher input[type=number] { background: #f4f7fd; color: #2d3748; border: 1px solid #e2e8f0; border-radius: 8px; padding: 6px 10px; font-size: 13px; font-family: inherit; }
body.is-teacher .roster-card .rc-ops { display: flex; align-items: center; gap: 6px; }
body.is-teacher .score-cell { position: relative; }
body.is-teacher .sc-val { cursor: pointer; }
body.is-teacher .sc-ops { display: flex; justify-content: center; gap: 4px; opacity: 0; transition: .12s; margin-top: 4px; }
body.is-teacher tr:hover .sc-ops { opacity: 1; }
body.is-teacher .score-pill.cur { cursor: pointer; }
body.is-teacher .score-pill.cur:hover { outline: 1px solid #4f8cff; }

/* ===========================================================
 * 教师端 · v2 新增：机房 3D 场景（讲台投影 + 显示器模型）
 * =========================================================== */
body.is-teacher .room-stage { margin-top: 14px; }
body.is-teacher .projector-room { display: flex; flex-direction: column; align-items: center; margin-bottom: 22px; }
body.is-teacher .screen {
  width: 62%; height: 86px; border: 3px solid #2a3550; border-radius: 8px;
  background: linear-gradient(180deg, #dfe7f5 0%, #c8d4ea 100%);
  box-shadow: 0 10px 24px rgba(0,0,0,.35), inset 0 0 30px rgba(79,140,255,.08);
  position: relative;
}
body.is-teacher .screen::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -8px; margin: auto;
  width: 46%; height: 8px; border-radius: 0 0 6px 6px;
  background: linear-gradient(180deg, #1a2438, #ffffff);
}
body.is-teacher .projector-arm { width: 62%; display: flex; justify-content: flex-end; padding: 6px 6px 0 0; }
body.is-teacher .projector-body {
  width: 34px; height: 22px; border-radius: 6px; background: #1a2438; border: 1px solid #2a3550;
  display: flex; align-items: center; justify-content: center; font-size: 13px; line-height: 1;
  box-shadow: 0 4px 10px rgba(0,0,0,.4);
}
body.is-teacher .podium-desk {
  margin-top: 10px; padding: 8px 34px; border-radius: 10px;
  background: linear-gradient(180deg, #233048 0%, #1a2438 100%);
  border: 1px solid #2a3550; color: #b6c6e8; font-size: 13px; font-weight: 600; letter-spacing: 2px;
  box-shadow: 0 8px 18px rgba(0,0,0,.35);
}
body.is-teacher .monitor { display: flex; flex-direction: column; align-items: center; cursor: pointer; transition: .15s; }
body.is-teacher .mon-screen {
  width: 92%; aspect-ratio: 3/2; border-radius: 8px; border: 3px solid #161e30;
  background: #f5f7fc; display: flex; flex-direction: column; align-items: center; justify-content: center;
  box-shadow: 0 6px 14px rgba(0,0,0,.35); transition: .15s; overflow: hidden;
}
body.is-teacher .mon-name { color: #14181f; font-size: 12px; font-weight: 900; letter-spacing: 0.5px; }
body.is-teacher .mon-no { color: #3c4453; font-size: 10px; font-weight: 700; margin-top: 1px; }
body.is-teacher .mon-stand { width: 26%; height: 8px; background: linear-gradient(180deg, #2a3550, #161e30); border-radius: 0 0 6px 6px; }
body.is-teacher .monitor:hover .mon-screen { transform: translateY(-3px); box-shadow: 0 10px 20px rgba(79,140,255,.28); }
body.is-teacher .monitor.green .mon-screen { background: #e2f5ec; border-color: #3fae8e; box-shadow: 0 0 14px rgba(63,174,142,.35); }
body.is-teacher .monitor.yellow .mon-screen { background: #f7efd4; border-color: #d9b45b; box-shadow: 0 0 14px rgba(217,180,91,.35); }
body.is-teacher .monitor.red .mon-screen { background: #f9e0e0; border-color: #e07a7a; box-shadow: 0 0 14px rgba(224,122,122,.4); animation: pulse 1.6s infinite; }

/* ===========================================================
 * 教师端 · v2 新增：备课中心资源库
 * =========================================================== */
body.is-teacher .prep-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
body.is-teacher .prep-cat { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 24px; padding: 16px 18px; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
body.is-teacher .prep-cat-head { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
body.is-teacher .prep-cat-head b { color: #2d3748; font-size: 13.5px; font-weight: 700; line-height: 21.6px; }
body.is-teacher .prep-cat-head .tag { margin-left: auto; }
body.is-teacher .prep-ico { font-size: 18px; }
body.is-teacher .prep-item { display: flex; align-items: center; gap: 8px; padding: 9px 10px; border-radius: 10px; cursor: pointer; transition: .12s; }
body.is-teacher .prep-item:hover { background: #ffffff; border: 1px solid rgba(79,140,255,.35); }
body.is-teacher .prep-dot { width: 8px; height: 8px; border-radius: 50%; background: #27ae60; box-shadow: 0 0 0 3px #e8f8ef; flex: none; }
body.is-teacher .prep-it-main { flex: 1; min-width: 0; }
body.is-teacher .prep-it-title { color: #2d3748; font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.is-teacher .prep-it-meta { color: #5a6b7f; font-size: 10.5px; margin-top: 2px; }
body.is-teacher .prep-go { color: #2563eb; font-size: 18px; font-weight: 700; }
body.is-teacher .prep-tips { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
body.is-teacher .prep-tip { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 14px; display: flex; gap: 10px; color: #5a6b7f; font-size: 12.5px; line-height: 1.65; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
body.is-teacher .prep-tip b { color: #2d3748; }
body.is-teacher .prep-tip-ico { font-size: 20px; line-height: 1.4; }

/* ===========================================================
 * 学生端 · 登录选册页 —— 上下分栏式（书架风）v0.5
 * 顶部栏(返回首页+教师入口) / 中部(标题+步骤+选卡) / 底部操作栏
 * 仅作用于学生端浅色主题，不影响教师端深色
 * =========================================================== */
.login-page { position: relative; }

/* —— 教师入口：固定在页面右下角 —— */
.login-teacher-link {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,122,69,0.08); border: 2px solid rgba(255,122,69,0.35);
  border-radius: 999px; padding: 10px 20px;
  color: var(--book-7a); font-size: 15px; font-weight: 700;
  text-decoration: none; transition: 0.2s;
}
.login-teacher-link .lt-arrow { font-size: 16px; }
.login-teacher-link:hover { background: var(--book-7a); color: #fff; transform: translateY(-2px); box-shadow: var(--shadow-md); }

/* —— 头部标题增强 —— */
.login-header { margin-bottom: 20px; }
.login-badges { display: flex; gap: 10px; justify-content: center; margin-top: 18px; flex-wrap: wrap; }
.badge-item {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 999px; padding: 7px 16px; font-size: 13px;
  color: var(--text-secondary); font-weight: 600; box-shadow: var(--shadow-sm);
}

/* —— 中部舞台：给卡片一个浅色弧面底板，强化上下分栏 —— */
.login-stage {
  background: rgba(255,255,255,0.55);
  border: 1px solid rgba(0,0,0,0.05);
  border-radius: 28px; padding: 10px 24px 14px;
  box-shadow: var(--shadow-sm); margin-bottom: 6px;
}

/* —— 步骤3（选名）紧凑模式：保证30人在一页内显示 —— */
.login-stage .login-crumb { margin-bottom: 8px !important; padding: 5px 16px !important; font-size: 13px !important; }
.login-stage .prompt-q { margin: 0 0 16px !important; font-size: 22px !important; }
.login-stage .avatar-grid { margin-bottom: 6px !important; }
.login-stage .login-actions { margin-top: 42px !important; /* 按钮区整体下移约1厘米，与名字网格拉开距离 */ }

/* —— 书本式选册卡：像立起来的教材封面 —— */
.book-grid { display: flex; gap: 40px; justify-content: center; margin-bottom: 28px; flex-wrap: wrap; perspective: 1200px; }
.book-card {
  width: 380px; height: 240px; border-radius: 8px 26px 26px 8px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all 0.28s ease; padding: 0 30px;
  color: #fff; font-family: inherit; position: relative;
  border: 0; text-align: left; overflow: hidden;
  box-shadow: 0 18px 40px -12px rgba(0,0,0,0.45);
}
.book-card::before { content: ''; position: absolute; top: -20%; right: -20%; bottom: auto; left: auto; width: 280px; height: 280px; border-radius: 50%; background: rgba(255,255,255,0.12); z-index: 0; }
.book-card::after { content: ''; position: absolute; top: auto; right: auto; bottom: -30%; left: -20%; width: 220px; height: 220px; border-radius: 50%; background: rgba(255,255,255,0.08); z-index: 0; }
.book-card.book-orange { background: var(--grad-orange); }
.book-card.book-blue   { background: var(--grad-blue); }
.book-card:hover { transform: translateY(-10px) rotateZ(0.6deg); box-shadow: 0 30px 56px -14px rgba(0,0,0,0.5); }
.book-card.selected { transform: translateY(-10px) scale(1.02); box-shadow: 0 0 0 5px rgba(255,255,255,0.6), 0 30px 56px -14px rgba(0,0,0,0.5); }
/* 书脊 */
.book-spine {
  position: absolute; left: 0; top: 0; bottom: 0; width: 18px;
  background: rgba(0,0,0,0.16); z-index: 1;
  border-radius: 8px 0 0 8px;
}
.book-spine::after { content: ''; position: absolute; left: 3px; top: 0; bottom: 0; width: 2px; background: rgba(255,255,255,0.25); }
/* 封面内容 */
.book-cover { display: flex; flex-direction: column; align-items: center; position: relative; z-index: 1; width: 100%; }
.book-cover .book-emoji { font-size: 70px; margin-bottom: 10px; filter: drop-shadow(0 2px 6px rgba(0,0,0,0.25)); }
.book-cover .book-name { font-size: 34px; font-weight: 900; letter-spacing: 3px; }
.book-cover .book-tag { font-size: 16px; opacity: 0.94; margin-top: 8px; letter-spacing: 0.5px; }

/* 册别锁定（教师端控制）：登录选书封面锁定遮罩 */
.book-card.locked { filter: grayscale(0.5); opacity: 0.85; cursor: not-allowed; }
.book-cover-lock {
  position: absolute; inset: 0; z-index: 3;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  background: rgba(23, 32, 55, 0.62); backdrop-filter: blur(1.5px); border-radius: 8px;
}
.bcl-icon { font-size: 44px; filter: drop-shadow(0 3px 8px rgba(0,0,0,0.4)); }
.bcl-txt { color: #fff; font-size: 16px; font-weight: 800; letter-spacing: 2px; text-shadow: 0 2px 6px rgba(0,0,0,0.45); }

/* 班级卡（白色，保持顺眼） */
.book-card.class-card { background: var(--surface); color: var(--text-primary); border: 2px solid var(--border); box-shadow: var(--shadow-md); text-align: center; justify-content: center; }
.book-card.class-card::before, .book-card.class-card::after, .book-card.class-card .book-spine { display: none; }
.book-card.class-card .book-emoji { font-size: 68px; }
.book-card.class-card .book-name { font-size: 32px; }
.book-card.class-card .book-tag { color: var(--text-secondary); font-size: 17px; }
.book-card.class-card:hover { border-color: var(--book-7a); }

/* —— 底部操作栏（上下分栏的 footer） —— */
.login-footer {
  margin-top: 26px; display: flex; flex-direction: column; gap: 10px;
  align-items: center; color: var(--text-muted); font-size: 13px;
}
.lf-info { display: flex; align-items: center; gap: 8px; }
.lf-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px rgba(39,174,96,0.18); }
.lf-tip { font-size: 12px; }
.lf-tip code { background: var(--surface-2); padding: 2px 8px; border-radius: 6px; color: var(--book-7a); font-family: monospace; font-weight: 700; }

/* 登录页底部：教师通道按钮 */
.lf-teacher-row { margin-top: 10px; display: flex; justify-content: center; }
.lf-teacher-btn {
  font-family: inherit; font-size: 13px; font-weight: 700; cursor: pointer;
  padding: 9px 22px; border-radius: 999px; border: 1.5px dashed #B48CFF;
  background: #F5EEFF; color: #6B3FD4;
  transition: all .18s ease;
}
.lf-teacher-btn:hover { background: #E9DEFF; transform: translateY(-1px); box-shadow: 0 6px 16px rgba(107,63,212,0.22); }
/* 备案号（首页底部中间） */
.lf-beian { margin-top: 6px; display: flex; justify-content: center; }
.lf-beian a { color: var(--text-muted); font-size: 12px; text-decoration: none; }
.lf-beian a:hover { text-decoration: underline; }
/* 教师端备案号（底部居中） */
.tc-beian { position: fixed; left: 0; right: 0; bottom: 6px; text-align: center; z-index: 50; }
.tc-beian a { color: rgba(120,130,150,0.7); font-size: 12px; text-decoration: none; }
.tc-beian a:hover { text-decoration: underline; color: rgba(120,130,150,1); }
.tc-beian .tc-beian-gap { display: inline-block; width: 14px; }
.tc-beian .tc-gab { display: inline-flex; align-items: center; }
.tc-beian .tc-shield { display: block; flex: none; width: 13px; height: 13px; margin-right: 3px; vertical-align: middle; }
/* 地图顶栏：教师模式徽章 */
.teacher-mode-badge {
  display: inline-flex; align-items: center; gap: 4px;
  margin-left: 8px; padding: 4px 12px; border-radius: 999px;
  background: #6B3FD4; color: #FFF; font-size: 14px; font-weight: 700;
  box-shadow: 0 3px 8px rgba(107,63,212,0.35);
}

/* DVD响应式：窄屏压缩书本卡 */
@media (max-width: 760px) {
  .book-card { width: 260px; height: 150px; }
  .login-stage { padding: 22px 16px 20px; }
  .login-badges { margin-top: 12px; }
}

/* ===========================================================
 * 登录页 v0.6 —— 步进条三态 + 面包屑 + 彩色头像 + 进入课堂
 * 仅作用于学生端浅色主题
 * =========================================================== */

/* 步进条：已完成=绿，当前=橙，未来=灰；连接线分段着色 */
.step.on .step-num { background: var(--book-7a); color: #fff; box-shadow: 0 0 0 4px rgba(255,122,69,0.18); }
.step.done .step-num { background: var(--green); color: #fff; box-shadow: 0 0 0 4px rgba(39,174,96,0.16); }
.step.done .step-lbl { color: var(--green); font-weight: 700; }
.step-line.done { background: var(--green); }

/* "班"字标红 */
.prompt-red { color: #e23a3a; font-weight: 900; margin: 0 1px; }

/* 面包屑（七年级上册 › 七(1)班 › 找到你的名字） */
.login-crumb {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 9px 20px; margin: 0 auto 24px;
  background: rgba(255,255,255,0.6); border: 1px solid var(--border);
  border-radius: 999px;
  font-size: 16px; color: var(--text-secondary);
  box-shadow: var(--shadow-sm);
}
.login-crumb .crumb-item { font-weight: 600; }
.login-crumb .crumb-sep { color: var(--text-muted); font-weight: 400; }
.login-crumb .crumb-current { color: var(--book-7a); font-weight: 800; }

/* 头像选择网格（10列×5行=50人，卡片加大醒目好找） */
.avatar-grid {
  display: grid; grid-template-columns: repeat(10, 1fr); gap: 10px;
  max-width: 1180px; margin: 0 auto 6px;
  padding: 8px 4px 8px;
}
.avatar-grid::-webkit-scrollbar { width: 6px; }
.avatar-grid::-webkit-scrollbar-thumb { background: rgba(255,122,69,0.25); border-radius: 3px; }
.avatar-card {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 4px; padding: 10px 4px 9px;
  background: var(--surface); border: 1.5px solid var(--border); border-radius: 12px;
  cursor: pointer; transition: 0.12s; font-family: inherit;
}
.avatar-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); border-color: rgba(0,0,0,0.1); }
.avatar-card.selected {
  border-color: var(--book-7a);
  box-shadow: 0 0 0 2px rgba(255,122,69,0.25), 0 4px 10px rgba(255,122,69,0.18);
  background: rgba(255,122,69,0.04);
}
.avatar-circle {
  width: 54px; height: 54px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 800; font-size: 24px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.10);
}
.avatar-name { font-size: 15px; font-weight: 700; color: var(--text-primary); line-height: 1.1; }
.avatar-no { font-size: 12px; color: var(--text-muted); font-weight: 500; }

/* ===== 步骤3 座号登录（隐私模式：不公开全班名单，输座号→打码姓名确认）===== */
.no-login-wrap { max-width: 680px; margin: 12px auto 0; }
.no-input-row { display: flex; align-items: center; justify-content: center; gap: 14px; }
.no-input {
  width: 160px; height: 78px; padding: 0 10px;
  border: 3px solid var(--border); border-radius: 16px;
  background: var(--surface);
  font-size: 42px; font-weight: 900; color: var(--text-primary);
  text-align: center; font-family: inherit; outline: none; transition: 0.15s;
}
.no-input:focus { border-color: var(--book-7a); box-shadow: 0 0 0 4px rgba(255,122,69,0.18); }
.no-input::placeholder { font-size: 22px; font-weight: 600; color: var(--text-muted); letter-spacing: 2px; }
.no-input-unit { font-size: 28px; font-weight: 800; color: var(--text-primary); }
/* 座号输入法提示：浅灰小字，提醒学生切换英文输入法/直接点框输入数字 */
.no-ime-tip { margin-top: 10px; text-align: center; font-size: 14px; color: var(--text-muted); font-weight: 500; }
.btn-find {
  height: 78px; padding: 0 36px; border-radius: 16px; border: 0;
  background: linear-gradient(135deg, #ff8a4c, #ff714d);
  color: #fff; font-size: 25px; font-weight: 800;
  cursor: pointer; font-family: inherit; letter-spacing: 2px;
  box-shadow: 0 10px 24px rgba(255,122,69,0.32); transition: 0.18s;
}
.btn-find:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(255,122,69,0.42); }
.no-error-tip { margin-top: 16px; text-align: center; font-size: 20px; font-weight: 700; color: #e5484d; }
.no-match-card {
  display: flex; align-items: center; justify-content: center; gap: 24px;
  margin: 22px auto 0; padding: 22px 40px; max-width: 580px;
  background: var(--surface); border: 2px solid rgba(255,122,69,0.4); border-radius: 20px;
  box-shadow: 0 0 0 4px rgba(255,122,69,0.12), 0 8px 22px rgba(255,122,69,0.16);
}
.avatar-circle.big { width: 88px; height: 88px; font-size: 40px; flex-shrink: 0; }
.no-match-info { text-align: left; }
.no-match-name { font-size: 38px; font-weight: 900; color: var(--text-primary); letter-spacing: 3px; line-height: 1.15; }
.no-match-no { font-size: 16px; color: var(--text-muted); font-weight: 600; margin-top: 7px; }

/* 按钮区：步骤3 加 CTA */
.login-actions {
  display: flex; align-items: center; justify-content: center; gap: 18px;
  margin-top: 8px;
}
.btn-enter {
  display: inline-flex; align-items: center; gap: 10px;
  background: linear-gradient(135deg, #ff8a4c, #ff714d);
  color: #fff; font-weight: 800; font-size: 20px;
  padding: 16px 42px; border-radius: 999px; border: 0;
  box-shadow: 0 12px 28px rgba(255,122,69,0.35);
  cursor: pointer; font-family: inherit; letter-spacing: 1px;
  transition: 0.18s;
}
.btn-enter:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 16px 32px rgba(255,122,69,0.45); }
.btn-enter:active:not(:disabled) { transform: translateY(0); }
.btn-enter:disabled { background: #d8dde6; color: #aab2c2; cursor: not-allowed; box-shadow: none; }
.btn-enter .enter-arrow { font-size: 24px; line-height: 1; }

@media (max-width: 760px) {
  .avatar-grid { grid-template-columns: repeat(4, 1fr); }
  .login-actions { flex-direction: column; gap: 10px; }
  .btn-enter { width: 100%; max-width: 320px; justify-content: center; }
}

/* ===========================================================
 * 学习地图标题（横排加大字号，代替原 progress-heading 的竖排）
 * =========================================================== */
.progress-heading {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
}
.progress-kicker { color: var(--book-7a); font-size: 14px; font-weight: 800; letter-spacing: 2px; }
.progress-label { font-size: 26px; font-weight: 900; color: var(--text-primary); letter-spacing: 1px; }
.progress-label::before { content: '· '; color: var(--border); font-weight: 400; margin: 0 6px 0 2px; }
.progress-section { grid-template-columns: auto minmax(180px, 1fr) auto; gap: 22px; }

@media (max-width: 760px) {
  .progress-label { font-size: 20px; }
}

/* ===========================================================
 * 导航页 · 路径地图（按 @image#5 风格：圆角矩形小卡片 + 第X单元标签）
 * =========================================================== */
.island-map { max-width: 1120px; margin: 0 auto; padding: 0 6px; }
.journey {
  position: relative;
  padding: 30px 0 36px;
  background-image: url('imgs/learning-map-7a.png');
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  border-radius: 18px;
}
.journey::before {
  content: '';
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background: rgba(255,255,255,0.55);
  border-radius: 18px;
  pointer-events: none;
  z-index: 0;
}
.journey-svg {
  position: absolute; top: 30px; right: 6px; bottom: 36px; left: 6px;
  width: calc(100% - 12px); height: calc(100% - 66px); pointer-events: none; z-index: 0;
}
.journey-svg path.journey-line {
  fill: none; stroke: var(--book-7a); stroke-width: 5;
  stroke-linecap: round; stroke-dasharray: 12 10;
  filter: drop-shadow(0 4px 8px rgba(255,122,69,0.25));
  animation: journey-dash 24s linear infinite;
}
@keyframes journey-dash {
  from { stroke-dashoffset: 0; }
  to   { stroke-dashoffset: -220; }
}

.journey-stops {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; gap: 28px;
  padding: 0 6px;
}
.journey-stop {
  display: flex; flex-direction: column; align-items: flex-start;
  gap: 8px;
  max-width: 320px;
}
.journey-stop.right { align-self: flex-end; align-items: flex-end; }
.journey-stop.left  { align-self: flex-start; }

/* 节点上方"第X单元"小标签 */
.stop-tag {
  display: inline-block;
  padding: 4px 14px;
  font-size: 13px; font-weight: 800;
  background: var(--orb-color, var(--book-7a)); color: #fff;
  border-radius: 999px;
  letter-spacing: 1px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}
.stop-tag-locked { background: #95a3c2; }

/* 节点卡片（一行：图标 + 主体 + 状态） */
.stop-card {
  display: flex; align-items: center; gap: 14px;
  width: 320px; padding: 14px 16px;
  background: var(--surface); border: 2px solid var(--border);
  border-radius: 18px;
  box-shadow: 0 8px 22px rgba(40,60,120,0.10);
  cursor: pointer; transition: 0.18s; font-family: inherit;
  text-align: left; color: inherit;
}
.stop-card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(40,60,120,0.18); border-color: var(--orb-color, var(--book-7a)); }
.stop-card.is-locked { background: rgba(255,255,255,0.72); opacity: 0.7; cursor: not-allowed; }
.stop-card.is-locked:hover { transform: none; box-shadow: 0 8px 22px rgba(40,60,120,0.10); border-color: var(--border); }
.stop-card.is-locked .stop-card-title, .stop-card.is-locked .stop-card-icon { filter: grayscale(0.6); }

.stop-card-icon {
  flex-shrink: 0;
  width: 56px; height: 56px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 30px;
  background: color-mix(in srgb, var(--orb-color, var(--book-7a)) 12%, white);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--orb-color, var(--book-7a)) 35%, white);
}

.stop-card-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.stop-card-title { font-size: 16px; font-weight: 800; color: var(--text-primary); line-height: 1.25; }
.stop-card-intro { font-size: 12px; color: var(--text-secondary); line-height: 1.4;
  overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.stop-card-foot { display: flex; align-items: center; gap: 8px; margin-top: 2px; }
.stop-progress {
  flex: 1; height: 5px; border-radius: 999px;
  background: #eef1f7; overflow: hidden;
}
.stop-progress-fill {
  height: 100%; background: linear-gradient(90deg, var(--orb-color, var(--book-7a)), #ff9b45);
  border-radius: 999px; transition: width 0.5s ease;
}
.stop-card-tag { font-size: 12px; font-weight: 700; color: var(--orb-color, var(--book-7a)); white-space: nowrap; }

.stop-card-state {
  flex-shrink: 0;
  width: 30px; height: 30px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 800; color: #fff;
  background: var(--orb-color, var(--book-7a));
  box-shadow: 0 4px 10px color-mix(in srgb, var(--orb-color, var(--book-7a)) 35%, transparent);
}
.stop-card-state.locked { background: #95a3c2; box-shadow: 0 4px 10px rgba(149,163,194,0.3); }
.stop-card-state.done { background: var(--green); box-shadow: 0 4px 10px rgba(39,174,96,0.3); }

@media (max-width: 760px) {
  .journey-stop, .journey-stop.right { align-self: stretch; align-items: stretch; max-width: none; }
  .stop-card { width: 100%; }
  .journey-svg { display: none; }
}

/* 整本书"完成提示"放到 island-map 末尾 */
.unit-totals {
  margin-top: 18px; padding: 16px 20px;
  background: rgba(255,255,255,0.7); border: 1px solid var(--border);
  border-radius: 12px; display: flex; align-items: center; justify-content: space-between;
  font-size: 16px; font-weight: 600; color: var(--text-secondary);
}

/* ===========================================================
 * 节点卡（按 image#2 风格：圆角矩形 + 圆形 icon + 灰小字 + 标题 + 绿色横条 + 数字）
 * =========================================================== */
.stop-card {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  width: 200px; padding: 14px 14px 14px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(40,60,120,0.10);
  cursor: pointer; transition: 0.18s; font-family: inherit;
  text-align: center; color: inherit;
  position: relative;
}
.stop-card:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(40,60,120,0.16); }
.stop-card.is-locked { background: rgba(255,255,255,0.78); opacity: 0.65; cursor: not-allowed; }
.stop-card.is-locked:hover { transform: none; box-shadow: 0 8px 24px rgba(40,60,120,0.10); }
.stop-card.is-locked .stop-orb { filter: grayscale(0.7); }
.stop-card.is-complete .stop-orb { box-shadow: 0 8px 22px color-mix(in srgb, var(--orb-color, var(--book-7a)) 30%, transparent), 0 0 0 3px color-mix(in srgb, var(--orb-color, var(--book-7a)) 25%, white); }

/* 顶部圆形 icon（凸出卡片上方，浅蓝底） */
.stop-orb {
  width: 72px; height: 72px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background:
    radial-gradient(circle at 30% 28%, rgba(255,255,255,.98), rgba(255,255,255,.55) 38%, transparent 75%),
    linear-gradient(135deg,
      color-mix(in srgb, var(--orb-color, #4a90e2) 32%, white),
      color-mix(in srgb, var(--orb-color, #4a90e2) 14%, white));
  box-shadow:
    0 8px 22px color-mix(in srgb, var(--orb-color, #4a90e2) 36%, transparent),
    0 0 0 4px color-mix(in srgb, var(--orb-color, #4a90e2) 18%, white),
    inset 0 -3px 6px rgba(0,0,0,0.06);
  margin-top: -36px;
  transition: 0.25s;
  position: relative;
  border: 1px solid rgba(255,255,255,0.6);
}
.stop-orb::after {
  content: '';
  position: absolute; top: -8px; right: -8px; bottom: -8px; left: -8px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--orb-color, #4a90e2) 30%, transparent) 0%, transparent 70%);
  z-index: -1;
  animation: stopOrbPulse 3.2s ease-in-out infinite;
  pointer-events: none;
}
@keyframes stopOrbPulse {
  0%, 100% { transform: scale(1); opacity: .55; }
  50% { transform: scale(1.18); opacity: .9; }
}
.stop-orb-emoji { font-size: 36px; line-height: 1; filter: drop-shadow(0 3px 4px rgba(0,0,0,0.18)); }
.stop-orb-img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }

/* 信息列 */
.stop-info { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.stop-unit { font-size: 12px; color: var(--text-muted); font-weight: 600; letter-spacing: 0.5px; }
.stop-title { font-size: 15px; font-weight: 800; color: var(--text-primary); line-height: 1.35; max-width: 100%; word-break: break-word; padding: 0 4px; }

/* 绿色横条进度（按 image#2） */
.stop-bar {
  width: 100%; height: 4px; background: #e3e8f1;
  border-radius: 999px; overflow: hidden; margin-top: 6px;
}
.stop-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #27ae60 0%, #2ecc71 100%);
  border-radius: 999px; transition: width 0.5s ease;
  box-shadow: 0 0 6px rgba(39,174,96,0.4);
}
.stop-stat { font-size: 12px; color: var(--text-muted); font-weight: 600; }

/* ===========================================================
 * 单元下 4 个子任务卡（按 image#3 风格：4 张圆角卡显示在单元节点下方，锁定态带锁标）
 * =========================================================== */
.task-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-top: 12px;
  padding: 12px;
  background: color-mix(in srgb, var(--orb-color, #4a90e2) 4%, white);
  border: 1px dashed color-mix(in srgb, var(--orb-color, #4a90e2) 30%, white);
  border-radius: 14px;
  width: 380px;
  max-width: 100%;
}
.task-card {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px;
  background: #fff;
  border: 1.5px solid #e3e8f1;
  border-radius: 10px;
  cursor: pointer; font-family: inherit;
  transition: 0.18s; text-align: left; color: inherit;
  position: relative;
  min-height: 44px;
}
.task-card:hover { transform: translateY(-1px); box-shadow: 0 6px 14px rgba(40,60,120,0.10); border-color: color-mix(in srgb, var(--orb-color, #4a90e2) 45%, white); }
.task-card .task-no {
  flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800; color: #fff;
  background: color-mix(in srgb, var(--orb-color, #4a90e2) 90%, white);
}
.task-card .task-emoji { flex-shrink: 0; font-size: 20px; line-height: 1; }
.task-card .task-title { flex: 1; min-width: 0; font-size: 13px; font-weight: 700; color: var(--text-primary); line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-card .task-mark { flex-shrink: 0; font-size: 12px; font-weight: 700; }
.task-card .mk-done { color: #27ae60; font-size: 16px; }
.task-card .mk-locked { color: #95a3c2; font-size: 14px; }
.task-card .mk-new { color: var(--orb-color, #4a90e2); background: color-mix(in srgb, var(--orb-color, #4a90e2) 10%, white); padding: 2px 7px; border-radius: 999px; font-size: 11px; }
.task-card.is-done { background: linear-gradient(135deg, #e8f8f0 0%, #fff 60%); border-color: #27ae60; }
.task-card.is-done .task-no { background: #27ae60; }
.task-card.is-done .task-title { color: #1e8449; }
.task-card.is-done::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 3px; background: linear-gradient(90deg, #27ae60, #2ecc71); border-radius: 0 0 10px 10px; }
.task-card.is-locked { background: #f5f7fb; border-color: #dde2eb; cursor: not-allowed; opacity: 0.85; }
.task-card.is-locked:hover { transform: none; box-shadow: none; }
.task-card.is-locked .task-no { background: #95a3c2; }
.task-card.is-locked .task-title { color: #95a3c2; }
.task-card.is-available { border-color: color-mix(in srgb, var(--orb-color, #4a90e2) 35%, white); }
@media (max-width: 760px) {
  .task-cards { width: 100%; }
}

@media (max-width: 760px) {
  .journey-stop, .journey-stop.right { align-self: stretch; align-items: stretch; max-width: none; }
  .stop-card { width: 100%; }
  .journey-svg { display: none; }
}

/* ===========================================================
 * 货架（切换册别）·按 image#2 底部 8 张大色块卡
 * =========================================================== */
.bookshelf {
  max-width: 1120px; margin: 18px auto 24px; padding: 16px 18px;
  background: rgba(255,255,255,0.78); border: 1px solid var(--border);
  border-radius: 16px; box-shadow: var(--shadow-sm);
}
.bookshelf-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.bookshelf-tag { font-size: 18px; }
.bookshelf-tag-label {
  padding: 4px 14px; border-radius: 999px;
  background: var(--book-7a); color: #fff; font-weight: 800; font-size: 13px;
  letter-spacing: 1px; box-shadow: 0 4px 12px rgba(255,122,69,0.3);
}
.bookshelf-tip { font-size: 12px; color: var(--text-secondary); font-weight: 600; }
.bookshelf-tip b { color: var(--book-7a); font-weight: 800; }

.bookshelf-grid {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px;
}
.shelf-card {
  --c: var(--book-7a);
  --c-light: var(--book-7a-light);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  padding: 14px 6px 10px;
  background: var(--surface); border: 2px solid var(--c);
  border-radius: 14px; cursor: pointer; transition: 0.18s;
  font-family: inherit; color: inherit; text-align: center;
  min-height: 110px;
  -webkit-appearance: none; appearance: none;
  overflow: visible; line-height: normal;
  text-indent: 0;
}
.shelf-card:hover { transform: translateY(-3px); box-shadow: 0 12px 26px color-mix(in srgb, var(--c) 28%, transparent); }
.shelf-card.active {
  background: linear-gradient(180deg, var(--c) 0%, var(--c-light) 100%);
  border-color: var(--c);
  box-shadow: 0 14px 30px color-mix(in srgb, var(--c) 40%, transparent);
}
.shelf-card.active .shelf-name, .shelf-card.active .shelf-tag-row, .shelf-card.active .shelf-emoji { color: #fff; }
.shelf-card.draft:not(.active) { opacity: 0.7; filter: grayscale(0.4); }
/* 册别锁定（教师端控制）：灰显 + 悬停提示不可进入 */
.shelf-card.locked { opacity: 0.75; filter: grayscale(0.55); cursor: not-allowed; }
.shelf-card.locked:hover { transform: none; box-shadow: 0 8px 20px rgba(0,0,0,0.10); }
.shelf-lock { color: #b3392b; background: rgba(179,57,43,0.10); padding: 2px 10px; border-radius: 999px; font-weight: 800; }

.shelf-emoji { font-size: 30px; line-height: 1.2; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.1)); color: var(--c); transition: 0.18s; display: block; }
.shelf-name { font-size: 15px; font-weight: 800; color: var(--c); letter-spacing: 0.5px; transition: 0.18s; display: block; visibility: visible; }
.shelf-tag-row { font-size: 11px; font-weight: 700; color: var(--text-secondary); transition: 0.18s; display: block; visibility: visible; }
.shelf-now { color: #fff; background: rgba(255,255,255,0.25); padding: 2px 8px; border-radius: 999px; }
.shelf-pending { color: #47536e; }

/* 册色映射：与 data.js 的 theme 值对应 */
.shelf-card.shelf-orange  { --c: var(--book-7a);  --c-light: var(--book-7a-light);  }
.shelf-card.shelf-blue    { --c: var(--book-7b);  --c-light: var(--book-7b-light);  }
.shelf-card.shelf-purple  { --c: var(--book-2a);  --c-light: var(--book-2a-light);  }
.shelf-card.shelf-pink    { --c: var(--book-3a);  --c-light: var(--book-3a-light);  }
.shelf-card.shelf-teal    { --c: var(--book-4a);  --c-light: var(--book-4a-light);  }
.shelf-card.shelf-yellow  { --c: var(--book-5a);  --c-light: var(--book-5a-light);  }
.shelf-card.shelf-cyan    { --c: var(--book-6a);  --c-light: var(--book-6a-light);  }
.shelf-card.shelf-red     { --c: var(--book-8a);  --c-light: var(--book-8a-light);  }
.shelf-card.shelf-magenta { --c: var(--book-9a);  --c-light: var(--book-9a-light);  }

@media (max-width: 1120px) { .bookshelf-grid { grid-template-columns: repeat(6, 1fr); } }
@media (max-width: 760px)  { .bookshelf-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 480px)  { .bookshelf-grid { grid-template-columns: repeat(3, 1fr); } }

/* ===========================================================
 * 最终横向版：参照模板页，内容从左到右等距铺满
 * =========================================================== */
.map-page { width: 100%; max-width: none; }
.island-topbar { width: 100%; }
.island-map { min-height: 330px; display: flex; align-items: center; }
.journey-stops {
  position: relative;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(18px, calc(var(--vwpx, 1vw) * 3), 52px);
  align-items: center;
  padding: 58px clamp(8px, calc(var(--vwpx, 1vw) * 2), 32px) 30px;
}
.journey-svg { display: none; }
.journey-stop:not(:last-child)::after {
  top: 34px;
  left: calc(50% + 38px);
  width: calc(100% + clamp(18px, calc(var(--vwpx, 1vw) * 3), 52px) - 76px);
  border-top: 4px dashed rgba(255, 122, 69, 0.55);
}
.stop-card {
  width: min(100%, 300px);
  min-height: 205px;
  padding: 15px 22px 18px;
  border: 2px solid rgba(30, 50, 90, 0.10);
  box-shadow: 0 10px 28px rgba(30, 50, 90, 0.11);
}
.stop-title { font-size: clamp(16px, calc(var(--vwpx, 1vw) * 1.45), 22px); white-space: nowrap; }
.stop-unit { font-size: 14px; }
.stop-stat { font-size: 14px; }
.stop-bar { height: 8px; }
.bookshelf { margin-top: 10px; }
.bookshelf-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.shelf-card { min-height: 86px; padding: 10px 8px 9px; }
.shelf-emoji { font-size: 24px; }
.shelf-name { font-size: 15px; }
.shelf-tag-row { font-size: 12px; }
@media (max-width: 900px) {
  .journey-stops { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .journey-stop:not(:last-child)::after { display: none; }
}
@media (max-width: 560px) {
  .journey-stops { grid-template-columns: 1fr; }
  .bookshelf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stop-title { white-space: normal; }
}

/* 老版 stop-card 内部元素（旧版未用到但保留避免影响其他场景） */
.stop-card-icon { display: none; }
.stop-card-body { display: none; }
.stop-card-foot { display: none; }
.stop-card-state { display: none; }

/* ===========================================================
 * 学习地图横向全屏布局：四个单元从左到右整齐铺开
 * =========================================================== */
.island-map {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 8px clamp(10px, calc(var(--vwpx, 1vw) * 2.4), 36px) 18px;
}
.journey-stops {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
  gap: clamp(14px, calc(var(--vwpx, 1vw) * 2.2), 34px);
  padding: 42px clamp(4px, calc(var(--vwpx, 1vw) * 1), 16px) 18px;
}
.journey-stop,
.journey-stop.left,
.journey-stop.right {
  width: 100%;
  max-width: none;
  align-self: start;
  align-items: center;
  text-align: center;
  gap: 0;
  position: relative;
}
.journey-stop:not(:last-child)::after {
  content: '';
  position: absolute;
  z-index: -1;
  top: 32px;
  left: calc(50% + 42px);
  width: calc(100% + clamp(14px, calc(var(--vwpx, 1vw) * 2.2), 34px) - 84px);
  border-top: 3px dashed rgba(255, 122, 69, 0.58);
}
.stop-card {
  width: min(100%, 280px);
  min-height: 194px;
  padding: 14px 18px 16px;
  border-radius: 20px;
}
.stop-orb { width: 70px; height: 70px; }
.stop-orb-emoji { font-size: 36px; }
.stop-title { font-size: clamp(15px, calc(var(--vwpx, 1vw) * 1.35), 21px); }
.stop-unit { font-size: clamp(12px, calc(var(--vwpx, 1vw) * 1), 15px); }
.stop-stat { font-size: clamp(12px, calc(var(--vwpx, 1vw) * 1), 14px); }
.stop-bar { height: 7px; margin-top: 9px; }

/* 底部册别：贴住页面底部（flex 布局 + margin-top:auto 推到底） */
.bookshelf {
  width: 100%;
  max-width: none;
  margin: 0 0;
  margin-top: auto;
}

@media (max-width: 900px) {
  .journey-stops { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .journey-stop:not(:last-child)::after { display: none; }
}
@media (max-width: 560px) {
  .journey-stops { grid-template-columns: 1fr; padding-top: 24px; }
  .stop-card { width: min(100%, 360px); }
}

/* ===== 16 班选班网格（4×4） ===== */
.book-grid.class-grid-16 {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
  max-width: 1100px;
}
.book-card.class-card-16 {
  width: auto;
  height: auto;
  min-height: 108px;
  padding: 12px 4px 10px;
  border-radius: 14px;
  background: linear-gradient(155deg, #FFF8E6 0%, #FFEEC4 55%, #FFE2A6 100%);
  color: #7A4A12;                 /* 阳光卡：暖棕文字（覆盖 .book-card 默认白色） */
  border: 1.5px solid #FFE3AC;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.book-card.class-card-16::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #FFC93C, #FF9A3C);
  opacity: 0;
  transition: opacity 0.18s ease;
}
.book-card.class-card-16:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 22px -8px rgba(255,150,50,0.45);
  border-color: #FFA53E;
}
.book-card.class-card-16:hover::before { opacity: 1; }
.book-card.class-card-16 .book-emoji {
  font-size: 20px;
  filter: drop-shadow(0 1px 2px rgba(180,90,0,0.25));
}
.book-card.class-card-16 .book-name {
  font-size: 17px;
  font-weight: 800;
  color: #7A4A12;
  letter-spacing: 0.5px;
  line-height: 1.1;
  margin-top: 2px;
}
.book-card.class-card-16 .book-tag {
  font-size: 10.5px;
  color: #B07A35;
  font-weight: 600;
  line-height: 1.2;
}
.book-card.class-card-16.selected {
  border-color: #FFA53E;
  background: linear-gradient(155deg, #FFD86E 0%, #FFB43D 55%, #FF9628 100%);
  box-shadow: 0 0 0 3px rgba(255, 160, 60, 0.35), 0 12px 24px -10px rgba(255,140,20,0.55);
}
.book-card.class-card-16.selected::before { opacity: 1; }
.book-card.class-card-16.selected .book-name { color: #ffffff; text-shadow: 0 1px 3px rgba(170,80,0,0.45); }
.book-card.class-card-16.selected .book-tag { color: #fff; background: rgba(255,255,255,0.25); border-radius: 999px; padding: 1px 8px; }

/* ===== 课堂锁定遮罩 ===== */
.class-lock-overlay {
  position: fixed;
  top: 0; right: 0; bottom: 0; left: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(10, 14, 26, 0.78);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.class-lock-card {
  background: #fff;
  border-radius: 24px;
  padding: 36px 44px 32px;
  text-align: center;
  max-width: 520px;
  width: 92%;
  box-shadow: 0 20px 60px rgba(0,0,0,0.30);
}
.class-lock-icon {
  font-size: 64px;
  margin-bottom: 16px;
  animation: lockPulse 2s ease-in-out infinite;
  filter: drop-shadow(0 4px 12px rgba(255,170,80,0.4));
}
@keyframes lockPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.08); opacity: 0.85; }
}
.class-lock-title {
  font-size: 26px;
  font-weight: 800;
  color: #1a1a2e;
  margin-bottom: 12px;
  letter-spacing: 1px;
}
.class-lock-msg {
  font-size: 15px;
  color: #555;
  line-height: 1.7;
  margin-bottom: 18px;
}
/* 调试状态 */
.lock-status {
  background: #f6f8fc;
  border: 1px solid #e2e8f2;
  border-radius: 12px;
  padding: 12px 16px;
  margin-bottom: 20px;
  font-size: 13px;
  color: #5a6577;
  text-align: left;
  line-height: 1.8;
}
.lock-status b { color: #1a2342; font-weight: 700; }
/* 按钮组 */
.lock-btns {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
}
.class-lock-btn {
  padding: 12px 26px;
  border: none;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.15s ease;
  font-family: inherit;
}
.class-lock-btn.primary {
  background: linear-gradient(135deg, #ff7a45, #ff9a6c);
  color: #fff;
  box-shadow: 0 6px 18px rgba(255,122,69,0.32);
}
.class-lock-btn.primary:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(255,122,69,0.42); }
.class-lock-btn.primary:active { transform: translateY(0); }
.class-lock-btn.ghost {
  background: #fff;
  color: #5a6577;
  border: 1.5px solid #e2e8f2;
}
.class-lock-btn.ghost:hover { border-color: var(--book-7a); color: var(--book-7a); background: #fff7f0; }

/* ===== 复习模式横幅（课堂未开始时放行已完成任务的复习） ===== */
.review-strip {
  position: sticky;
  top: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  background: linear-gradient(135deg, #eef4ff, #f4f0ff);
  border: 1px solid #d4e0f7;
  border-radius: 14px;
  padding: 12px 18px;
  margin: 0 0 18px;
  box-shadow: 0 2px 10px rgba(59, 92, 158, 0.10);
}
.review-strip .rs-icon { font-size: 22px; line-height: 1; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.12)); }
.review-strip .rs-text {
  flex: 1;
  min-width: 260px;
  font-size: 14px;
  color: #3d4a66;
  line-height: 1.6;
}
.review-strip .rs-text b { color: #1e40af; }
.review-strip .rs-btn {
  padding: 8px 16px;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  background: linear-gradient(135deg, #4a6cf7, #6a8dff);
  color: #fff;
  box-shadow: 0 4px 12px rgba(74, 108, 247, 0.28);
  transition: all 0.15s ease;
}
.review-strip .rs-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(74, 108, 247, 0.38); }
.review-strip .rs-btn.ghost {
  background: #fff;
  color: #5a6577;
  border: 1.5px solid #e2e8f2;
  box-shadow: none;
}
.review-strip .rs-btn.ghost:hover { border-color: #4a6cf7; color: #4a6cf7; }
/* 播放器内复习横幅：置顶吸附在课件上方，紫蓝基调区分"学习/复习" */
.player-review-strip {
  background: linear-gradient(135deg, #f0f4ff, #efe9ff);
  border-color: #d9d2f7;
  margin-bottom: 14px;
}
.player-review-strip .rs-text b { color: #6d4aff; }
/* 播放器内预习横幅：青绿基调区分"预习/复习/学习" */
.player-preview-strip {
  background: linear-gradient(135deg, #e8faf5, #e6f7ff);
  border-color: #b8e6d8;
}
.player-preview-strip .rs-text b { color: #16a085; }

/* ===== 教师端课堂控制条（标准版式 start-row 规格） ===== */
body.is-teacher .teacher-class-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 24px;
  padding: 14px 18px;
  margin-bottom: 16px;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
body.is-teacher .teacher-class-bar select {
  padding: 8px 36px 8px 14px;
  border-radius: 16px;
  background: #ffffff;
  color: #2d3748;
  border: 1px solid #e2e8f0;
  font-size: 14px;
  font-weight: 600;
}
body.is-teacher .teacher-class-btn {
  padding: 12px 28px;
  border: none;
  border-radius: 999px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}
body.is-teacher .teacher-class-btn.start {
  background: linear-gradient(135deg, #2563eb, #3b82f6);
  color: #fff;
  box-shadow: 0 4px 20px rgba(37,99,235,.25);
}
.teacher-class-btn.start:hover { background: linear-gradient(135deg, #2563eb, #60a5fa); }
.teacher-class-btn.end {
  background: #e74c3c;
  color: #fff;
}
.teacher-class-btn.end:hover { background: #c0392b; }
body.is-teacher .teacher-class-btn.attend {
  background: #ffffff;
  color: #2563eb;
  border: 2px solid #3b82f6;
  box-shadow: 0 2px 8px rgba(59,130,246,.15);
}
body.is-teacher .teacher-class-btn.attend:hover { background: #eff6ff; }
.teacher-class-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.teacher-class-status {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--txt2, #8899aa);
}
.teacher-class-status .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.teacher-class-status .dot.on { background: #27ae60; box-shadow: 0 0 6px #27ae60; }
.teacher-class-status .dot.off { background: #555; }

/* 课中实况课程选择：三级目录下拉（书→单元→课时） */
body.is-teacher .dd-wrap { position: relative; display: inline-block; }
body.is-teacher .dd-wrap.disabled { opacity: .55; }
body.is-teacher .dd-btn {
  display: inline-flex; align-items: center; gap: 8px;
  min-width: 280px; max-width: 520px;
  padding: 8px 14px;
  border-radius: 16px;
  background: #ffffff;
  color: #2d3748;
  border: 1px solid #e2e8f0;
  font-size: 14px; font-weight: 600;
  cursor: pointer; text-align: left; font-family: inherit; line-height: 1.5;
}
body.is-teacher .dd-btn:hover { border-color: #cbd5e1; }
body.is-teacher .dd-btn.open { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.15); }
body.is-teacher .dd-btn:disabled { cursor: not-allowed; }
body.is-teacher .dd-btn-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.is-teacher .dd-btn-txt.ph { color: #a0aec0; font-weight: 500; }
body.is-teacher .dd-caret { color: #718096; font-size: 12px; flex: none; }
body.is-teacher .dd-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 998; background: transparent; }
body.is-teacher .dd-panel {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 999;
  width: 400px; max-width: 86vw;
  background: #ffffff; border: 1px solid #e2e8f0; border-radius: 16px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .18);
  overflow: hidden;
}
body.is-teacher .dd-head {
  padding: 10px 14px; font-size: 12px; font-weight: 700; color: #8899aa;
  background: #f7fafc; border-bottom: 1px solid #eef2f7;
}
body.is-teacher .dd-scroll { max-height: 400px; overflow-y: auto; padding: 6px; }
body.is-teacher .dd-row {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; border-radius: 10px;
  font-size: 14px; color: #2d3748; cursor: pointer;
}
body.is-teacher .dd-row:hover { background: #f0f7ff; }
body.is-teacher .dd-book { font-weight: 700; }
body.is-teacher .dd-book.open { color: #1d4ed8; }
body.is-teacher .dd-book.open .dd-tw { color: #2563eb; }
body.is-teacher .dd-unit { padding-left: 26px; font-weight: 600; font-size: 13.5px; color: #41526b; }
body.is-teacher .dd-lessons { padding-left: 44px; }
body.is-teacher .dd-lesson { font-weight: 500; font-size: 13.5px; color: #41526b; padding: 7px 10px; }
body.is-teacher .dd-lesson:hover { background: #eff6ff; color: #2d3748; }
body.is-teacher .dd-lesson.cur { background: #eff6ff; color: #1d4ed8; font-weight: 700; }
body.is-teacher .dd-tw { width: 12px; text-align: center; color: #b0bec5; font-size: 11px; flex: none; }
body.is-teacher .dd-ic { flex: none; }
body.is-teacher .dd-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.is-teacher .dd-n { flex: none; font-size: 11px; color: #a0aec0; background: #f1f5f9; border-radius: 999px; padding: 2px 8px; white-space: nowrap; }
body.is-teacher .dd-dot { flex: none; width: 6px; height: 6px; border-radius: 50%; background: #60a5fa; }
body.is-teacher .dd-check { flex: none; font-size: 11px; font-weight: 700; color: #2563eb; white-space: nowrap; }

@media (max-width: 1100px) {
  .book-grid.class-grid-16 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .book-grid.class-grid-16 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ===========================================================
 * 引领式学习引擎 v1 —— 交互页样式
 * =========================================================== */

/* —— 顶部任务进度条 —— */
.guide-bar {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 14px; padding: 10px 16px; margin-bottom: 14px;
  box-shadow: var(--shadow-sm);
}
.guide-step { font-size: 13.5px; font-weight: 700; color: var(--text-primary); white-space: nowrap; }
.guide-dots { display: flex; align-items: center; gap: 5px; flex: 1; flex-wrap: wrap; }
.gdot {
  width: 11px; height: 11px; border-radius: 50%;
  background: var(--surface-2); border: 2px solid var(--border-strong);
  cursor: pointer; transition: all .18s ease;
}
.gdot.work { border-color: var(--book-7a); background: #fff; }
.gdot.done { background: var(--green); border-color: var(--green); }
.gdot.cur  { transform: scale(1.45); box-shadow: 0 0 0 3px rgba(255,122,69,.22); border-color: var(--book-7a); }
.gdot.lock { opacity: .38; cursor: not-allowed; }
.guide-score {
  font-size: 12.5px; font-weight: 700; color: #fff;
  background: var(--grad-orange); padding: 3px 12px; border-radius: 999px; white-space: nowrap;
}

/* —— 题面卡（醒目大题卡） —— */
.q-card {
  background: linear-gradient(135deg, #fff6ef 0%, #ffffff 62%);
  border: 1.5px solid #ffddc6;
  border-left: 6px solid var(--book-7a); border-radius: 16px;
  padding: 16px 24px; margin-top: 12px;
  box-shadow: 0 6px 18px rgba(255,122,69,.10);
}
.q-text { font-size: 19px; line-height: 1.65; color: #1d2945; font-weight: 700; white-space: pre-line; }

/* —— 选项（大卡片版） —— */
.q-opts { display: flex; flex-direction: column; gap: 13px; margin-top: 18px; }
.q-opt.big {
  display: flex; align-items: center; gap: 16px; text-align: left;
  padding: 15px 22px; font-size: 17.5px; line-height: 1.5;
  font-weight: 600; color: var(--text-primary);
  background: var(--surface); border: 1.5px solid var(--border);
  border-radius: 14px; box-shadow: 0 2px 8px rgba(30,50,90,.06);
}
.qo-key {
  flex: 0 0 42px; height: 42px; border-radius: 50%;
  background: var(--surface-2); border: 2px solid var(--border-strong);
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 18px; color: var(--text-secondary);
  transition: all 0.15s;
}
.q-opt:hover .qo-key { background: var(--book-7a); border-color: var(--book-7a); color: #fff; }
.q-opt:hover { transform: translateX(3px); border-color: var(--book-7a); }
.qo-text { flex: 1; }
.q-opt.right { border-color: var(--green); background: rgba(39,174,96,0.10); color: #1e8449; font-weight: 600; }
.q-opt.wrong { border-color: var(--red); background: rgba(231,76,60,0.10); color: #c0392b; animation: qShake 0.4s ease-in-out; }
.q-opt.right .qo-key { background: var(--green); border-color: var(--green); color: #fff; }
.q-opt.wrong .qo-key { background: var(--red); border-color: var(--red); color: #fff; }
@keyframes qShake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-4px); }
  40%, 80% { transform: translateX(4px); }
}

/* —— 即时反馈条（放大醒目） —— */
.fb {
  margin-top: 16px; padding: 14px 20px; border-radius: 14px;
  font-size: 16px; line-height: 1.6; border: 1.5px solid transparent;
  font-weight: 500;
}
.fb b { font-size: 17px; }
.fb.ok { background: rgba(39,174,96,.10); border-color: rgba(39,174,96,.34); color: #1e8449; }
.fb.no { background: rgba(231,76,60,.09); border-color: rgba(231,76,60,.32); color: #c0392b; }
.fb.no-tries { background: linear-gradient(135deg, rgba(245,166,35,.10), rgba(245,166,35,.05)); border-color: rgba(245,166,35,.40); color: #8a5500; }
.fb .ex, .fb .hint { margin-top: 8px; font-size: 15.5px; font-weight: 400; line-height: 1.65; }
.fb-ex { margin-top: 6px; font-size: 14px; color: var(--text-secondary); font-weight: 400; }

/* —— 操作行 —— */
.act-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.panel-btn.ghost { background: transparent; border-style: dashed; color: var(--text-secondary); }
.panel-btn.ghost:hover:not(:disabled) { border-color: var(--text-secondary); color: var(--text-primary); }

/* —— 排序题（拖拽 + 一键移位） —— */
.sort-hint { background: #fff7e6; border: 1px solid #ffe2ad; border-left: 4px solid #f5a623; border-radius: 12px; padding: 10px 16px; font-size: 14px; font-weight: 600; color: #8a5a00; margin: 10px 0 8px; }
.sort-list { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; min-height: 60px; }
.sort-row {
  display: flex; align-items: center; gap: 12px;
  background: var(--surface); border: 1.5px solid var(--border);
  border-radius: 14px; padding: 12px 16px;
  box-shadow: 0 2px 8px rgba(30,50,90,.06); transition: all .18s ease;
}
.sort-row:hover { border-color: var(--book-7a); box-shadow: 0 4px 12px rgba(255,122,69,0.12); }
/* 输错序号的行：红色高亮 */
.sort-row-bad { border-color: var(--red); background: rgba(231,76,60,0.06); }
/* 答对锁定状态 */
.sort-row-locked { cursor: default; opacity: 0.92; }
.sort-row-locked:hover { transform: none; border-color: var(--green); box-shadow: none; }
/* 输入序号控件 */
.sort-input-wrap { flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; }
.sort-input-label { font-size: 13px; color: var(--text-secondary); font-weight: 600; }
.sort-input {
  width: 64px; height: 38px; text-align: center;
  border: 2px solid var(--border-strong); border-radius: 10px;
  font-size: 17px; font-weight: 800; color: var(--text-primary);
  background: var(--surface-2); outline: none;
  font-family: inherit; transition: all .15s ease;
}
.sort-input:focus { border-color: var(--book-7a); box-shadow: 0 0 0 3px rgba(255,122,69,0.15); background: #fff; }
.sort-correct-tag {
  flex-shrink: 0; font-size: 12px; font-weight: 700; color: #e23a3a;
  background: rgba(231,76,60,0.10); border-radius: 999px; padding: 4px 12px; white-space: nowrap;
}
.sort-grip {
  flex: 0 0 22px; color: #c0c8d4; font-size: 18px; line-height: 1; cursor: grab; user-select: none;
  letter-spacing: -2px;
}
.sort-no {
  flex: 0 0 32px; height: 32px; border-radius: 10px;
  background: var(--grad-orange); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 15px;
  box-shadow: 0 2px 6px rgba(255,122,69,0.25);
}
.sort-txt { flex: 1; font-size: 16px; line-height: 1.55; font-weight: 600; color: var(--text-primary); }
.sort-btns { display: flex; gap: 4px; }
.sort-mv {
  width: 30px; height: 30px; border-radius: 8px; cursor: pointer;
  border: 1px solid var(--border-strong); background: var(--surface-2);
  color: var(--text-secondary); font-size: 13px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
  transition: all .15s ease;
}
.sort-mv:hover:not(:disabled) { border-color: var(--book-7a); color: #fff; background: var(--book-7a); transform: translateY(-1px); }
.sort-mv:disabled { opacity: .25; cursor: not-allowed; }
.sort-locked-tag { font-size: 12px; color: #27ae60; background: rgba(39,174,96,0.10); border: 1px solid rgba(39,174,96,0.30); border-radius: 999px; padding: 4px 12px; font-weight: 600; }
/* 拖拽中的行 */
.sort-row.sort-dragging { opacity: 0.45; transform: scale(0.98); }
/* 拖拽悬停目标行 */
.sort-row.sort-drop-over { border-color: var(--book-7a); background: rgba(255,122,69,0.08); transform: translateY(2px); }
/* 拖拽手柄 hover 提示 */
.sort-row:not(.sort-row-locked):hover .sort-grip { color: var(--book-7a); cursor: grab; }
.sort-row:not(.sort-row-locked):active .sort-grip { cursor: grabbing; }

/* —— 时间轴 —— */
.tl-list { display: flex; flex-direction: column; gap: 9px; margin-top: 12px; }
.tl-row {
  display: flex; align-items: center; gap: 12px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 12px; padding: 11px 14px;
  box-shadow: var(--shadow-sm); transition: all .18s ease;
}
.tl-row:hover { border-color: var(--book-7a); }
.tl-row.bad { border-color: var(--red); background: rgba(231,76,60,.06); }
.tl-no {
  flex: 0 0 26px; height: 26px; border-radius: 50%;
  background: var(--surface-2); border: 1px solid var(--border-strong);
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 13px; color: var(--text-secondary);
}
.tl-txt { flex: 1; font-size: 16px; line-height: 1.55; color: var(--text-primary); font-weight: 600; }
.tl-year {
  font-size: 14px; font-weight: 800; color: var(--book-7a);
  background: rgba(255,122,69,.10); padding: 4px 13px; border-radius: 999px; white-space: nowrap;
}

/* —— 配对题（左右同行对齐） —— */
.match-wrap { display: flex; flex-direction: column; gap: 11px; margin-top: 14px; }
.match-row { display: grid; grid-template-columns: minmax(150px, 0.55fr) 1fr; gap: 14px; align-items: stretch; }
.match-item {
  background: var(--surface); border: 1.5px solid var(--border);
  border-radius: 14px; padding: 14px 18px; cursor: pointer;
  font-size: 16px; line-height: 1.55; font-weight: 600; color: var(--text-primary);
  transition: all .16s ease; box-shadow: 0 2px 8px rgba(30,50,90,.06);
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  min-height: 60px;
}
.match-item:hover { border-color: var(--book-7a); transform: translateY(-1px); }
.match-item.l.sel  { border-color: var(--book-7a); background: rgba(255,122,69,.10); box-shadow: 0 0 0 3px rgba(255,122,69,.16); }
.match-item.l.done { border-color: var(--green); background: rgba(39,174,96,.09); opacity: .78; cursor: default; }
.match-item.l.wrong{ border-color: var(--red); background: rgba(231,76,60,.10); animation: shake .4s; }
.match-item.r.used { border-color: var(--green); background: rgba(39,174,96,.09); opacity: .78; cursor: default; }
.mi-tag { font-size: 11.5px; font-weight: 700; color: var(--green); white-space: nowrap; }
@keyframes shake {
  0%,100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}

/* ============================================================
 * 连连看配对棋盘（原版式 mp-board 1:1）
 * 指令条 + 双列彩卡 + SVG 贝塞尔连线；弹窗/课件内页各有一套尺寸覆盖
 * ============================================================ */
.mp-root { display: flex; flex-direction: column; gap: 14px; min-height: 0; }
/* —— 指令条：图标 + 主指令 + 灰色操作说明 —— */
.mp-instr {
  flex: none; display: flex; align-items: center; gap: 13px;
  background: #fff; border: 1px solid #e6e9f2; border-radius: 16px;
  padding: 13px 20px; box-shadow: 0 4px 14px rgba(30,50,90,.06);
}
.mp-instr-ico {
  flex: none; width: 42px; height: 42px; border-radius: 12px;
  background: linear-gradient(135deg, #fff0e6, #ffe0cc);
  display: flex; align-items: center; justify-content: center; font-size: 22px;
}
.mp-instr-lines { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mp-instr-t { font-size: 17px; font-weight: 800; color: #1f2738; line-height: 1.4; white-space: pre-line; }
.mp-instr-sub { font-size: 13px; font-weight: 600; color: #98a2b8; line-height: 1.35; }
/* —— 棋盘底板 —— */
.mp-board {
  position: relative; flex: 1 1 auto; min-height: 240px;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 48px; padding: 20px 28px;
  background: #fff; border: 1px solid #e6e9f2; border-radius: 20px;
  box-shadow: 0 8px 24px rgba(30,50,90,.07);
}
/* top/right/bottom/left 显式兜底：360极速旧内核(Chromium<87) 不识别 inset:0 */
.mp-lines { position: absolute; top: 0; left: 0; right: 0; bottom: 0; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; overflow: visible; }
.mp-lines path { opacity: .92; animation: mpLineIn .45s ease; }
@keyframes mpLineIn { from { opacity: 0; } to { opacity: .92; } }
/* —— 左右两列 —— */
.mp-col { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.mp-col-head {
  flex: none; text-align: center; padding: 2px 0 2px;
  font-size: 15px; font-weight: 800; color: #64748b; letter-spacing: 1px;
}
/* —— 卡片 —— */
.mp-card {
  display: flex; align-items: center; gap: 13px;
  min-height: 64px; padding: 14px 18px;
  background: #fff; border: 2.5px solid #e2e8f0; border-radius: 16px;
  font-size: 17px; font-weight: 700; color: #1f2738; line-height: 1.4;
  box-shadow: 0 2px 8px rgba(30,50,90,.05);
  cursor: pointer; -webkit-user-select: none; user-select: none;
  transition: border-color .16s ease, background .16s ease, transform .16s ease, box-shadow .16s ease;
}
.mp-card:hover { border-color: #ff8a5c; transform: translateY(-2px); box-shadow: 0 6px 16px rgba(255,107,53,.14); }
.mp-card.sel { border-color: #ff6b35; background: #fff1e6; box-shadow: 0 0 0 4px rgba(255,107,53,.15); transform: translateY(-2px); }
.mp-card.done { cursor: default; }
.mp-card.done:hover { transform: none; box-shadow: 0 2px 8px rgba(30,50,90,.05); }
.mp-card.wrong { border-color: #ef4444; background: #fef2f2; animation: mpShake .4s ease; }
@keyframes mpShake {
  0%,100% { transform: translateX(0); }
  25% { transform: translateX(-6px); }
  75% { transform: translateX(6px); }
}
.mp-card-icon { flex: none; font-size: 26px; line-height: 1; }
.mp-card-no {
  flex: none; width: 30px; height: 30px; border-radius: 50%;
  background: #f1f5f9; color: #64748b;
  font-size: 15px; font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center;
}
.mp-card.done .mp-card-no { background: rgba(0,0,0,.07); color: #475569; }
.mp-card-text { flex: 1; min-width: 0; }
.mp-check {
  flex: none; width: 30px; height: 30px; border-radius: 50%;
  background: #34c77a; color: #fff; font-size: 16px; font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center;
}
/* —— 答错气泡 —— */
.mp-bubble {
  position: absolute; left: 50%; bottom: 16px; z-index: 6;
  transform: translateX(-50%); white-space: nowrap; pointer-events: none;
  background: #fff1f2; color: #dc2626; border: 1px solid #fecdd3;
  padding: 10px 22px; border-radius: 14px; font-size: 15px; font-weight: 700;
  box-shadow: 0 8px 24px rgba(220,38,38,.15);
  animation: mpBubbleIn .25s ease;
}
@keyframes mpBubbleIn {
  from { opacity: 0; transform: translateX(-50%) translateY(8px); }
  to { opacity: 1; transform: translateX(-50%) translateY(0); }
}
/* —— 棋盘下方持久「答案提示」条（配对失败后出现，一直留到配对正确） —— */
.mp-tip {
  flex: none; display: flex; align-items: center;
  margin: 4px 2px 0; padding: 10px 20px;
  border-radius: 13px; font-size: 15px; font-weight: 700; line-height: 1.45;
  animation: mpTipIn .22s ease;
}
.mp-tip.warn { background: #fff7e6; color: #b45309; border: 1px solid #fde7b3; }
.mp-tip.ans  { background: #eff6ff; color: #1d4ed8; border: 1px solid #bfdbfe; }
@keyframes mpTipIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
/* —— 揭晓答案：右侧目标卡呼吸光圈（颜色由内联 style 注入） —— */
.mp-card.rv { cursor: pointer; animation: mpRvPulse 1.15s ease-in-out infinite; }
@keyframes mpRvPulse {
  0%, 100% { transform: translateY(-1px); filter: brightness(1); }
  50% { transform: translateY(-3px); filter: brightness(1.05); }
}
/* —— 8 组等大配对页：自动紧凑 —— */
.mp-many { gap: 30px; padding: 14px 20px; }
.mp-many .mp-col { gap: 8px; }
.mp-many .mp-card { min-height: 46px; padding: 8px 14px; font-size: 14.5px; border-radius: 12px; }
.mp-many .mp-col-head { font-size: 13px; padding-bottom: 0; }
.mp-many .mp-card-icon { font-size: 20px; }
.mp-many .mp-card-no, .mp-many .mp-check { width: 24px; height: 24px; font-size: 12.5px; }

/* —— 开放作答 —— */
.write-q {
  margin-top: 14px; font-size: 17px; font-weight: 700;
  color: #1d2945; line-height: 1.7;
  background: linear-gradient(135deg, #fff6ef 0%, #ffffff 62%);
  border: 1.5px solid #ffddc6; border-left: 6px solid var(--book-7a);
  border-radius: 16px; padding: 15px 22px;
  box-shadow: 0 6px 18px rgba(255,122,69,.10);
}
.write-area {
  width: 100%; margin-top: 12px; box-sizing: border-box;
  border: 1px solid var(--border-strong); border-radius: 12px;
  padding: 14px 16px; font-size: 15px; line-height: 1.8;
  font-family: inherit; color: var(--text-primary);
  background: var(--surface); resize: vertical; outline: none;
  transition: border-color .16s ease;
}
.write-area:focus { border-color: var(--book-7a); box-shadow: 0 0 0 3px rgba(255,122,69,.14); }
.write-area:disabled { background: var(--surface-2); color: var(--text-secondary); }
.write-count { font-size: 12.5px; color: var(--text-muted); font-weight: 600; }

/* —— 动手打卡 / 辨析勾选（大卡片） —— */
.check-list { display: flex; flex-direction: column; gap: 11px; margin-top: 16px; }
.check-item {
  display: flex; align-items: center; gap: 15px; cursor: pointer;
  background: var(--surface); border: 1.5px solid var(--border);
  border-radius: 14px; padding: 14px 20px;
  transition: all .16s ease; box-shadow: 0 2px 8px rgba(30,50,90,.06);
}
.check-item:hover { border-color: var(--book-7a); transform: translateY(-2px); box-shadow: 0 6px 16px rgba(255,122,69,.13); }
.check-item.on { border-color: var(--green); background: rgba(39,174,96,.08); box-shadow: 0 4px 12px rgba(39,174,96,.13); }
.ck-box {
  flex: 0 0 28px; height: 28px; border-radius: 9px;
  border: 2.5px solid var(--border-strong); background: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 17px; font-weight: 900; color: #fff; transition: all .16s ease;
}
.check-item.on .ck-box { background: var(--green); border-color: var(--green); box-shadow: 0 2px 8px rgba(39,174,96,.35); }
.ck-txt { flex: 1; font-size: 16.5px; line-height: 1.5; font-weight: 600; color: var(--text-primary); }
.check-item.on .ck-txt { color: #1e8449; }
.ck-tip {
  font-size: 14px; color: #8a5a00; font-weight: 700;
  background: #fff7e6; border: 1px solid #ffe2ad;
  border-radius: 999px; padding: 8px 20px;
}

/* —— 随堂练习（多题） —— */
.qz-prog {
  display: inline-block; margin-top: 10px; font-size: 14px; font-weight: 800;
  color: #fff; background: var(--grad-orange); padding: 6px 18px; border-radius: 999px;
  box-shadow: 0 3px 10px rgba(255,122,69,.30); letter-spacing: .5px;
}
.qz-result { margin-top: 18px; }
.qz-review {
  margin-top: 12px; background: var(--surface-2); border: 1px solid var(--border);
  border-radius: 14px; padding: 13px 18px;
}
.qz-rq { font-size: 15.5px; font-weight: 700; color: var(--text-primary); line-height: 1.6; }
.qz-ra { margin-top: 6px; font-size: 14.5px; font-weight: 600; }
.qz-ra.ok { color: var(--green); }
.qz-ra.no { color: var(--red); }
.qz-ex { margin-top: 4px; font-size: 14px; font-weight: 400; color: var(--text-secondary); line-height: 1.65; }

/* —— check 辨析勾选：错勾项标红抖动 —— */
.check-item.bad { border-color: var(--red); background: rgba(231,76,60,.07); animation: qShake 0.4s ease-in-out; }

/* ===========================================================
 * 新版课件页型（U1T1 蓝图课件 · 2026-09）
 * =========================================================== */
/* —— 双栏图文（twocol）—— */
.twocol-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 32px; align-items: center; min-height: 340px; }
.twocol-grid.only { grid-template-columns: 1fr; }
.twocol-img { min-width: 0; }
.twocol-img img {
  width: 100%; max-height: 380px; object-fit: contain;
  border-radius: 18px; box-shadow: 0 16px 40px rgba(30,50,90,0.16);
  border: 1px solid var(--border); background: #FBFDFF;
}
.twocol-txt { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.twocol-lead {
  font-size: 17.5px; line-height: 1.7; font-weight: 600; color: var(--text-primary);
  background: var(--surface-2); border-left: 4px solid var(--book-7a);
  border-radius: 12px; padding: 14px 18px;
}
.twocol-points { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.twocol-points li {
  position: relative; padding: 11px 14px 11px 48px;
  background: var(--surface); border: 1px solid var(--border); border-radius: 12px;
  font-size: 15px; line-height: 1.65; color: var(--text-primary);
  box-shadow: var(--shadow-sm); transition: all .16s ease;
}
.twocol-points li:hover { border-color: var(--book-7a); transform: translateX(3px); }
.twocol-points li::before {
  content: ''; position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  width: 24px; height: 24px; border-radius: 50%;
  background: linear-gradient(135deg, #ff8a3d, #ff6b35);
  box-shadow: 0 2px 8px rgba(255,107,53,.35);
}
.twocol-points li::after {
  content: '▸'; position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  width: 24px; text-align: center; line-height: 24px;
  color: #fff; font-weight: 900; font-size: 13px;
}
.twocol-tip {
  font-size: 13.5px; font-weight: 600; color: #8a5500;
  background: linear-gradient(135deg, rgba(245,166,35,.12), rgba(245,166,35,.05));
  border: 1px dashed rgba(245,166,35,.5); border-radius: 10px; padding: 10px 14px;
}

/* —— twocol·ilr 左图右文（图片放大在左，文字缩小在右） —— */
.twocol-grid.ilr {
  grid-template-columns: 1.35fr 1fr; /* 图片占更大空间 */
  gap: 20px;
}
.twocol-grid.ilr .twocol-img { order: 1; }
.twocol-grid.ilr .twocol-txt { order: 2; }
.twocol-grid.ilr .twocol-img img {
  width: auto; max-width: 100%; max-height: 52vh; object-fit: contain;
}
.twocol-grid.ilr .twocol-txt .ptitle { font-size: 19px; margin-bottom: 6px; }
.twocol-grid.ilr .twocol-lead { font-size: 14px; padding: 10px 14px; line-height: 1.55; }
.twocol-grid.ilr .twocol-points { gap: 6px; }
.twocol-grid.ilr .twocol-points li {
  font-size: 13px; line-height: 1.5; padding: 7px 10px 7px 36px;
}
.twocol-grid.ilr .twocol-points li::before,
.twocol-grid.ilr .twocol-points li::after {
  width: 18px; height: 18px; left: 8px;
}
.twocol-grid.ilr .twocol-points li::after { font-size: 10px; line-height: 18px; }
.twocol-grid.ilr .twocol-tip { font-size: 12px; padding: 7px 10px; }

/* —— 关键文字蓝色标记 —— */
.twocol-lead .kw, .twocol-points li .kw,
.twocol-txt .kw, .imgtop-txt .kw {
  color: #1d64d8; font-weight: 700;
  background: linear-gradient(120deg, rgba(29,100,216,.10), rgba(29,100,216,.02));
  border-radius: 4px; padding: 1px 5px;
}

/* ====== 切包演示 overlay（sl-011 学生端版，SVG 原生动画） ====== */
.twocol-img.pcd-wrap { position: relative; overflow: hidden; }
.twocol-img.pcd-wrap img { position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  object-fit: contain; transition: filter .3s; }
/* SVG overlay：viewBox 和 u1t1-textbook-anim.svg 完全一致，preserveAspectRatio 默认 xMidYMid meet = object-fit:contain，与 img 完美对齐 */
.pcd-overlay {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  pointer-events: none; z-index: 2;
}
.pcd-overlay svg {
  width: 100%; height: 100%; display: block; overflow: visible;
}
/* 包颜色 */
.pcd-pk1 { fill:#b5d4f4; stroke:#185fa5; }
.pcd-pk2 { fill:#fac775; stroke:#ba7517; }
.pcd-pk3 { fill:#9fe1cb; stroke:#0f6e56; }
.pcd-no1 { fill:#042c53; }
.pcd-no2 { fill:#412402; }
.pcd-no3 { fill:#04342c; }

/* 三阶段浮标（JS 控制 .show） */
.pcd-phase {
  position: absolute; font-size: 13px; font-weight: 800; color: #fff;
  padding: 5px 13px; border-radius: 999px;
  box-shadow: 0 3px 10px rgba(0,0,0,.25); opacity: 0;
  transition: opacity .35s ease; white-space: nowrap; z-index: 5;
}
.pcd-ph1 { top: 14px; left: 14px; background: #185fa5; }
.pcd-ph2 { top: 14px; left: 50%; transform: translateX(-50%); background: #0f6e56; }
.pcd-ph3 { top: 14px; right: 14px; background: #993c1d; }
.pcd-phase.show { opacity: 1; }

.pcd-btn {
  position: absolute; bottom: 12px; right: 12px; z-index: 10; pointer-events: auto;
  background: linear-gradient(135deg, #1d64d8, #2563eb); color: #fff; border: none;
  padding: 8px 18px; border-radius: 999px; font-size: 14px; font-weight: 700;
  box-shadow: 0 6px 18px rgba(29,100,216,.35); cursor: pointer;
  transition: transform .15s, box-shadow .15s;
}
.pcd-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 22px rgba(29,100,216,.45); }

/* —— 大图数据页（imagefull）—— */
.imagefull-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 28px; align-items: stretch; margin-top: 12px; }
.imagefull-grid.only { grid-template-columns: 1fr; }
.imagefull-img { min-width: 0; }
.imagefull-img img {
  width: 100%; max-height: 400px; object-fit: contain;
  border-radius: 18px; box-shadow: 0 16px 40px rgba(30,50,90,0.16);
  border: 1px solid var(--border); background: #FBFDFF;
}
.imagefull-stats { display: flex; flex-direction: column; gap: 14px; justify-content: center; }
.if-stat {
  background: var(--surface); border: 1px solid var(--border); border-radius: 14px;
  padding: 14px 18px; box-shadow: var(--shadow-sm);
  border-left: 4px solid var(--book-7a); transition: all .16s ease;
}
.if-stat:hover { border-color: var(--book-7a); transform: translateX(3px); }
.if-k { font-size: 16.5px; font-weight: 800; color: var(--book-7a); line-height: 1.5; }
.if-v { margin-top: 5px; font-size: 14px; line-height: 1.7; color: var(--text-secondary); }
.imagefull-note {
  margin-top: 16px; font-size: 14px; font-weight: 600; line-height: 1.7; color: #1a6fb5;
  background: linear-gradient(135deg, rgba(74,144,226,.10), rgba(74,144,226,.04));
  border: 1px solid rgba(74,144,226,.28); border-radius: 12px; padding: 12px 16px;
}

/* —— 双图对比页（dualimg）—— 学生端 · 上下排列 */
.dualimg-grid { display: flex; flex-direction: column; align-items: stretch; height: calc(var(--vhpx, 1vh) * 82); }
.dualimg-item { flex: 1; display: flex; flex-direction: column; align-items: center; margin: 0.4vh 0; min-height: 0; }
.dualimg-img { width: 100%; flex: 1; display: flex; align-items: center; justify-content: center; min-height: 0; }
.dualimg-img img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 10px; box-shadow: 0 4px 18px rgba(0,0,0,.10); }
.dualimg-label { flex: none; margin-bottom: 0.5vh; font-size: calc(var(--vhpx, 1vh) * 2.2); font-weight: 700; color: #333; text-align: center; }

/* —— 金句页（quote）—— */
.quote-wrap {
  position: relative; border-radius: 18px; overflow: hidden; min-height: 400px;
  background-color: #16213e;
  background-size: cover; background-position: center;
  box-shadow: 0 18px 44px rgba(22,33,62,0.35);
  display: flex; align-items: center; justify-content: center;
}
.quote-wrap::before {
  content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background: linear-gradient(180deg, rgba(10,18,38,.55), rgba(10,18,38,.74));
}
.quote-inner { position: relative; z-index: 1; width: 100%; padding: 34px 44px; text-align: center; box-sizing: border-box; }
.quote-inner .ptitle {
  background: none; -webkit-background-clip: initial; background-clip: initial;
  color: #fff; -webkit-text-fill-color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.45);
}
.quote-lines { margin-top: 26px; display: flex; flex-direction: column; gap: 20px; }
.quote-line {
  font-size: 24px; line-height: 1.6; font-weight: 600; color: rgba(255,255,255,.94);
  text-shadow: 0 2px 12px rgba(0,0,0,.5); letter-spacing: 1px;
}
.quote-kw {
  display: inline-block; margin: 0 4px; padding: 0 10px;
  color: #ffd166; font-weight: 900; font-size: 27px;
  border-bottom: 3px solid rgba(255,209,102,.75);
  text-shadow: 0 0 24px rgba(255,209,102,.55);
}
.quote-tip {
  margin-top: 28px; font-size: 13.5px; font-weight: 600; color: rgba(255,255,255,.88);
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25);
  border-radius: 999px; padding: 8px 18px; display: inline-block;
}

/* —— 输入序号排序（sortn）—— */
.sortn-list { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.sortn-row {
  display: flex; align-items: center; gap: 15px;
  background: var(--surface); border: 1.5px solid var(--border);
  border-radius: 14px; padding: 12px 16px;
  box-shadow: 0 2px 8px rgba(30,50,90,.06); transition: all .18s ease;
}
.sortn-row:hover { border-color: var(--book-7a); }
.sortn-row.okrow { border-color: var(--green); background: rgba(39,174,96,.07); }
.sortn-row.badrow { border-color: var(--red); background: rgba(231,76,60,.06); animation: qShake 0.4s ease-in-out; }
.sortn-input {
  flex: 0 0 58px; height: 48px; text-align: center;
  border: 2.5px solid var(--border-strong); border-radius: 12px;
  font-size: 22px; font-weight: 900; color: var(--text-primary);
  background: var(--surface-2); outline: none; font-family: inherit;
  transition: all .15s ease;
}
.sortn-input:focus { border-color: var(--book-7a); box-shadow: 0 0 0 3px rgba(255,122,69,.15); background: #fff; }
.sortn-input:disabled { opacity: .55; }
.sortn-txt { flex: 1; min-width: 0; }
.sortn-label { font-size: 16.5px; font-weight: 700; color: var(--text-primary); line-height: 1.5; }
.sortn-sub { margin-top: 2px; font-size: 13.5px; color: var(--text-muted); line-height: 1.5; }
.sortn-year {
  flex: 0 0 auto; font-size: 15.5px; font-weight: 900; color: #1a6fb5;
  background: rgba(74,144,226,.12); border: 1px solid rgba(74,144,226,.3);
  border-radius: 999px; padding: 5px 15px;
}
.sortn-mark { flex: 0 0 26px; font-size: 19px; font-weight: 900; text-align: center; }
.sortn-row.okrow .sortn-mark { color: var(--green); }
.sortn-row.badrow .sortn-mark { color: var(--red); }
.sortn-answer { margin-top: 14px; }
.sortn-answer img { max-height: 300px; }

/* —— 视频多段连播 —— */
.video-multi { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 10px 0 16px; }
.video-multi-item { min-width: 0; }
.vm-label {
  font-size: 13.5px; font-weight: 700; color: var(--text-primary);
  margin-bottom: 7px; display: flex; align-items: center; flex-wrap: wrap;
}
.video-multi .video-card { margin: 0; }

/* —— 底部翻页：未完成时的引导态 —— */
.pager button.blocked {
  background: var(--surface-2); color: var(--text-muted);
  border-color: var(--border); cursor: not-allowed; font-weight: 600;
}
.pager button.blocked:hover { transform: none; border-color: var(--border); color: var(--text-muted); }
.pager-hint {
  margin-top: 10px; text-align: center; font-size: 13.5px; font-weight: 700;
  color: var(--book-7a); background: rgba(255,122,69,.09);
  border: 1px dashed rgba(255,122,69,.4); border-radius: 10px; padding: 8px 14px;
}

@media (max-width: 700px) {
  .match-row { grid-template-columns: 1fr; }
  .guide-dots { gap: 4px; }
  .gdot { width: 9px; height: 9px; }
}

/* ===========================================================
 * 教师端：实时答题进度（轻量列表版）
 * =========================================================== */
.live-progress-grid { display: flex; flex-direction: column; gap: 4px; max-height: 460px; overflow-y: auto; padding: 2px 4px; }
.lp-row {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px; border-radius: 6px;
  background: var(--surface-2);
  font-size: 12.5px; line-height: 1;
  transition: all .2s ease;
}
.lp-row.hot { background: rgba(79,140,255,.14); box-shadow: inset 0 0 0 1px rgba(79,140,255,.42); }
.lp-no {
  flex: 0 0 24px; height: 18px; border-radius: 4px;
  background: var(--book-7a); color: #fff;
  font-size: 10.5px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
}
.lp-name { flex: 0 0 64px; font-weight: 600; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp-bar { flex: 1; height: 8px; background: var(--surface); border-radius: 999px; overflow: hidden; }
.lp-fill { display: block; height: 100%; background: linear-gradient(90deg, var(--green), #2ecc71); transition: width .4s; }
.lp-num { flex: 0 0 38px; text-align: right; font-weight: 700; color: var(--text-primary); font-variant-numeric: tabular-nums; }
.lp-page { flex: 0 0 68px; font-size: 11.5px; color: var(--book-7a); font-weight: 600; }
.lp-page.dim { color: var(--text-muted); font-weight: 400; }

/* ===========================================================
 * 图文并茂课件（闯关式设计）
 * =========================================================== */
/* 封面：左文右图 */
.cover-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 40px; align-items: center; min-height: 380px; }
.cover-text { display: flex; flex-direction: column; gap: 10px; }
.cover-chips { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
.cover-chips span {
  font-size: 12.5px; font-weight: 700; color: var(--book-7a);
  background: rgba(255,122,69,0.10); border: 1px solid rgba(255,122,69,0.28);
  border-radius: 999px; padding: 6px 14px;
}
.cover-img img {
  width: 100%; aspect-ratio: 16/10; object-fit: contain;
  border-radius: 20px; box-shadow: 0 18px 44px rgba(30,50,90,0.18);
  border: 1px solid var(--border);
  background: #FBFDFF;
}
/* 情境/总结页大图 */
.stage-img { margin: 6px 0 16px; }
.stage-img img {
  width: 100%; max-height: 340px; object-fit: contain;
  border-radius: 16px; box-shadow: 0 12px 30px rgba(30,50,90,0.14);
  border: 1px solid var(--border);
  background: #FBFDFF;
}
.stage-img.sm img { max-height: 340px; width: 100%; }
/* 要点页右侧配图（文字环绕感） */
.content-img { float: right; margin: 0 0 14px 24px; max-width: 300px; }
.content-img img {
  width: 100%; aspect-ratio: 1/1; object-fit: contain;
  border-radius: 16px; border: 1px solid var(--border);
  box-shadow: 0 10px 26px rgba(30,50,90,0.14);
  background: #FBFDFF;
}
.player-stage::after { content: ''; display: block; clear: both; }
/* ===== 自由排版还原（2026-10-06）：教师端课件编辑的图片位移/缩放 → 学生端 =====
   CSS 变量由学生端 imgCssVars(p) 注入 page-slide；封面背景图 cover-bg 不参与
   2026-10-06 二轮：宽/高独立（--img-sx/--img-sy），origin left top 与教师端一致 */
.player-stage .page-slide img:not(.cover-bg) {
  transform: translate(var(--img-x, 0px), var(--img-y, 0px)) scale(var(--img-sx, 1), var(--img-sy, 1));
  transform-origin: left top;
}
/* 阅读材料小图 */
.read-img { float: right; margin: 0 0 12px 20px; width: 180px; }
.read-img img { width: 100%; aspect-ratio: 1/1; object-fit: contain; border-radius: 12px; border: 1px solid var(--border); background: #FBFDFF; }
.read-card::after { content: ''; display: block; clear: both; }

/* ===== AI 挑战页 ===== */
.ai-challenge { display: flex; flex-direction: column; flex: 1; min-height: 0; gap: 10px; }
.ai-head { display: flex; align-items: center; gap: 18px; background: linear-gradient(135deg, #6d5bd0 0%, #4f7ce0 55%, #3b82f6 100%);
  border-radius: 16px; padding: 14px 24px; color: #fff; box-shadow: 0 10px 28px rgba(109,91,208,.28); }
.ai-head-emoji { font-size: 44px; line-height: 1; flex: none; filter: drop-shadow(0 3px 8px rgba(0,0,0,.25)); }
.ai-head-text { min-width: 0; }
.ai-tag { display: inline-block; font-size: 13px; font-weight: 700; background: rgba(255,255,255,.22); border: 1px solid rgba(255,255,255,.4);
  padding: 3px 14px; border-radius: 999px; margin-bottom: 6px; letter-spacing: 1px; }
.ai-title { font-size: 28px; font-weight: 800; margin: 0; color: #fff; line-height: 1.25; text-shadow: 0 2px 10px rgba(0,0,0,.2); }
.ai-task { display: flex; align-items: center; gap: 14px; background: #fff6ef; border: 2px solid #ffd2b3; border-left: 6px solid #ff6b35;
  border-radius: 14px; padding: 10px 18px; }
.ai-task-label { flex: none; font-size: 15px; font-weight: 800; color: #c2410c; background: #ffe7d4; padding: 5px 14px; border-radius: 999px; }
.ai-task-text { font-size: 18px; font-weight: 700; color: #7c2d12; line-height: 1.4; }
.ai-steps-label { font-size: 15px; font-weight: 800; color: #475569; padding-left: 10px; border-left: 4px solid #4f8cff; }
.ai-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ai-step { position: relative; background: linear-gradient(160deg, #f8faff 0%, #eef4ff 100%); border: 1.5px solid #d6e4ff; border-radius: 16px;
  padding: 13px 14px 11px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 5px;
  box-shadow: 0 6px 16px rgba(79,140,255,.12); transition: .2s; }
.ai-step:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(79,140,255,.22); }
.ai-step-n { position: absolute; top: 8px; left: 10px; font-size: 18px; font-weight: 800; color: #4f8cff; opacity: .5; }
.ai-step-icon { font-size: 32px; line-height: 1; margin-top: 2px; }
.ai-step-title { font-size: 17px; font-weight: 800; color: #1e3a8a; margin-top: 1px; }
.ai-step-desc { font-size: 13px; color: #475569; line-height: 1.5; }
.ai-remember { display: flex; align-items: flex-start; gap: 14px; background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
  border: 1.5px solid #fcd34d; border-radius: 14px; padding: 10px 16px; margin-top: auto; }
.ai-remember-icon { font-size: 24px; line-height: 1; flex: none; margin-top: 2px; }
.ai-remember-body { min-width: 0; flex: 1; }
.ai-remember-title { font-size: 13px; font-weight: 800; color: #92400e; margin-bottom: 1px; }
.ai-remember-main { font-size: 15px; font-weight: 700; color: #78350f; line-height: 1.45; }
.ai-funfact { font-size: 12.5px; color: #92600a; line-height: 1.45; margin-top: 3px; font-style: italic; }

/* 内嵌视频（学生端闯关学习） */
.video-dur { display: inline-block; font-size: 12px; font-weight: 700; color: #fff; background: var(--grad-orange); padding: 2px 11px; border-radius: 999px; vertical-align: middle; margin-left: 8px; }
.video-card { position: relative; margin: 10px 0 16px; border-radius: 16px; overflow: hidden; background: #0f172a; box-shadow: 0 12px 30px rgba(15,23,42,0.20); border: 1px solid rgba(15,23,42,0.1); }
.video-card video { display: block; width: 100%; aspect-ratio: 16/9; object-fit: contain; background: #0f172a; }

/* 计分徽章（闯关式 · 醒目橙） */
.score-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 800; color: #c2410c;
  background: linear-gradient(135deg, #fff3e8, #ffe7d4);
  border: 1.5px solid #ffc49a;
  border-radius: 999px; padding: 7px 18px; margin: 2px 0 12px;
  box-shadow: 0 3px 10px rgba(255,122,69,.14); letter-spacing: .3px;
}
.guide-score.star { color: #d68910; font-weight: 800; }

/* ===========================================================
 * 科技感整体升级（干净大气 + 微光效）
 * =========================================================== */
/* 页面背景：淡网格 + 光晕 */
body {
  background:
    radial-gradient(1000px 500px at 85% -10%, rgba(74,144,226,0.10), transparent 60%),
    radial-gradient(900px 480px at -10% 30%, rgba(255,122,69,0.07), transparent 55%),
    linear-gradient(180deg, #edf2fd 0%, #f5f7fb 45%, #fafbff 100%);
}
body::before {
  content: ''; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; pointer-events: none;
  background-image:
    linear-gradient(rgba(30,50,90,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(30,50,90,0.035) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(ellipse 90% 70% at 50% 0%, #000 30%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 90% 70% at 50% 0%, #000 30%, transparent 75%);
}
/* 播放器舞台：玻璃卡片感 */
.player-stage {
  backdrop-filter: blur(6px);
  box-shadow: 0 24px 60px rgba(30, 50, 90, 0.12), inset 0 1px 0 rgba(255,255,255,0.7);
}
/* 课件大标题：渐变字 */
.ptitle {
  background: linear-gradient(120deg, #1a2342 30%, #3d5a99 70%, #4a90e2);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
/* 引领条：玻璃拟态 */
.guide-bar {
  background: rgba(255,255,255,0.72);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(30,50,90,0.08);
  box-shadow: 0 8px 24px rgba(30,50,90,0.08);
}
/* 登录页大标题：光效 */
.login-hero-title, .auth-title, h1 {
  text-shadow: 0 2px 24px rgba(74,144,226,0.18);
}
@media (max-width: 900px) {
  .cover-grid { grid-template-columns: 1fr; gap: 20px; min-height: 0; }
  .cover-img img { aspect-ratio: 16/9; }
  .content-img { float: none; margin: 0 0 14px 0; max-width: 100%; }
  .read-img { float: none; margin: 0 0 12px 0; width: 100%; }
  .twocol-grid { grid-template-columns: 1fr; gap: 18px; min-height: 0; }
  .imagefull-grid { grid-template-columns: 1fr; gap: 16px; }
  .video-multi { grid-template-columns: 1fr; }
  .quote-wrap { min-height: 300px; }
  .quote-line { font-size: 19px; }
  .quote-kw { font-size: 22px; }
}

/* ===========================================================
 * 探险岛地图（模仿闯关式课件平台：SVG 路径 + 单元岛屿）
 * =========================================================== */
.map-canvas {
  position: relative;
  height: 680px;
  margin: 8px 0 4px;
  background:
    radial-gradient(600px 300px at 20% 20%, rgba(74,144,226,0.06), transparent 65%),
    radial-gradient(500px 260px at 80% 70%, rgba(255,122,69,0.06), transparent 60%);
  border-radius: 20px;
}
.path-svg {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  width: 100%; height: 100%;
  pointer-events: none;
  animation: pathFlow 24s linear infinite;
}
@keyframes pathFlow { to { stroke-dashoffset: -70; } }
.unit-island {
  position: absolute;
  transform: translateX(-50%);
  width: 252px;
  z-index: 2;
}
.island-body { position: relative; text-align: center; }
.island-main {
  background: rgba(255,255,255,0.88);
  backdrop-filter: blur(8px);
  border: 1.5px solid rgba(30,50,90,0.10);
  border-radius: 20px;
  padding: 18px 14px 14px;
  box-shadow: 0 16px 40px rgba(30,50,90,0.12), inset 0 1px 0 rgba(255,255,255,0.8);
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  transition: transform .2s ease, box-shadow .2s ease;
}
.unit-island:not(.locked):hover .island-main {
  transform: translateY(-5px);
  box-shadow: 0 22px 50px rgba(30,50,90,0.18);
  border-color: rgba(255,122,69,0.45);
}
.unit-island.locked .island-main { opacity: 0.78; filter: saturate(0.55); }
.island-icon {
  width: 62px; height: 62px; border-radius: 50%;
  overflow: hidden; flex-shrink: 0;
  background: linear-gradient(135deg, #ffe8d9, #ffd9c2);
  border: 2.5px solid #fff;
  box-shadow: 0 6px 16px rgba(255,122,69,0.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 30px;
}
.island-icon img { width: 100%; height: 100%; object-fit: cover; }
.island-num {
  font-size: 11px; font-weight: 800; letter-spacing: 2px;
  color: var(--book-7a); text-transform: uppercase; margin-top: 2px;
}
.island-name { font-size: 16.5px; font-weight: 800; color: var(--text-primary); }
/* 任务圆点 */
.lesson-dots { display: flex; gap: 8px; margin: 6px 0 2px; }
.lesson-dot {
  width: 38px; height: 38px; border-radius: 50%;
  border: 2px solid var(--border);
  background: #fff; color: var(--text-secondary);
  font-size: 15px; font-weight: 800;
  cursor: pointer; transition: all .18s ease;
  display: flex; align-items: center; justify-content: center;
}
.lesson-dot.ready { border-color: #4a90e2; color: #1a6fb5; background: rgba(74,144,226,0.08); }
.lesson-dot.ready:hover { background: rgba(74,144,226,0.18); transform: scale(1.1); }
.lesson-dot.done {
  border-color: var(--green); background: var(--green); color: #fff;
  box-shadow: 0 4px 10px rgba(39,174,96,0.35);
}
.lesson-dot.current {
  border-color: var(--book-7a); color: #1d4ed8;
  background: rgba(255,122,69,0.12);
  animation: dotPulse 1.8s ease-in-out infinite;
}
@keyframes dotPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,122,69,0.45); }
  50% { box-shadow: 0 0 0 9px rgba(255,122,69,0); }
}
.lesson-dot.locked {
  background: #eef1f6; color: #9aa7c0; cursor: not-allowed; border-color: #dde3ee;
}
/* 单元进度条 */
.unit-progress { width: 100%; margin-top: 4px; }
.unit-progress-track {
  height: 7px; border-radius: 999px; background: #e8edf5; overflow: hidden;
}
.unit-progress-fill {
  height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, var(--book-7a), #ffb08a);
  transition: width .5s ease;
}
.unit-island.locked .unit-progress-fill { background: #b8c2d4; }
/* r153 低分屏可读性：进度小字由浅灰蓝(--text-muted #8e9ab5)改深藏青，对比度 3:1→10:1 */
.unit-progress-text { font-size: 11.5px; color: #2a3854; margin-top: 4px; font-weight: 700; }
/* 岛屿底座（椭圆阴影） */
.island-base {
  width: 78%; height: 14px; margin: 2px auto 0;
  background: radial-gradient(ellipse at center, rgba(30,50,90,0.20), transparent 70%);
  border-radius: 50%;
}
.unit-island.locked .island-base { opacity: 0.5; }

/* ===========================================================
 * 播放器底部控制栏（进度条 + 页码 + 箭头 + 缩略图/全屏）
 * =========================================================== */
.control-bar {
  display: flex; align-items: center; gap: 16px;
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(30,50,90,0.10);
  border-radius: 999px;
  padding: 8px 14px;
  margin: 16px auto 0;
  box-shadow: 0 12px 32px rgba(30,50,90,0.14);
  position: sticky; bottom: 14px; z-index: 30;
}
.ctrl-left, .ctrl-right { display: flex; align-items: center; gap: 8px; }
.ctrl-center { flex: 1; display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.progress-track {
  height: 8px; border-radius: 999px; background: #e8edf5; overflow: hidden;
}
.progress-fill {
  height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, var(--book-7a), #ffb08a);
  transition: width .35s ease;
}
.page-indicator {
  text-align: center; font-size: 13.5px; color: var(--text-secondary); font-weight: 700;
  line-height: 1;
}
.page-indicator .total { color: var(--text-muted); font-weight: 500; }
.ctrl-btn {
  width: 44px; height: 44px; border-radius: 50%;
  border: 1.5px solid var(--border-strong);
  background: #fff; color: var(--text-primary);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all .18s ease; flex-shrink: 0;
}
.ctrl-btn:hover:not(:disabled) { border-color: var(--book-7a); color: var(--book-7a); transform: scale(1.07); }
.ctrl-btn:disabled { opacity: 0.35; cursor: not-allowed; }
.ctrl-btn.primary {
  width: 52px; height: 52px;
  background: linear-gradient(135deg, var(--book-7a), #3b82f6);
  border: none; color: #fff;
  box-shadow: 0 8px 22px rgba(255,122,69,0.40);
}
.ctrl-btn.primary:hover:not(.blocked) { transform: scale(1.1); box-shadow: 0 10px 28px rgba(255,122,69,0.5); }
.ctrl-btn.primary.blocked { background: #c3cbd9; box-shadow: none; cursor: not-allowed; }
.ctrl-btn.on { background: rgba(74,144,226,0.12); border-color: #4a90e2; color: #1a6fb5; }
.finish-btn {
  height: 44px; padding: 0 22px; border-radius: 999px; border: none;
  background: linear-gradient(135deg, #27ae60, #6fcf97); color: #fff;
  font-size: 14.5px; font-weight: 800; cursor: pointer;
  box-shadow: 0 8px 22px rgba(39,174,96,0.35);
  transition: all .18s ease;
}
.finish-btn:hover:not(.blocked) { transform: scale(1.05); }
.finish-btn.blocked { background: #c3cbd9; box-shadow: none; cursor: not-allowed; }

/* ===========================================================
 * 页面缩略图面板
 * =========================================================== */
.thumb-overlay {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 200;
  background: rgba(20,30,55,0.45);
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(3px);
}
.thumb-box {
  width: min(860px, calc(var(--vwpx, 1vw) * 92)); max-height: calc(var(--vhpx, 1vh) * 82);
  background: #fff; border-radius: 20px;
  box-shadow: 0 30px 80px rgba(20,30,55,0.35);
  display: flex; flex-direction: column; overflow: hidden;
}
.thumb-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 22px; border-bottom: 1px solid var(--border);
  font-size: 16px; color: var(--text-primary);
}
.thumb-close {
  width: 34px; height: 34px; border-radius: 50%; border: none;
  background: #f0f3f9; color: var(--text-secondary);
  font-size: 20px; cursor: pointer; line-height: 1;
}
.thumb-close:hover { background: #e6ebf4; color: var(--text-primary); }
.thumb-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 12px; padding: 18px 22px 22px; overflow-y: auto;
}
.thumb-card {
  display: flex; flex-direction: column; align-items: flex-start; gap: 5px;
  background: #f7f9fd; border: 1.5px solid var(--border);
  border-radius: 14px; padding: 12px 14px;
  cursor: pointer; text-align: left; transition: all .16s ease;
  min-height: 86px;
}
.thumb-card:hover:not(:disabled) { border-color: var(--book-7a); transform: translateY(-3px); box-shadow: 0 8px 18px rgba(255,122,69,0.15); }
.thumb-card .thumb-no {
  font-size: 12px; font-weight: 800; color: var(--book-7a);
  background: rgba(255,122,69,0.10); border-radius: 999px; padding: 2px 10px;
}
.thumb-card .thumb-title {
  font-size: 13px; font-weight: 600; color: var(--text-primary); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.thumb-card .thumb-mark { font-size: 12px; color: var(--text-muted); margin-top: auto; }
.thumb-card.done { background: rgba(39,174,96,0.06); border-color: rgba(39,174,96,0.35); }
.thumb-card.done .thumb-no { color: var(--green); background: rgba(39,174,96,0.12); }
.thumb-card.cur { border-color: var(--book-7a); background: rgba(255,122,69,0.08); box-shadow: 0 0 0 2px rgba(255,122,69,0.18); }
.thumb-card.locked, .thumb-card.lock { opacity: 0.55; cursor: not-allowed; }
.thumb-card.sync-lock { opacity: 0.45; cursor: not-allowed; filter: grayscale(.4); }

/* ===========================================================
 * 学生端：教师通道口令弹窗（替代原生 prompt，避免显示 IP）
 * =========================================================== */
.overlay.overlay-top {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 9999;
  background: rgba(24, 33, 56, 0.45);
  backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.modal.confirm-modal {
  background: #fff;
  border-radius: 18px;
  min-width: 360px; max-width: calc(var(--vwpx, 1vw) * 92);
  padding: 22px 24px 20px;
  box-shadow: 0 30px 80px rgba(20, 30, 55, 0.35);
  animation: modal-pop .18s ease-out;
}
@keyframes modal-pop {
  from { opacity: 0; transform: translateY(6px) scale(.98); }
  to   { opacity: 1; transform: translateY(0)   scale(1);   }
}
.modal.confirm-modal h2 {
  margin: 0 0 10px;
  font-size: 18px; font-weight: 800; color: #1e293b;
  display: flex; align-items: center; gap: 8px;
}
.modal.confirm-modal .confirm-msg {
  font-size: 14px; color: #475569; line-height: 1.6;
}
.teacher-code-modal .t-lc-field { margin-bottom: 0; }
.modal.confirm-modal .seat-unlock-error {
  color: #e53e3e; font-size: 13px; margin-top: 6px;
}
.modal.confirm-modal .confirm-btns {
  display: flex; gap: 10px; justify-content: flex-end;
}
.modal.confirm-modal .btn-default,
.modal.confirm-modal .btn-cancel {
  border: 1px solid #e2e8f0; background: #fff; color: #64748b;
  font-size: 14px; font-weight: 700; font-family: inherit;
  padding: 10px 22px; border-radius: 999px; cursor: pointer; transition: .15s;
}
.modal.confirm-modal .btn-default:hover,
.modal.confirm-modal .btn-cancel:hover {
  color: #1e293b; border-color: #cbd5e1; background: #f8fafc;
}

/* 窄屏：岛屿改纵向流式 */
@media (max-width: 760px) {
  .map-canvas { height: auto; display: flex; flex-direction: column; gap: 18px; padding: 10px; }
  .path-svg { display: none; }
  .unit-island { position: static; transform: none; width: 100%; }
  .control-bar { gap: 8px; padding: 6px 10px; border-radius: 18px; }
  .ctrl-btn { width: 38px; height: 38px; }
  .ctrl-btn.primary { width: 44px; height: 44px; }
}

/* ===========================================================
 * 探险岛地图 v3：横向大卡片 · 每单元独立主题色 · 徽章式任务入口
 * （覆盖上面 v1 绝对定位 & v2 横排版全部样式）
 * =========================================================== */
.island-map {
  max-width: none !important;
  min-height: max-content !important;
  /* 顶部加高：给「学习探索路径」标签 + 上浮卡片留出避让空间 */
  padding: 96px 22px 28px !important;
  margin: 14px 0 12px !important;
  display: flex !important;
  align-items: center;
  flex: 1 1 auto;
  border-radius: 24px;
  position: relative;
  background:
    radial-gradient(800px 420px at 10% 0%, rgba(74,144,226,0.12), transparent 60%),
    radial-gradient(700px 380px at 90% 100%, rgba(255,122,69,0.10), transparent 58%),
    linear-gradient(180deg, rgba(238,246,255,0.82), rgba(245,250,255,0.55));
  border: 1px solid rgba(74,144,226,0.16);
  backdrop-filter: blur(12px);
  box-shadow:
    0 30px 70px -20px rgba(30,50,90,0.15),
    0 10px 30px -10px rgba(30,50,90,0.08),
    inset 0 1px 0 rgba(255,255,255,0.8);
}
.island-map::before {
  content: '🗺️ 学习探索路径';
  position: absolute;
  top: 26px; left: 56px;
  padding: 16px 44px;
  background: linear-gradient(135deg, #ff7a45, #ffb08a);
  color: #fff;
  border-radius: 999px;
  font-size: 24px; font-weight: 800; letter-spacing: 2px;
  box-shadow: 0 12px 30px rgba(255,122,69,0.45);
}
.island-map::after {
  content: '';
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background-image:
    radial-gradient(rgba(74,144,226,0.06) 1px, transparent 1px);
  background-size: 22px 22px;
  background-position: 0 10px;
  border-radius: 28px;
  pointer-events: none;
  opacity: .5;
}
/* 「学习探索路径」胶囊跟随当前册主题色（默认橙＝七上；蓝＝七下；紫＝AI上册；玫红＝AI下册） */
.island-map.islandmap-blue::before {
  background: var(--grad-blue);
  box-shadow: 0 12px 30px rgba(74,144,226,0.45);
}
.island-map.islandmap-purple::before {
  background: var(--grad-purple);
  box-shadow: 0 12px 30px rgba(142,92,246,0.45);
}
.island-map.islandmap-magenta::before {
  background: var(--grad-magenta);
  box-shadow: 0 12px 30px rgba(232,74,134,0.45);
}

.map-canvas {
  position: relative !important;
  height: auto !important;
  width: 100%;
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 0;
  margin: 0 !important;
  background: none !important;
  border-radius: 0 !important;
  z-index: 1;
}

/* —— 单元探险站卡片（横向波浪弧形：一上一下错落排列） —— */
.unit-island {
  position: relative !important;
  width: auto !important;
  flex: 1 1 0;
  min-width: 0;
  z-index: 2;
  /* 波浪弧：奇偶卡片交替上下错位（--arc-y 由模板按单元序号注入） */
  transform: translateY(var(--arc-y, 0px));
}
.island-body {
  position: relative;
  height: 100%;
  padding: 0 2px;
}
/* 背后光晕（用 unit-color 变量发光） */
.island-halo {
  position: absolute;
  top: -16px; right: -8px; bottom: -20px; left: -8px;
  background: radial-gradient(closest-side, var(--u-color), transparent 72%);
  opacity: .18;
  z-index: 0;
  filter: blur(2px);
  transition: opacity .3s;
}
.unit-island.locked .island-halo { opacity: .05; }
.unit-island.current .island-halo { opacity: .3; animation: haloPulse 2.6s ease-in-out infinite; }
.unit-island.complete .island-halo { background: radial-gradient(closest-side, rgba(39,174,96,0.22), transparent 72%); }
@keyframes haloPulse {
  0%, 100% { transform: scale(1); opacity: .85; }
  50% { transform: scale(1.04); opacity: 1; }
}

.island-main {
  position: relative;
  z-index: 1;
  /* 用半透明白色渐变叠在单元主题色上，所有浏览器都支持，色彩区分明显 */
  background: rgba(255,255,255,0.94);
  background: linear-gradient(180deg,
    rgba(255,255,255,0.76) 0%,
    rgba(255,255,255,0.84) 55%,
    rgba(255,255,255,0.90) 100%), var(--u-color);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1.5px solid rgba(30,50,90,0.10);
  border: 1.5px solid color-mix(in srgb, var(--u-color) 28%, rgba(30,50,90,0.10));
  border-top: 3px solid var(--u-color);
  border-radius: 18px;
  padding: 12px 13px 12px;
  box-shadow:
    0 18px 44px -14px rgba(30,50,90,0.18),
    0 6px 16px -6px rgba(30,50,90,0.10),
    inset 0 1px 0 rgba(255,255,255,0.9);
  box-shadow:
    0 18px 44px -14px color-mix(in srgb, var(--u-color) 22%, rgba(30,50,90,0.12)),
    0 6px 16px -6px rgba(30,50,90,0.10),
    inset 0 1px 0 rgba(255,255,255,0.9);
  display: flex; flex-direction: column; align-items: stretch; gap: 6px;
  height: 100%;
  transition: transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s, border-color .25s;
}
.unit-island:not(.locked):hover .island-main {
  transform: translateY(-8px);
  box-shadow:
    0 32px 60px -18px color-mix(in srgb, var(--u-color) 36%, rgba(30,50,90,0.18)),
    0 12px 28px -10px rgba(30,50,90,0.15);
  border-color: color-mix(in srgb, var(--u-color) 60%, rgba(30,50,90,0.10));
}
.unit-island.locked .island-main {
  /* 锁定态也保留淡淡单元色，避免四个版块全白；用更厚的白罩表示未解锁。
     r152：去掉 opacity 降透明、饱和仅轻度降低——原先 0.9×saturate(.55) 会把
     卡片内任务文字洗得发白，低分屏上学生看不清（红框反馈问题） */
  background: linear-gradient(180deg, rgba(255,255,255,0.90), rgba(255,255,255,0.95)), var(--u-color);
  opacity: 1;
  filter: saturate(0.8);
}
.unit-island.complete .island-main {
  border-top-color: #27ae60;
  border-color: rgba(39,174,96,0.4);
  box-shadow:
    0 18px 44px -14px rgba(39,174,96,0.22),
    0 6px 16px -6px rgba(30,50,90,0.10);
}
.unit-island.current .island-main {
  /* 旧内核兜底：实色描边环（color-mix 版在下方增强） */
  box-shadow:
    0 0 0 2px var(--u-color),
    0 10px 28px -10px rgba(30,50,90,0.15);
  box-shadow:
    0 22px 50px -16px color-mix(in srgb, var(--u-color) 38%, rgba(30,50,90,0.18)),
    0 0 0 2px color-mix(in srgb, var(--u-color) 42%, white),
    0 10px 28px -10px rgba(30,50,90,0.15);
}

/* 顶部标签行 */
.island-toprow {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  margin-bottom: 0;
}
.island-unit-tag {
  padding: 3px 12px;
  border-radius: 999px;
  font-size: 12.5px; font-weight: 800; letter-spacing: 1px;
  box-shadow: 0 3px 10px color-mix(in srgb, var(--u-color) 22%, transparent);
}
.island-state-tag {
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 11.5px; font-weight: 700;
  margin-left: auto;
  border: 1px solid transparent;
}
.tag-open {
  background: rgba(255,255,255,0.7);
  background: color-mix(in srgb, var(--u-color) 12%, white);
  color: #1a2342;
  border-color: rgba(30,50,90,0.12);
  border-color: color-mix(in srgb, var(--u-color) 30%, white);
}
.tag-complete {
  background: rgba(39,174,96,0.12);
  color: #176936;
  border-color: rgba(39,174,96,0.35);
}
.tag-locked {
  background: #f1f3f8;
  /* r153 低分屏可读性：#8993a8 浅灰(对比3:1)→深灰蓝(对比7:1)，锁定感由浅底色传达 */
  color: #47536e;
  border-color: #dde3ee;
}

/* hero：图标 + 标题 + 副介绍 */
.island-hero {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 2px 0 0;
}
.island-icon {
  flex: 0 0 auto;
  width: 50px; height: 50px; border-radius: 14px;
  overflow: hidden;
  background:
    radial-gradient(circle at 30% 30%, color-mix(in srgb, var(--u-color) 32%, white), color-mix(in srgb, var(--u-color) 18%, white));
  border: 2px solid #fff;
  box-shadow:
    0 8px 20px color-mix(in srgb, var(--u-color) 32%, transparent),
    inset 0 1px 0 rgba(255,255,255,0.8);
  display: flex; align-items: center; justify-content: center;
  font-size: 26px;
  line-height: 1;
  position: relative;
}
.island-icon::after {
  content: '';
  position: absolute;
  top: -5px; right: -5px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--u-color);
  border: 2.5px solid #fff;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}
.unit-island.complete .island-icon::after {
  background: #27ae60;
}
.unit-island.locked .island-icon::after {
  background: #8993a8;
}
.island-icon img { width: 100%; height: 100%; object-fit: cover; }

.island-title-group {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 6px;
  padding-top: 2px;
}
.island-name {
  font-size: 22px; font-weight: 900;
  color: var(--text-primary);
  line-height: 1.25;
  letter-spacing: 0.2px;
}
/* 当前学习单元：标题染单元色，一眼锁定
   r153 低分屏可读性：原 78% 单元色在金/绿单元下偏浅(对比4:1)；反转为深藏青为主(55%)+单元色(42%)，
   任何单元色下对比度都 ≥7:1，先写兜底深色再写 color-mix 增强（旧内核 Chromium<111 不支持 color-mix） */
.unit-island.current .island-name {
  color: #14213d;
  color: color-mix(in srgb, var(--u-color) 42%, #14213d);
}
.island-intro {
  font-size: 12px;
  /* r153 低分屏可读性：12px 小字由 #2c3a52 微加深一档，白底对比 10:1→12:1 */
  color: #1c2a48;
  line-height: 1.45;
  font-weight: 600;
}
.island-sub {
  padding: 3px 10px;
  background: linear-gradient(90deg, rgba(255,255,255,0.65), transparent);
  background: linear-gradient(90deg, color-mix(in srgb, var(--u-color) 10%, white), transparent);
  border-left: 3px solid var(--u-color);
  border-radius: 6px;
  font-size: 12px;
  font-weight: 800;
  color: #1a2342;
  letter-spacing: 0.2px;
}

/* —— 任务徽章入口（2×2 方块） —— */
.lesson-tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin: 2px 0 0;
}
.lesson-tile {
  --tile-bg: #f2f6fd;
  --tile-bd: #d9e3f2;
  /* r153 低分屏可读性：状态文字色由 #43536f(对比7:1)加深一档到 #2c395a(对比9:1) */
  --tile-color: #2c395a;
  background: var(--tile-bg);
  border: 1.5px solid var(--tile-bd);
  color: var(--tile-color);
  border-radius: 12px;
  padding: 6px 8px 5px;
  cursor: pointer;
  transition: all .2s cubic-bezier(.2,.7,.2,1);
  font-family: inherit;
  text-align: left;
  display: grid;
  grid-template-columns: 24px 1fr;
  grid-template-rows: auto auto;
  grid-template-areas:
    "num title"
    "num state";
  column-gap: 8px;
  row-gap: 2px;
  align-items: start;
  box-shadow: 0 2px 6px rgba(30,50,90,0.05);
  position: relative;
  overflow: hidden;
}
.lesson-tile::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--tile-bd);
  transition: background .2s;
}
.lesson-tile:hover:not(:disabled):not(.locked):not(.done) {
  transform: translateY(-3px);
  box-shadow: 0 10px 22px -8px color-mix(in srgb, var(--u-color) 36%, rgba(30,50,90,0.18));
}

.lesson-tile .lt-num {
  grid-area: num;
  width: 24px; height: 24px;
  border-radius: 7px;
  background: var(--tile-bd);
  color: var(--tile-color);
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 900;
  transition: .2s;
}
.lesson-tile .lt-title {
  grid-area: title;
  font-size: 14px;
  font-weight: 800;
  color: var(--text-primary);
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lesson-tile .lt-state {
  grid-area: state;
  font-size: 12.5px;
  font-weight: 800;
  color: var(--tile-color);
}

/* —— 课型徽标（AI 社团课程「学练评测一体化」：导/学/练/测/项） —— */
.lt-kind {
  position: absolute;
  top: 4px; right: 4px;
  z-index: 2;
  min-width: 17px;
  padding: 0 4px;
  border-radius: 6px;
  font-size: 10.5px;
  line-height: 1.5;
  font-weight: 900;
  color: #fff;
  text-align: center;
  letter-spacing: 0;
  box-shadow: 0 1px 3px rgba(30,50,90,0.22);
}
.ltk-dao   { background: #00BCD4; }  /* 导学 · 青 */
.ltk-xue   { background: #4A90E2; }  /* 学 · 蓝 */
.ltk-lian  { background: #FF7A45; }  /* 练 · 橙 */
.ltk-ce    { background: #8E44AD; }  /* 测 · 紫 */
.ltk-xiang { background: #16A085; }  /* 项 · 青绿 */
/* 有课型徽标时标题右让，避免文字压到角标 */
.lesson-tile.has-kind .lt-title { padding-right: 18px; }
/* 待装配瓦片上课型徽标灰显 */
.lesson-tile.draft .lt-kind { background: #aab4c8; box-shadow: none; }
/* 当前高亮瓦片上白字标题加避让 */
.lesson-tile.current .lt-kind { box-shadow: inset 0 0 0 1px rgba(255,255,255,0.35), 0 1px 3px rgba(30,50,90,0.22); }

/* 状态：ready（当前可学）
   注意：color-mix 在旧内核（360极速等 Chromium<111）中无效，且写在自定义属性里连"后写兜底"都
   不生效（自定义属性解析期不校验值）。改用全内核兼容写法：86%不透明白色叠在单元色上 ≈ 混白12%。 */
.lesson-tile.ready {
  --tile-bg: linear-gradient(rgba(255,255,255,0.86), rgba(255,255,255,0.86)), var(--u-color);
  --tile-bd: var(--u-color);
  --tile-color: var(--u-color);
}
.lesson-tile.ready::before { background: var(--u-color); }
.lesson-tile.ready .lt-num {
  background: var(--u-color);
  color: #fff;
  /* r153 低分屏可读性：金/绿等浅单元色上白字发虚，加黑描影勾边 */
  text-shadow: 0 1px 2px rgba(0,0,0,0.5), 0 0 1px rgba(0,0,0,0.4);
  box-shadow: 0 3px 8px rgba(30,50,90,0.18);
}
/* ready 状态文字用深色，避免金色/绿色单元色在浅底上看不清（r153 再加深一档） */
.lesson-tile.ready .lt-state {
  color: #22304f;
}
.lesson-tile.ready:hover:not(:disabled) {
  --tile-bg: linear-gradient(rgba(255,255,255,0.82), rgba(255,255,255,0.82)), var(--u-color);
}

/* 状态：current（当前高亮建议学）
   关键兼容：--tile-bg 不能放含 color-mix 的渐变——旧内核（360极速等 Chromium<111）解析自定义
   属性时不校验值，会让 background 在计算期失效变透明，白字压在白卡上完全看不见。
   兜底用实色单元色（白字依然清晰），新内核再用直接声明的渐变覆盖增强。 */
.lesson-tile.current {
  --tile-bg: var(--u-color);
  --tile-bd: var(--u-color);
  --tile-color: #fff;
  background: var(--u-color);
  background: linear-gradient(135deg, var(--u-color), color-mix(in srgb, var(--u-color) 70%, #ffb487));
  animation: currentTileGlow 2.4s ease-in-out infinite;
}
/* r153 低分屏可读性：描影加深加双勾边，保证金/绿等浅单元色渐变底上白字依然锐利 */
.lesson-tile.current .lt-title { color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.62), 0 0 2px rgba(0,0,0,0.5); }
.lesson-tile.current .lt-state { color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.62), 0 0 2px rgba(0,0,0,0.5); }
.lesson-tile.current::before {
  background: var(--u-color);
  width: 4px;
  background: linear-gradient(180deg, var(--u-color), color-mix(in srgb, var(--u-color) 60%, #ffb487));
}
.lesson-tile.current .lt-num {
  background: rgba(255,255,255,0.28);
  color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,0.55);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.35);
}
@keyframes currentTileGlow {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(30,50,90,0.18);
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--u-color) 30%, transparent);
  }
  50% {
    box-shadow: 0 0 0 5px rgba(30,50,90,0);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--u-color) 12%, transparent);
  }
}

/* 状态：done 已完成（r153 状态绿字加深一档，浅绿底上更实） */
.lesson-tile.done {
  --tile-bg: rgba(39,174,96,0.12);
  --tile-bd: rgba(39,174,96,0.4);
  --tile-color: #176936;
}
.lesson-tile.done::before { background: #27ae60; }
.lesson-tile.done .lt-num {
  background: #27ae60;
  color: #fff;
  box-shadow: 0 3px 8px rgba(39,174,96,0.3);
}
.lesson-tile.done .lt-title { color: #196f3d; }

/* 状态：locked 锁定
   r152：原 #5a6888 浅灰蓝 + opacity .85，叠加外层锁定卡透明后文字发白看不清。
   改深灰蓝并保透明 0.95——"未解锁"的视觉弱化交给浅底色和边框，不再靠洗白文字
   r153（图2红框反馈）：浅灰蓝底 #edf1f8 与单元卡白色罩叠加后灰蒙蒙一片，低分屏文字发糊。
   改纯白底（白纸黑字原理，深字对比最大化 12:1）+ 边框加深勾出格子边界，
   "未解锁"弱化感全部交给灰蓝边框和灰序号块传达 */
.lesson-tile.locked {
  --tile-bg: #ffffff;
  --tile-bd: #b8c7e0;
  --tile-color: #3a4a70;
  cursor: not-allowed;
  opacity: 0.95;
}
.lesson-tile.locked::before { background: #b8c7e0; }
.lesson-tile.locked .lt-title { color: #1e2c4f; }

/* 状态：draft（🚧 待装配课次：课件未装入课时轨道的占位瓦片，虚线边+斜纹底，
   装配完成（draft 改 false）后自动恢复上方正常状态样式。全部用 rgba/预混色，兼容 360 极速旧内核） */
.lesson-tile.draft {
  --tile-bg: repeating-linear-gradient(135deg, #f6f7fb 0 7px, #edf0f6 7px 14px);
  --tile-bd: #c3cade;
  --tile-color: #7c86a3;
  cursor: not-allowed;
  opacity: 0.92;
  border-style: dashed;
}
.lesson-tile.draft::before { background: #c3cade; }
.lesson-tile.draft .lt-title { color: #5b667f; }
.lesson-tile.draft .lt-num { background: #dde2ee; color: #7c86a3; }

/* 单元进度 */
.unit-progress { width: 100%; margin-top: auto; padding-top: 4px; display: flex; flex-direction: column; gap: 3px; }
.unit-progress-text { font-size: 11px; }
.unit-progress-track {
  height: 7px; border-radius: 999px;
  background: #eef1f7;
  overflow: hidden;
  box-shadow: inset 0 1px 2px rgba(30,50,90,0.06);
}
.unit-progress-fill {
  height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, var(--book-7a), #ffb08a);
  transition: width .6s cubic-bezier(.2,.7,.2,1);
  position: relative;
  overflow: hidden;
}
.unit-progress-fill::after {
  content: '';
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.45), transparent);
  animation: progShine 2.4s ease-in-out infinite;
}
@keyframes progShine {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}
.unit-island.locked .unit-progress-fill { background: #c0c8d8; }
.unit-island.locked .unit-progress-fill::after { display: none; }
.unit-progress-text {
  font-size: 12px;
  color: #3d4a66;
  font-weight: 700;
  letter-spacing: 0.2px;
  display: flex; justify-content: space-between;
}
.unit-progress-text::after {
  content: attr(data-pct);
}

/* —— 岛间发光渐变路径 + 箭头（横向波浪间的 S 形连接） —— */
.link-connector {
  flex: 0 0 104px;
  height: 72px;
  align-self: center;
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  margin: 0 -8px;
}
.link-connector svg { width: 100%; height: 100%; overflow: visible; }
.connector-line {
  fill: none;
  stroke: #FF9900;
  stroke-width: 3.5;
  stroke-dasharray: 8 7;
  stroke-linecap: round;
  transition: all .4s ease;
  filter: drop-shadow(0 1px 2px rgba(255,153,0,0.15));
  opacity: 0.45;
}
.link-connector.lit .connector-line {
  stroke-dasharray: 10 7;
  opacity: 1;
  filter: drop-shadow(0 2px 6px rgba(255,153,0,0.35));
  animation: connFlow 18s linear infinite;
}
.conn-arrow {
  opacity: 0.4;
  fill: #FF9900;
  transition: opacity .4s;
}
.link-connector.lit .conn-arrow {
  opacity: 1;
  animation: arrowFloat 1.6s ease-in-out infinite;
}
@keyframes connFlow { to { stroke-dashoffset: -420; } }
@keyframes arrowFloat {
  0%, 100% { transform: translateX(0); opacity: 1; }
  50% { transform: translateX(3px); opacity: 0.75; }
}

/* 响应式：中屏收窄 */
@media (max-width: 1200px) {
  .island-map { padding: 44px 20px 30px !important; }
  .link-connector { flex-basis: 82px; height: 72px; margin: 0 -4px; }
  .island-main { padding: 18px 14px 14px; }
  .island-icon { width: 64px; height: 64px; border-radius: 18px; font-size: 32px; }
  .island-name { font-size: 20px; }
}
/* 窄屏（<1000px）：纵向排列，连接器旋转竖直，取消波浪错位 */
@media (max-width: 1000px) {
  .map-canvas { flex-direction: column; gap: 0; }
  .unit-island { flex: none; width: 100% !important; margin: 0 !important; transform: none; }
  .link-connector {
    flex-basis: 52px;
    width: 72px; height: 52px;
    transform: rotate(90deg);
    margin: -2px auto -2px;
  }
}
@media (max-width: 560px) {
  .island-map { padding: 24px 12px 30px !important; margin: 20px 0 44px !important; border-radius: 22px; }
  .lesson-tiles { grid-template-columns: 1fr 1fr; }
  .island-name { font-size: 18px; }
  .island-intro { font-size: 12px; }
}

/* ===========================================================
 * 欢迎气泡 v3：左下紧凑小卡（不挡卡片，≤ 260×84）
 * =========================================================== */
.greeting-bubble.greeting-pin {
  position: fixed;
  left: 22px;
  bottom: 136px;
  right: auto;
  top: auto;
  z-index: 45;
  width: min(260px, calc(calc(var(--vwpx, 1vw) * 100) - 44px));
  padding: 10px 12px 10px 36px;
  background: #fffdf8;
  border: 1.25px solid rgba(255,155,69,0.36);
  border-radius: 12px 12px 12px 4px;
  box-shadow: 0 12px 28px -10px rgba(30,50,90,0.18);
  color: var(--text-secondary);
  flex-direction: row;
  align-items: flex-start;
  gap: 8px;
}
.greeting-pinhead {
  position: absolute;
  left: 10px; top: 8px;
  font-size: 18px;
  filter: drop-shadow(0 1.5px 2px rgba(0,0,0,0.16));
  transform: rotate(-15deg);
  line-height: 1;
}
.greeting-pin .greeting-robot {
  position: static;
  width: 30px; height: 30px;
  border-radius: 50%;
  background: #fff4ec;
  display: flex; align-items: center; justify-content: center;
  font-size: 15px;
  flex: 0 0 auto;
  box-shadow: inset 0 0 0 1.5px #ffe3cf;
}
.greeting-pin .greeting-copy {
  display: grid; gap: 2px;
  font-size: 11.5px; line-height: 1.55;
  min-width: 0;
}
.greeting-pin .greeting-copy strong {
  font-size: 12.5px;
  color: var(--text-primary);
  font-weight: 800;
  line-height: 1.3;
}
.greeting-pin .greeting-close {
  position: absolute;
  right: 8px; top: 6px;
  width: 20px; height: 20px;
  background: transparent;
  color: #b08a66;
  font-size: 17px;
  line-height: 1;
}
.greeting-pin .greeting-close:hover {
  color: var(--book-7a);
  background: #fff0e2;
  border-radius: 50%;
}
@media (max-width: 900px) {
  .greeting-bubble.greeting-pin { bottom: 160px; }
}
@media (max-width: 720px) {
  .greeting-bubble.greeting-pin {
    left: 12px; bottom: 14px;
    width: calc(calc(var(--vwpx, 1vw) * 100) - 24px);
    padding: 10px 12px 10px 32px;
  }
  .greeting-pinhead { left: 8px; top: 7px; font-size: 16px; }
}

/* ===========================================================
 * 彩虹册别糖豆 v5：紧凑横条（整区 ≤ 130px，塞进一屏）
 * =========================================================== */
.bookshelf-v4 {
  max-width: none;
  margin: 0 0 12px;
  padding: 12px 22px 16px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.95), rgba(255,255,255,0.82)),
    repeating-linear-gradient(45deg, rgba(74,144,226,0.025) 0 10px, transparent 10px 20px);
  border: 1px solid var(--border);
  border-radius: 22px;
  box-shadow: 0 14px 34px -16px rgba(30,50,90,0.15), 0 6px 16px -10px rgba(30,50,90,0.07);
  max-height: 140px;
}
.bookshelf-head-v4 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.bsh-icon {
  font-size: 20px;
  width: 32px; height: 32px;
  border-radius: 10px;
  background: linear-gradient(135deg, #fff4ec, #ffe3cf);
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset 0 0 0 1.5px #ffd2b3;
}
.bsh-text { flex: 1; min-width: 0; }
.bsh-title {
  font-size: 13.5px; font-weight: 900;
  color: var(--text-primary);
  letter-spacing: 0.3px;
  line-height: 1;
}
.bsh-tip {
  font-size: 11px;
  color: var(--text-secondary);
  font-weight: 600;
  margin-top: 3px;
  line-height: 1;
}
.bsh-tip b { color: var(--text-primary); }
.bsh-theme { font-weight: 800; letter-spacing: 0.3px; }
.bsh-stars {
  padding: 6px 14px;
  background: linear-gradient(135deg, #fff7e0, #ffe58a);
  color: #985f00;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 800;
  box-shadow: inset 0 0 0 1.5px #ffd95c;
  white-space: nowrap;
  line-height: 1;
}
.bsh-stars b { color: var(--text-primary); font-size: 13px; margin: 0 1.5px; }
.bsh-star { filter: drop-shadow(0 1px 1px rgba(0,0,0,0.12)); }

.shelf-v4-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 10px;
}
.shelf-v4 {
  --c: var(--book-7a);
  position: relative;
  background: linear-gradient(180deg, color-mix(in srgb, var(--c) 11%, white), #ffffff 72%);
  border: 1.5px solid color-mix(in srgb, var(--c) 42%, white);
  border-radius: 14px;
  padding: 10px 10px 9px;
  cursor: pointer;
  transition: transform .2s cubic-bezier(.2,.7,.2,1), box-shadow .2s, border-color .2s;
  font-family: inherit;
  color: inherit;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-height: 72px;
  overflow: hidden;
  box-shadow:
    0 6px 14px -8px color-mix(in srgb, var(--c) 28%, rgba(30,50,90,0.10)),
    inset 0 1px 0 rgba(255,255,255,0.9);
}
.shelf-v4::before {
  content: '';
  position: absolute;
  top: -14px; right: -16px;
  width: 64px; height: 64px;
  border-radius: 50%;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--c) 20%, transparent), transparent 70%);
  pointer-events: none;
  transition: opacity .2s;
  opacity: 0.85;
}
.shelf-v4:hover:not(:disabled) {
  transform: translateY(-2.5px);
  box-shadow:
    0 14px 24px -10px color-mix(in srgb, var(--c) 40%, rgba(30,50,90,0.18)),
    0 6px 14px -8px rgba(30,50,90,0.12);
  border-color: var(--c);
}
.shelf-v4.active {
  border-color: var(--c);
  background: linear-gradient(180deg, color-mix(in srgb, var(--c) 18%, #fff), #fff 78%);
  transform: translateY(-2px);
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--c) 28%, white),
    0 14px 26px -12px color-mix(in srgb, var(--c) 44%, rgba(30,50,90,0.20));
}
.shelf-v4.active::after {
  content: '\2713';
  position: absolute;
  top: 6px; right: 8px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--c);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 10.5px; font-weight: 900;
  box-shadow: 0 2px 6px color-mix(in srgb, var(--c) 42%, transparent);
  z-index: 2;
}
.shelf-v4.draft { opacity: 0.72; filter: saturate(0.6); }

.sv4-top {
  display: flex; align-items: center; justify-content: space-between;
  gap: 5px;
}
.sv4-emoji {
  font-size: 22px;
  line-height: 1;
  filter: drop-shadow(0 1.5px 3px rgba(0,0,0,0.08));
  transition: transform .2s;
}
.shelf-v4:hover .sv4-emoji { transform: scale(1.08) rotate(-4deg); }
.sv4-stars {
  padding: 2px 6px;
  background: rgba(255,255,255,0.85);
  border: 1px solid color-mix(in srgb, var(--c) 28%, white);
  border-radius: 999px;
  font-size: 9.5px;
  font-weight: 800;
  color: var(--c);
  white-space: nowrap;
  line-height: 1.2;
}
.sv4-stars.dim { color: #9aa7c0; border-color: #dde3ee; background: #f8faff; }
.sv4-title {
  font-size: 12.5px;
  font-weight: 900;
  color: var(--text-primary);
  letter-spacing: 0.15px;
  line-height: 1.2;
  margin-top: -1px;
}
.shelf-v4.active .sv4-title { color: color-mix(in srgb, var(--c) 70%, #000); }
.sv4-theme {
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.4px;
  line-height: 1.1;
}
.sv4-state {
  margin-top: auto;
  padding-top: 1px;
}
.sv4-state > span {
  font-size: 9.5px;
  font-weight: 700;
  padding: 2.5px 7px;
  border-radius: 999px;
  border: 1px solid transparent;
  line-height: 1;
}
.sv4-now {
  background: var(--c);
  color: #fff;
  border-color: var(--c);
  box-shadow: 0 2px 6px color-mix(in srgb, var(--c) 38%, transparent);
}
.shelf-v4.active .sv4-now {
  background: rgba(255,255,255,0.92);
  color: var(--c);
}
.sv4-open {
  background: color-mix(in srgb, var(--c) 9%, #fff);
  color: var(--c);
  border-color: color-mix(in srgb, var(--c) 22%, white);
}
.sv4-pending {
  background: #f1f3f8;
  color: #8993a8;
  border-color: #dde3ee;
}

/* 册色映射（.shelfv4-xxx） */
.shelf-v4.shelfv4-orange  { --c: #FF7A45; }
.shelf-v4.shelfv4-blue    { --c: #4A90E2; }
.shelf-v4.shelfv4-purple  { --c: #8E44AD; }
.shelf-v4.shelfv4-pink    { --c: #E91E63; }
.shelf-v4.shelfv4-teal    { --c: #16A085; }
.shelf-v4.shelfv4-yellow  { --c: #F39C12; }
.shelf-v4.shelfv4-cyan    { --c: #00BCD4; }
.shelf-v4.shelfv4-red     { --c: #C0392B; }
.shelf-v4.shelfv4-magenta { --c: #D81B60; }
.shelf-v4.shelfv4-green   { --c: #27AE60; }
.shelf-v4.shelfv4-indigo  { --c: #3F51B5; }

@media (max-width: 1260px) { .shelf-v4-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 920px)  {
  .bookshelf-v4 { max-height: none; }
  .shelf-v4 { min-height: 74px; }
  .bsh-stars { width: 100%; text-align: center; }
}
@media (max-width: 520px)  {
  .bookshelf-v4 { padding: 12px 14px 14px; border-radius: 18px; margin-bottom: 10px; }
  .shelf-v4 { min-height: 72px; padding: 9px 8px 8px; }
  .sv4-title { font-size: 12px; }
  .sv4-emoji { font-size: 20px; }
  .bookshelf-head-v4 .bsh-stars { display: none; }
}

/* ===========================================================
 * 教师登录页 v2.0 —— 双栏式品牌 + 登录卡
 * 左侧：品牌价值主张（深色玻璃感）
 * 右侧：登录卡（毛玻璃 + 渐变光）
 * =========================================================== */
/* ===========================================================
 * 教师登录页 v2.0 —— 双栏式品牌 + 登录卡
 * 左侧：品牌价值主张（深色玻璃感）
 * 右侧：登录卡（毛玻璃 + 渐变光）
/* ===========================================================
 * 教师登录页 v2.0 —— 双栏式品牌 + 登录卡
 * 左侧：品牌价值主张（深色玻璃感）
 * 右侧：登录卡（毛玻璃 + 渐变光）
 * 适配 body.is-teacher 深色背景
 * =========================================================== */
body.is-teacher .login-hero {
  position: relative;
  min-height: calc(var(--vhpx, 1vh) * 100);
  display: flex; align-items: center; justify-content: center;
  padding: 16px 20px;
  overflow: hidden;
}
.t-login-bg {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(900px 540px at 78% 12%, rgba(37,99,235,.10), transparent 60%),
    radial-gradient(720px 480px at 8% 88%, rgba(78,205,196,.08), transparent 55%),
    #f1f5f9;
}
.t-grid {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background-image:
    linear-gradient(rgba(37,99,235,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37,99,235,.07) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, #000 30%, transparent 80%);
}
.t-glow {
  position: absolute; border-radius: 50%;
  filter: blur(80px); opacity: .5;
  animation: tGlowPulse 8s ease-in-out infinite;
}
.t-glow-1 { width: 380px; height: 380px; top: -60px; right: -40px; background: radial-gradient(circle, rgba(37,99,235,.30), transparent 70%); }
.t-glow-2 { width: 320px; height: 320px; bottom: -60px; left: -40px; background: radial-gradient(circle, rgba(78,205,196,.24), transparent 70%); animation-delay: -4s; }
.t-glow-3 { width: 220px; height: 220px; top: 30%; left: 40%; background: radial-gradient(circle, rgba(69,183,209,.20), transparent 70%); animation-delay: -2s; }
@keyframes tGlowPulse {
  0%, 100% { transform: scale(1); opacity: .45; }
  50% { transform: scale(1.15); opacity: .65; }
}
.t-orbits { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; }

.t-login-content {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px;
  max-width: 1280px; width: 100%;
  align-items: stretch;
}

/* 左侧品牌区 */
.t-brand { color: #2d3748; }
/* 教育场景图面板（参考 Colorlib v17 分屏式：左图右表单） */
.t-brand-photo {
  position: relative; border-radius: 24px; overflow: hidden;
  height: 100%; min-height: 640px; background: #16294d;
  box-shadow: 0 24px 60px rgba(15,23,42,.28);
}
.t-brand-img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.t-brand-overlay {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(15,26,46,.46) 0%, rgba(15,26,46,.16) 42%, rgba(15,26,46,.84) 100%),
    linear-gradient(90deg, rgba(15,26,46,.50) 0%, rgba(15,26,46,.12) 55%);
}
.t-brand-inner {
  position: relative; z-index: 2; height: 100%;
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 52px 48px 44px; color: #fff;
}
/* 图片面板上的文字统一改白色系 */
.t-brand-photo .t-logo-title { background: none; -webkit-background-clip: initial; background-clip: initial; -webkit-text-fill-color: #fff; color: #fff; }
.t-brand-photo .t-logo-sub { color: rgba(255,255,255,.75); }
.t-brand-photo .t-brand-line { color: #fff; }
.t-brand-photo .t-bl-item { color: rgba(255,255,255,.88); }
.t-brand-photo .t-brand-foot {
  background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.22);
  color: rgba(255,255,255,.85); backdrop-filter: blur(8px);
}
.t-logo { display: flex; align-items: center; gap: 20px; margin-bottom: 48px; }
.t-logo-mark { width: 80px; height: 80px; border-radius: 20px; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, rgba(79,140,255,.15), rgba(70,200,224,.10));
  border: 1px solid rgba(79,140,255,.30);
  box-shadow: 0 8px 28px rgba(79,140,255,.20);
}
.t-logo-text { line-height: 1.2; }
.t-logo-title {
  font-size: 40px; font-weight: 900; letter-spacing: .5px; white-space: nowrap;
  background: linear-gradient(135deg, #1e3a5f 0%, #4f8cff 50%, #46c8e0 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 2px 20px rgba(79,140,255,.15);
}
.t-logo-sub {
  font-size: 21px; color: #5a6b7f; font-weight: 500; margin-top: 8px; letter-spacing: .5px;
  display: flex; align-items: center; gap: 10px;
}
.t-logo-sub::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%;
  background: linear-gradient(135deg, #4f8cff, #46c8e0);
  box-shadow: 0 0 0 4px rgba(79,140,255,.18);
}

.t-brand-desc { margin-bottom: 32px;
  background: rgba(255,255,255,.55); backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 24px; padding: 36px 36px 32px;
  box-shadow: 0 8px 32px rgba(79,140,255,.10), inset 0 1px 0 rgba(255,255,255,.9);
}
.t-brand-line {
  font-size: 52px; font-weight: 800; line-height: 1.25; margin-bottom: 28px;
  color: #1e3a5f; letter-spacing: 1px;
  background: linear-gradient(135deg, #1e3a5f 0%, #4f8cff 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  position: relative; padding-left: 20px;
  white-space: nowrap; overflow: hidden;
}
.t-brand-line::before {
  content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 6px;
  background: linear-gradient(180deg, #4f8cff 0%, #46c8e0 100%);
  border-radius: 3px;
  box-shadow: 0 0 12px rgba(79,140,255,.5);
}
.t-brand-list { display: flex; flex-direction: column; gap: 14px; }
.t-bl-item {
  display: flex; align-items: center; gap: 14px;
  font-size: 21px; color: #2d3748; font-weight: 600;
  padding: 14px 20px;
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(79,140,255,.15);
  border-radius: 16px;
  transition: all .2s ease;
}
.t-bl-item:hover {
  background: rgba(255,255,255,.95);
  border-color: rgba(79,140,255,.35);
  transform: translateX(4px);
  box-shadow: 0 4px 16px rgba(79,140,255,.12);
}
.t-bl-dot { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0;
  box-shadow: 0 0 0 5px rgba(79,140,255,.15); }
.t-bl-dot-1 { background: linear-gradient(135deg, #4f8cff, #7cb3ff); box-shadow: 0 0 0 5px rgba(79,140,255,.18); }
.t-bl-dot-2 { background: linear-gradient(135deg, #46c8e0, #6dd5ed); box-shadow: 0 0 0 5px rgba(70,200,224,.18); }
.t-bl-dot-3 { background: linear-gradient(135deg, #c9a96a, #e6c77a); box-shadow: 0 0 0 5px rgba(201,169,106,.18); }
.t-bl-dot-4 { background: linear-gradient(135deg, #3fae8e, #5cc9a8); box-shadow: 0 0 0 5px rgba(63,174,142,.18); }

.t-brand-foot {
  font-size: 20px; color: #2d3748; display: flex; align-items: center; gap: 12px;
  padding: 18px 28px;
  background: rgba(255,255,255,.7);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(79,140,255,.2);
  border-radius: 16px; width: fit-content;
  box-shadow: 0 4px 20px rgba(79,140,255,.10), inset 0 1px 0 rgba(255,255,255,.9);
  transition: all .2s ease;
}
.t-brand-foot:hover {
  background: rgba(255,255,255,.95);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(79,140,255,.18);
}
.t-bf-ico { font-size: 22px; }
.t-bf-link { color: #d97706; text-decoration: none; font-weight: 700; transition: .15s; }
.t-bf-link:hover { color: #2563eb; }

/* 右侧登录卡 */
.t-login-card {
  position: relative;
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 28px;
  padding: 56px 56px 48px;
  box-shadow: 0 24px 60px rgba(79,140,255,.12), inset 0 1px 0 rgba(255,255,255,.9);
  overflow: hidden;
  height: 100%;
  display: flex; flex-direction: column; justify-content: center;
}
.t-login-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(37,99,235,.5), rgba(79,140,255,.5), transparent);
}
.t-lc-tag {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(37,99,235,.08); border: 1px solid rgba(37,99,235,.30);
  color: #2563eb; font-size: 16px; font-weight: 700;
  padding: 8px 18px; border-radius: 999px;
  margin-bottom: 24px; letter-spacing: .5px;
}
.t-lc-title { color: #2d3748; font-size: 40px; font-weight: 800; margin-bottom: 10px; letter-spacing: 1px; }
.t-lc-sub { color: #5a6b7f; font-size: 19px; margin-bottom: 36px; }
.t-lc-field { margin-bottom: 24px; }
.t-lc-field label { display: block; color: #5a6b7f; font-size: 17px; font-weight: 600; margin-bottom: 10px; letter-spacing: .3px; }
.t-lc-field input {
  width: 100%; padding: 22px 28px;
  background: rgba(248,250,252,.8);
  border: 1px solid #e2e8f0;
  border-radius: 16px; color: #2d3748; font-size: 22px;
  font-family: inherit; transition: .15s;
}
.t-lc-field input:focus { outline: none; border-color: #4f8cff; box-shadow: 0 0 0 4px rgba(79,140,255,.15); background: #ffffff; }
.t-lc-field input::placeholder { color: #a0aec0; }

/* 密码输入框：带显示/隐藏眼睛图标 */
.pwd-input-wrap { position: relative; }
.pwd-input-wrap input { padding-right: 60px; }
.pwd-eye {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  width: 48px; height: 48px; border-radius: 12px;
  border: 0; background: transparent; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; color: #94a3b8; transition: .15s;
}
.pwd-eye:hover { background: rgba(79,140,255,.10); color: #4f8cff; }
.pwd-eye:active { transform: translateY(-50%) scale(.95); }
.caps-tip {
  margin-top: 8px; padding: 6px 10px;
  font-size: 12px; color: #1d4ed8;
  background: #eff6ff; border: 1px solid #bfdbfe;
  border-radius: 8px;
  display: inline-flex; align-items: center; gap: 5px;
}
.caps-tip span { font-size: 13px; }

.t-lc-btn {
  width: 100%; padding: 24px 32px;
  background: linear-gradient(95deg, #4f8cff 0%, #46c8e0 100%);
  color: #fff; font-size: 23px; font-weight: 800;
  border-radius: 16px; border: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin-top: 14px; box-shadow: 0 8px 24px rgba(79,140,255,.32);
  transition: .18s; letter-spacing: 1px;
}
.t-lc-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(79,140,255,.42); }
.t-lc-btn:active { transform: translateY(0); }
.t-lc-arrow { transition: .15s; }
.t-lc-btn:hover .t-lc-arrow { transform: translateX(4px); }

.t-lc-hint {
  margin-top: 24px; padding: 14px 16px;
  background: rgba(255,107,53,.05); border: 1px dashed rgba(255,107,53,.30);
  border-radius: 12px; color: #b45309; font-size: 14px;
  display: flex; align-items: center; gap: 8px;
}
.t-lc-hint code { background: #fff3ed; color: #ff6b35; padding: 2px 8px; border-radius: 4px; font-weight: 700; font-family: monospace; }
.t-lc-hint-dot { width: 7px; height: 7px; border-radius: 50%; background: #ff6b35; box-shadow: 0 0 0 3px rgba(255,107,53,.18); animation: tDotPulse 1.6s ease-in-out infinite; }
@keyframes tDotPulse { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }


/* 响应式：窄屏上下排 */
@media (max-width: 900px) {
  .t-login-content { grid-template-columns: 1fr; gap: 28px; }
  .t-brand-photo { min-height: 420px; }
  .t-brand-inner { padding: 36px 32px 32px; }
  .t-brand-line { font-size: 30px; }
  .t-login-card { padding: 40px 32px 34px; }
}
/* 中等屏：标题缩回一档，防止换行 */
@media (min-width: 901px) and (max-width: 1280px) {
  .t-logo-title { font-size: 30px; }
  .t-logo-sub { font-size: 18px; }
  .t-brand-line { font-size: 42px; }
  .t-bl-item { font-size: 18px; }
  .t-brand-desc { padding: 28px 28px 24px; }
  .t-login-card { padding: 40px 36px 34px; }
  .t-lc-title { font-size: 32px; }
  .t-lc-sub { font-size: 17px; }
  .t-lc-field input { font-size: 18px; padding: 16px 20px; }
  .t-lc-btn { font-size: 19px; padding: 18px 24px; }
}

/* ===========================================================
 * 教师端 · 标准版式 6 页面（训练成绩/试卷测验/作品展示/学期报告/备课中心/机房座次）
 * 统一令牌：#ff6b35 主色 / #2d3748 主字 / #5a6b7f 副字 / #a0aec0 弱字 / #e2e8f0 边框 / #edf2f7 分隔
 * =========================================================== */

/* —— 通用 view-header（原版式各页共用） —— */
body.is-teacher .view-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; }
body.is-teacher .view-title { font-size: 22px; color: #2d3748; font-weight: 700; }
body.is-teacher .view-subtitle { color: #5a6b7f; margin-top: 4px; font-size: 13px; }
body.is-teacher .filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
body.is-teacher .select-wrap select { border: 1.5px solid #e2e8f0; border-radius: 10px; padding: 8px 12px; font-size: 13px; background: #fff; color: #2d3748; }
body.is-teacher .btn { border: none; border-radius: 10px; padding: 8px 16px; font-size: 13px; font-weight: 600; cursor: pointer; font-family: inherit; }
body.is-teacher .btn-ghost { border: 1.5px solid #e2e8f0; color: #5a6b7f; background: #fff; }
body.is-teacher .btn-ghost:hover { background: #f1f5f9; color: #2d3748; }
body.is-teacher .btn-primary { background: linear-gradient(135deg, #2563eb, #3b82f6); color: #fff; box-shadow: 0 2px 8px rgba(79,107,246,.25); }
body.is-teacher .btn.mini { min-height: 28px; padding: 4px 12px; font-size: 12px; }

/* ===========================================================
 * 训练成绩（.tc-root）
 * =========================================================== */
body.is-teacher .tc-root { display: flex; flex-direction: column; gap: 18px; }
body.is-teacher .tc-subtabs { background: #f7f9fc; border-radius: 12px; gap: 4px; width: fit-content; padding: 4px; display: flex; }
body.is-teacher .tc-subtab { border: none; border-radius: 9px; padding: 8px 18px; font-size: 13px; font-weight: 600; color: #5a6b7f; cursor: pointer; background: transparent; font-family: inherit; }
body.is-teacher .tc-subtab.active { color: #2563eb; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.08); }

/* —— 基础训练：顶层子 Tab —— */
body.is-teacher .tc-top-subtabs { display: flex; gap: 8px; margin-bottom: 4px; }
body.is-teacher .tc-top-sub {
  border: 1px solid transparent; background: #f7f9fc; color: #5a6b7f; font-weight: 600;
  border-radius: 12px; padding: 10px 22px; cursor: pointer; font-size: 14px; font-family: inherit;
}
body.is-teacher .tc-top-sub.active { color: #2563eb; background: #fff; border-color: #dbeafe; box-shadow: 0 1px 3px rgba(37,99,235,.1); }

/* —— 基础训练：入口网格 —— */
body.is-teacher .tc-entry { display: flex; flex-direction: column; gap: 16px; }
body.is-teacher .tc-entry-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px;
}
body.is-teacher .tc-entry-card {
  background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; padding: 16px;
  display: flex; flex-direction: column; gap: 8px; transition: transform .15s, box-shadow .15s;
}
body.is-teacher .tc-entry-card:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,.08); }
body.is-teacher .tc-entry-card.tec-打字训练 { border-top: 3px solid #3b82f6; }
body.is-teacher .tc-entry-card.tec-基础操作 { border-top: 3px solid #10b981; }
body.is-teacher .tc-entry-card.tec-软件实训 { border-top: 3px solid #8b5cf6; }
body.is-teacher .tc-entry-card.tec-综合实践 { border-top: 3px solid #f59e0b; }
body.is-teacher .tec-top { display: flex; justify-content: space-between; align-items: center; }
body.is-teacher .tec-cat { font-size: 11px; font-weight: 700; color: #fff; padding: 3px 10px; border-radius: 9999px; }
body.is-teacher .tec-打字训练 .tec-cat { background: #3b82f6; }
body.is-teacher .tec-基础操作 .tec-cat { background: #10b981; }
body.is-teacher .tec-软件实训 .tec-cat { background: #8b5cf6; }
body.is-teacher .tec-综合实践 .tec-cat { background: #f59e0b; }
body.is-teacher .tec-diff { font-size: 10px; color: #f59e0b; font-weight: 700; }
body.is-teacher .tec-emoji { font-size: 40px; text-align: center; margin: 4px 0; }
body.is-teacher .tec-title { font-size: 14px; font-weight: 700; color: #2d3748; text-align: center; line-height: 1.3; min-height: 36px; display: flex; align-items: center; justify-content: center; }
body.is-teacher .tec-meta { font-size: 11px; color: #a0aec0; text-align: center; }
body.is-teacher .tec-row { display: flex; justify-content: space-between; align-items: center; margin-top: 2px; }
body.is-teacher .tec-stat { font-size: 11px; color: #6b7280; font-weight: 600; }
body.is-teacher .tec-btn {
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); color: #fff; border: none;
  border-radius: 8px; padding: 6px 12px; font-size: 11px; font-weight: 700; cursor: pointer;
  font-family: inherit;
}
body.is-teacher .tec-btn:hover { opacity: .9; }
body.is-teacher .tc-entry-empty { text-align: center; padding: 40px; color: #a0aec0; font-size: 14px; }

body.is-teacher .stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; }
body.is-teacher .stat-card { border: 1px solid #e2e8f0; background: #fff; border-radius: 14px; padding: 18px 20px; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
body.is-teacher .stat-label { font-size: 12px; font-weight: 600; color: #5a6b7f; }
body.is-teacher .stat-value { margin: 6px 0 4px; font-size: 30px; font-weight: 800; color: #2d3748; }
body.is-teacher .stat-value small { font-size: 14px; font-weight: 600; color: #a0aec0; }
body.is-teacher .tc-table-wrap { border: 1px solid #e2e8f0; background: #fff; border-radius: 14px; overflow: hidden; }
body.is-teacher .tc-table { border-collapse: collapse; width: 100%; font-size: 13px; }
body.is-teacher .tc-table th { background: linear-gradient(180deg, #f7fafe, #eef3fb); padding: 13px 14px; font-size: 20px; font-weight: 800; color: #4338ca; text-align: left; letter-spacing: .5px; border-bottom: 2px solid #bfdbfe; box-shadow: inset 0 -3px 0 #2563eb; }
body.is-teacher .tc-table td { padding: 12px 14px; border-bottom: 1px solid #f3f4f6; color: #2d3748; text-align: left; }
body.is-teacher .tc-table th.c, body.is-teacher .tc-table .c { text-align: center; }
body.is-teacher .tc-table .r { text-align: right; }
body.is-teacher .tc-avatar { width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; font-weight: 800; margin-right: 10px; vertical-align: middle; }
body.is-teacher .tc-badge { border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 700; display: inline-block; }
body.is-teacher .tc-badge.green { background: #e8f8ef; color: #27ae60; }

/* ===========================================================
   软件实训 · 桌面实训场（标准版式）
   结构：sim-topbar 顶栏 / sim-desktop 天空桌面 / sim-taskbar 任务栏
        sim-startmenu 开始菜单 / sim-courses 课程选择页
   =========================================================== */
.sim-root { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 40; display: flex; flex-direction: column; background: #f4f6f9; }

/* ---- 顶栏 ---- */
.sim-topbar { flex: 0 0 68px; height: 68px; background: #fff; display: flex; align-items: center; justify-content: space-between; padding: 0 22px; box-shadow: 0 2px 8px rgba(0,0,0,.08); position: relative; z-index: 5; }
.sim-topbar-left { display: flex; align-items: center; gap: 20px; min-width: 0; }
.sim-back { display: inline-flex; align-items: center; gap: 6px; border: none; background: linear-gradient(135deg, #8b5cf6, #7c3aed); color: #fff; cursor: pointer; padding: 10px 20px 10px 14px; border-radius: 999px; font-family: inherit; font-size: 16px; font-weight: 700; box-shadow: 0 4px 14px rgba(139, 92, 246, .35); transition: all .2s ease; }
.sim-back svg { width: 18px; height: 18px; flex-shrink: 0; }
.sim-back:hover { background: linear-gradient(135deg, #7c3aed, #6d28d9); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(139, 92, 246, .45); color: #fff; }
.sim-titles { line-height: 1.3; }
.sim-crumb { font-size: 18px; color: #4a5568; font-weight: 600; }
.sim-page-title { font-size: 30px; font-weight: 800; color: #1a202c; letter-spacing: 1px; }
.sim-topbar-right { display: flex; align-items: center; gap: 6px; }
.sim-done { font-size: 15px; color: #333; margin-right: 6px; }
.sim-done b { color: #000; }
.sim-ico { width: 36px; height: 36px; border: none; background: none; border-radius: 8px; cursor: pointer; font-size: 18px; line-height: 1; color: #5a6b7f; font-family: inherit; }
.sim-ico:hover { background: #f0f4ff; }

/* ---- 桌面背景（清爽大气壁纸） ---- */
.sim-desktop { flex: 1; position: relative; overflow: hidden; background: #e6f3fb url('imgs/sim-bg.jpg') center center / cover no-repeat; }

.sim-tip { position: absolute; left: 50%; top: 30px; transform: translateX(-50%); display: flex; align-items: center; gap: 10px; background: rgba(255,255,255,.94); border-radius: 999px; padding: 12px 26px 12px 15px; font-size: 17px; font-weight: 600; color: #000; box-shadow: 0 10px 28px rgba(40,100,160,.20); white-space: nowrap; z-index: 2; }
.sim-tip-bot { font-size: 30px; line-height: 1; }

/* ---- 桌面软件图标（放大 + 精致化） ---- */
.sim-icons { position: absolute; left: 56px; top: 104px; display: grid; grid-template-columns: repeat(3, 142px); row-gap: 40px; z-index: 1; }
.sim-icon { width: 128px; text-align: center; padding: 12px 4px 13px; margin: 0 auto; border-radius: 20px; cursor: pointer; user-select: none; border: 2px solid transparent; transition: transform .18s ease, background .18s ease, border-color .18s ease; }
.sim-icon:hover { transform: translateY(-4px); background: rgba(255,255,255,.5); }
.sim-icon.sel { background: rgba(255,255,255,.72); border-color: var(--ac, #2b9cf0); box-shadow: 0 10px 24px rgba(31,74,128,.16); }
.sim-icon-tile { position: relative; width: 90px; height: 90px; margin: 0 auto; background: linear-gradient(155deg, #ffffff 0%, #f2f8ff 100%); border-radius: 24px; box-shadow: 0 12px 26px rgba(31,74,128,.18), 0 3px 8px rgba(31,74,128,.10), inset 0 2px 0 rgba(255,255,255,.95); display: flex; align-items: center; justify-content: center; overflow: hidden; transition: box-shadow .18s ease, transform .18s ease; }
.sim-icon-tile::before { content: ''; position: absolute; left: 50%; top: 42%; width: 78px; height: 78px; transform: translate(-50%,-50%); border-radius: 50%; background: radial-gradient(circle, var(--ac, #2b9cf0) 0%, rgba(255,255,255,0) 72%); opacity: .15; pointer-events: none; }
.sim-icon:hover .sim-icon-tile { transform: scale(1.05); box-shadow: 0 16px 32px rgba(31,74,128,.24), 0 4px 10px rgba(31,74,128,.12), inset 0 2px 0 rgba(255,255,255,.95); }
.sim-icon-tile span { position: relative; z-index: 1; font-size: 43px; font-weight: 800; line-height: 1; filter: drop-shadow(0 2px 3px rgba(31,74,128,.18)); }
.sim-icon-name { margin-top: 11px; font-size: 18px; font-weight: 700; color: #1b4a7a; text-shadow: 0 1px 0 rgba(255,255,255,.95), 0 2px 8px rgba(255,255,255,.95); }
.sim-icon-badge { display: inline-block; margin-top: 8px; background: rgba(255,255,255,.92); border-radius: 999px; padding: 3px 14px; font-size: 14px; font-weight: 800; color: var(--ac, #2b9cf0); box-shadow: 0 3px 10px rgba(31,74,128,.14); }

/* ---- 任务栏 ---- */
.sim-taskbar { flex: 0 0 54px; background: #1e2a4a; display: flex; align-items: center; gap: 16px; padding: 0 14px; position: relative; z-index: 6; }
.sim-start { display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 18px; border: none; border-radius: 8px; background: transparent; color: #fff; font-size: 18px; font-weight: 700; cursor: pointer; font-family: inherit; }
.sim-start:hover { background: rgba(255,255,255,.12); }
.sim-start.open { background: #ff6b35; }
.sim-start-logo { width: 7px; height: 7px; background: #fff; box-shadow: 10px 0 #fff, 0 10px #fff, 10px 10px #fff; margin-right: 4px; flex: 0 0 auto; }
.sim-tb-label { font-size: 17px; color: #d6ddef; font-weight: 600; }
.sim-tb-clock { margin-left: auto; font-size: 18px; font-weight: 700; color: #fff; letter-spacing: 1px; }

/* ---- 开始菜单 ---- */
.sim-startmenu { position: absolute; left: 10px; bottom: 56px; width: 252px; background: #fff; border-radius: 18px; box-shadow: 0 18px 50px rgba(15,45,85,.30); padding: 10px; z-index: 7; }
.sim-sm-head { font-size: 13px; color: #666; padding: 6px 10px 8px; }
.sim-sm-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border: none; background: none; border-radius: 12px; cursor: pointer; text-align: left; font-family: inherit; }
.sim-sm-row:hover { background: #f4f7fd; }
.sim-sm-ico { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 19px; font-weight: 800; }
.sim-sm-name { flex: 1; font-size: 16px; font-weight: 600; color: #000; }
.sim-sm-n { font-size: 14px; color: #666; }
.sim-sm-play { font-size: 13px; color: #ff9f43; }

/* ---- 课程选择页 ---- */
.sim-courses { flex: 1; overflow-y: auto; width: 100%; background: #eaf4fb url('imgs/sim-courses-bg.jpg') center center / cover no-repeat; background-attachment: fixed; padding: 30px 24px 60px; display: flex; flex-direction: column; gap: 16px; }
.sim-app-card, .sim-free, .sim-lv-group { width: 100%; max-width: 760px; margin: 0 auto; }
.sim-app-card { background: #fff; border-radius: 22px; border-top: 5px solid var(--ac, #ff6b35); padding: 22px 26px; display: flex; align-items: center; gap: 18px; box-shadow: 0 6px 22px rgba(40,60,90,.08); }
.sim-app-ico { flex: 0 0 62px; width: 62px; height: 62px; border-radius: 16px; display: flex; align-items: center; justify-content: center; }
.sim-app-ico span { font-size: 32px; font-weight: 800; line-height: 1; }
.sim-app-name { font-size: 27px; font-weight: 800; line-height: 1.2; }
.sim-app-desc { font-size: 17px; color: #333; margin-top: 6px; }
.sim-app-pct { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.sim-app-track { width: 150px; height: 7px; border-radius: 99px; background: #edf0f5; overflow: hidden; }
.sim-app-track i { display: block; height: 100%; background: var(--ac, #ff6b35); border-radius: 99px; transition: width .4s; }
.sim-app-num { font-size: 19px; font-weight: 800; color: var(--ac, #ff6b35); min-width: 42px; text-align: right; }

.sim-free { display: flex; align-items: center; gap: 14px; width: 100%; text-align: left; background: rgba(255,250,240,.96); border: 2px dashed var(--ac, #ffab2e); border-radius: 18px; padding: 16px 22px; cursor: pointer; font-family: inherit; }
.sim-free:hover { background: #fff4d6; }
.sim-free-spark { font-size: 28px; line-height: 1; }
.sim-free-main { min-width: 0; }
.sim-free-main b { display: block; font-size: 20px; font-weight: 700; color: #000; }
.sim-free-main span { display: block; font-size: 16px; color: #666; margin-top: 4px; line-height: 1.5; }
.sim-free-right { margin-left: auto; flex: 0 0 auto; font-size: 16px; color: #666; white-space: nowrap; }
.sim-free-right i, .sim-course-right i { font-style: normal; color: #ff9f43; margin-left: 6px; font-size: 14px; }

.sim-course { display: flex; align-items: center; gap: 16px; width: 100%; max-width: 760px; margin: 0 auto; text-align: left; background: #fff; border: none; border-radius: 18px; padding: 16px 22px; cursor: pointer; font-family: inherit; box-shadow: 0 3px 12px rgba(40,60,90,.06); transition: transform .15s, box-shadow .15s; }
.sim-course:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(40,60,90,.11); }
.sim-course-ico { flex: 0 0 46px; width: 46px; height: 46px; border-radius: 13px; background: #f4f7fd; display: flex; align-items: center; justify-content: center; font-size: 26px; }
.sim-course-main { min-width: 0; }
.sim-course-main b { display: block; font-size: 20px; font-weight: 700; color: #000; }
.sim-course-main span { display: block; font-size: 16px; color: #333; margin-top: 3px; }
.sim-course-right { margin-left: auto; flex: 0 0 auto; font-size: 16px; color: #333; white-space: nowrap; }

/* ---- 级别分组（初级/中级/高级） ---- */
.sim-lv-group { display: flex; flex-direction: column; gap: 12px; }
.sim-lv-group.lock .sim-course { opacity: .55; filter: grayscale(.6); cursor: not-allowed; }
.sim-lv-head { display: flex; align-items: center; gap: 12px; padding: 4px 6px 0; }
.sim-lv-badge { font-size: 18px; font-weight: 800; color: #fff; background: linear-gradient(135deg, #ff9f43, #ff6b35); border-radius: 10px; padding: 4px 16px; letter-spacing: 2px; }
.sim-lv-group:nth-child(2) .sim-lv-badge { background: linear-gradient(135deg, #a78bfa, #8b5cf6); }
.sim-lv-group:nth-child(3) .sim-lv-badge { background: linear-gradient(135deg, #f87171, #ef4444); }
.sim-lv-sub { font-size: 14px; font-weight: 700; color: #c3ccd9; letter-spacing: 1.5px; }
.sim-lv-progress { margin-left: auto; font-size: 16px; color: #333; }
.sim-lv-lock { margin-left: auto; font-size: 16px; color: #666; }
.sim-course.done .sim-course-ico { background: #e8f8f0; }
.sim-course.done b { color: #2f9e6e; }
.sim-course-done { font-style: normal; color: #2f9e6e; font-size: 16px; margin-left: 6px; }
.sim-course-video { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; font-size: 15px; font-weight: 600; color: #00a1d6; background: #e8f7fd; border: 1px solid #c9ecfa; border-radius: 99px; padding: 3px 12px; cursor: pointer; transition: all .15s; }
.sim-course-video:hover { background: #d3f1fc; }

/* ---- AI 通识学习窗 ---- */
.ai-win { flex: 1; display: flex; flex-direction: column; overflow: hidden; background: #faf9ff; }
.ai-hero { display: flex; align-items: center; gap: 14px; padding: 16px 24px; background: #fff; border-bottom: 1px solid #ece7fb; }
.ai-hero-ico { flex: 0 0 52px; width: 52px; height: 52px; border-radius: 15px; background: linear-gradient(135deg, #ede9fe, #ddd3fd); display: flex; align-items: center; justify-content: center; font-size: 26px; }
.ai-hero-main { min-width: 0; }
.ai-hero-title { font-size: 19px; font-weight: 800; color: #4c3a99; }
.ai-hero-desc { font-size: 12.5px; color: #8f86b8; margin-top: 3px; }
.ai-hero-right { margin-left: auto; flex: 0 0 auto; font-size: 13px; color: #8f86b8; background: #f4f0ff; border-radius: 12px; padding: 8px 14px; font-weight: 600; }
.ai-hero-right b { color: #8b5cf6; font-size: 16px; }
.ai-hero-right b.ok { color: #2f9e6e; }
.ai-scroll { flex: 1; overflow-y: auto; padding: 20px 26px 40px; }
.ai-sec { margin-bottom: 26px; }
.ai-sec h3 { font-size: 15px; font-weight: 800; color: #4c3a99; margin-bottom: 12px; display: flex; align-items: center; gap: 6px; }
.ai-videos { display: flex; flex-direction: column; gap: 10px; }
.ai-video { display: flex; align-items: center; gap: 14px; width: 100%; text-align: left; background: #fff; border: 1px solid #ece7fb; border-radius: 14px; padding: 13px 16px; cursor: pointer; font-family: inherit; transition: all .15s; }
.ai-video:hover { border-color: #c9b8f8; box-shadow: 0 6px 18px rgba(139,92,246,.12); transform: translateY(-1px); }
.ai-video-play { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #fb7299, #00a1d6); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 15px; }
.ai-video-main { min-width: 0; flex: 1; }
.ai-video-main b { display: block; font-size: 14px; font-weight: 700; color: #2d3748; }
.ai-video-main span { display: block; font-size: 12px; color: #9aa7b6; margin-top: 2px; }
.ai-video-go { flex: 0 0 auto; font-size: 12px; font-weight: 700; color: #00a1d6; background: #e8f7fd; border-radius: 99px; padding: 5px 14px; }
.ai-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.ai-card { background: #fff; border: 1px solid #ece7fb; border-radius: 14px; padding: 15px 16px; box-shadow: 0 2px 8px rgba(139,92,246,.05); }
.ai-card b { display: block; font-size: 13.5px; font-weight: 800; color: #6d4fd6; margin-bottom: 6px; }
.ai-card p { font-size: 12.5px; color: #5a6b7f; line-height: 1.75; margin: 0; }
.ai-quiz { background: #fff; border: 1px solid #ece7fb; border-radius: 14px; padding: 15px 17px; margin-bottom: 12px; }
.ai-quiz.ok { border-color: #bfe9d2; background: #f7fdf9; }
.ai-quiz-q { font-size: 14px; font-weight: 700; color: #2d3748; margin-bottom: 11px; line-height: 1.5; display: flex; gap: 8px; }
.ai-quiz-no { flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%; background: #8b5cf6; color: #fff; font-size: 12px; display: flex; align-items: center; justify-content: center; margin-top: 1px; }
.ai-quiz.ok .ai-quiz-no { background: #2f9e6e; }
.ai-quiz-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.ai-opt { border: 1.5px solid #e4dff5; background: #faf8ff; border-radius: 10px; padding: 8px 16px; font-size: 13px; color: #4a5568; cursor: pointer; font-family: inherit; transition: all .15s; }
.ai-opt:hover { border-color: #c9b8f8; background: #fff; }
.ai-opt.right { border-color: #2f9e6e; background: #e8f8f0; color: #1f7a54; font-weight: 700; }
.ai-opt.wrong { border-color: #f28b82; background: #fdeceb; color: #c0392b; animation: sim-shake .4s; }
.ai-opt.faded { opacity: .5; cursor: default; }
.ai-quiz-ex { margin-top: 10px; font-size: 12.5px; color: #2f7a52; background: #e8f8f0; border-radius: 9px; padding: 9px 12px; line-height: 1.65; }

/* ---- B 站视频弹窗 ---- */
.sim-video-mask { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(20,16,40,.62); backdrop-filter: blur(3px); z-index: 90; display: flex; align-items: center; justify-content: center; padding: 24px; }
.sim-video-pop { width: min(920px, calc(var(--vwpx, 1vw) * 94)); background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 24px 70px rgba(20,16,40,.4); display: flex; flex-direction: column; }
.sim-video-head { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid #f0ecfa; }
.sim-video-title { min-width: 0; flex: 1; }
.sim-video-title b { display: block; font-size: 15px; font-weight: 800; color: #2d3748; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sim-video-title span { display: block; font-size: 12px; color: #9aa7b6; margin-top: 2px; }
.sim-video-close { flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%; border: none; background: #f4f0ff; color: #6d4fd6; font-size: 14px; cursor: pointer; }
.sim-video-close:hover { background: #e8e0fc; }
.sim-video-frame { position: relative; width: 100%; padding-top: 56.25%; background: #000; }
.sim-video-frame iframe, .sim-video-frame video { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0; object-fit: contain; }
.sim-video-foot { padding: 10px 18px; font-size: 11.5px; color: #b3a9d6; background: #faf8ff; }
body.is-teacher .tc-badge.gray { background: #f3f4f6; color: #a0aec0; }

/* ===========================================================
 * 软件实训 · 操作窗口（标准版式）
 * =========================================================== */
.sim-win { flex: 1; display: flex; flex-direction: row; overflow: hidden; background: #f4f6f9; }
.sim-app-col { flex: 1; display: flex; flex-direction: column; overflow: hidden; min-width: 0; }
.sim-side { flex: 0 0 240px; width: 240px; background: #fff; border-left: 1px solid #e1e6ed; display: flex; flex-direction: column; overflow-y: auto; }
.sim-side-h { font-size: 16px; font-weight: 700; color: #000; padding: 14px 16px 8px; }
.sim-side-body { padding: 0 14px 10px; }
.sim-task { display: flex; gap: 8px; font-size: 15px; color: #333; line-height: 1.55; padding: 7px 8px; border-radius: 8px; background: #f7fafc; margin-bottom: 6px; }
.sim-task-no { flex: 0 0 18px; width: 18px; height: 18px; border-radius: 50%; background: #ff6b35; color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-top: 1px; }
.sim-task-txt { flex: 1; }
.sim-side-tips { padding: 0 16px 16px; font-size: 15px; color: #333; line-height: 1.7; }

/* ---- 菜单栏 ---- */
.sim-menubar { flex: 0 0 36px; background: #f7f9fc; border-bottom: 1px solid #e1e6ed; display: flex; align-items: center; gap: 22px; padding: 0 18px; font-size: 15px; color: #333; }
.sim-menubar span { cursor: default; padding: 4px 2px; }
.sim-menubar span:hover { color: #2d3748; }

/* ---- 工具栏 ---- */
.sim-toolbar { flex: 0 0 auto; min-height: 46px; background: #fff; border-bottom: 1px solid #e1e6ed; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; padding: 6px 14px; }
.sim-tbtn { display: inline-flex; align-items: center; gap: 4px; border: 1px solid #e2e8f0; background: #fff; border-radius: 8px; padding: 5px 10px; font-size: 15px; font-weight: 600; color: #333; cursor: pointer; font-family: inherit; transition: all .15s; }
.sim-tbtn:hover { background: #f7fafc; border-color: #cbd5e0; }
.sim-tbtn.on { background: #ebf8ff; border-color: #63b3ed; color: #2b6cb0; }
.sim-tbtn.hot { animation: sim-pulse 1.2s infinite; box-shadow: 0 0 0 3px rgba(255,107,53,.25); border-color: #ff6b35; }
.sim-tbtn.hit { background: #c6f6d5; border-color: #68d391; color: #276749; }
.sim-tbtn.shake { animation: sim-shake .4s; }
.sim-tbtn-play { background: #fff5f5; border-color: #feb2b2; color: #c53030; }
.sim-tbtn-play:hover { background: #fed7d7; }
.sim-tbtn-run { background: #f0fff4; border-color: #9ae6b4; color: #276749; }
.sim-tbtn-run:hover { background: #c6f6d5; }
.sim-tsep { width: 1px; height: 22px; background: #e2e8f0; margin: 0 4px; }

.sim-colors { display: flex; align-items: center; gap: 5px; }
.sim-color { width: 20px; height: 20px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; padding: 0; }
.sim-color:hover { transform: scale(1.1); }
.sim-color.active { border-color: #2d3748; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #ff6b35; }
.sim-color.hot { animation: sim-pulse 1.2s infinite; }

/* ---- 工作区 ---- */
.sim-work { flex: 1; overflow: auto; padding: 16px; display: flex; align-items: center; justify-content: center; }
.sim-canvas { width: 100%; max-width: 760px; height: auto; background: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(40,60,90,.12); cursor: crosshair; touch-action: none; }

/* ---- 引导栏 ---- */
.sim-guide { flex: 0 0 auto; min-height: 44px; background: #fff; border-top: 1px solid #e1e6ed; padding: 10px 18px; font-size: 16px; color: #333; display: flex; align-items: center; }
.sim-guide b { color: #ff6b35; margin-right: 8px; }
.sim-guide-celebrate { display: flex; align-items: center; gap: 12px; color: #276749; font-weight: 700; }
.sim-guide-celebrate button { border: none; background: #48bb78; color: #fff; border-radius: 8px; padding: 5px 12px; font-size: 15px; font-weight: 600; cursor: pointer; font-family: inherit; }
.sim-guide-celebrate button:hover { background: #38a169; }

/* ---- Word ---- */
.sim-doc { width: 100%; max-width: 720px; min-height: 420px; background: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(40,60,90,.12); padding: 36px 44px; font-size: 18px; line-height: 1.9; color: #000; outline: none; }
.sim-doc-title { font-size: 26px; font-weight: 700; margin-bottom: 16px; }
.sim-doc.sim-center .sim-doc-title { text-align: center; }
.sim-doc.sim-bold .sim-doc-title { font-weight: 800; }
.sim-doc.sim-big .sim-doc-title { font-size: 30px; }
.sim-doc.sim-color .sim-doc-title { color: #e74c3c; }

/* ---- Excel ---- */
.sim-excel { align-items: flex-start; justify-content: center; gap: 20px; flex-wrap: wrap; }
.sim-xlsheet { background: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(40,60,90,.12); overflow: hidden; }
.sim-xlrow { display: flex; }
.sim-xlrow.sim-xlhead { background: #f7fafc; font-weight: 700; }
.sim-xlcell { width: 72px; height: 36px; border-right: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0; display: flex; align-items: center; justify-content: center; font-size: 15px; color: #000; position: relative; }
.sim-xlcell.corner { background: #edf2f7; }
.sim-xlcell.colh, .sim-xlcell.rowh { background: #f7fafc; color: #666; font-size: 14px; }
.sim-xlcell.sel { box-shadow: inset 0 0 0 2px #4299e1; background: #ebf8ff; }
.sim-xlcell.filled { background: #fff; color: #2d3748; font-weight: 600; }
.sim-xlcell.hot { animation: sim-pulse 1.2s infinite; box-shadow: inset 0 0 0 2px #ff6b35; }
.sim-xlinput { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: none; padding: 0 6px; font-size: 15px; outline: none; background: #fff; text-align: center; }
.sim-chart { width: 260px; min-height: 200px; background: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(40,60,90,.12); padding: 16px; }
.sim-chart-title { font-size: 16px; font-weight: 700; color: #000; margin-bottom: 12px; }
.sim-chart-bars { display: flex; align-items: flex-end; justify-content: center; gap: 18px; height: 140px; }
.sim-bar { width: 44px; background: linear-gradient(180deg, #63b3ed, #4299e1); border-radius: 6px 6px 0 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding-bottom: 6px; color: #fff; font-size: 14px; font-weight: 700; position: relative; }
.sim-bar span { position: absolute; bottom: -20px; color: #333; font-size: 14px; font-weight: 600; }
.sim-bar b { margin-bottom: 4px; }

/* ---- PowerPoint ---- */
.sim-ppt { width: 100%; max-width: 860px; gap: 14px; align-items: stretch; }
.sim-ppt-thumbs { width: 76px; display: flex; flex-direction: column; gap: 10px; }
.sim-ppt-thumb { height: 56px; background: #fff; border-radius: 8px; box-shadow: 0 2px 8px rgba(40,60,90,.10); display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: #718096; cursor: pointer; border: 2px solid transparent; }
.sim-ppt-thumb.active { border-color: #4299e1; color: #2b6cb0; }
.sim-ppt-stage { flex: 1; background: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(40,60,90,.12); min-height: 380px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.sim-slide { width: 100%; height: 100%; min-height: 380px; padding: 40px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.sim-slide-1 { background: linear-gradient(135deg, #fff5f5, #fff); }
.sim-ppt-placeholder { font-size: 18px; color: #a0aec0; border: 2px dashed #cbd5e0; border-radius: 12px; padding: 20px 40px; }
.sim-ppt-text { font-size: 28px; font-weight: 700; color: #2d3748; text-align: center; min-width: 200px; outline: none; }
.sim-ppt-img { width: 120px; height: 120px; background: #edf2f7; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 40px; margin-top: 24px; }
.sim-ppt-play { width: 100%; height: 100%; background: #1a202c; display: flex; align-items: center; justify-content: center; }
.sim-ppt-slide { color: #fff; font-size: 42px; font-weight: 700; text-align: center; line-height: 1.4; }
.sim-ppt-slide small { display: block; font-size: 16px; font-weight: 400; color: #a0aec0; margin-top: 12px; }

/* ---- Scratch ---- */
.sim-scratch { width: 100%; max-width: 960px; gap: 14px; align-items: stretch; justify-content: center; }
.sim-scratch-blocks { width: 170px; background: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(40,60,90,.12); padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.sim-block-title { font-size: 11px; font-weight: 700; color: #718096; margin: 6px 0 2px; }
.sim-block { border: none; border-radius: 6px; padding: 8px 10px; font-size: 12px; font-weight: 600; color: #fff; cursor: pointer; font-family: inherit; text-align: left; }
.sim-block:nth-of-type(4n+1) { background: #4c6ef5; }
.sim-block:nth-of-type(4n+2) { background: #4c6ef5; }
.sim-block:nth-of-type(4n+3) { background: #9b59b6; }
.sim-block:nth-of-type(4n+4) { background: #9b59b6; }
.sim-block.hot { animation: sim-pulse 1.2s infinite; box-shadow: 0 0 0 3px rgba(37,99,235,.35); }
.sim-scratch-code { flex: 1; background: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(40,60,90,.12); padding: 14px; min-height: 320px; }
.sim-code-hint { font-size: 12px; color: #718096; margin-bottom: 12px; }
.sim-code-stack { display: flex; flex-direction: column; gap: 8px; }
.sim-code-block { border-radius: 6px; padding: 10px 14px; font-size: 13px; font-weight: 600; color: #fff; }
.sim-code-block.motion { background: #4c6ef5; }
.sim-code-block.look { background: #9b59b6; }
.sim-scratch-stage { width: 240px; background: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(40,60,90,.12); position: relative; overflow: hidden; min-height: 320px; }
.sim-stage-bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, #87ceeb 0%, #e0f7fa 100%); }
.sim-cat { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font-size: 52px; transition: all .4s; z-index: 2; }
.sim-cat-run { animation: sim-cat-run 1.6s ease-in-out; }
.sim-cat-big { transform: translate(-50%,-50%) scale(1.6); }
.sim-dog { position: absolute; right: 30px; bottom: 30px; font-size: 42px; z-index: 2; }
.sim-say-bubble { position: absolute; left: 50%; top: 24%; transform: translateX(-50%); background: #fff; border-radius: 12px; padding: 8px 14px; font-size: 13px; font-weight: 700; color: #2d3748; box-shadow: 0 2px 10px rgba(0,0,0,.15); z-index: 3; }

/* ---- Python ---- */
.sim-python { width: 100%; max-width: 860px; flex-direction: column; gap: 14px; align-items: stretch; }
.sim-editor { flex: 1; min-height: 220px; background: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(40,60,90,.12); border: none; padding: 16px; font-family: 'Consolas','Monaco',monospace; font-size: 14px; line-height: 1.6; color: #2d3748; resize: none; outline: none; }
.sim-shell { min-height: 120px; background: #1a202c; border-radius: 12px; box-shadow: 0 4px 20px rgba(40,60,90,.12); padding: 14px 16px; font-family: 'Consolas','Monaco',monospace; font-size: 13px; color: #e2e8f0; overflow-y: auto; }
.sim-shell.err { box-shadow: 0 0 0 2px #fc8181; }
.sim-shell-title { color: #a0aec0; font-size: 11px; margin-bottom: 8px; }
.sim-shell-wait { color: #718096; }
.sim-shell .err-line { color: #fc8181; }

/* ===========================================================
 * 画图应用（标准版式）
 * =========================================================== */
.sim-paint-task-card { position: relative; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: #fff; border-radius: 14px; padding: 12px 16px; margin: 0 16px 14px; box-shadow: 0 2px 10px rgba(40,60,90,.08); }
.sim-task-tag { background: #f59e0b; color: #fff; font-size: 15px; font-weight: 700; padding: 4px 10px; border-radius: 20px; }
.sim-task-txt { flex: 1; font-size: 16px; color: #333; min-width: 220px; }
.sim-task-refresh, .sim-task-tip { border: 1px solid #e2e8f0; background: #fff; border-radius: 8px; padding: 5px 10px; font-size: 15px; color: #333; cursor: pointer; }
.sim-task-refresh:hover, .sim-task-tip:hover { background: #f7fafc; }
.sim-task-tip-pop { position: absolute; left: 16px; right: 16px; top: calc(100% + 6px); background: #fffbeb; border: 1px solid #fcd34d; border-radius: 10px; padding: 10px 14px; font-size: 15px; color: #92400e; z-index: 10; box-shadow: 0 4px 12px rgba(0,0,0,.08); }

.sim-paint-win { position: relative; background: #fff; border-radius: 16px; box-shadow: 0 8px 32px rgba(40,60,90,.15); overflow: hidden; display: flex; flex-direction: column; margin: 0 16px; flex: 1; min-height: 0; }
.sim-paint-titlebar { flex: 0 0 46px; background: linear-gradient(90deg, #f5a623, #e69a2e); display: flex; align-items: center; justify-content: space-between; padding: 0 16px; }
.sim-paint-title-left { display: flex; align-items: center; gap: 8px; color: #fff; font-size: 16px; }
.sim-paint-title-ico { font-size: 20px; }
.sim-paint-title-left b { font-weight: 700; }
.sim-paint-title-file { opacity: 0.9; font-size: 14px; }
.sim-paint-win-dots { display: flex; gap: 6px; }
.sim-paint-win-dots i { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.55); }

.sim-paint-win .sim-menubar { background: #f7f9fc; }

.sim-toolbar-row { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding: 8px 14px; background: #fff; border-bottom: 1px solid #eef1f5; }
.sim-toolbar-row + .sim-toolbar-row { border-top: none; }
.sim-toolbar-row .sim-tbtn { padding: 6px 12px; }

.sim-paint-bar { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: #f7f9fc; border-bottom: 1px solid #e1e6ed; }
.sim-bar-label { font-size: 15px; color: #666; font-weight: 600; }
.sim-paint-bar .sim-colors { gap: 7px; }
.sim-color.white { border: 1px solid #e2e8f0; }
.sim-thicks { display: flex; align-items: center; gap: 8px; }
.sim-thick-dot { width: var(--w, 6px); height: var(--w, 6px); border-radius: 50%; background: #4a5568; border: 2px solid transparent; padding: 0; cursor: pointer; }
.sim-thick-dot.active { background: #fff; border-color: #4299e1; box-shadow: 0 0 0 2px #4299e1; }
.sim-paint-bar .sim-clear-btn { margin-left: auto; color: #e53e3e; border-color: #fed7d7; background: #fff5f5; }
.sim-paint-bar .sim-clear-btn:hover { background: #fed7d7; }
.sim-paint-bar .sim-tool-info { font-size: 15px; color: #f59e0b; font-weight: 700; min-width: 92px; text-align: right; }

.sim-paint-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 18px; padding: 10px 18px; background: #fff; border-top: 1px solid #e1e6ed; }
.sim-actbtn { display: inline-flex; align-items: center; gap: 5px; border: none; background: transparent; font-size: 16px; color: #333; cursor: pointer; font-family: inherit; padding: 4px 6px; border-radius: 6px; }
.sim-actbtn:hover { background: #f7fafc; }
.sim-actbtn i { font-style: normal; }

.sim-paint-success { position: fixed; left: 50%; top: 76px; transform: translateX(-50%); background: #c6f6d5; color: #276749; border: 1px solid #9ae6b4; border-radius: 24px; padding: 9px 26px; font-size: 17px; font-weight: 700; box-shadow: 0 4px 14px rgba(0,0,0,.08); z-index: 200; }

.sim-paint-guide { flex: 0 0 auto; margin: 14px 16px 16px; background: #1e293b; color: #fff; border-radius: 26px; padding: 10px 18px; display: flex; align-items: center; gap: 12px; font-size: 16px; }
.sim-guide-step { background: #f97316; color: #fff; font-size: 14px; font-weight: 700; padding: 3px 8px; border-radius: 12px; }
.sim-guide-back { cursor: pointer; color: #94a3b8; font-size: 18px; }
.sim-guide-back:hover { color: #fff; }
.sim-guide-txt { flex: 1; }
.sim-guide-dots { display: flex; gap: 6px; }
.sim-guide-dots i { width: 8px; height: 8px; border-radius: 50%; background: #475569; }
.sim-guide-dots i.done { background: #48bb78; }
.sim-guide-dots i.cur { background: #f97316; }
.sim-guide-done { background: #276749; }
.sim-guide-next { border: none; background: #48bb78; color: #fff; border-radius: 16px; padding: 5px 14px; font-size: 15px; font-weight: 700; cursor: pointer; }

/* 课程模式：非目标控件变暗禁用 */
.sim-paint-win.course .sim-toolbar-row .sim-tbtn:not(.hot),
.sim-paint-win.course .sim-paint-bar .sim-color:not(.hot),
.sim-paint-win.course .sim-paint-bar .sim-thick-dot:not(.hot),
.sim-paint-win.course .sim-paint-bar .sim-clear-btn:not(.hot),
.sim-paint-win.course .sim-paint-actions .sim-actbtn:not(.hot),
.sim-paint-win.course .sim-canvas { opacity: 0.42; pointer-events: none; }
.sim-paint-win.course .sim-toolbar-row .sim-tbtn.hot,
.sim-paint-win.course .sim-paint-bar .sim-color.hot,
.sim-paint-win.course .sim-paint-bar .sim-thick-dot.hot,
.sim-paint-win.course .sim-paint-bar .sim-clear-btn.hot,
.sim-paint-win.course .sim-paint-actions .sim-actbtn.hot { opacity: 1; pointer-events: auto; }
.sim-paint-win.course .sim-canvas.hot { opacity: 1; pointer-events: auto; }

/* ---- 动画 ---- */
@keyframes sim-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,107,53,.35); }
  50% { box-shadow: 0 0 0 6px rgba(255,107,53,0); }
}
@keyframes sim-shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  75% { transform: translateX(4px); }
}
@keyframes sim-cat-run {
  0% { left: 30%; }
  50% { left: 70%; }
  100% { left: 30%; }
}

/* ===========================================================
 * 训练成绩 · 自由练习（标准版式截图）
 * =========================================================== */
/* stat-card 副标题 */
body.is-teacher .stat-sub { margin-top: 6px; font-size: 11.5px; color: #a0aec0; line-height: 1.4; }
/* 大 Tab */
body.is-teacher .tc-tabs-big { padding: 6px; border-radius: 14px; }
body.is-teacher .tc-tab-big { font-size: 13.5px; padding: 9px 22px; display: inline-flex; align-items: center; gap: 6px; }
body.is-teacher .tc-tab-ico { font-size: 14px; }
/* 打字训练 · 排序下拉（标准版式 tc-sort） */
body.is-teacher .tc-sort { margin-left: 10px; display: inline-flex; align-items: center; }
body.is-teacher .tc-sort select {
  border: 1.5px solid #e2e8f0; color: #5a6b7f; cursor: pointer; background: #fff;
  border-radius: 9px; padding: 7px 12px; font-size: 12px; outline: none;
}
body.is-teacher .tc-sort select:focus { border-color: #2563eb; }

/* 自由练习表格列宽 */
body.is-teacher .free-table-wrap { overflow-x: auto; }
body.is-teacher .free-table { min-width: 1080px; }
body.is-teacher .free-table th, body.is-teacher .free-table td { white-space: nowrap; }
body.is-teacher .free-table .tc-col-no  { width: 70px;  text-align: center; }
body.is-teacher .free-table .tc-col-name { width: 160px; }
body.is-teacher .free-table .tc-col-num { width: 90px;  text-align: center; }
body.is-teacher .free-table .tc-col-sw  { width: 120px; text-align: center; }
body.is-teacher .free-table .tc-col-time{ width: 150px; color: #5a6b7f; }
body.is-teacher .free-table .tc-col-work{ width: 140px; color: #5a6b7f; }

/* 表格行样式 */
body.is-teacher .free-table tbody tr.started { background: #fdfaf6; }
body.is-teacher .free-table tbody tr:hover { background: #f5f7fa !important; }

/* 学号徽标 */
body.is-teacher .tc-no-badge { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 30px; border-radius: 8px; background: #eff6ff; color: #2563eb; font-size: 19px; font-weight: 800; font-family: 'SF Mono', Consolas, monospace; }
/* 累计保存数字 */
body.is-teacher .tc-num-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 22px; padding: 0 8px; border-radius: 6px; background: #2563eb; color: #fff; font-size: 12px; font-weight: 700; }
/* 灰色未开始 */
body.is-teacher .tc-muted { color: #cbd5e0; font-size: 13px; }

/* 软件探索标签（原版式截图核心样式） */
body.is-teacher .sw-chip {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 78px; height: 24px; padding: 0 10px;
  border-radius: 12px; font-size: 12px; font-weight: 600;
  line-height: 1;
}
body.is-teacher .sw-chip.sw-on {
  background: #93c5fd; color: #fff;
  box-shadow: 0 1px 2px rgba(37,99,235,.2);
}
body.is-teacher .sw-chip.sw-off {
  background: #f1f5f9; color: #b0b8c4;
  border: 1px solid #e8ecf1;
}

/* ===========================================================
 * 训练成绩 · 标准版式四Tab新样式（type/base/soft/free）
 * =========================================================== */

/* 认证达标徽章（打字训练） */
body.is-teacher .tc-cert-chip {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 3px 10px; border-radius: 999px;
  background: #e8f8ef; color: #1e8449; font-size: 12px; font-weight: 700;
}
/* 黄色徽章（单元徽章） */
body.is-teacher .tc-badge-yellow { background: #dbeafe; color: #1d4ed8; }

/* 完成率进度条（计算机基础 / 软件操作） */
body.is-teacher .tc-rate-bar {
  position: relative; display: inline-flex; align-items: center;
  width: 140px; height: 18px; background: #e5e7eb; border-radius: 9px; overflow: hidden;
}
body.is-teacher .tc-rate-fill {
  height: 100%; border-radius: 9px;
  transition: width .3s ease;
}
body.is-teacher .tc-rate-text {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  font-size: 11px; font-weight: 700; color: #374151;
}

/* 软件进度标签行（软件操作 / 自由练习） */
body.is-teacher .tc-sw-row {
  display: flex; flex-wrap: wrap; gap: 5px; justify-content: center;
}
body.is-teacher .tc-sw-chip {
  display: inline-flex; align-items: center; justify-content: center;
  height: 22px; padding: 0 8px; border-radius: 11px;
  font-size: 11.5px; font-weight: 600; white-space: nowrap; line-height: 1;
}
body.is-teacher .tc-sw-chip.active {
  background: #93c5fd; color: #fff;
  box-shadow: 0 1px 2px rgba(37,99,235,.15);
}
body.is-teacher .tc-sw-chip.off {
  background: #f1f5f9; color: #b0b8c4;
  border: 1px solid #e8ecf1;
}

/* 时间列颜色 */
body.is-teacher .tc-col-time { color: #718096; font-size: 12.5px; }

/* 表格 hover 效果统一 */
body.is-teacher .tc-table tbody tr:hover { background: #fafbfd; }
body.is-teacher .tc-table tbody tr:last-child td { border-bottom: none; }

/* tb-select 下拉（训练成绩顶部筛选） */
body.is-teacher .tb-select {
  font-size: 14px; font-weight: 600; color: #2d3748;
  border-radius: 16px; padding: 8px 36px 8px 14px; border: 1px solid #e2e8f0;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23a0aec0'/%3E%3C/svg%3E") no-repeat right 12px center;
  -webkit-appearance: none; appearance: none; cursor: pointer; font-family: inherit;
}
body.is-teacher .tb-select:focus { outline: none; border-color: #2563eb; }

/* ===========================================================
 * 试卷测验（.pa-root）—— 标准版式
 * =========================================================== */
body.is-teacher .pa-root { display: flex; flex-direction: column; gap: 18px; }
body.is-teacher .pa-table-wrap { border: 1px solid #e2e8f0; background: #fff; border-radius: 14px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.04); }
body.is-teacher .pa-table { border-collapse: collapse; width: 100%; font-size: 13px; }
body.is-teacher .pa-table th { background: linear-gradient(135deg,#3b82f6,#2563eb); padding: 15px 16px; font-size: 14px; font-weight: 800; color: #fff; text-align: center; border-bottom: 1px solid #2563eb; white-space: nowrap; letter-spacing: .5px; }
body.is-teacher .pa-table td { padding: 14px 16px; border-bottom: 1px solid #f3f4f6; color: #2d3748; vertical-align: middle; text-align: center; }
body.is-teacher .pa-table tbody tr:hover { background: #eff6ff; }

/* 列宽控制 */
body.is-teacher .pa-table th.pa-col-title { width: auto; text-align: left; }
/* 标题列单元格：表头与内容统一左对齐（特异性 0,3,2 / 0,2,2，压过居中规则） */
body.is-teacher .pa-table td.pa-td-title { text-align: left; }
body.is-teacher .pa-table td.pa-td-title .pa-scope { text-align: left; }
body.is-teacher .pa-col-grade { width: 80px; text-align: center; }
body.is-teacher .pa-col-status { width: 80px; text-align: center; }
body.is-teacher .pa-col-submit { width: 100px; text-align: center; }
body.is-teacher .pa-col-avg { width: 80px; text-align: center; }
body.is-teacher .pa-col-time { width: 160px; text-align: center; }
body.is-teacher .pa-col-op { width: 200px; text-align: center; }

/* 单元格 */
body.is-teacher .pa-td-title { font-weight: 600; color: #2d3748; }
body.is-teacher .pa-td-grade { text-align: center; color: #5a6b7f; }
body.is-teacher .pa-td-status { text-align: center; }
body.is-teacher .pa-td-submit { text-align: center; color: #5a6b7f; }
body.is-teacher .pa-td-avg { text-align: center; font-weight: 700; color: #2d3748; }
body.is-teacher .pa-td-time { text-align: center; color: #8895a7; font-size: 12px; }
body.is-teacher .pa-td-op { text-align: center; }

/* 状态标签（原版式三色） */
body.is-teacher .pa-badge { border-radius: 999px; padding: 3px 12px; font-size: 12px; font-weight: 600; display: inline-block; letter-spacing: 0.5px; }
body.is-teacher .pa-badge.published { background: #e8f8ef; color: #1e8449; border: 1px solid #a7f3d0; }
body.is-teacher .pa-badge.collected { background: #eff6ff; color: #1d4ed8; border: 1px solid #bfdbfe; }
body.is-teacher .pa-badge.draft { background: #f3f4f6; color: #6b7280; border: 1px solid #e5e7eb; }

/* 操作按钮 */
body.is-teacher .pa-btn { border: 1px solid transparent; background: none; cursor: pointer; font-family: inherit; font-size: 12px; font-weight: 600; padding: 5px 12px; border-radius: 6px; transition: .15s; white-space: nowrap; margin: 0 3px; }
body.is-teacher .pa-btn-outline { border-color: #e2e8f0; color: #5a6b7f; background: #fff; }
body.is-teacher .pa-btn-outline:hover { border-color: #2563eb; color: #2563eb; background: #eff6ff; }
body.is-teacher .pa-btn-primary-outline { border-color: #2563eb; color: #2563eb; background: #fff; }
body.is-teacher .pa-btn-primary-outline:hover { background: #eff6ff; }

/* 空状态 */
body.is-teacher .pa-empty { padding: 60px 20px; text-align: center; color: #a0aec0; }
body.is-teacher .pa-empty-icon { font-size: 48px; margin-bottom: 12px; }
body.is-teacher .pa-empty-text { font-size: 13px; }

/* 详情页 */
body.is-teacher .pa-detail { display: flex; flex-direction: column; gap: 14px; }
body.is-teacher .pa-detail-card { border: 1px solid #e2e8f0; background: #fff; border-radius: 14px; padding: 22px 24px; box-shadow: 0 2px 8px rgba(0,0,0,.04); }
body.is-teacher .pa-detail-head { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid #f3f4f6; margin-bottom: 20px; }
body.is-teacher .pa-detail-title { font-size: 18px; font-weight: 700; color: #2d3748; margin: 0 0 8px; }
body.is-teacher .pa-detail-meta { display: flex; flex-wrap: wrap; gap: 6px; color: #5a6b7f; font-size: 13px; align-items: center; }
body.is-teacher .pa-detail-meta .dot { color: #d1d5db; margin: 0 4px; }
body.is-teacher .pa-detail-actions { display: flex; gap: 8px; flex-shrink: 0; }
body.is-teacher .pa-detail-section { margin-bottom: 22px; }
body.is-teacher .pa-detail-section:last-child { margin-bottom: 0; }
body.is-teacher .pa-section-title { font-size: 14px; font-weight: 700; color: #2d3748; margin: 0 0 14px; padding-left: 10px; border-left: 3px solid #2563eb; }

/* 成绩网格 */
body.is-teacher .pa-result-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
body.is-teacher .pa-result-chip { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; background: #f7f9fc; border-radius: 8px; border: 1px solid #eef2f7; }
body.is-teacher .pa-result-name { font-size: 13px; color: #2d3748; font-weight: 500; }
body.is-teacher .pa-result-score { font-size: 15px; font-weight: 700; color: #5a6b7f; }
body.is-teacher .pa-result-score.good { color: #1e8449; }
body.is-teacher .pa-result-score.mid { color: #d68910; }
body.is-teacher .pa-result-score.bad { color: #e74c3c; }
body.is-teacher .pa-no-result { color: #a0aec0; font-size: 13px; padding: 20px; text-align: center; background: #f7f9fc; border-radius: 8px; }

/* 题目区（复用已有paper-q样式，但补充细节） */
body.is-teacher .pq-text { margin-bottom: 8px; color: #2d3748; line-height: 1.6; }

/* 弹窗 */
body.is-teacher .pa-modal-mask { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(15,23,42,.45); display: flex; align-items: center; justify-content: center; z-index: 9999; backdrop-filter: blur(2px); }
body.is-teacher .pa-modal { background: #fff; border-radius: 16px; width: 480px; max-width: calc(var(--vwpx, 1vw) * 92); max-height: calc(var(--vhpx, 1vh) * 90); overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.15); display: flex; flex-direction: column; }
body.is-teacher .pa-modal-head { padding: 18px 22px; border-bottom: 1px solid #f3f4f6; display: flex; justify-content: space-between; align-items: center; }
body.is-teacher .pa-modal-head h3 { margin: 0; font-size: 16px; font-weight: 700; color: #2d3748; }
body.is-teacher .pa-modal-close { border: none; background: none; font-size: 22px; color: #a0aec0; cursor: pointer; padding: 0 4px; line-height: 1; }
body.is-teacher .pa-modal-close:hover { color: #2d3748; }
body.is-teacher .pa-modal-body { padding: 22px; overflow-y: auto; }
body.is-teacher .pa-form-row { margin-bottom: 16px; }
body.is-teacher .pa-form-row:last-child { margin-bottom: 0; }
body.is-teacher .pa-form-row label { display: block; font-size: 13px; font-weight: 600; color: #2d3748; margin-bottom: 8px; }
body.is-teacher .pa-form-row input, body.is-teacher .pa-form-row select { width: 100%; padding: 9px 12px; border: 1.5px solid #e2e8f0; border-radius: 8px; font-size: 14px; color: #2d3748; font-family: inherit; box-sizing: border-box; transition: .15s; }
body.is-teacher .pa-form-row input:focus, body.is-teacher .pa-form-row select:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
body.is-teacher .pa-form-hint { font-size: 12px; color: #8895a7; background: #f7f9fc; padding: 12px 14px; border-radius: 8px; margin: 0; line-height: 1.6; }
body.is-teacher .pa-modal-foot { padding: 14px 22px; border-top: 1px solid #f3f4f6; display: flex; justify-content: flex-end; gap: 10px; }

/* —— 新建试卷 · 组卷器（标准版式图1） —— */
body.is-teacher .pa-modal-lg { width: 780px; }
body.is-teacher .pa-modal-lg .pa-modal-head { padding: 20px 26px; }
body.is-teacher .pa-modal-lg .pa-modal-head h3 { font-size: 17px; }
body.is-teacher .pa-modal-lg .pa-modal-body { padding: 20px 26px; }
body.is-teacher .pa-modal-lg .pa-modal-foot { padding: 16px 26px; }
/* 顶行：试卷标题(flex) + 面向年级(固定宽) 同行 */
body.is-teacher .pm-top-row { display: flex; gap: 20px; margin-bottom: 18px; }
body.is-teacher .pm-field label { display: block; font-size: 13px; font-weight: 600; color: #2d3748; margin-bottom: 8px; }
body.is-teacher .pm-field input, body.is-teacher .pm-field select { width: 100%; padding: 10px 14px; border: 1.5px solid #e2e8f0; border-radius: 10px; font-size: 14px; color: #2d3748; font-family: inherit; box-sizing: border-box; transition: .15s; background: #fff; }
body.is-teacher .pm-field input:focus, body.is-teacher .pm-field select:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
/* 多行输入框：横向占满、输入自动撑高（JS hwAutoGrow），框内不出滚动条 */
body.is-teacher .pm-field textarea {
  width: 100%; box-sizing: border-box; display: block;
  padding: 10px 14px; border: 1.5px solid #e2e8f0; border-radius: 10px;
  font-size: 15px; line-height: 1.7; color: #2d3748; font-family: inherit;
  background: #fff; resize: none; overflow: hidden; outline: none; transition: border-color .15s, box-shadow .15s;
}
body.is-teacher .pm-field textarea:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
/* 作业要求说明框：横向占满，初始 4 行高度，随输入自动增高 */
body.is-teacher .hw-desc-input { min-height: 96px; }
body.is-teacher .pm-field-title { flex: 1; }
body.is-teacher .pm-field-grade { width: 150px; flex: none; }
/* 题卡：浅灰底圆角 */
body.is-teacher .pm-q-card { background: #f7f8fa; border: 1px solid #eef1f5; border-radius: 14px; padding: 16px 18px; margin-bottom: 14px; }
body.is-teacher .pm-q-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
body.is-teacher .pm-q-no { font-size: 14px; font-weight: 700; color: #2563eb; }
body.is-teacher .pm-q-tools { display: flex; gap: 14px; }
body.is-teacher .pm-tool { border: none; background: none; color: #2563eb; font-size: 13px; font-weight: 600; cursor: pointer; padding: 0; font-family: inherit; }
body.is-teacher .pm-tool:hover { color: #1d4ed8; }
body.is-teacher .pm-tool:disabled { color: #c3ccd8; cursor: not-allowed; }
body.is-teacher .pm-q-stem { width: 100%; box-sizing: border-box; padding: 10px 14px; border: 1.5px solid #e2e8f0; border-radius: 10px; font-size: 14px; color: #2d3748; font-family: inherit; resize: vertical; min-height: 58px; background: #fff; transition: .15s; }
body.is-teacher .pm-q-stem:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
/* 选项行：圆点 + 字母 + 输入框；正确项绿色 */
body.is-teacher .pm-opt-row { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
body.is-teacher .pm-radio { width: 18px; height: 18px; flex: none; border: 2px solid #c8d2de; border-radius: 50%; background: #fff; cursor: pointer; padding: 0; position: relative; transition: .15s; }
body.is-teacher .pm-radio:hover { border-color: #27ae60; }
body.is-teacher .pm-radio.on { border-color: #27ae60; }
body.is-teacher .pm-radio.on::after { content: ''; position: absolute; top: 3px; right: 3px; bottom: 3px; left: 3px; border-radius: 50%; background: #27ae60; }
body.is-teacher .pm-letter { width: 16px; flex: none; text-align: center; font-size: 13px; font-weight: 700; color: #8a97a8; }
body.is-teacher .pm-letter.on { color: #27ae60; }
body.is-teacher .pm-opt-row input { flex: 1; padding: 10px 14px; border: 1.5px solid #e2e8f0; border-radius: 10px; font-size: 14px; color: #2d3748; font-family: inherit; box-sizing: border-box; background: #fff; transition: .15s; }
body.is-teacher .pm-opt-row input:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
body.is-teacher .pm-opt-row input:disabled { background: #f2f4f8; color: #8a97a8; }
/* 题脚：分值 + 答案提示 */
body.is-teacher .pm-q-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; }
body.is-teacher .pm-score-wrap { display: flex; align-items: center; gap: 8px; }
body.is-teacher .pm-score-label { font-size: 13px; color: #5a6b7f; font-weight: 600; }
body.is-teacher .pm-score { width: 68px; padding: 7px 10px; border: 1.5px solid #e2e8f0; border-radius: 8px; font-size: 14px; color: #2d3748; font-family: inherit; text-align: center; box-sizing: border-box; }
body.is-teacher .pm-score:focus { outline: none; border-color: #2563eb; }
body.is-teacher .pm-score-unit { font-size: 13px; color: #5a6b7f; }
body.is-teacher .pm-ans-tip { font-size: 13px; color: #a0aec0; }
/* 添加题目 + 合计 */
body.is-teacher .pm-add { width: 100%; padding: 11px; border: 1.5px dashed #d5dce5; border-radius: 10px; background: #fff; color: #5a6b7f; font-size: 14px; font-weight: 600; cursor: pointer; font-family: inherit; transition: .15s; }
body.is-teacher .pm-add:hover { border-color: #2563eb; color: #2563eb; background: #eff6ff; }
body.is-teacher .pm-total { text-align: right; font-size: 13px; color: #8a97a8; margin-top: 12px; }
/* 出题方式切换 Tab */
body.is-teacher .pm-mode-tabs { display: flex; gap: 0; margin-bottom: 16px; border-bottom: 2px solid #eef2f7; }
body.is-teacher .pm-mode-tab { flex: 0 0 auto; padding: 8px 20px; background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -2px; font-size: 14px; font-weight: 600; color: #8a97a8; cursor: pointer; font-family: inherit; transition: .15s; }
body.is-teacher .pm-mode-tab:hover { color: #2563eb; }
body.is-teacher .pm-mode-tab.active { color: #2563eb; border-bottom-color: #2563eb; }
/* AI 生成面板 */
body.is-teacher .pm-ai-panel { background: linear-gradient(135deg, #eff6ff 0%, #fef6ff 100%); border: 1px solid #dbeafe; border-radius: 12px; padding: 16px 18px; margin-bottom: 16px; }
body.is-teacher .pm-ai-row { margin-bottom: 12px; }
body.is-teacher .pm-ai-row-inline { display: flex; gap: 16px; align-items: flex-end; }
body.is-teacher .pm-ai-label { display: block; font-size: 13px; font-weight: 600; color: #5a6b7f; margin-bottom: 6px; }
body.is-teacher .pm-ai-input { width: 100%; padding: 9px 12px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 14px; font-family: inherit; box-sizing: border-box; }
body.is-teacher .pm-ai-input:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
body.is-teacher .pm-ai-field { display: flex; flex-direction: column; gap: 6px; }
body.is-teacher .pm-ai-field label { font-size: 12px; color: #8a97a8; }
body.is-teacher .pm-ai-num { width: 80px; padding: 7px 10px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 14px; font-family: inherit; text-align: center; }
body.is-teacher .pm-ai-num:focus { outline: none; border-color: #2563eb; }
body.is-teacher .pm-ai-select { padding: 7px 10px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 13px; font-family: inherit; min-width: 110px; }
body.is-teacher .pm-ai-select:focus { outline: none; border-color: #2563eb; }
body.is-teacher .pm-ai-tip { font-size: 12px; color: #a0aec0; margin-top: 4px; }
body.is-teacher .pm-ai-action { display: flex; align-items: center; gap: 14px; margin-top: 14px; }
body.is-teacher .pm-ai-gen-btn { padding: 9px 22px; }
body.is-teacher .pm-ai-gen-btn:disabled { background: #bfdbfe; box-shadow: none; cursor: not-allowed; }
body.is-teacher .pm-ai-error { color: #e53e3e; font-size: 13px; }
/* 保存按钮禁用态（浅橙） */
body.is-teacher .pa-modal-foot .btn-primary:disabled { background: #bfdbfe; box-shadow: none; cursor: not-allowed; }

/* ===========================================================
 * 作品展示（.wk-root）—— 标准版式
 * =========================================================== */
body.is-teacher .wk-root { display: flex; flex-direction: column; gap: 20px; }
body.is-teacher .wk-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
body.is-teacher .wk-btn { border-radius: 999px; font-size: 14px; cursor: pointer; border: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 8px 20px; font-weight: 600; transition: .15s; font-family: inherit; white-space: nowrap; }
body.is-teacher .wk-btn-ghost { border: 1px solid #e2e8f0; background: #fff; color: #5a6b7f; }
body.is-teacher .wk-btn-ghost:hover { background: #f1f5f9; color: #2d3748; border-color: #c8d6f5; }
body.is-teacher .wk-btn-primary { background: linear-gradient(135deg, #2563eb, #3b82f6); color: #fff; box-shadow: 0 4px 20px rgba(37,99,235,.25); }
body.is-teacher .wk-btn-primary:hover { box-shadow: 0 6px 24px rgba(37,99,235,.35); transform: translateY(-1px); }

/* —— 空状态 —— */
body.is-teacher .wk-empty { text-align: center; background: #fff; border: 1px solid #e2e8f0; border-radius: 18px; padding: 80px 20px; }
body.is-teacher .wk-empty-icon { font-size: 80px; line-height: 1; margin-bottom: 20px; }
body.is-teacher .wk-empty-title { font-size: 18px; font-weight: 600; color: #5a6b7f; margin-bottom: 8px; }
body.is-teacher .wk-empty-desc { font-size: 13px; color: #a0aec0; }

/* —— 作品网格 —— */
body.is-teacher .wk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
body.is-teacher .wk-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; overflow: hidden; cursor: pointer; transition: .18s; }
body.is-teacher .wk-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(45,55,72,.12); border-color: #3b82f6; }
body.is-teacher .wk-card-thumb { aspect-ratio: 4/3; display: flex; align-items: center; justify-content: center; position: relative; background: linear-gradient(135deg, #f1f5f9 0%, #eff6ff 100%); }
body.is-teacher .wk-card-emoji { font-size: 56px; }
body.is-teacher .wk-card-type { position: absolute; top: 10px; right: 10px; background: rgba(45,55,72,.65); color: #fff; font-size: 11px; padding: 3px 10px; border-radius: 999px; font-weight: 600; backdrop-filter: blur(4px); }
body.is-teacher .wk-card-body { padding: 12px 16px 14px; }
body.is-teacher .wk-card-title { font-size: 15px; font-weight: 700; color: #2d3748; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.is-teacher .wk-card-meta { margin-top: 4px; font-size: 12px; color: #a0aec0; display: flex; align-items: center; gap: 4px; }
body.is-teacher .wk-card-dot { color: #cbd5e0; }
body.is-teacher .wk-card-bottom { margin-top: 10px; display: flex; align-items: center; justify-content: space-between; }
body.is-teacher .wk-stars { display: flex; align-items: center; gap: 1px; }
body.is-teacher .wk-star { border: none; background: none; padding: 0 1px; font-size: 16px; color: #d1d5db; cursor: pointer; line-height: 1; }
body.is-teacher .wk-star.on { color: #f59e0b; }
body.is-teacher .wk-like { border: none; background: #fff0f0; border-radius: 999px; padding: 4px 12px; font-size: 12px; color: #e07a7a; cursor: pointer; font-weight: 600; transition: .15s; }
body.is-teacher .wk-like:hover { background: #ffe0e0; }
/* 作品卡：悬浮工具按钮（✎ 编辑 / 🗑 撤下），鼠标移入卡片时显示 */
body.is-teacher .wk-card-tools { position: absolute; top: 8px; left: 8px; display: flex; gap: 6px; opacity: 0; transition: opacity .18s; z-index: 2; }
body.is-teacher .wk-card:hover .wk-card-tools { opacity: 1; }
body.is-teacher .wk-tool-btn { width: 26px; height: 26px; border-radius: 50%; border: none; background: rgba(255,255,255,.92); color: #4a5568; font-size: 13px; cursor: pointer; box-shadow: 0 2px 8px rgba(45,55,72,.22); display: flex; align-items: center; justify-content: center; line-height: 1; padding: 0; transition: .15s; }
body.is-teacher .wk-tool-btn:hover { background: #fff; color: #2563eb; transform: scale(1.1); }
body.is-teacher .wk-tool-btn.wk-tool-del:hover { color: #e53e3e; }
/* 作品卡：推送日期行 */
body.is-teacher .wk-card-date { margin-top: 6px; font-size: 12px; color: #a0aec0; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ===========================================================
 * 学期报告（.term-weights / .term-roster / .rep-*）—— 标准版式学期报告页
 * =========================================================== */
body.is-teacher .sem-btn-refresh { border: 1.5px solid #e2e8f0; background: #fff; border-radius: 10px; padding: 9px 18px; font-size: 13px; font-weight: 600; color: #5a6b7f; cursor: pointer; font-family: inherit; transition: .12s; }
body.is-teacher .sem-btn-refresh:hover { border-color: #cbd5e0; color: #2d3748; background: #f8fafc; }
body.is-teacher .sem-btn-export { border: none; background: linear-gradient(135deg, #2563eb, #3b82f6); border-radius: 999px; padding: 10px 22px; font-size: 14px; font-weight: 700; color: #fff; cursor: pointer; font-family: inherit; box-shadow: 0 4px 20px rgba(37,99,235,.25); transition: .12s; }
body.is-teacher .sem-btn-export:hover { box-shadow: 0 6px 24px rgba(37,99,235,.35); transform: translateY(-1px); }

body.is-teacher .term-weights { border-radius: 18px; box-shadow: 0 2px 8px rgba(0,0,0,.06); border: 1px solid #e2e8f0; background: #fff; margin-bottom: 16px; padding: 20px 24px; }
body.is-teacher .tw-title { font-size: 20px; margin-bottom: 14px; font-weight: 800; color: #4338ca; }
body.is-teacher .tw-grid { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 24px; }
body.is-teacher .tw-item label { font-size: 16px; color: #31405e; margin-bottom: 6px; font-weight: 700; display: block; }
body.is-teacher .tw-input { display: flex; align-items: center; gap: 4px; }
body.is-teacher .tw-input input { border: 1.5px solid #e2e8f0; border-radius: 12px; width: 92px; font-size: 22px; text-align: center; padding: 10px 12px; font-weight: 800; color: #1f2d3d; font-family: inherit; background: #fff; transition: .12s; }
body.is-teacher .tw-input input:hover:not(:disabled) { border-color: #3b82f6; }
body.is-teacher .tw-input input:focus:not(:disabled) { border-color: #2563eb; box-shadow: 0 0 0 3px #eff6ff; outline: none; }
body.is-teacher .tw-input input:disabled { background: #f5f7fa; color: #2d3748; cursor: default; }
body.is-teacher .tw-input span { font-size: 17px; color: #5a6b7f; font-weight: 700; }
body.is-teacher .tw-sum { border-radius: 999px; font-size: 16px; background: #e8f8ef; color: #27ae60; padding: 8px 18px; font-weight: 800; }
body.is-teacher .tw-sum.bad { background: #fdecec; color: #e74c3c; }
body.is-teacher .tw-edit-text { margin-left: auto; border: none; background: none; padding: 8px 14px; font-size: 15px; font-weight: 700; color: #a0aec0; cursor: pointer; font-family: inherit; transition: .12s; border-radius: 8px; }
body.is-teacher .tw-edit-text:hover { background: #f1f5f9; color: #2563eb; }
body.is-teacher .tw-edit-text.active { color: #2563eb; }
body.is-teacher .tw-hint { font-size: 14px; color: #8a97ab; margin-top: 14px; }

body.is-teacher .term-roster { border-radius: 18px; box-shadow: 0 2px 8px rgba(0,0,0,.06); border: 1px solid #e2e8f0; background: #fff; margin-bottom: 16px; padding: 20px 24px; }
body.is-teacher .tr-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
body.is-teacher .tr-cap { font-size: 15px; margin-bottom: 0; display: flex; align-items: center; gap: 6px; }
body.is-teacher .tr-cls-text { font-weight: 700; color: #2d3748; }
body.is-teacher .tr-sep { color: #a0aec0; font-weight: 600; }
body.is-teacher .tr-total { font-size: 13px; color: #a0aec0; font-weight: 600; }
body.is-teacher .tr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
body.is-teacher .tr-student { border-radius: 12px; border: 1.5px solid #e2e8f0; cursor: pointer; text-align: left; background: #fff; display: flex; align-items: center; gap: 10px; padding: 15px 14px; font-family: inherit; transition: .12s; }
body.is-teacher .tr-student:hover { border-color: #3b82f6; box-shadow: 0 2px 10px rgba(37,99,235,.1); transform: translateY(-1px); }
body.is-teacher .tr-avatar { width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: 17px; box-shadow: 0 2px 6px rgba(15,23,42,.18); }
body.is-teacher .tr-name { flex: 1; min-width: 0; font-size: 18px; font-weight: 800; color: #1a202c; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 个人学期报告弹窗 */
body.is-teacher .rep-mask { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(15,23,42,.45); display: flex; align-items: center; justify-content: center; z-index: 9999; backdrop-filter: blur(2px); }
/* ===== 学期报告 · 原版式内嵌个人报告面板 ===== */
body.is-teacher .tr-student.sel { border-color: #2563eb; box-shadow: 0 0 0 2px rgba(37,99,235,.18); background: #eff6ff; }
body.is-teacher .tr-score-wrap { margin-left: auto; display: flex; align-items: center; gap: 5px; flex-shrink: 0; align-self: center; }
body.is-teacher .tr-score { font-style: normal; font-size: 16px; font-weight: 800; color: #2563eb; }
body.is-teacher .tr-lv { font-style: normal; font-size: 11.5px; color: #fff; padding: 2px 8px; border-radius: 999px; line-height: 1.5; }
/* ===== 原版式 1:1 复刻：.term-report 个人学期报告面板 ===== */
body.is-teacher .term-report {
  margin-top: 16px; background: #fff; border-radius: 14px;
  box-shadow: 0 2px 12px rgba(0,0,0,.06); padding: 22px 26px;
  display: flex; flex-direction: column; gap: 18px;
}
/* ① 头部 */
body.is-teacher .term-report .trp-head { display: flex; align-items: center; gap: 16px; position: relative; }
body.is-teacher .term-report .rp-avatar.big {
  width: 54px; height: 54px; border-radius: 50%; color: #fff; font-weight: 800; font-size: 22px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  box-shadow: 0 2px 10px rgba(0,0,0,.12);
}
body.is-teacher .term-report .trp-info { flex: 1 1 auto; min-width: 0; }
body.is-teacher .term-report .trp-info h2 { font-size: 20px; font-weight: 700; margin: 0 0 4px; color: #1a1a1a; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
body.is-teacher .term-report .trp-level {
  display: inline-block; font-size: 12px; font-weight: 600; padding: 2px 10px; border-radius: 999px;
  color: #fff; letter-spacing: .5px;
}
body.is-teacher .term-report .trp-level.gold  { background: linear-gradient(135deg,#f093fb,#f5576c); }
body.is-teacher .term-report .trp-level.green { background: linear-gradient(135deg,#11998e,#38ef7d); }
body.is-teacher .term-report .trp-level.blue  { background: linear-gradient(135deg,#3a7bd5,#3a6073); }
body.is-teacher .term-report .trp-level.red   { background: linear-gradient(135deg,#f12711,#f5af19); }
body.is-teacher .term-report .trp-meta { font-size: 12px; color: #888; display: flex; flex-wrap: wrap; gap: 10px; }
body.is-teacher .term-report .trp-meta span { display: inline-flex; align-items: center; }
body.is-teacher .term-report .trp-overall { text-align: right; flex: 0 0 auto; }
body.is-teacher .term-report .trp-overall-num { font-size: 44px; font-weight: 800; line-height: 1; color: #27ae60; letter-spacing: -1px; }
body.is-teacher .term-report .trp-overall-label { font-size: 12px; color: #888; margin-top: 4px; }
body.is-teacher .term-report .trp-close {
  position: absolute; top: -4px; right: -8px; border: none; background: #f1f5f9; color: #94a3b8;
  width: 26px; height: 26px; border-radius: 50%; font-size: 13px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
body.is-teacher .term-report .trp-close:hover { background: #e2e8f0; color: #475569; }

/* ② 三栏评分卡 */
body.is-teacher .term-report .trp-parts { display: flex; gap: 14px; }
body.is-teacher .term-report .trp-part {
  flex: 1 1 0; background: #fafbfc; border: 1px solid #eef0f4; border-radius: 12px;
  padding: 16px 18px; display: flex; flex-direction: column; gap: 8px;
}
body.is-teacher .term-report .trp-part.na { opacity: .7; }
body.is-teacher .term-report .trp-part-head { display: flex; justify-content: space-between; align-items: center; }
body.is-teacher .term-report .trp-part-label { font-size: 13px; font-weight: 600; color: #555; }
body.is-teacher .term-report .trp-part-weight { font-size: 11px; color: #aaa; }
body.is-teacher .term-report .trp-part-pct { font-size: 24px; font-weight: 700; }
body.is-teacher .term-report .trp-part-bar { height: 6px; background: #eef0f4; border-radius: 999px; overflow: hidden; }
body.is-teacher .term-report .trp-part-fill { height: 100%; border-radius: 999px; transition: width .5s ease; }

/* ③ 评语区 */
body.is-teacher .term-report .trp-comment {
  background: #eef6ff; border-radius: 10px; padding: 12px 16px;
  font-size: 13px; color: #3a5a7a; line-height: 1.7;
  border-left: 3px solid #3b82f6;
}

/* ④ 两列详情 */
body.is-teacher .term-report .trp-detail { display: flex; gap: 18px; }
body.is-teacher .term-report .trp-col { flex: 1 1 0; min-width: 0; }
body.is-teacher .term-report .trp-col > h4 {
  font-size: 14px; font-weight: 700; color: #333; margin: 0 0 10px; padding-bottom: 8px;
  border-bottom: 1px solid #eef0f4;
}
body.is-teacher .term-report .trp-col h4 + .report-table { margin-top: -2px; }

/* 课程得分表格 */
body.is-teacher .term-report .report-table {
  width: 100%; border-collapse: collapse; font-size: 12.5px; margin-bottom: 14px;
}
body.is-teacher .term-report .report-table th,
body.is-teacher .term-report .report-table td {
  padding: 7px 8px; text-align: left; border-bottom: 1px solid #f0f2f5; color: #444;
}
body.is-teacher .term-report .report-table th { background: #fafbfc; font-weight: 600; color: #666; font-size: 11.5px; }
body.is-teacher .term-report .report-table .c { text-align: center; }
body.is-teacher .term-report .report-table tbody tr:hover { background: #fafbfc; }

/* 技能训练条形图 */
body.is-teacher .term-report .trp-training { display: flex; flex-direction: column; gap: 10px; }
body.is-teacher .term-report .trp-tr-item { display: grid; grid-template-columns: 80px 1fr 50px; align-items: center; gap: 10px; font-size: 12.5px; }
body.is-teacher .term-report .trp-tr-label { color: #555; font-weight: 500; }
body.is-teacher .term-report .trp-tr-num { font-weight: 700; font-size: 12.5px; text-align: right; }

/* 测验成绩面板（右侧） */
body.is-teacher .term-report .trp-paper-box { text-align: center; padding: 22px 10px; background: #f0faf4; border-radius: 10px; }
body.is-teacher .term-report .trp-paper-num { font-size: 40px; font-weight: 800; color: #27ae60; line-height: 1; }
body.is-teacher .term-report .trp-paper-label { font-size: 12px; color: #888; margin-top: 6px; }
body.is-teacher .term-report .empty-cell { font-size: 13px; color: #bbb; text-align: center; }

/* ⑤ 家长只读链接 */
body.is-teacher .term-report .trp-link {
  background: #fafbfc; border: 1px dashed #d0d5dd; border-radius: 10px; padding: 14px 18px;
}
body.is-teacher .term-report .trp-link-title { font-size: 14px; font-weight: 600; color: #333; margin-bottom: 4px; }
body.is-teacher .term-report .trp-link-hint { font-size: 12px; color: #888; margin: 0 0 12px; line-height: 1.6; }
body.is-teacher .term-report .trp-link-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
body.is-teacher .term-report .trp-link-input {
  flex: 1; min-width: 200px; font-size: 12px; background: #fff; border: 1px solid #e5e7eb;
  border-radius: 6px; padding: 7px 10px; color: #555; font-family: 'Courier New', monospace;
}
body.is-teacher .term-report .btn.btn-primary.mini {
  background: linear-gradient(135deg, #3b82f6, #6366f1); color: #fff; border: none;
  font-size: 12px; font-weight: 600; padding: 7px 16px; border-radius: 6px; cursor: pointer;
  transition: .15s; white-space: nowrap;
}
body.is-teacher .term-report .btn.btn-primary.mini:hover { transform: translateY(-1px); box-shadow: 0 3px 10px rgba(59,130,246,.35); }

/* ⑥ 底部信息栏 */
body.is-teacher .term-report .report-footer {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  font-size: 12px; color: #999; padding-top: 4px; border-top: 1px solid #eef0f4;
}
body.is-teacher .term-report .report-footer strong { color: #666; font-weight: 600; }

/* ===== 家长只读报告（经典风格） ===== */
.pr-wrap { min-height: calc(var(--vhpx, 1vh) * 100); background: #f4f6fb; padding: 28px 16px 40px; display: flex; flex-direction: column; align-items: center; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; }
.pr-subject-badge { font-size: 12px; color: #4f46e5; background: #eef2ff; padding: 4px 14px; border-radius: 999px; font-weight: 500; }
.pr-page-title { font-size: 28px; font-weight: 800; color: #1e293b; margin: 10px 0 2px; letter-spacing: 1px; }
.pr-page-sub { font-size: 13px; color: #94a3b8; margin: 0 0 24px; }
.pr-main { width: 100%; max-width: 560px; display: flex; flex-direction: column; gap: 14px; }

/* 成绩单卡（蓝紫渐变） */
.pr-hero-card {
  background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #a78bfa 100%);
  border-radius: 20px; padding: 22px 24px; color: #fff;
  display: flex; justify-content: space-between; align-items: stretch;
  box-shadow: 0 8px 30px rgba(99,102,241,.25);
}
.pr-hero-left { display: flex; align-items: center; gap: 14px; }
.pr-avatar { width: 58px; height: 58px; border-radius: 50%; color: #fff; font-size: 24px; font-weight: 800; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(0,0,0,.15); }
.pr-hero-info { display: flex; flex-direction: column; gap: 4px; }
.pr-hero-name { font-size: 22px; font-weight: 800; }
.pr-hero-cls { font-size: 12.5px; opacity: .85; }
.pr-hero-right { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.pr-hero-score { font-size: 48px; font-weight: 900; line-height: 1; letter-spacing: -2px; }
.pr-hero-label { font-size: 12px; opacity: .85; }
.pr-hero-level {
  font-size: 12px; font-weight: 700; padding: 3px 14px; border-radius: 999px;
  background: rgba(255,255,255,.95); color: #6366f1; margin-top: 6px;
}

/* 通用 block */
.pr-block { background: #fff; border-radius: 14px; padding: 18px 20px; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.pr-block-title { font-size: 15px; font-weight: 700; color: #1e293b; margin-bottom: 14px; }
.pr-block-tip { margin-top: 10px; font-size: 12px; color: #94a3b8; }

/* 成绩构成行 */
.pr-item-row { margin-bottom: 10px; }
.pr-item-row:last-child { margin-bottom: 0; }
.pr-item-head { display: flex; justify-content: space-between; align-items: center; font-size: 13.5px; color: #475569; margin-bottom: 5px; }
.pr-item-name { font-weight: 600; }
.pr-item-weight { color: #94a3b8; font-size: 12px; margin-right: 6px; }
.pr-item-val { font-weight: 700; color: #1e293b; }
.pr-item-bar { height: 6px; background: #eef2f7; border-radius: 999px; overflow: hidden; }
.pr-item-bar i {
  display: block; height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, #818cf8, #6366f1);
  transition: width .6s cubic-bezier(.4,0,.2,1);
}

/* 表扬/提醒 */
.pr-praise-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.pr-praise { font-size: 12.5px; font-weight: 600; padding: 5px 12px; border-radius: 999px; }
.pr-praise-good { background: #dcfce7; color: #16a34a; }
.pr-praise-warn { background: #fef3c7; color: #d97706; }
.pr-praise-empty { background: #f1f5f9; color: #64748b; }
.pr-comment { background: #f8fafc; border-left: 3px solid #6366f1; padding: 12px 14px; font-size: 13px; color: #334155; line-height: 1.7; border-radius: 0 8px 8px 0; }

/* 课程互动 */
.pr-course-list { display: flex; flex-direction: column; gap: 8px; }
.pr-course-row { display: flex; justify-content: space-between; font-size: 13px; padding: 6px 0; border-bottom: 1px dashed #eef2f7; }
.pr-course-row:last-child { border-bottom: none; }
.pr-course-name { color: #475569; }
.pr-course-val { font-weight: 700; color: #6366f1; }

/* 空状态 */
.pr-empty { font-size: 13px; color: #cbd5e1; padding: 8px 0; }

/* 技能训练（复用 pr-item-row） */

/* 单元测验 */
.pr-paper { text-align: center; padding: 14px; background: #faf5ff; border-radius: 10px; }
.pr-paper-val { font-size: 28px; font-weight: 900; color: #7c3aed; }
.pr-paper-sub { font-size: 12px; color: #a78bfa; margin-top: 4px; }

/* 底部 */
.pr-bottom { text-align: center; padding: 20px 0 0; }
.pr-time { font-size: 12px; color: #94a3b8; }
.pr-tip { font-size: 11.5px; color: #cbd5e1; margin-top: 4px; }

/* 错误/加载 */
.pr-error { background: #fff; border-radius: 14px; padding: 40px 20px; text-align: center; }
.pr-error-icon { font-size: 38px; margin-bottom: 10px; }
.pr-error-text { font-size: 14px; color: #ef4444; line-height: 1.6; }
.pr-loading { padding: 40px 20px; text-align: center; color: #94a3b8; font-size: 13px; }
.pr-spinner { width: 28px; height: 28px; border: 3px solid #e0e7ff; border-top-color: #6366f1; border-radius: 50%; animation: prSpin .8s linear infinite; margin: 0 auto 12px; }
@keyframes prSpin { to { transform: rotate(360deg); } }

body.is-teacher .rep-close:hover { color: #2d3748; }
body.is-teacher .rep-body { padding: 20px 22px; overflow-y: auto; }
body.is-teacher .rep-stu { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
body.is-teacher .rep-stu .tr-avatar { width: 44px; height: 44px; font-size: 18px; }
body.is-teacher .rep-stu-name { font-size: 16px; font-weight: 800; color: #2d3748; }
body.is-teacher .rep-stu-sub { font-size: 12.5px; color: #a0aec0; margin-top: 2px; }
body.is-teacher .rep-row { margin-bottom: 14px; }
body.is-teacher .rep-row-top { display: flex; justify-content: space-between; align-items: center; font-size: 13px; color: #5a6b7f; font-weight: 600; margin-bottom: 6px; }
body.is-teacher .rep-w { font-style: normal; font-size: 11.5px; color: #a0aec0; margin-left: 8px; font-weight: 600; }
body.is-teacher .rep-row-score { font-size: 14px; font-weight: 800; color: #2d3748; }
body.is-teacher .rep-bar { height: 8px; border-radius: 999px; background: #e5e7eb; overflow: hidden; }
body.is-teacher .rep-bar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #3b82f6, #2563eb); transition: width .3s; }
body.is-teacher .rep-total { display: flex; justify-content: space-between; align-items: center; background: #eff6ff; border: 1px solid #dbeafe; border-radius: 12px; padding: 14px 18px; margin: 4px 0 12px; }
body.is-teacher .rep-total-label { font-size: 13.5px; font-weight: 700; color: #2d3748; }
body.is-teacher .rep-total-label small { display: block; font-size: 11.5px; color: #a0aec0; font-weight: 600; margin-top: 2px; }
body.is-teacher .rep-total-val { font-size: 30px; font-weight: 800; color: #2563eb; line-height: 1; }
body.is-teacher .rep-link { background: #f4f7fd; border: 1px dashed #4f8cff; border-radius: 10px; padding: 10px 12px; font-size: 12px; color: #5a6b7f; word-break: break-all; }

/* ===========================================================
 * 备课中心（.prep-*）
 * =========================================================== */
body.is-teacher .prep { display: flex; flex-direction: column; flex: 1 1 0%; width: 100%; min-height: 0; }
body.is-teacher .prep-toolbar { display: flex; justify-content: space-between; align-items: center; padding: 14px 20px 12px; background: #fff; border-bottom: 1px solid #e2e8f0; flex-wrap: wrap; gap: 10px; }
body.is-teacher .vol-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
body.is-teacher .plan-doc-btn { border: 1px solid #2563eb; color: #2563eb; border-radius: 999px; padding: 7px 16px; font-size: 13px; font-weight: 600; background: #fff; cursor: pointer; }
body.is-teacher .vol-chip { border: 1px solid #e2e8f0; background: #f1f5f9; color: #5a6b7f; border-radius: 999px; padding: 7px 16px; font-size: 13px; font-weight: 600; cursor: pointer; }
body.is-teacher .vol-chip.active { background: #2563eb; border-color: #2563eb; color: #fff; box-shadow: 0 4px 20px rgba(37,99,235,.25); }
body.is-teacher .semester-pill { display: flex; align-items: center; gap: 7px; padding: 6px 14px; font-size: 12.5px; border-radius: 999px; border: 1px solid #e2e8f0; background: #f1f5f9; color: #5a6b7f; }
body.is-teacher .semester-pill .dot { background: #27ae60; width: 7px; height: 7px; border-radius: 50%; }
body.is-teacher .prep-body { display: flex; flex: 1; min-height: 560px; }
body.is-teacher .prep-main { background: #f1f5f9; flex: 1; min-width: 0; padding: 20px 22px 40px; overflow-y: auto; }
/* —— 概览 v2 · 本周聚焦大卡（每屏一个主任务） —— */
body.is-teacher .ov-focus { background: linear-gradient(135deg, #eff6ff 0%, #fff 55%); border: 1px solid #dbeafe; border-radius: 24px; box-shadow: 0 2px 8px rgba(0,0,0,.06); padding: 22px 26px 20px; margin-bottom: 14px; }
body.is-teacher .ov-focus-kicker { font-size: 13px; font-weight: 700; color: #2563eb; letter-spacing: .5px; margin-bottom: 6px; }
body.is-teacher .ov-focus-title { font-size: 26px; font-weight: 800; color: #1e293b; margin: 0 0 10px; line-height: 1.3; }
body.is-teacher .ov-focus-meta { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: #5a6b7f; margin-bottom: 16px; flex-wrap: wrap; }
body.is-teacher .ovf-sep { color: #cbd5e1; }
body.is-teacher .ov-focus-acts { display: flex; gap: 10px; flex-wrap: wrap; }
body.is-teacher .ovf-btn { border-radius: 12px; padding: 9px 20px; font-size: 14px; font-weight: 700; cursor: pointer; font-family: inherit; border: 1px solid transparent; transition: transform .12s, box-shadow .12s; }
body.is-teacher .ovf-main { background: #2563eb; color: #fff; box-shadow: 0 4px 14px rgba(37,99,235,.3); }
body.is-teacher .ovf-main:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(37,99,235,.4); }
body.is-teacher .ovf-ghost { background: #fff; color: #2563eb; border-color: #93c5fd; }
body.is-teacher .ovf-ghost:hover { background: #eff6ff; }
body.is-teacher .ovf-line { background: transparent; color: #5a6b7f; border-color: #cbd5e0; }
body.is-teacher .ovf-line:hover { color: #2563eb; border-color: #2563eb; }
/* —— 概览 v2 · 状态色点（g=已就绪 b=已编辑 n=待装配） —— */
body.is-teacher .ov-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
body.is-teacher .ov-dot.g { background: #1e8449; box-shadow: 0 0 0 3px #e8f8ef; }
body.is-teacher .ov-dot.b { background: #2563eb; box-shadow: 0 0 0 3px #eaf2ff; }
body.is-teacher .ov-dot.n { background: #e2e8f0; }
/* —— 概览 v2 · 单元课时卡片（一课时一卡，左色条示状态，统一样式） —— */
body.is-teacher .ov-unit { background: #fff; border: 1px solid #e2e8f0; border-radius: 18px; box-shadow: 0 2px 8px rgba(0,0,0,.06); padding: 10px 16px 11px; margin-bottom: 10px; }
body.is-teacher .ov-unit-head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
body.is-teacher .unit-no { font-family: Georgia, 'Times New Roman', serif; font-size: 28px; font-weight: 800; color: #d5e0ec; line-height: 1; letter-spacing: -1px; flex-shrink: 0; }
body.is-teacher .ov-unit-name { font-size: 21px; font-weight: 700; color: #1e293b; flex: 1; line-height: 1.2; }
body.is-teacher .ov-unit-count { font-size: 13.5px; color: #2563eb; background: #eff6ff; border: 1px solid #dbeafe; border-radius: 999px; padding: 3px 12px; font-weight: 600; flex-shrink: 0; }
body.is-teacher .ov-u-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; }
body.is-teacher .ov-lcard { position: relative; display: flex; flex-direction: column; align-items: flex-start; text-align: left; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 12px; padding: 9px 12px 9px 17px; cursor: pointer; font-family: inherit; overflow: hidden; transition: border-color .15s, background .15s, transform .15s, box-shadow .15s; }
body.is-teacher .ov-lcard:hover { background: #fff; border-color: #93c5fd; transform: translateY(-2px); box-shadow: 0 6px 16px rgba(37,99,235,.13); }
body.is-teacher .ov-lcard-bar { position: absolute; left: 0; top: 0; bottom: 0; width: 4px; }
body.is-teacher .ov-lcard-bar.g { background: #1e8449; }
body.is-teacher .ov-lcard-bar.b { background: #2563eb; }
body.is-teacher .ov-lcard-bar.n { background: #d6dee8; }
body.is-teacher .ov-lcard-top { display: flex; width: 100%; justify-content: space-between; align-items: center; margin-bottom: 4px; }
body.is-teacher .ov-lcard-no { font-size: 12.5px; font-weight: 700; color: #94a3b8; letter-spacing: 1px; }
body.is-teacher .ov-lcard-st { font-size: 12px; font-weight: 600; }
body.is-teacher .ov-lcard-st.g { color: #1e8449; }
body.is-teacher .ov-lcard-st.b { color: #2563eb; }
body.is-teacher .ov-lcard-st.n { color: #94a3b8; }
body.is-teacher .ov-lcard-name { font-size: 15.5px; font-weight: 600; color: #2d3748; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ===========================================================
 * 备课中心 · AI 社团课程目录页（.cat-*，2026-10-05 新增）
 * 上册紫渐变横幅 / 下册蓝渐变横幅 + 聚焦卡 + 单元目录卡 + 课次卡
 * =========================================================== */
/* —— 返回首页按钮（横幅上方，主界面回"上课"，弹窗关闭窗口） —— */
body.is-teacher .cat-back { margin: 0 0 10px 2px; }
body.is-teacher .cat-back a { display: inline-block; font-size: 14px; font-weight: 700; color: #5a6b7f; text-decoration: none; background: #fff; border: 1px solid #e2e8f0; border-radius: 999px; padding: 7px 18px; cursor: pointer; box-shadow: 0 2px 6px rgba(0,0,0,.05); transition: color .15s, border-color .15s, background .15s, transform .12s; }
body.is-teacher .cat-back a:hover { color: #7c3aed; border-color: #c4b5fd; background: #f5f3ff; transform: translateX(-2px); }
/* —— 册头横幅：上册（紫） —— */
body.is-teacher .cat-hero { position: relative; display: flex; align-items: center; gap: 22px; flex-wrap: wrap; background: linear-gradient(130deg, #5b21b6 0%, #7c3aed 48%, #4f46e5 100%); border-radius: 24px; padding: 24px 28px; margin-bottom: 12px; box-shadow: 0 8px 24px rgba(109,40,217,.28); overflow: hidden; }
/* —— 册头横幅：下册（蓝，覆盖渐变与阴影） —— */
body.is-teacher .cat-hero.cat-hero-down { background: linear-gradient(130deg, #075985 0%, #0284c7 48%, #2563eb 100%); box-shadow: 0 8px 24px rgba(2,132,199,.28); }
/* —— 册头横幅：七年级上册（活力橙）/ 七年级下册（青绿） —— */
body.is-teacher .cat-hero.cat-hero-7a { background: linear-gradient(130deg, #9a3412 0%, #ea580c 48%, #f59e0b 100%); box-shadow: 0 8px 24px rgba(234,88,12,.28); }
body.is-teacher .cat-hero.cat-hero-7b { background: linear-gradient(130deg, #134e4a 0%, #0d9488 48%, #0891b2 100%); box-shadow: 0 8px 24px rgba(13,148,136,.28); }
/* 装饰圆（纯色半透明圆，兼容模式安全） */
body.is-teacher .cat-hero-deco { position: absolute; border-radius: 50%; pointer-events: none; }
body.is-teacher .cat-hero-deco1 { width: 300px; height: 300px; right: -90px; top: -140px; background: rgba(255,255,255,.07); }
body.is-teacher .cat-hero-deco2 { width: 180px; height: 180px; left: 32%; bottom: -110px; background: rgba(255,255,255,.06); }
/* 左侧 emoji 玻璃徽章 */
body.is-teacher .cat-hero-mark { width: 68px; height: 68px; border-radius: 20px; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.38); font-size: 34px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; z-index: 1; }
/* 主文案区 */
body.is-teacher .cat-hero-main { flex: 1; min-width: 280px; position: relative; z-index: 1; }
body.is-teacher .cat-hero-kicker { font-size: 13.5px; font-weight: 700; color: rgba(255,255,255,.82); letter-spacing: 1.5px; margin-bottom: 7px; }
body.is-teacher .cat-hero-title { font-size: 31px; font-weight: 900; color: #fff; margin: 0 0 9px; line-height: 1.25; }
body.is-teacher .cat-hero-vol { display: inline-block; vertical-align: 4px; margin-left: 12px; font-size: 15.5px; font-weight: 700; color: #fff; background: rgba(255,255,255,.22); border: 1px solid rgba(255,255,255,.4); border-radius: 999px; padding: 4px 16px; letter-spacing: 2px; }
body.is-teacher .cat-hero-tag { font-size: 15px; font-weight: 600; color: rgba(255,255,255,.92); margin: 0 0 5px; }
body.is-teacher .cat-hero-goal { font-size: 13.5px; color: rgba(255,255,255,.72); margin: 0; }
/* 右侧数据速览（2×2 玻璃格） */
body.is-teacher .cat-hero-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; flex-shrink: 0; position: relative; z-index: 1; }
body.is-teacher .cat-stat { background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22); border-radius: 13px; padding: 10px 18px; text-align: center; min-width: 96px; }
body.is-teacher .cat-stat b { display: block; font-size: 23px; font-weight: 900; color: #fff; line-height: 1.15; }
body.is-teacher .cat-stat span { display: block; font-size: 12.5px; font-weight: 600; color: rgba(255,255,255,.75); margin-top: 2px; }

/* —— 聚焦卡（挂在 ov-focus 上的紫色皮肤；下册经相邻选择器转蓝） —— */
body.is-teacher .ov-focus.cat-focus { background: linear-gradient(135deg, #f5f3ff 0%, #fff 58%); border-color: #ddd6fe; }
body.is-teacher .ov-focus.cat-focus .ov-focus-kicker { color: #7c3aed; }
body.is-teacher .cat-hero-down + .cat-focus { background: linear-gradient(135deg, #eff6ff 0%, #fff 58%); border-color: #bfdbfe; }
body.is-teacher .cat-hero-down + .cat-focus .ov-focus-kicker { color: #2563eb; }
/* 聚焦卡：七年级上册（橙）/ 下册（青）联动皮肤 */
body.is-teacher .cat-hero-7a + .cat-focus { background: linear-gradient(135deg, #fff7ed 0%, #fff 58%); border-color: #fed7aa; }
body.is-teacher .cat-hero-7a + .cat-focus .ov-focus-kicker { color: #ea580c; }
body.is-teacher .cat-hero-7b + .cat-focus { background: linear-gradient(135deg, #f0fdfa 0%, #fff 58%); border-color: #99f6e4; }
body.is-teacher .cat-hero-7b + .cat-focus .ov-focus-kicker { color: #0d9488; }
body.is-teacher .cat-focus-lt { display: inline-block; vertical-align: 4px; margin-left: 12px; font-size: 12.5px; font-weight: 700; color: #6d28d9; background: #ede9fe; border: 1px solid #ddd6fe; border-radius: 999px; padding: 3px 12px; }

/* —— 单元目录卡 —— */
body.is-teacher .cat-unit { background: #fff; border: 1px solid #e2e8f0; border-radius: 18px; box-shadow: 0 2px 8px rgba(0,0,0,.06); padding: 14px 18px 13px; margin-bottom: 12px; }
body.is-teacher .cat-unit-head { display: flex; align-items: center; gap: 13px; padding-bottom: 11px; border-bottom: 1px dashed #e2e8f0; margin-bottom: 12px; }
body.is-teacher .cat-unit-ico { width: 44px; height: 44px; border-radius: 13px; background: linear-gradient(135deg, #ede9fe, #e0e7ff); font-size: 23px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
body.is-teacher .cat-unit-tt { flex: 1; min-width: 0; }
body.is-teacher .cat-unit-name { display: block; font-size: 20px; font-weight: 800; color: #1e293b; line-height: 1.25; }
body.is-teacher .cat-unit-goal { display: block; font-size: 13px; color: #94a3b8; margin-top: 3px; line-height: 1.4; }
body.is-teacher .cat-unit-count { flex-shrink: 0; font-size: 12.5px; font-weight: 700; color: #7c3aed; background: #f5f3ff; border: 1px solid #ddd6fe; border-radius: 999px; padding: 4px 14px; }
/* 课次卡网格 */
body.is-teacher .cat-u-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
/* —— 课次卡：课次号 + 课型徽章 + 课题 + 源课程包 + 装配状态 —— */
body.is-teacher .cat-lcard { position: relative; display: flex; flex-direction: column; align-items: flex-start; text-align: left; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 12px; padding: 10px 12px 10px 17px; cursor: pointer; font-family: inherit; overflow: hidden; transition: border-color .15s, background .15s, transform .15s, box-shadow .15s; }
body.is-teacher .cat-lcard:hover { background: #fff; border-color: #c4b5fd; transform: translateY(-2px); box-shadow: 0 6px 16px rgba(124,58,237,.16); }
body.is-teacher .cat-lcard-bar { position: absolute; left: 0; top: 0; bottom: 0; width: 4px; }
body.is-teacher .cat-lcard-bar.g { background: #1e8449; }
body.is-teacher .cat-lcard-bar.b { background: #2563eb; }
body.is-teacher .cat-lcard-bar.n { background: #d6dee8; }
body.is-teacher .cat-lcard-top { display: flex; width: 100%; justify-content: space-between; align-items: center; margin-bottom: 5px; }
body.is-teacher .cat-lcard-no { font-size: 13px; font-weight: 800; color: #7c3aed; letter-spacing: .5px; }
/* 课型徽章五色：导学/学/练/测评/项目 */
body.is-teacher .cat-lt { flex-shrink: 0; font-size: 11.5px; font-weight: 700; border-radius: 999px; padding: 2px 10px; }
body.is-teacher .cat-lt-导学 { background: #f3e8ff; color: #9333ea; }
body.is-teacher .cat-lt-学 { background: #eaf2ff; color: #2563eb; }
body.is-teacher .cat-lt-练 { background: #e8f8ef; color: #1e8449; }
body.is-teacher .cat-lt-测评 { background: #fef3e2; color: #d97706; }
body.is-teacher .cat-lt-项目 { background: #fde7f1; color: #db2777; }
body.is-teacher .cat-lcard-name { font-size: 15.5px; font-weight: 600; color: #2d3748; line-height: 1.35; margin-bottom: 8px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
body.is-teacher .cat-lcard-foot { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 6px; margin-top: auto; }
body.is-teacher .cat-lcard-src { flex: 1 1 0%; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; color: #8493a8; }
body.is-teacher .cat-lcard-st { flex-shrink: 0; font-size: 12px; font-weight: 700; }
body.is-teacher .cat-lcard-st.g { color: #1e8449; }
body.is-teacher .cat-lcard-st.b { color: #2563eb; }
body.is-teacher .cat-lcard-st.n { color: #94a3b8; }
/* —— 七年级上册（活力橙）目录页命名空间微调 —— */
body.is-teacher .cat-book-7a .cat-unit-ico { background: linear-gradient(135deg, #ffedd5, #fde68a); }
body.is-teacher .cat-book-7a .cat-unit-count { color: #c2410c; background: #fff7ed; border-color: #fed7aa; }
body.is-teacher .cat-book-7a .cat-lcard-no { color: #ea580c; }
body.is-teacher .cat-book-7a .cat-lcard:hover { border-color: #fdba74; box-shadow: 0 6px 16px rgba(234,88,12,.16); }
body.is-teacher .cat-book-7a .cat-focus-lt { color: #c2410c; background: #ffedd5; border-color: #fed7aa; }
/* —— 七年级下册（青绿）目录页命名空间微调 —— */
body.is-teacher .cat-book-7b .cat-unit-ico { background: linear-gradient(135deg, #ccfbf1, #a5f3fc); }
body.is-teacher .cat-book-7b .cat-unit-count { color: #0f766e; background: #f0fdfa; border-color: #99f6e4; }
body.is-teacher .cat-book-7b .cat-lcard-no { color: #0d9488; }
body.is-teacher .cat-book-7b .cat-lcard:hover { border-color: #5eead4; box-shadow: 0 6px 16px rgba(13,148,136,.16); }
body.is-teacher .cat-book-7b .cat-focus-lt { color: #0f766e; background: #ccfbf1; border-color: #99f6e4; }
/* —— 目录页窄屏适配（弹窗备课 / 小窗口） —— */
@media (max-width: 1150px) { body.is-teacher .cat-u-row { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
  body.is-teacher .cat-u-row { grid-template-columns: repeat(2, 1fr); }
  body.is-teacher .cat-hero { padding: 18px 20px; }
  body.is-teacher .cat-hero-stats { grid-template-columns: repeat(4, 1fr); width: 100%; }
  body.is-teacher .cat-hero-title { font-size: 25px; }
}
@media (max-width: 560px) { body.is-teacher .cat-u-row { grid-template-columns: 1fr; } body.is-teacher .cat-hero-stats { grid-template-columns: repeat(2, 1fr); } }

/* ===========================================================
 * 备课中心 · 详情视图（五 tab：教学设计 / 逐字稿 / 课件 / 互动活动 / 资源库）
 * =========================================================== */
body.is-teacher .prep-detail { display: flex; flex-direction: column; gap: 14px; }

/* —— 详情头部 —— */
body.is-teacher .pd-header { background: #fff; border: 1px solid #e2e8f0; border-radius: 24px; padding: 18px 22px 16px; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
body.is-teacher .pd-crumb { font-size: 12.5px; color: #5a6b7f; cursor: pointer; margin-bottom: 10px; display: inline-block; }
body.is-teacher .pd-crumb:hover { color: #2563eb; }
body.is-teacher .pd-title-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
body.is-teacher .pd-title { font-size: 22px; font-weight: 700; color: #2d3748; margin: 0; line-height: 1.3; }
body.is-teacher .pd-badge { font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
body.is-teacher .pd-badge-blue { background: #eaf2ff; color: #2563eb; }
body.is-teacher .pd-badge-pink { background: #fce7f3; color: #db2777; }
body.is-teacher .pd-badge-green { background: #e8f8ef; color: #1e8449; border: 1px solid #a7f3d0; }
body.is-teacher .pd-meta { font-size: 12.5px; color: #5a6b7f; margin-top: 12px; display: flex; align-items: center; gap: 6px; }
/* 头部主操作：🚀 上课 + ✎ 编辑 + ⋯ 更多（次操作收进下拉） */
body.is-teacher .pd-head-acts { display: flex; align-items: center; gap: 8px; margin-left: auto; }
body.is-teacher .pd-hact { border: 1.5px solid #cbd5e0; background: #fff; color: #2d3748; border-radius: 999px; padding: 8px 18px; font-size: 13px; font-weight: 700; cursor: pointer; font-family: inherit; transition: .15s; white-space: nowrap; }
body.is-teacher .pd-hact:hover { border-color: #2563eb; color: #2563eb; background: #eff6ff; }
body.is-teacher .pd-hact-main { background: linear-gradient(135deg, #10b981, #059669); border-color: transparent; color: #fff; box-shadow: 0 4px 14px rgba(16,185,129,.32); }
body.is-teacher .pd-hact-main:hover { box-shadow: 0 6px 20px rgba(16,185,129,.45); transform: translateY(-1px); color: #fff; }
body.is-teacher .pd-more { position: relative; }
body.is-teacher .pd-more-btn { width: 38px; height: 38px; border-radius: 999px; border: 1.5px solid #cbd5e0; background: #fff; color: #2d3748; font-size: 16px; font-weight: 800; cursor: pointer; font-family: inherit; line-height: 1; padding: 0; transition: .15s; }
body.is-teacher .pd-more-btn:hover, body.is-teacher .pd-more-btn.on { border-color: #2563eb; color: #2563eb; background: #eff6ff; }
body.is-teacher .pd-more-menu { position: absolute; top: 44px; right: 0; min-width: 150px; background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; box-shadow: 0 10px 30px rgba(0,0,0,.14); padding: 6px; z-index: 40; }
body.is-teacher .pd-more-menu a { display: block; padding: 9px 12px; font-size: 13px; color: #2d3748; border-radius: 9px; text-decoration: none; }
body.is-teacher .pd-more-menu a:hover { background: #eff6ff; color: #2563eb; }
/* 课件 tab 顶部按钮组沿用 */
body.is-teacher .pd-ware-edited { display: inline-flex; align-items: center; background: #eff6ff; border: 1px solid #93c5fd; color: #1d4ed8; font-size: 12px; font-weight: 700; padding: 6px 12px; border-radius: 999px; white-space: nowrap; }
body.is-teacher .pd-ware-top-btns { display: inline-flex; align-items: center; gap: 10px; flex: none; }
body.is-teacher .pd-act-edit { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff; border-color: transparent; box-shadow: 0 4px 14px rgba(37,99,235,.3); }
body.is-teacher .pd-act-edit:hover { box-shadow: 0 6px 18px rgba(37,99,235,.4); transform: translateY(-1px); }

/* —— 教学目标卡（默认折叠为一行摘要，点击展开） —— */
body.is-teacher .pd-goals { background: #fff; border: 1px solid #e2e8f0; border-radius: 24px; padding: 14px 22px; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
body.is-teacher .pd-goals-head { display: flex; justify-content: space-between; align-items: center; cursor: pointer; }
body.is-teacher .pd-goals-head:hover .pd-goals-sum { color: #2563eb; }
body.is-teacher .pd-goals-sum { font-size: 14px; font-weight: 700; color: #2d3748; transition: color .15s; }
body.is-teacher .pd-goals-arrow { font-size: 12px; color: #5a6b7f; flex: none; }
body.is-teacher .pd-goals-list { display: flex; flex-direction: column; gap: 10px; }
body.is-teacher .pd-goal-item { display: flex; align-items: flex-start; gap: 10px; }
body.is-teacher .pd-goal-tag { font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 6px; flex: none; margin-top: 1px; }
body.is-teacher .pd-goal-knowledge { background: #dbeafe; color: #1d4ed8; }
body.is-teacher .pd-goal-skill { background: #fce7f3; color: #be185d; }
body.is-teacher .pd-goal-literacy { background: #dbeafe; color: #1d4ed8; }
body.is-teacher .pd-goal-text { font-size: 13.5px; color: #334155; line-height: 1.7; }

/* —— Tab 栏 —— */
body.is-teacher .pd-tabs { display: flex; gap: 4px; background: #fff; border: 1px solid #e2e8f0; border-radius: 20px; padding: 5px; box-shadow: 0 2px 6px rgba(0,0,0,.04); overflow-x: auto; }
body.is-teacher .pd-tab { background: transparent; border: none; padding: 10px 18px; font-size: 13.5px; font-weight: 600; color: #5a6b7f; border-radius: 16px; cursor: pointer; white-space: nowrap; display: flex; align-items: center; gap: 6px; transition: .15s; font-family: inherit; }
body.is-teacher .pd-tab:hover { color: #2563eb; background: #eff6ff; }
body.is-teacher .pd-tab.active { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff; box-shadow: 0 4px 14px rgba(37,99,235,.3); }
body.is-teacher .pd-tab-count { font-size: 11px; background: rgba(255,255,255,.3); color: #fff; padding: 1px 7px; border-radius: 999px; font-weight: 700; }
body.is-teacher .pd-tab:not(.active) .pd-tab-count { background: #e2e8f0; color: #5a6b7f; }

/* —— Tab 行级按钮栏 —— */
body.is-teacher .pd-toolbar { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 10px 16px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; box-shadow: 0 2px 4px rgba(0,0,0,.04); }
body.is-teacher .pd-toolbar-btns { display: flex; gap: 8px; }
/* 内容版章节折叠角标（如"核心素养学段目标"默认收起） */
body.is-teacher .pd-sec-fold { float: right; font-size: 11.5px; font-weight: 400; color: #5a6b7f; }
body.is-teacher .pd-act { padding: 8px 16px; border-radius: 999px; font-size: 13px; font-weight: 600; cursor: pointer; border: 1.5px solid transparent; font-family: inherit; transition: .15s; white-space: nowrap; }
body.is-teacher .pd-act-main { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff; border-color: transparent; box-shadow: 0 4px 14px rgba(37,99,235,.3); }
body.is-teacher .pd-act-main:hover { box-shadow: 0 6px 18px rgba(37,99,235,.4); transform: translateY(-1px); }
body.is-teacher .pd-act-preview { background: #fff; color: #2563eb; border-color: #2563eb; }
body.is-teacher .pd-act-preview:hover { background: #eff6ff; }
body.is-teacher .pd-act-ghost { background: #fff; color: #5a6b7f; border-color: #e2e8f0; }
body.is-teacher .pd-act-ghost:hover { border-color: #2563eb; color: #2563eb; }

/* —— 通用内容卡 —— */
body.is-teacher .pd-content { background: #fff; border: 1px solid #e2e8f0; border-radius: 24px; padding: 18px 22px; box-shadow: 0 2px 8px rgba(0,0,0,.06); min-height: 400px; }

/* —— 教学设计：三卡网格 —— */
body.is-teacher .pd-design-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }
body.is-teacher .pd-card { border-radius: 16px; padding: 16px 18px; border: 1px solid #e2e8f0; position: relative; }
body.is-teacher .pd-card h3 { font-size: 14px; font-weight: 700; color: #2d3748; margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px dashed #e2e8f0; }
body.is-teacher .pd-card-yellow { border-top: 3px solid #f59e0b; background: #fffdf5; }
body.is-teacher .pd-card-blue { border-top: 3px solid #3b82f6; background: #f5f9ff; }
body.is-teacher .pd-card-green { border-top: 3px solid #10b981; background: #f3fbf7; }
body.is-teacher .pd-bullets { list-style: none; padding: 0; margin: 0; }
body.is-teacher .pd-bullets li { font-size: 13px; color: #334155; line-height: 1.7; padding: 4px 0; padding-left: 14px; position: relative; }
body.is-teacher .pd-bullets li::before { content: '·'; position: absolute; left: 2px; color: #2563eb; font-weight: 700; }
body.is-teacher .pd-blackboard { font-size: 13px; line-height: 1.8; }
body.is-teacher .pd-bb-main { color: #1d4ed8; font-weight: 700; margin-bottom: 8px; }
body.is-teacher .pd-bb-sub { color: #7c3aed; margin-bottom: 10px; }
body.is-teacher .pd-bb-quote { color: #1d4ed8; background: #dbeafe; padding: 8px 12px; border-radius: 10px; }

/* —— 逐字稿：左导轨 + 右正文 —— */
body.is-teacher .pd-script { display: grid; grid-template-columns: 280px 1fr; gap: 0; padding: 0; overflow: hidden; }
body.is-teacher .pd-script-rail { background: #f7f9fc; border-right: 1px solid #e2e8f0; padding: 14px 0; display: flex; flex-direction: column; max-height: 620px; overflow-y: auto; }
body.is-teacher .pd-rail-head { font-size: 12px; font-weight: 700; color: #5a6b7f; padding: 0 16px 10px; border-bottom: 1px solid #e2e8f0; margin-bottom: 6px; }
body.is-teacher .pd-rail-item { background: transparent; border: none; text-align: left; padding: 10px 16px; cursor: pointer; font-family: inherit; display: flex; flex-direction: column; gap: 2px; border-left: 3px solid transparent; transition: .12s; }
body.is-teacher .pd-rail-item:hover { background: #eff6ff; border-left-color: #2563eb; }
body.is-teacher .pd-rail-code { font-size: 11px; color: #94a3b8; font-family: monospace; }
body.is-teacher .pd-rail-time { font-size: 11px; color: #5a6b7f; }
body.is-teacher .pd-rail-title { font-size: 12.5px; color: #334155; font-weight: 600; line-height: 1.4; }
body.is-teacher .pd-script-body { padding: 18px 24px; overflow-y: auto; max-height: 620px; }
body.is-teacher .pd-script-title { font-size: 18px; font-weight: 700; color: #2d3748; margin: 0 0 4px; }
body.is-teacher .pd-script-meta { font-size: 12.5px; color: #5a6b7f; margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px dashed #e2e8f0; }
body.is-teacher .pd-script-block { margin-bottom: 18px; }
body.is-teacher .pd-script-seg-head { display: flex; align-items: center; gap: 10px; background: linear-gradient(135deg, #eff6ff, #eff6ff); padding: 10px 14px; border-radius: 12px; margin-bottom: 10px; }
body.is-teacher .pd-script-badge { background: #2563eb; color: #fff; font-size: 11px; font-weight: 700; padding: 2px 10px; border-radius: 999px; }
body.is-teacher .pd-script-seg-title { font-size: 13px; font-weight: 700; color: #2d3748; flex: 1; }
body.is-teacher .pd-script-time { font-size: 12px; color: #5a6b7f; background: #fff; padding: 2px 10px; border-radius: 6px; border: 1px solid #e2e8f0; }
body.is-teacher .pd-script-toggle { font-size: 12px; color: #2563eb; cursor: pointer; font-weight: 600; }
body.is-teacher .pd-script-seg-body { padding: 4px 10px; }
body.is-teacher .pd-script-seg-body p { font-size: 13px; color: #334155; line-height: 1.75; margin: 6px 0; }
body.is-teacher .pd-script-hint { color: #94a3b8; font-size: 12px; }
body.is-teacher .pd-script-note { margin-top: 10px; font-size: 12px; color: #5a6b7f; background: #f7f9fc; padding: 8px 12px; border-radius: 8px; border-left: 3px solid #2563eb; }

/* —— 课件列表 —— */
body.is-teacher .pd-ware-rows { display: flex; flex-direction: column; gap: 8px; }
body.is-teacher .pd-ware-row { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 10px; border: 1px solid #f1f5f9; background: #fafbfc; transition: .12s; }
body.is-teacher .pd-ware-row:hover { background: #fff; border-color: #2563eb; box-shadow: 0 2px 8px rgba(37,99,235,.15); }
body.is-teacher .pd-ware-idx { font-size: 13px; font-weight: 700; color: #5a6b7f; min-width: 26px; text-align: center; }
body.is-teacher .pd-ware-badge { font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
body.is-teacher .pd-ware-badge.kw-cover { background: #fce7f3; color: #db2777; }
body.is-teacher .pd-ware-badge.kw-objective { background: #dbeafe; color: #1d4ed8; }
body.is-teacher .pd-ware-badge.kw-content, body.is-teacher .pd-ware-badge.kw-read { background: #d1fae5; color: #047857; }
body.is-teacher .pd-ware-badge.kw-choice, body.is-teacher .pd-ware-badge.kw-match, body.is-teacher .pd-ware-badge.kw-sortd, body.is-teacher .pd-ware-badge.kw-quizset, body.is-teacher .pd-ware-badge.kw-explore, body.is-teacher .pd-ware-badge.kw-challenge { background: #dbeafe; color: #1d4ed8; }
body.is-teacher .pd-ware-badge.kw-timeline { background: #e9d5ff; color: #7c3aed; }
body.is-teacher .pd-ware-badge.kw-check, body.is-teacher .pd-ware-badge.kw-homework { background: #f1f5f9; color: #475569; }
body.is-teacher .pd-ware-badge.kw-do { background: #e0e7ff; color: #4338ca; }
body.is-teacher .pd-ware-title { font-size: 13.5px; color: #2d3748; font-weight: 500; flex: 1; }
body.is-teacher .pd-ware-right { display: flex; gap: 10px; }
body.is-teacher .pd-ware-sub { font-size: 11.5px; color: #94a3b8; }

/* —— 互动活动卡片 —— */
body.is-teacher .pd-act-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
body.is-teacher .pd-act-card { border: 1px solid #e2e8f0; border-radius: 16px; padding: 14px; background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,.04); transition: .15s; }
body.is-teacher .pd-act-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(37,99,235,.15); border-color: #2563eb; }
body.is-teacher .pd-act-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
body.is-teacher .pd-act-tag { font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: #e9d5ff; color: #7c3aed; }
body.is-teacher .pd-act-tag.at-随堂小测 { background: #fce7f3; color: #db2777; }
body.is-teacher .pd-act-tag.at-排序列表 { background: #ede9fe; color: #7c3aed; }
body.is-teacher .pd-act-tag.at-配对排序 { background: #d1fae5; color: #047857; }
body.is-teacher .pd-act-tag.at-配对连线 { background: #dbeafe; color: #1d4ed8; }
body.is-teacher .pd-act-tag.at-时间轴 { background: #dbeafe; color: #1d4ed8; }
body.is-teacher .pd-act-tag.at-打卡任务 { background: #f1f5f9; color: #475569; }
body.is-teacher .pd-act-tag.at-match_pair { background: #dbeafe; color: #1d4ed8; }
body.is-teacher .pd-act-tag.at-拖拽分类 { background: #d1fae5; color: #047857; }

/* ===============================================================
 * 学期教学计划 · 弹窗文档样式（经典风格）
 * =============================================================== */
body.is-teacher .plan-overlay { background: rgba(15,23,42,.6); z-index: 100; }
body.is-teacher .plan-modal {
  width: 940px; max-width: calc(var(--vwpx, 1vw) * 94); height: calc(var(--vhpx, 1vh) * 88);
  background: #f7f9fc; border-radius: 14px; overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 20px 60px rgba(0,0,0,.3);
}

/* 工具栏 */
body.is-teacher .plan-toolbar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 20px; background: #fff; border-bottom: 1px solid #e2e8f0;
  flex-shrink: 0;
}
body.is-teacher .plan-toolbar-left { display: flex; align-items: center; gap: 18px; }
body.is-teacher .plan-toolbar-title { font-size: 15px; font-weight: 700; color: #2d3748; }
body.is-teacher .plan-book-switch { display: flex; gap: 4px; background: #f4f7fd; border-radius: 999px; padding: 3px; }
body.is-teacher .plan-book-tab {
  border: none; background: transparent; border-radius: 999px;
  padding: 6px 16px; font-size: 12.5px; font-weight: 600; color: #5a6b7f; cursor: pointer;
  transition: .15s;
}
body.is-teacher .plan-book-tab.active { background: #2563eb; color: #fff; box-shadow: 0 2px 8px rgba(37,99,235,.3); }
body.is-teacher .plan-toolbar-right { display: flex; gap: 8px; }
body.is-teacher .plan-tb-btn {
  border: 1px solid #e2e8f0; background: #fff; border-radius: 8px;
  padding: 6px 14px; font-size: 12.5px; font-weight: 600; color: #5a6b7f; cursor: pointer;
  transition: .12s;
}
body.is-teacher .plan-tb-btn:hover { border-color: #4f8cff; color: #1d4ed8; }
body.is-teacher .plan-tb-btn.primary { background: #2563eb; color: #fff; border-color: #2563eb; }
body.is-teacher .plan-tb-btn.primary:hover { background: #1d4ed8; }
body.is-teacher .plan-tb-btn.close:hover { border-color: #dc2626; color: #dc2626; }

/* 文档滚动容器 */
body.is-teacher .plan-doc-scroll { flex: 1; overflow-y: auto; padding: 24px 0; background: #e8edf5; }

/* 文档内容（A4 纸张模拟） */
body.is-teacher .plan-doc {
  max-width: 780px; margin: 0 auto; background: #fff;
  padding: 48px 56px; border-radius: 4px;
  box-shadow: 0 2px 12px rgba(0,0,0,.08);
  font-family: "微软雅黑", "Microsoft YaHei", "PingFang SC", sans-serif;
  color: #1a202c; line-height: 1.75; font-size: 14px;
}

/* 文档标题区 */
body.is-teacher .plan-doc-header { text-align: center; margin-bottom: 20px; }
body.is-teacher .plan-doc-title {
  font-size: 24px; font-weight: 700; color: #1a202c;
  margin: 0 0 6px; letter-spacing: 2px;
}
body.is-teacher .plan-doc-sub { font-size: 14px; color: #4a5568; margin-bottom: 10px; }
body.is-teacher .plan-doc-meta { font-size: 12px; color: #718096; display: flex; justify-content: center; gap: 20px; }
body.is-teacher .plan-divider { border: none; border-top: 2px solid #1a202c; margin: 16px 0 24px; }

/* 章节标题 */
body.is-teacher .plan-section { margin-bottom: 22px; }
body.is-teacher .plan-h2 {
  font-size: 17px; font-weight: 700; color: #1a202c;
  border-left: 4px solid #2563eb; padding-left: 10px;
  margin: 0 0 14px; letter-spacing: 1px;
}
body.is-teacher .plan-subsec { margin-bottom: 14px; }
body.is-teacher .plan-h3 {
  font-size: 14.5px; font-weight: 700; color: #2d3748;
  margin: 0 0 8px; padding-left: 4px;
}
body.is-teacher .plan-p { font-size: 13.5px; color: #2d3748; text-indent: 2em; margin: 0 0 6px; line-height: 1.85; }

/* 编号列表 */
body.is-teacher .plan-num-list p {
  font-size: 13.5px; color: #2d3748; margin: 0 0 6px;
  line-height: 1.85; padding-left: 2em; text-indent: -2em;
}
body.is-teacher .plan-num-list { padding-left: 0; }

/* 项目符号列表 */
body.is-teacher .plan-bullet-list { padding-left: 28px; margin: 0; }
body.is-teacher .plan-bullet-list li { font-size: 13.5px; color: #2d3748; line-height: 1.85; margin-bottom: 4px; }

/* 单元目标块 */
body.is-teacher .plan-unit-goal {
  background: #fafbfc; border: 1px solid #e2e8f0; border-radius: 8px;
  padding: 12px 16px; margin-bottom: 10px;
}
body.is-teacher .plan-ug-head { font-size: 14px; font-weight: 700; color: #2563eb; margin-bottom: 4px; }
body.is-teacher .plan-ug-tasks { font-size: 12.5px; color: #718096; margin-bottom: 6px; }

/* 进度表 */
body.is-teacher .plan-schedule-wrap { overflow-x: auto; }
body.is-teacher .plan-schedule-table {
  width: 100%; border-collapse: collapse; font-size: 13px;
  margin-top: 4px;
}
body.is-teacher .plan-schedule-table thead th {
  background: #f7f9fc; color: #2d3748; font-weight: 700;
  padding: 8px 10px; border: 1px solid #e2e8f0; text-align: left;
  font-size: 12.5px;
}
body.is-teacher .plan-schedule-table tbody td {
  padding: 7px 10px; border: 1px solid #e2e8f0; color: #334155;
  font-size: 12.5px; vertical-align: top;
}
body.is-teacher .plan-schedule-table tr.highlight td { background: #eff6ff; }
body.is-teacher .plan-schedule-table .cw1 { width: 60px; text-align: center; font-weight: 600; color: #2563eb; }
body.is-teacher .plan-schedule-table .cw2 { width: 38%; font-weight: 600; }
body.is-teacher .plan-schedule-table .cw3 { width: 16%; color: #718096; }
body.is-teacher .plan-schedule-table .cw4 { width: 60px; text-align: center; }
body.is-teacher .plan-schedule-table .cw5 { color: #718096; }

/* ===========================================================
 * 教师端 · 日程中心（子标签 + 占位卡片）
 * =========================================================== */
body.is-teacher .sched-tabs {
  display: flex; gap: 10px; flex-wrap: wrap;
  margin: 4px 0 22px; padding: 8px;
  background: #ffffff; border-radius: 16px;
  border: 1px solid #e2e8f0; box-shadow: 0 1px 3px rgba(16,24,40,.05);
  width: fit-content;
}
body.is-teacher .sched-tab-btn {
  border: none; background: transparent; cursor: pointer;
  border-radius: 10px; padding: 9px 20px;
  font-size: 14px; font-weight: 600; color: #5a6b7f;
  transition: .15s; white-space: nowrap;
}
body.is-teacher .sched-tab-btn:hover { background: #f1f5f9; color: #2d3748; }
body.is-teacher .sched-tab-btn.active { background: #2563eb; color: #ffffff; box-shadow: 0 3px 10px rgba(37,99,235,.35); }

/* —— 资料待补充占位卡 —— */
body.is-teacher .sched-placeholder {
  text-align: center; padding: 64px 24px 56px;
  background: #ffffff; border-radius: 24px;
  border: 2px dashed #cbd5e0; box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
body.is-teacher .sched-placeholder .sched-ph-ico { font-size: 54px; line-height: 1; margin-bottom: 16px; opacity: .85; }
body.is-teacher .sched-placeholder .sched-ph-title { font-size: 19px; font-weight: 700; color: #2d3748; margin-bottom: 8px; }
body.is-teacher .sched-placeholder .sched-ph-sub { font-size: 13px; color: #a0aec0; }

/* —— 资料文件展示（校历/作息表/行事历）—— */
body.is-teacher .sched-doc-bar {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; flex-wrap: wrap; margin: 4px 0 14px;
}
body.is-teacher .sched-doc-bar .sched-doc-name {
  font-size: 15px; font-weight: 700; color: #2d3748;
}
body.is-teacher .sched-doc-bar .sched-dl {
  text-decoration: none; display: inline-block; white-space: nowrap;
  padding: 8px 16px; border-radius: 10px;
  background: #ffffff; border: 1px solid #e2e8f0; color: #2563eb;
  font-size: 13px; font-weight: 600; cursor: pointer;
  transition: .15s;
}
body.is-teacher .sched-doc-bar .sched-dl:hover {
  background: #eff6ff; border-color: #93c5fd; box-shadow: 0 2px 8px rgba(37,99,235,.18);
}
body.is-teacher .sched-doc-card {
  background: #ffffff; border-radius: 18px; padding: 18px;
  box-shadow: 0 4px 16px rgba(16,24,40,.08);
  border: 1px solid #e2e8f0;
}
body.is-teacher .sched-doc-card a { display: block; text-decoration: none; }
body.is-teacher .sched-doc-card img {
  display: block; width: 100%; max-height: calc(var(--vhpx, 1vh) * 74);
  object-fit: contain; margin: 0 auto; border-radius: 10px;
  cursor: zoom-in; background: #fbfcfe;
}
body.is-teacher .sched-xlsx-frame {
  width: 100%; height: calc(var(--vhpx, 1vh) * 72); border: none; border-radius: 10px;
  background: #ffffff;
}
body.is-teacher .sched-doc-hint {
  margin-top: 10px; text-align: center;
  font-size: 12.5px; color: #a0aec0;
}

/* ===========================================================
 * 教师端 · 日程中心 —— 周课表（全新样式 v2）
 * =========================================================== */
body.is-teacher .sched-card {
  background: #ffffff; border-radius: 18px; padding: 20px;
  box-shadow: 0 4px 16px rgba(16,24,40,.08);
  border: 2px solid #cbd5e0; overflow: hidden;
}
body.is-teacher .sched-table {
  width: 100%; border-collapse: collapse;
  font-size: 13px; table-layout: fixed;
}

/* —— 表头：橙色渐变 + 白字（加大加粗）—— */
body.is-teacher .sched-table thead th {
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  color: #ffffff; font-weight: 800; font-size: 14px;
  padding: 11px 6px; text-align: center;
  border: 1.5px solid #ffffff;
  border-right: 1.5px solid rgba(255,255,255,.3);
  letter-spacing: 2px;
  text-shadow: 0 1px 2px rgba(0,0,0,.15);
}
body.is-teacher .sched-table thead th:last-child { border-right: none; }

/* —— 左上角三分斜线表头（午别/星期/时课）—— */
body.is-teacher .sched-corner {
  background: linear-gradient(135deg, #f06292 0%, #e91e63 100%) !important;
  position: relative;
  padding: 0 !important;
  height: 58px;
  border-radius: 0 !important;
  overflow: hidden;
}
body.is-teacher .sched-corner .sched-c-svg {
  position: absolute; left: 0; top: 0;
  width: 100%; height: 100%; display: block;
}
body.is-teacher .sched-corner .sched-c-svg line {
  stroke: rgba(255,255,255,.55); stroke-width: 1.5;
}
body.is-teacher .sched-corner .sched-c-lab {
  position: absolute; z-index: 1;
  font-size: 12px; font-weight: 700; color: #ffffff;
  letter-spacing: 1px; line-height: 1;
  text-shadow: 0 1px 2px rgba(0,0,0,.18);
  outline: none; min-width: 1em; white-space: nowrap;
}
body.is-teacher .sched-corner .sched-c-lab[contenteditable="true"]:focus {
  background: rgba(255,255,255,.25); border-radius: 3px;
}
body.is-teacher .sched-corner .sched-c-wubie { left: 9px; top: 8px; }
body.is-teacher .sched-corner .sched-c-xingqi { right: 9px; top: 8px; }
body.is-teacher .sched-corner .sched-c-shike { left: 50%; bottom: 6px; transform: translateX(-50%); }

/* —— 左侧午别 + 时课列 —— */
body.is-teacher .sched-table .sched-wubie {
  background: #eff6ff; color: #1d4ed8;
  font-weight: 800; font-size: 14px;
  text-align: center; vertical-align: middle;
  border: 2px solid #2563eb;
  padding: 0 8px; width: 50px;
  writing-mode: horizontal-tb;
}
body.is-teacher .sched-table .sched-shike {
  background: #ffe0b2; color: #bf360c;
  font-weight: 700; font-size: 12px;
  text-align: center; padding: 8px 4px;
  border: 2px solid #ffcc80;
  width: 72px;
}

/* —— 课程单元格（可编辑）—— */
body.is-teacher .sched-table tbody td {
  border: 1.5px solid #94a3b8;
  padding: 6px 4px; vertical-align: middle;
  text-align: center; font-size: 12.5px; color: #2d3748;
  min-height: 58px;
  transition: background .15s;
  outline: none;
  line-height: 1.5;
}
body.is-teacher .sched-table tbody td[contenteditable="true"]:hover {
  background: #f7fafc;
}
body.is-teacher .sched-table tbody td[contenteditable="true"]:focus {
  background: #e3f2fd; box-shadow: inset 0 0 0 2px #42a5f5;
}
body.is-teacher .sched-table tbody td:last-child { border-right: 1.5px solid #94a3b8; }

/* —— 空格子（无课程时的淡色提示）—— */
body.is-teacher .sched-table .sched-empty {
  color: #cbd5e1;
}

/* —— 信息科技-单：浅黄底 —— */
body.is-teacher .sched-table .sched-class.sched-dan {
  background: #fffde7; color: #f57f17;
  font-weight: 700; line-height: 1.5;
  border: 2px solid #ffb300 !important;
}
/* —— 信息科技-双：青绿底（与橙色主色调互补）—— */
body.is-teacher .sched-table .sched-class.sched-shuang {
  background: #e0f2f1; color: #00695c;
  font-weight: 700; line-height: 1.5;
  border: 2px solid #26a69a !important;
}
body.is-teacher .sched-table .sched-class {
  border-radius: 4px;
  padding: 6px 4px;
}

/* —— 课间休息行 —— */
body.is-teacher .sched-table .sched-break { background: #f8fafc; }
body.is-teacher .sched-table .sched-break-cell {
  text-align: center; padding: 7px 4px;
  font-size: 12.5px; color: #64748b; letter-spacing: 5px; font-weight: 600;
  border: 1.5px solid #cbd5e0;
}
body.is-teacher .sched-table .sched-break-eye { color: #607d8b; font-weight: 500; }
body.is-teacher .sched-table .sched-break-big { color: #37474f; font-weight: 700; font-size: 13px; letter-spacing: 6px; }

/* —— 午休行 —— */
body.is-teacher .sched-table .sched-lunch { background: #eceff1; }
body.is-teacher .sched-table .sched-lunch-cell {
  text-align: center; padding: 8px;
  font-size: 13px; color: #37474f; font-weight: 800; letter-spacing: 10px;
  border: 2px solid #90a4ae;
  position: relative;
}

/* —— colgroup：午别/时课列固定宽，星期列可由 colWidths 覆盖 —— */
body.is-teacher .sched-table col.sched-col-wubie { width: 50px; }
body.is-teacher .sched-table col.sched-col-shike { width: 72px; }

/* —— 表头：星期列可编辑文字 + 删列按钮 + 列宽把手定位基准 —— */
body.is-teacher .sched-table thead .sched-day-th { position: relative; }
body.is-teacher .sched-table .sched-day-text {
  display: inline-block; outline: none; min-width: 1em;
}
body.is-teacher .sched-table .sched-del-col {
  position: absolute; top: 2px; right: 2px;
  width: 16px; height: 16px; line-height: 14px;
  border: none; border-radius: 50%;
  background: rgba(255,255,255,.85); color: #e53e3e;
  font-size: 11px; cursor: pointer; padding: 0;
  opacity: 0; transition: opacity .12s;
}
body.is-teacher .sched-table .sched-day-th:hover .sched-del-col { opacity: 1; }

/* —— 列宽拖拽把手：贴在表头右边界 —— */
body.is-teacher .sched-table .sched-col-grip {
  position: absolute; top: 0; bottom: 0; right: -5px; width: 10px;
  cursor: col-resize; z-index: 6;
}
body.is-teacher .sched-table .sched-col-grip::after {
  content: ''; position: absolute; top: 12%; bottom: 12%; left: 4px; width: 2px;
  border-radius: 1px; background: transparent; transition: background .12s;
}
body.is-teacher .sched-table .sched-col-grip:hover::after,
body.is-teacher .sched-table .sched-col-grip.dragging::after { background: #42a5f5; }

/* —— 时课格：行高把手 + 删行按钮定位基准 —— */
body.is-teacher .sched-table .sched-shike { position: relative; }
body.is-teacher .sched-table .sched-period-text {
  display: block; outline: none; min-width: 1em; line-height: 1.3;
}
body.is-teacher .sched-table .sched-time-text {
  display: block; outline: none; min-width: 1em;
  font-size: 11px; color: #718096; line-height: 1.3; margin-top: 2px;
}
/* period 第 2 行起的时间文字：灰色（与 .sched-time-text 一致），
   覆盖 .sched-shike 继承的深橙红（如"课间操⏎9:35-10:10"的时间行） */
body.is-teacher .sched-table .sched-period-text .sched-inline-time {
  font-size: 11px; color: #718096; font-weight: 500; line-height: 1.3;
}
body.is-teacher .sched-table .sched-break-text {
  display: inline-block; outline: none; min-width: 1em;
}

/* —— 行高拖拽把手：贴在行底边线 —— */
body.is-teacher .sched-table .sched-row-grip {
  position: absolute; left: 0; right: 0; bottom: -4px; height: 9px;
  cursor: ns-resize; z-index: 6;
}
body.is-teacher .sched-table .sched-row-grip::after {
  content: ''; position: absolute; left: 6%; right: 6%; top: 3.5px; height: 2px;
  border-radius: 1px; background: transparent; transition: background .12s;
}
body.is-teacher .sched-table .sched-row-grip:hover::after,
body.is-teacher .sched-table .sched-row-grip.dragging::after { background: #42a5f5; }

/* —— 悬停删行按钮：时课格/课间格右上角 —— */
body.is-teacher .sched-table .sched-del-row-hover {
  position: absolute; top: 1px; right: 1px;
  width: 15px; height: 15px; line-height: 13px;
  border: none; border-radius: 50%;
  background: #fff; color: #e53e3e;
  font-size: 10px; cursor: pointer; padding: 0;
  opacity: 0; transition: opacity .12s; z-index: 5;
  box-shadow: 0 1px 3px rgba(0,0,0,.15);
}
body.is-teacher .sched-table .sched-shike:hover .sched-del-row-hover,
body.is-teacher .sched-table .sched-break-cell:hover .sched-del-row-hover,
body.is-teacher .sched-table .sched-lunch-cell:hover .sched-del-row-hover { opacity: 1; }
body.is-teacher .sched-table .sched-break-cell { position: relative; }

/* —— 底部工具栏（解锁后显示）—— */
body.is-teacher .sched-row-tools {
  margin-top: 10px; padding: 8px 12px;
  background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
body.is-teacher .sched-tools-label { font-size: 13px; color: #4a5568; font-weight: 600; }
body.is-teacher .sched-tool-btn {
  border: 1px solid #cbd5e0; background: #fff; color: #2d3748;
  padding: 4px 10px; border-radius: 6px; font-size: 12.5px;
  cursor: pointer; transition: .12s;
}
body.is-teacher .sched-tool-btn:hover { background: #edf2f7; border-color: #a0aec0; }
body.is-teacher .sched-tools-hint { font-size: 12px; color: #718096; margin-left: auto; }
body.is-teacher .sched-tools-sep { color: #cbd5e0; margin: 0 2px; }
body.is-teacher .sched-tool-btn.sched-tool-merge { background: #ebf8ff; border-color: #90cdf4; color: #2b6cb0; }
body.is-teacher .sched-tool-btn.sched-tool-merge:hover { background: #bee3f8; }

/* —— 单元格样式工具栏（字体/字号/文字色/背景色）—— */
body.is-teacher .sched-style-tools { margin-top: 8px; }
body.is-teacher .sched-style-select {
  border: 1px solid #cbd5e0; background: #fff; color: #2d3748;
  padding: 4px 6px; border-radius: 6px; font-size: 12.5px;
  cursor: pointer; height: 28px;
}
body.is-teacher .sched-tool-btn.sched-tool-on { background: #ebf8ff; border-color: #4299e1; color: #2b6cb0; }
body.is-teacher .sched-palette-row {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap; width: 100%;
  padding-top: 6px; margin-top: 2px; border-top: 1px dashed #e2e8f0;
}
body.is-teacher .sched-swatch {
  width: 26px; height: 26px; border-radius: 6px;
  border: 1px solid #cbd5e0; cursor: pointer; transition: transform .1s, box-shadow .1s;
  padding: 0;
}
body.is-teacher .sched-swatch:hover { transform: scale(1.15); box-shadow: 0 0 0 2px #4299e1; }
body.is-teacher .sched-palette-tip { font-size: 12px; color: #718096; }

/* —— 单元格选区高亮 —— */
body.is-teacher .sched-table td.sched-cell-sel {
  outline: 2px solid #4299e1;
  outline-offset: -2px;
  background: rgba(66, 153, 225, 0.12) !important;
}

/* —— 合并单元格：禁用文字选择，便于拖拽选区 —— */
body.is-teacher .sched-table .sched-class {
  user-select: none;
}
body.is-teacher .sched-table .sched-class[contenteditable="true"] {
  user-select: text;
}

/* —— 底部备注 + 教务处 —— */
body.is-teacher .sched-foot {
  margin-top: 10px; padding-top: 10px; border-top: 1px dashed #cbd5e0;
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13.5px;
}
body.is-teacher .sched-foot .sched-note { color: #4a5568; }
body.is-teacher .sched-foot .sched-dept { color: #718096; }

/* —— 周课表「保存」按钮 —— */
body.is-teacher .btn-sched-save {
  border: none; background: linear-gradient(135deg, #2563eb 0%, #2563eb 100%);
  color: #fff; padding: 7px 18px; border-radius: 10px;
  font-size: 14px; font-weight: 600; cursor: pointer;
  transition: .15s; box-shadow: 0 2px 6px rgba(37,99,235,.3);
}
body.is-teacher .btn-sched-save:hover { transform: translateY(-1px); box-shadow: 0 4px 10px rgba(37,99,235,.4); }
body.is-teacher .btn-sched-save.dirty {
  background: linear-gradient(135deg, #27ae60 0%, #1e8449 100%);
  box-shadow: 0 2px 6px rgba(39,174,96,.3);
  animation: pulse-dirty 1.5s ease-in-out infinite;
}
@keyframes pulse-dirty {
  0%, 100% { box-shadow: 0 2px 6px rgba(39,174,96,.3); }
  50% { box-shadow: 0 2px 14px rgba(39,174,96,.6); }
}

/* —— 统计卡（缩小版，放在课表下方）—— */
body.is-teacher .sched-stats-row {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
  margin-top: 14px;
}
body.is-teacher .sched-stats-row .stat-card {
  padding: 10px 12px; border-radius: 12px;
  background: #fff; border: 1px solid #e2e8f0;
  box-shadow: 0 1px 3px rgba(16,24,40,.04);
  border-left: 3px solid #2563eb;
}
body.is-teacher .sched-stats-row .stat-card.s-green { border-left-color: #27ae60; }
body.is-teacher .sched-stats-row .stat-card.s-blue { border-left-color: #3498db; }
body.is-teacher .sched-stats-row .stat-card.s-orange { border-left-color: #f39c12; }
body.is-teacher .sched-stats-row .stat-card .stat-label {
  font-size: 11px; color: #a0aec0; font-weight: 500; margin-bottom: 2px;
}
body.is-teacher .sched-stats-row .stat-card .stat-value {
  font-size: 20px; font-weight: 700; color: #2d3748; line-height: 1.1;
}
body.is-teacher .sched-stats-row .stat-card .stat-value .unit {
  font-size: 11px; font-weight: 500; color: #a0aec0; margin-left: 2px;
}

/* 页脚 */
body.is-teacher .plan-doc-footer {
  display: flex; justify-content: space-between;
  margin-top: 36px; padding-top: 14px; border-top: 1px dashed #cbd5e0;
  font-size: 12px; color: #a0aec0;
}

/* ===========================================================
 * 教师端 · 课后报告（标准版式）
 * =========================================================== */

/* —— 空状态 —— */
body.is-teacher .report-empty {
  text-align: center; padding: 72px 24px 56px; background: #ffffff;
  border-radius: 24px; box-shadow: 0 2px 8px rgba(0,0,0,.06); border: 1px solid #e2e8f0;
}
body.is-teacher .report-empty .re-emo {
  font-size: 56px; line-height: 1; margin-bottom: 18px; opacity: .85;
}
body.is-teacher .report-empty h2 {
  font-size: 22px; font-weight: 700; color: #2d3748; margin: 0 0 10px; line-height: 32px;
}
body.is-teacher .report-empty .re-desc {
  font-size: 14px; color: #5a6b7f; line-height: 22.4px;
}

/* —— 历史会话卡片 —— */
body.is-teacher .rh-card { padding: 0; overflow: hidden; }
body.is-teacher .rh-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 18px 22px; border-bottom: 1px solid #edf2f7;
}
body.is-teacher .rh-title {
  font-size: 15px; font-weight: 700; color: #2d3748; margin: 0; line-height: 24px;
}
body.is-teacher .rh-refresh {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 12px; border: 1px solid #e2e8f0;
  background: #ffffff; color: #5a6b7f; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: .15s; font-family: inherit;
}
body.is-teacher .rh-refresh:hover { background: #f1f5f9; color: #2d6cf2; border-color: #c5d6f5; }
body.is-teacher .rh-ico { font-size: 13px; }

/* —— 历史会话表格 —— */
body.is-teacher .hist-table {
  width: 100%; border-collapse: collapse; font-size: 13px; color: #2d3748;
}
body.is-teacher .hist-table thead tr { background: #fafbfc; }
body.is-teacher .hist-table th {
  font-size: 12.5px; font-weight: 600; color: #5a6b7f;
  padding: 12px 22px; text-align: left; border-bottom: 1px solid #edf2f7;
  background: #fafbfc;
}
body.is-teacher .hist-table th.left { text-align: left; }
body.is-teacher .hist-table td {
  font-size: 13px; color: #2d3748; padding: 13px 22px;
  border-bottom: 1px solid #f0f4f8; vertical-align: middle;
}
body.is-teacher .hist-table td.left { font-weight: 500; }
body.is-teacher .hist-table tbody tr:hover { background: #fafbfc; }

/* —— 状态胶囊（蓝=进行中 / 绿=已下课）—— */
body.is-teacher .pill.status-pill {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 600;
  line-height: 1.5; letter-spacing: .2px; cursor: default;
  border: 1px solid transparent;
}
body.is-teacher .pill.status-pill.pill-green { color: #1e8449; background: #e8f8ef; border-color: #a7f3d0; }
body.is-teacher .pill.status-pill.pill-blue { color: #2d6cf2; background: #eaf1ff; border-color: #b8cefc; }

/* —— 文字链接按钮 —— */
body.is-teacher .tb-link {
  background: none; border: none; color: #2d6cf2; font-size: 13px; font-weight: 600;
  cursor: pointer; padding: 2px 0; transition: .12s; font-family: inherit;
}
body.is-teacher .tb-link:hover { color: #2563eb; text-decoration: underline; }

/* —— 详情弹窗 —— */
body.is-teacher .report-modal {
  width: 640px; max-height: calc(var(--vhpx, 1vh) * 85); overflow-y: auto; padding: 24px 26px 20px;
  border-radius: 20px;
}
body.is-teacher .report-modal .rm-head {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px;
}
body.is-teacher .report-modal .rm-head h2 {
  font-size: 18px; font-weight: 700; color: #2d3748; margin: 0; line-height: 28px;
}
body.is-teacher .report-modal .rm-close {
  width: 30px; height: 30px; border-radius: 50%; border: none;
  background: #f4f7fd; color: #5a6b7f; font-size: 14px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; transition: .15s;
}
body.is-teacher .report-modal .rm-close:hover { background: #e2e8f0; color: #2d3748; }

body.is-teacher .report-modal .rm-meta {
  display: flex; gap: 16px; flex-wrap: wrap;
  font-size: 13px; color: #5a6b7f; padding: 10px 0 18px; margin-bottom: 18px;
  border-bottom: 1px solid #edf2f7;
}
body.is-teacher .report-modal .rm-meta span { white-space: nowrap; }

body.is-teacher .report-modal .rm-kpis {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px;
}
body.is-teacher .report-modal .rm-kpi {
  text-align: center; padding: 14px 10px; border-radius: 12px;
  background: #f7f9fc; border: 1px solid #e2e8f0;
}
body.is-teacher .report-modal .rm-kv {
  font-size: 24px; font-weight: 800; color: #2d3748; line-height: 1.2;
}
body.is-teacher .report-modal .rm-ku { font-size: 12px; font-weight: 500; color: #5a6b7f; margin-left: 2px; }
body.is-teacher .report-modal .rm-kl {
  font-size: 12px; color: #5a6b7f; margin-top: 6px; line-height: 18px;
}

body.is-teacher .report-modal .rm-section h4 {
  font-size: 14px; font-weight: 700; color: #2d3748; margin: 0 0 10px; line-height: 22px;
}
body.is-teacher .report-modal .rm-hl {
  margin: 0; padding: 0 0 0 20px; color: #2d3748; font-size: 13.5px; line-height: 1.8;
}
body.is-teacher .report-modal .rm-hl li { margin-bottom: 3px; }

body.is-teacher .report-modal .rm-foot {
  display: flex; justify-content: flex-end; gap: 12px; margin-top: 22px; padding-top: 16px;
  border-top: 1px solid #edf2f7;
}
body.is-teacher .report-modal .tb-primary {
  padding: 8px 22px; border-radius: 999px; border: none;
  background: #2563eb; color: #ffffff; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: .15s; font-family: inherit; box-shadow: 0 2px 6px rgba(37,99,235,.2);
}
body.is-teacher .report-modal .tb-primary:hover { background: #1d4ed8; }

/* 打印样式 */
@media print {
  body.is-teacher .plan-overlay {
    position: static; background: #fff; z-index: auto;
  }
  body.is-teacher .plan-modal {
    width: 100%; height: auto; box-shadow: none; border-radius: 0;
    max-width: calc(var(--vwpx, 1vw) * 100);
  }
  body.is-teacher .plan-toolbar { display: none !important; }
  body.is-teacher .plan-doc-scroll { overflow: visible; background: #fff; padding: 0; }
  body.is-teacher .plan-doc {
    max-width: 100%; padding: 20px; box-shadow: none;
    font-size: 12pt;
  }
  body.is-teacher .plan-doc-meta span { display: inline; }
  /* —— 周课表打印优化 —— */
  body.is-teacher .sidebar { display: none !important; }
  body.is-teacher .topbar { display: none !important; }
  body.is-teacher .teach-main { margin-left: 0 !important; padding: 10mm !important; }
  body.is-teacher .view-header .filters { display: none !important; }
  body.is-teacher .sched-tabs { display: none !important; }
  body.is-teacher .sched-card { box-shadow: none !important; border: none !important; padding: 0 !important; border-radius: 0 !important; }
  body.is-teacher .sched-stats-row { display: none !important; }
  body.is-teacher .sched-row-tools { display: none !important; }
  body.is-teacher .sched-table .sched-col-grip,
  body.is-teacher .sched-table .sched-row-grip,
  body.is-teacher .sched-table .sched-del-col,
  body.is-teacher .sched-table .sched-del-row-hover { display: none !important; }
  body.is-teacher .sched-table { font-size: 14pt !important; }
  body.is-teacher .sched-table thead th { font-size: 16pt !important; padding: 12px 6px !important; color-adjust: exact; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body.is-teacher .sched-table tbody td { font-size: 14pt !important; padding: 10px 6px !important; color-adjust: exact; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body.is-teacher .sched-table .sched-break-cell { font-size: 13pt !important; }
  body.is-teacher .sched-foot { display: flex !important; }
}
body.is-teacher .pd-act-scene { font-size: 11px; color: #94a3b8; }
body.is-teacher .pd-act-title { font-size: 14px; font-weight: 700; color: #2d3748; margin: 0 0 10px; line-height: 1.4; }
body.is-teacher .pd-act-score { font-size: 12px; color: #5a6b7f; margin-bottom: 10px; }
body.is-teacher .pd-act-cores { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
body.is-teacher .pd-act-core { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 6px; background: #f1f5f9; color: #475569; }
body.is-teacher .pd-act-btn { width: 100%; padding: 8px 0; border-radius: 999px; font-size: 13px; font-weight: 700; color: #fff; background: linear-gradient(135deg, #3b82f6, #2563eb); border: none; cursor: pointer; font-family: inherit; box-shadow: 0 4px 12px rgba(37,99,235,.3); transition: .15s; }
body.is-teacher .pd-act-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(37,99,235,.4); }

/* —— 资源库（四分区 + 弹层） —— */
body.is-teacher .pd-reslib { display: flex; flex-direction: column; gap: 0; }
/* ===== 资源库：目录树 + 筛选 + 网格布局 ===== */
body.is-teacher .res-layout { display: flex; gap: 16px; min-height: 500px; }
/* 左侧目录树 */
body.is-teacher .res-tree-panel { flex: none; width: 240px; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; }
body.is-teacher .res-tree-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; background: #f8fafc; border-bottom: 1px solid #e2e8f0; font-size: 13px; font-weight: 700; color: #2d3748; }
body.is-teacher .res-tree-expand-all { font-size: 11px; font-weight: 700; color: #2563eb; background: #eff6ff; border: none; padding: 3px 10px; border-radius: 999px; cursor: pointer; transition: .15s; }
body.is-teacher .res-tree-expand-all:hover { background: #2563eb; color: #fff; }
body.is-teacher .res-tree-body { flex: 1; overflow-y: auto; padding: 6px 0; max-height: 600px; }
body.is-teacher .res-tree-node { }
body.is-teacher .res-tree-row { display: flex; align-items: center; gap: 6px; padding: 5px 12px; cursor: pointer; font-size: 13px; color: #475569; transition: background .12s; user-select: none; }
body.is-teacher .res-tree-row:hover { background: #f1f5f9; }
body.is-teacher .res-tree-row.active { background: #eff6ff; color: #2563eb; font-weight: 700; }
body.is-teacher .res-tree-book { font-weight: 700; color: #1e293b; font-size: 13.5px; padding: 7px 12px; }
body.is-teacher .res-tree-unit { font-weight: 600; color: #334155; font-size: 13px; padding-left: 20px; }
body.is-teacher .res-tree-task { padding-left: 36px; font-size: 12.5px; }
body.is-teacher .res-tree-arrow { flex: none; width: 14px; text-align: center; font-size: 10px; color: #94a3b8; transition: transform .15s; }
body.is-teacher .res-tree-arrow.open { transform: rotate(90deg); }
body.is-teacher .res-tree-arrow.invisible { visibility: hidden; }
body.is-teacher .res-tree-emoji { flex: none; font-size: 14px; }
body.is-teacher .res-tree-label { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.is-teacher .res-tree-badge { flex: none; font-size: 10px; font-weight: 700; color: #94a3b8; background: #f1f5f9; padding: 1px 7px; border-radius: 999px; }
body.is-teacher .res-tree-cur { flex: none; color: #2563eb; font-size: 8px; }
body.is-teacher .res-tree-children { }
/* 右侧主面板 */
body.is-teacher .res-main-panel { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
/* 筛选栏 */
body.is-teacher .res-filter-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 10px 14px; flex-wrap: wrap; }
body.is-teacher .res-filter-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
body.is-teacher .res-ftab { font-size: 12.5px; font-weight: 600; color: #64748b; background: transparent; border: 1px solid transparent; padding: 5px 12px; border-radius: 999px; cursor: pointer; transition: .15s; white-space: nowrap; }
body.is-teacher .res-ftab b { font-size: 11px; font-weight: 800; margin-left: 3px; color: #94a3b8; }
body.is-teacher .res-ftab:hover { background: #f1f5f9; }
body.is-teacher .res-ftab.on { background: #2563eb; color: #fff; }
body.is-teacher .res-ftab.on b { color: #fff; }
body.is-teacher .res-filter-right { display: flex; align-items: center; gap: 8px; }
body.is-teacher .res-search { width: 220px; font-size: 13px; padding: 6px 14px; border: 1px solid #e2e8f0; border-radius: 999px; outline: none; transition: .15s; font-family: inherit; }
body.is-teacher .res-search:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.1); }
body.is-teacher .res-view-switch { display: flex; gap: 2px; background: #f1f5f9; border-radius: 8px; padding: 2px; }
body.is-teacher .res-view-switch button { font-size: 16px; width: 30px; height: 28px; border: none; background: transparent; border-radius: 6px; cursor: pointer; color: #94a3b8; transition: .15s; }
body.is-teacher .res-view-switch button.on { background: #fff; color: #2563eb; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
/* 当前课时提示 */
body.is-teacher .res-cur-task { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #475569; padding: 0 4px; }
body.is-teacher .res-cur-emoji { font-size: 16px; }
body.is-teacher .res-cur-title { font-weight: 700; color: #1e293b; }
body.is-teacher .res-cur-count { margin-left: auto; font-size: 12px; color: #94a3b8; }
/* 平铺网格 */
body.is-teacher .res-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
body.is-teacher .res-card { display: flex; align-items: center; gap: 12px; border: 1px solid #e2e8f0; border-radius: 12px; padding: 12px 14px; background: #fff; cursor: pointer; transition: .15s; }
body.is-teacher .res-card:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,.08); border-color: #2563eb; }
body.is-teacher .res-card-icon { flex: none; width: 40px; height: 40px; border-radius: 10px; background: linear-gradient(135deg, #f8fafc, #f1f5f9); display: flex; align-items: center; justify-content: center; font-size: 19px; }
body.is-teacher .res-card-doc .res-card-icon { background: linear-gradient(135deg, #eff6ff, #dbeafe); }
body.is-teacher .res-card-img .res-card-icon { background: linear-gradient(135deg, #eff6ff, #dbeafe); }
body.is-teacher .res-card-aud .res-card-icon { background: linear-gradient(135deg, #f0fdf4, #dcfce7); }
body.is-teacher .res-card-vid .res-card-icon { background: linear-gradient(135deg, #faf5ff, #f3e8ff); }
body.is-teacher .res-card-main { flex: 1; min-width: 0; }
body.is-teacher .res-card-name { font-size: 13px; font-weight: 700; color: #2d3748; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.is-teacher .res-card-code { font-size: 11px; color: #94a3b8; margin-top: 2px; }
body.is-teacher .res-card-meta { font-size: 11px; color: #cbd5e1; margin-top: 1px; }
body.is-teacher .res-card-thumb { flex: none; width: 48px; height: 48px; border-radius: 8px; overflow: hidden; }
body.is-teacher .res-card-thumb img { width: 100%; height: 100%; object-fit: cover; }
body.is-teacher .res-empty { grid-column: 1 / -1; text-align: center; padding: 60px 20px; color: #94a3b8; font-size: 14px; }
body.is-teacher .pd-res-sec { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 16px 18px; box-shadow: 0 2px 6px rgba(0,0,0,.04); }
body.is-teacher .pd-res-sec-head { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: #2d3748; margin-bottom: 14px; }
body.is-teacher .pd-res-sec-n { background: #eff6ff; color: #2563eb; font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; }
body.is-teacher .pd-res-sec-tip { margin-left: auto; font-size: 11.5px; font-weight: 400; color: #94a3b8; }
/* 备课文档卡片 */
body.is-teacher .pd-doc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
body.is-teacher .pd-doc-card { display: flex; align-items: center; gap: 12px; border: 1px solid #e2e8f0; border-radius: 12px; padding: 13px 14px; background: #fff; text-decoration: none; transition: .15s; }
body.is-teacher .pd-doc-card:hover { border-color: #2563eb; box-shadow: 0 4px 14px rgba(37,99,235,.12); transform: translateY(-2px); }
body.is-teacher .pd-doc-icon { flex: none; width: 44px; height: 44px; border-radius: 10px; background: linear-gradient(135deg, #eff6ff, #dbeafe); display: flex; align-items: center; justify-content: center; font-size: 21px; }
body.is-teacher .pd-doc-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; text-decoration: none; color: inherit; }
body.is-teacher .pd-doc-name { font-size: 13px; font-weight: 700; color: #2d3748; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.is-teacher .pd-doc-meta { font-size: 11.5px; color: #94a3b8; }
body.is-teacher .pd-doc-open { flex: none; font-size: 12px; font-weight: 700; color: #2563eb; background: #eff6ff; padding: 5px 12px; border-radius: 999px; text-decoration: none; }
body.is-teacher .pd-doc-card:hover .pd-doc-open { background: #2563eb; color: #fff; }
body.is-teacher .pd-doc-dl { flex: none; font-size: 12px; font-weight: 700; color: #64748b; background: #f1f5f9; padding: 5px 11px; border-radius: 999px; text-decoration: none; transition: .15s; }
body.is-teacher .pd-doc-dl:hover { background: #475569; color: #fff; }
body.is-teacher .pd-res-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 14px; }
body.is-teacher .pd-res-card { border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; background: #fff; transition: .15s; cursor: pointer; }
body.is-teacher .pd-res-card:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,.08); border-color: #2563eb; }
body.is-teacher .pd-res-thumb { width: 100%; aspect-ratio: 4/3; background: #f1f5f9; display: flex; align-items: center; justify-content: center; overflow: hidden; }
body.is-teacher .pd-res-thumb img { width: 100%; height: 100%; object-fit: contain; padding: 6px; }
body.is-teacher .pd-res-placeholder { font-size: 28px; color: #cbd5e1; }
body.is-teacher .pd-res-code { font-size: 11px; font-weight: 700; color: #2563eb; padding: 8px 10px 2px; font-family: Consolas, monospace; }
body.is-teacher .pd-res-title { font-size: 12.5px; font-weight: 600; color: #2d3748; padding: 0 10px; line-height: 1.5; }
body.is-teacher .pd-res-vtitle { font-size: 12.5px; font-weight: 600; color: #2d3748; padding: 0 10px; line-height: 1.5; }
body.is-teacher .pd-res-desc { font-size: 12px; color: #475569; padding: 2px 10px 10px; line-height: 1.5; }
body.is-teacher .pd-res-empty { grid-column: 1 / -1; text-align: center; padding: 30px; color: #94a3b8; font-size: 13px; }
/* 音频卡片 */
body.is-teacher .pd-res-agrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
body.is-teacher .pd-res-acard { display: flex; gap: 12px; border: 1px solid #e2e8f0; border-radius: 12px; padding: 12px; background: #fff; transition: .15s; }
body.is-teacher .pd-res-acard:hover { border-color: #2563eb; box-shadow: 0 4px 14px rgba(37,99,235,.12); }
body.is-teacher .pd-res-aicon { flex: none; width: 46px; height: 46px; border-radius: 10px; background: linear-gradient(135deg, #eff6ff, #dbeafe); display: flex; align-items: center; justify-content: center; font-size: 22px; }
body.is-teacher .pd-res-amain { flex: 1; min-width: 0; }
body.is-teacher .pd-res-acode { font-size: 11px; font-weight: 700; color: #2563eb; font-family: Consolas, monospace; }
body.is-teacher .pd-res-atitle { font-size: 12.5px; font-weight: 600; color: #2d3748; margin: 2px 0 8px; }
body.is-teacher .pd-res-adesc { font-size: 11.5px; color: #94a3b8; margin-top: 6px; }
body.is-teacher .pd-res-audio { display: flex; align-items: center; gap: 10px; }
body.is-teacher .pd-audio-play { flex: none; width: 30px; height: 30px; border-radius: 50%; border: none; background: #2563eb; color: #fff; font-size: 13px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: .15s; }
body.is-teacher .pd-audio-play:hover { background: #1d4ed8; }
body.is-teacher .pd-audio-bar { flex: 1; height: 5px; background: #eef1f6; border-radius: 3px; overflow: hidden; }
body.is-teacher .pd-audio-progress { height: 100%; width: 0; background: linear-gradient(90deg, #3b82f6, #2563eb); border-radius: 3px; transition: width .3s linear; }
body.is-teacher .pd-audio-time { flex: none; font-size: 11.5px; color: #5a6b7f; font-family: Consolas, monospace; min-width: 34px; text-align: right; }
/* 视频卡片 */
body.is-teacher .pd-res-vgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
body.is-teacher .pd-res-vcard { border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; background: #fff; cursor: pointer; transition: .15s; }
body.is-teacher .pd-res-vcard:hover { transform: translateY(-2px); border-color: #2563eb; box-shadow: 0 6px 16px rgba(0,0,0,.08); }
body.is-teacher .pd-res-vthumb { position: relative; width: 100%; aspect-ratio: 16/9; background: linear-gradient(135deg, #667eea, #0ea5e9); display: flex; align-items: center; justify-content: center; }
body.is-teacher .pd-res-vthumb img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
body.is-teacher .pd-res-vplay { width: 44px; height: 44px; border-radius: 50%; background: rgba(255,255,255,.92); color: #2563eb; font-size: 17px; font-weight: 700; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 14px rgba(0,0,0,.25); transition: .15s; position: relative; }
body.is-teacher .pd-res-vcard:hover .pd-res-vplay { transform: scale(1.1); background: #2563eb; color: #fff; }
/* 图片/视频弹层 */
body.is-teacher .pd-lightbox { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 999; background: rgba(15,23,42,.86); display: flex; align-items: center; justify-content: center; padding: 32px; backdrop-filter: blur(4px); }
body.is-teacher .pd-lightbox-inner { position: relative; max-width: min(920px, calc(var(--vwpx, 1vw) * 92)); max-height: calc(var(--vhpx, 1vh) * 88); background: #fff; border-radius: 16px; padding: 14px; display: flex; flex-direction: column; gap: 10px; box-shadow: 0 30px 80px rgba(0,0,0,.5); }
body.is-teacher .pd-lightbox-inner img { max-width: 100%; max-height: calc(var(--vhpx, 1vh) * 72); object-fit: contain; border-radius: 10px; background: #f8fafc; }
body.is-teacher .pd-lightbox-cap { font-size: 13px; color: #475569; }
body.is-teacher .pd-lightbox-cap b { color: #2563eb; font-family: Consolas, monospace; }
body.is-teacher .pd-lightbox-x { flex: none; margin-left: 12px; background: #f1f5f9; border: none; color: #5a6b7f; font-size: 12.5px; font-weight: 600; padding: 7px 14px; border-radius: 999px; cursor: pointer; font-family: inherit; }
body.is-teacher .pd-lightbox-x:hover { background: #2563eb; color: #fff; }
body.is-teacher .pd-vidbox { width: min(880px, calc(var(--vwpx, 1vw) * 92)); }
body.is-teacher .pd-vid-stage { width: 100%; aspect-ratio: 16/9; border-radius: 10px; overflow: hidden; background: #0f172a; }
body.is-teacher .pd-vid-stage svg { display: block; width: 100%; height: 100%; }
body.is-teacher .pd-vid-stage video { display: block; width: 100%; height: 100%; object-fit: contain; background: #0f172a; }
body.is-teacher .pd-vid-bar { display: flex; align-items: center; gap: 10px; }

/* —— 上课模式 · 深蓝顶栏 —— */
body.is-teacher .pd-classbar { display: flex; align-items: center; gap: 8px; background: linear-gradient(135deg, #2b4acb, #1e3aa8); border-radius: 16px; padding: 8px 12px; margin-bottom: 14px; box-shadow: 0 4px 14px rgba(30,58,168,.3); overflow-x: auto; }
body.is-teacher .pd-class-pill { display: flex; align-items: center; gap: 6px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.25); color: #fff; font-size: 12.5px; font-weight: 600; padding: 7px 12px; border-radius: 999px; cursor: pointer; white-space: nowrap; font-family: inherit; transition: .15s; }
body.is-teacher .pd-class-pill:hover { background: rgba(255,255,255,.24); }

/* —— 学生管理（标准版式：标题区+统计标签+工具栏+表格视图） —— */
body.is-teacher .stu-root { padding: 0; }
/* 标题区与工具栏上下排列：标题占满宽度不换行，工具栏在下方，消除右侧多行造成的左侧大片空白 */
body.is-teacher .stu-top { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
body.is-teacher .stu-head { width: 100%; min-width: 0; }
body.is-teacher .stu-head .pg-title { margin-bottom: 4px; font-size: 28px; white-space: nowrap; line-height: 1.3; display: inline-block; color: #1e293b; }
body.is-teacher .stu-head .pg-sub { margin-bottom: 8px; font-size: 15px; color: #8a99ab; white-space: nowrap; }
body.is-teacher .stu-stats { display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; }
body.is-teacher .stu-stat { min-height: 46px; display: inline-flex; align-items: center; gap: 5px; padding: 5px 14px 5px 6px; border-radius: 14px; cursor: pointer; transition: all .15s; user-select: none; white-space: nowrap; box-shadow: 0 3px 12px rgba(0,0,0,.08); }
body.is-teacher .stu-stat:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.12); }
body.is-teacher .stu-stat .ss-ico { width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 18px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.28); }
body.is-teacher .stu-stat .ss-name { font-size: 14px; font-weight: 600; }
body.is-teacher .stu-stat .ss-num { font-size: 27px; font-weight: 800; line-height: 1; font-family: Consolas, 'Courier New', monospace; margin-left: 4px; }
body.is-teacher .stu-stat .ss-unit { font-size: 12px; font-weight: 600; opacity: .8; align-self: flex-end; padding-bottom: 2px; }
body.is-teacher .stu-stat.on { color: #14532d; background: linear-gradient(135deg, #ecfdf5, #c9f4d9); border: 1.5px solid #a7f3d0; }
body.is-teacher .stu-stat.on .ss-ico { background: linear-gradient(135deg, #25c26a, #16a34a); color: #fff; }
body.is-teacher .stu-stat.off { color: #334155; background: linear-gradient(135deg, #f8fafc, #e8eef5); border: 1.5px solid #e2e8f0; }
body.is-teacher .stu-stat.off .ss-ico { background: linear-gradient(135deg, #94a3b8, #64748b); color: #fff; }
body.is-teacher .stu-stat.all { color: #1e3a8a; background: linear-gradient(135deg, #eff6ff, #dbeafe); border: 1.5px solid #bfdbfe; }
body.is-teacher .stu-stat.all .ss-ico { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff; }
body.is-teacher .stu-stat.active { outline: 2px solid #2563eb; outline-offset: 2px; box-shadow: 0 4px 16px rgba(37,99,235,.35); transform: scale(1.03); }

/* 工具栏（紧凑：按钮缩小，尽量单行） */
body.is-teacher .stu-toolbar { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
body.is-teacher .stu-toolbar .select-wrap select { height: 32px; font-size: 12px; padding: 5px 26px 5px 9px; }
/* 学生查找框（学生管理 + 机房座次共用） */
body.is-teacher .stu-search-wrap { position: relative; display: flex; align-items: center; flex: 0 1 160px; min-width: 130px; }
body.is-teacher .stu-search-ico { position: absolute; left: 11px; font-size: 13px; pointer-events: none; }
body.is-teacher .stu-search { width: 100%; height: 32px; border-radius: 999px; border: 2px solid #e2e8f0; background: #fff; font-size: 12.5px; font-weight: 600; font-family: inherit; color: #2d3748; padding: 0 32px; outline: none; transition: .15s; }
body.is-teacher .stu-search::placeholder { color: #a0aec0; font-size: 12px; font-weight: 400; }
body.is-teacher .stu-search:hover { border-color: #3b82f6; }
body.is-teacher .stu-search:focus { border-color: #2563eb; box-shadow: 0 0 0 4px #eff6ff; }
body.is-teacher .stu-search-clear { position: absolute; right: 7px; width: 18px; height: 18px; border-radius: 50%; border: none; background: #e2e8f0; color: #64748b; font-size: 10px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
body.is-teacher .stu-search-clear:hover { background: #2563eb; color: #fff; }
/* 【查找】主按钮 */
body.is-teacher .stu-btn.stu-btn-search { font-size: 13px; font-weight: 700; padding: 6px 14px; background: linear-gradient(135deg, #3b82f6, #2563eb); box-shadow: 0 3px 12px rgba(37,99,235,.4); letter-spacing: 1px; }
body.is-teacher .stu-btn.stu-btn-search:hover { transform: translateY(-1px) scale(1.03); box-shadow: 0 6px 22px rgba(37,99,235,.55); }
body.is-teacher .stu-btn.stu-btn-search:active { transform: scale(.97); }
/* 弹窗内独立查找行（试卷测验·成绩弹窗） */
body.is-teacher .pg-search-row { display: flex; align-items: center; gap: 8px; margin: 10px 0 4px; }
/* 联想下拉（输入姓氏实时列出所有班级同姓学生） */
body.is-teacher .stu-suggest { position: absolute; top: calc(100% + 8px); left: 0; right: 0; min-width: 300px; background: #fff; border: 1.5px solid #bfdbfe; border-radius: 14px; box-shadow: 0 14px 38px rgba(30,41,59,.18); z-index: 60; overflow: hidden; }
body.is-teacher .stu-sug-item { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 9px 14px; background: none; border: none; cursor: pointer; font-family: inherit; transition: .12s; }
body.is-teacher .stu-sug-item:hover { background: #eff6ff; }
body.is-teacher .stu-sug-ava { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 13px; font-weight: 800; flex-shrink: 0; }
body.is-teacher .stu-sug-name { font-size: 14px; font-weight: 700; color: #2d3748; }
body.is-teacher .stu-sug-cls { margin-left: auto; font-size: 12px; color: #64748b; white-space: nowrap; }
body.is-teacher .stu-sug-foot { font-size: 12px; color: #94a3b8; padding: 8px 14px; background: #f8fafc; border-top: 1px solid #f1f5f9; }
body.is-teacher .stu-btn { font-size: 11.5px; font-weight: 600; padding: 5px 8px; border-radius: 999px; border: none; cursor: pointer; font-family: inherit; transition: .15s; white-space: nowrap; }
body.is-teacher .stu-btn-primary { background: #2563eb; color: #fff; box-shadow: 0 4px 16px rgba(37,99,235,.3); }
body.is-teacher .stu-btn-primary:hover { background: #1d4ed8; transform: translateY(-1px); }
body.is-teacher .stu-btn-outline { background: #fff; color: #475569; border: 1px solid #e2e8f0; }
body.is-teacher .stu-btn-outline:hover { border-color: #2563eb; color: #2563eb; }
body.is-teacher .stu-btn-ghost { background: transparent; color: #5a6b7f; border: 1px solid transparent; }
body.is-teacher .stu-btn-ghost:hover { background: #f1f5f9; color: #2d3748; }

/* 提示条 */
body.is-teacher .stu-hint { font-size: 12px; color: #94a3b8; text-align: right; margin-bottom: 6px; }

/* 表格 */
body.is-teacher .stu-table-wrap { background: #fff; border-radius: 16px; box-shadow: 0 2px 12px rgba(0,0,0,.04); overflow-x: auto; overflow-y: hidden; margin-bottom: 16px; scrollbar-width: none; -ms-overflow-style: none; }
body.is-teacher .stu-table-wrap::-webkit-scrollbar { display: none; }
body.is-teacher .stu-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 15px; }
body.is-teacher .stu-table thead tr { background: #2563eb; }
body.is-teacher .stu-table th { font-size: 26px !important; font-weight: 900; color: #fff; background: #2563eb; padding: 18px 16px; text-align: center; white-space: nowrap; border-bottom: none; letter-spacing: 1px; }
body.is-teacher .stu-table th.stu-col-name { text-align: left; padding-left: 68px; } /* 姓名表头与下方姓名文字垂直对应（16内边距+42头像+10间距） */
body.is-teacher .stu-table th:first-child { border-top-left-radius: 12px; }
body.is-teacher .stu-table th:last-child { border-top-right-radius: 12px; }
body.is-teacher .stu-table td { padding: 12px 16px; border-bottom: 1px solid #f1f5f9; color: #2d3748; vertical-align: middle; }
body.is-teacher .stu-table tbody tr:hover { background: #fafbfd; }
body.is-teacher .stu-table tbody tr.alt { background: #fafbfc; }
body.is-teacher .stu-table tbody tr.alt:hover { background: #f1f5f9; }

/* 列宽（table-layout:fixed 权重宽：宽屏下富余宽度按比例摊给各列；备注给小权重即收窄，窄屏由 wrap 横向滚动兜底） */
body.is-teacher .stu-col-no { width: 116px; }
body.is-teacher .stu-col-name { width: 320px; }
body.is-teacher .stu-col-state { width: 120px; text-align: center; }
body.is-teacher .stu-col-grade { width: 160px; color: #94a3b8; white-space: nowrap; }
body.is-teacher .stu-col-account { width: 200px; }
body.is-teacher .stu-col-op { width: 360px; text-align: center; }
body.is-teacher .stu-col-remark { width: 240px; color: #64748b; font-size: 14px; }
/* 社团班「班级」列（学生原行政班）：仅社团班渲染此列 */
body.is-teacher .stu-col-org { width: 150px; text-align: center; }
body.is-teacher .stu-org-text { display: inline-block; max-width: 100%; font-size: 16px; font-weight: 700; color: #1e40af; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
body.is-teacher .stu-org-text.empty { color: #cbd5e1; font-weight: 600; }
body.is-teacher .stu-org-text:hover { color: #2563eb; }
body.is-teacher .stu-org-input { width: 100%; font-size: 15px; font-family: inherit; color: #2d3748; background: #fff; padding: 7px 10px; border: 1.5px solid #2563eb; border-radius: 8px; outline: none; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
/* 备注显示：支持多行自动换行，最多展示3行，超出省略（悬停/编辑可看全文） */
body.is-teacher .stu-remark-text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; max-width: 100%; white-space: pre-wrap; word-break: break-word; line-height: 1.55; cursor: pointer; border-radius: 6px; }
body.is-teacher .stu-remark-text.empty { color: #cbd5e1; display: inline-block; }
body.is-teacher .stu-remark-text:hover { color: #2563eb; }
/* 备注编辑：多行文本域，宽度撑满备注列，随内容自动增高 */
body.is-teacher .stu-remark-input { width: 100%; max-width: 620px; min-height: 38px; display: block; font-size: 12px; font-family: inherit; line-height: 1.6; color: #2d3748; background: #fff; padding: 6px 10px; border: 1.5px solid #2563eb; border-radius: 8px; outline: none; box-shadow: 0 0 0 3px rgba(37,99,235,.12); resize: none; overflow: hidden; }

/* 机号徽章 */
body.is-teacher .stu-no-badge { display: inline-flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 12px; background: linear-gradient(135deg, #eef2ff, #e0e7ff); border: 1.5px solid #c7d2fe; color: #3730a3; font-size: 22px; font-weight: 800; font-family: Consolas, monospace; box-shadow: inset 0 1px 0 rgba(255,255,255,.6); }

/* 姓名+头像（仅数据行 td 需要弹性布局，表头 th 保持 table-cell；头像姓名与表头统一左对齐，起点精确一致） */
body.is-teacher .stu-table td.stu-col-name { display: flex; align-items: center; justify-content: flex-start; gap: 10px; }
body.is-teacher .stu-avatar { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; color: #fff; font-size: 16px; font-weight: 800; font-family: Consolas, monospace; flex-shrink: 0; }
body.is-teacher .stu-name { font-size: 18px; font-weight: 600; color: #2d3748; }
/* 跨班查找结果：姓名后的班级标签 */
body.is-teacher .stu-cls-tag { font-size: 13px; font-weight: 700; color: #1e40af; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 6px; padding: 1px 8px; white-space: nowrap; flex-shrink: 0; }

/* 状态下拉 select（替代点击切换胶囊） */
body.is-teacher .stu-state-select { font-size: 15px; font-weight: 600; padding: 4px 12px; border-radius: 999px; border: 1px solid transparent; font-family: inherit; cursor: pointer; appearance: none; background-image: none; }
body.is-teacher .stu-state-select.sel-在读 { color: #1e8449; background: #e8f8ef; border-color: #a7f3d0; }
body.is-teacher .stu-state-select.sel-休学 { color: #5a6b7f; background: #eef1f6; border-color: #d1d9e6; }
/* 旧样式兼容（转入弹窗里的学生列表还在用 state-xxx 胶囊） */
body.is-teacher .stu-state.state-休学 { color: #5a6b7f; background: #eef1f6; border: 1px solid #d1d9e6; }
body.is-teacher .stu-state.state-转出 { color: #5a6b7f; background: #eef1f6; border: 1px solid #d1d9e6; }
body.is-teacher .stu-state.state-毕业 { color: #5a6b7f; background: #eef1f6; border: 1px solid #d1d9e6; }

/* 账号 */
body.is-teacher .stu-account-chip { font-family: Consolas, monospace; font-size: 16px; color: #5a6b7f; background: #f7f9fc; padding: 4px 12px; border-radius: 8px; letter-spacing: .5px; }

/* 操作按钮（仅数据行 td 按钮组用 flex 居中；表头 th 的"操作"两字由 text-align:center 居中） */
body.is-teacher .stu-table td.stu-col-op { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: nowrap; }
body.is-teacher .stu-op-btn { font-size: 15px; font-weight: 700; padding: 6px 14px; border-radius: 9px; border: none; cursor: pointer; font-family: inherit; transition: .12s; white-space: nowrap; }
body.is-teacher .stu-op-edit { background: #f1f5f9; color: #475569; }
body.is-teacher .stu-op-edit:hover { background: #e2e8f0; }
body.is-teacher .stu-op-transfer { background: #fff; color: #5a6b7f; border: 1px solid #e2e8f0; }
body.is-teacher .stu-op-transfer:hover { border-color: #2563eb; color: #2563eb; }
body.is-teacher .stu-op-out { background: #fff; color: #2563eb; border: 1px solid #bfdbfe; }
body.is-teacher .stu-op-out:hover { background: #eff6ff; border-color: #2563eb; color: #1d4ed8; }
body.is-teacher .stu-op-in { background: #fff; color: #0ea5e9; border: 1px solid #bae6fd; }
body.is-teacher .stu-op-in:hover { background: #f0f9ff; border-color: #0ea5e9; color: #0284c7; }
body.is-teacher .stu-op-danger { background: #fff; color: #e74c3c; border: 1px solid #f5c6cb; }
body.is-teacher .stu-op-danger:hover { background: #fdecea; border-color: #e74c3c; color: #c0392b; }

/* 空状态 */
body.is-teacher .stu-empty { padding: 48px 32px; text-align: center; color: #94a3b8; font-size: 13px; }
body.is-teacher .stu-empty-ico { font-size: 40px; margin-bottom: 8px; }

/* 弹窗：学号只读展示 */
body.is-teacher .stu-modal-cls-hint { margin-bottom: 10px; padding: 8px 12px; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px; font-size: 13px; color: #9a3412; }
body.is-teacher .stu-modal-cls-hint b { color: #1d4ed8; }
body.is-teacher .stu-modal-account { display: flex; align-items: center; gap: 10px; margin-top: 8px; padding: 10px 12px; background: #f7f9fc; border-radius: 8px; font-size: 13px; color: #5a6b7f; }
body.is-teacher .stu-modal-account label { font-weight: 600; color: #2d3748; flex-shrink: 0; }

/* 弹窗：转入他班 */
body.is-teacher .transfer-modal { min-width: 380px; }
body.is-teacher .transfer-hint { font-size: 13px; color: #475569; margin-bottom: 12px; line-height: 1.6; }
body.is-teacher .transfer-hint b { color: #2563eb; }

/* 弹窗：他班转入 */
body.is-teacher .import-modal { min-width: 420px; max-width: 480px; }
body.is-teacher .import-hint { font-size: 13px; color: #475569; margin-bottom: 12px; line-height: 1.6; padding: 8px 12px; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px; }
body.is-teacher .import-hint b { color: #1d4ed8; }
body.is-teacher .import-stu-list { max-height: 220px; overflow-y: auto; border: 1px solid #e2e8f0; border-radius: 8px; padding: 6px; background: #fafbfc; }
body.is-teacher .import-stu-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 6px; cursor: pointer; transition: background .15s; font-size: 13px; }
body.is-teacher .import-stu-item:hover { background: #f1f5f9; }
body.is-teacher .import-stu-item input[type="radio"] { accent-color: #2563eb; }
body.is-teacher .import-stu-avatar { width: 26px; height: 26px; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
body.is-teacher .import-stu-name { font-weight: 600; color: #2d3748; }
body.is-teacher .import-stu-no { color: #94a3b8; font-size: 12px; }
body.is-teacher .import-stu-state { font-size: 11px; font-weight: 600; padding: 1px 8px; border-radius: 999px; margin-left: auto; }
body.is-teacher .import-stu-state.state-在读 { color: #1e8449; background: #e8f8ef; }
body.is-teacher .import-stu-state.state-休学 { color: #5a6b7f; background: #eef1f6; }
body.is-teacher .import-stu-state.state-转出 { color: #5a6b7f; background: #eef1f6; }
body.is-teacher .import-stu-state.state-毕业 { color: #5a6b7f; background: #eef1f6; }
body.is-teacher .import-stu-empty { padding: 20px; text-align: center; color: #94a3b8; font-size: 13px; }
body.is-teacher .import-target { margin-top: 8px; padding-top: 10px; border-top: 1px dashed #e2e8f0; }

/* 弹窗：通用确认 */
body.is-teacher .confirm-modal { min-width: 360px; }
body.is-teacher .confirm-modal .confirm-msg { font-size: 14px; color: #475569; line-height: 1.6; white-space: pre-wrap; }

/* 弹窗：座次布局解锁 */
body.is-teacher .seat-unlock-modal .seat-unlock-error { color: #e53e3e; font-size: 13px; margin-top: 6px; }

/* 弹窗：班级管理 */
body.is-teacher .class-manage-modal { min-width: 480px; max-height: calc(var(--vhpx, 1vh) * 80); display: flex; flex-direction: column; }
body.is-teacher .class-manage-toolbar { display: flex; gap: 8px; margin-bottom: 12px; }
body.is-teacher .class-manage-toolbar input { flex: 1; padding: 8px 12px; border-radius: 8px; border: 1px solid #e2e8f0; font-size: 13px; font-family: inherit; }
body.is-teacher .class-manage-toolbar input:focus { outline: none; border-color: #2563eb; }
body.is-teacher .class-list { flex: 1; overflow-y: auto; max-height: 360px; display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
body.is-teacher .class-row { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; background: #f7f9fc; border-radius: 12px; border: 1px solid transparent; transition: .15s; }
body.is-teacher .class-row:hover { border-color: #e2e8f0; background: #f1f5f9; }
body.is-teacher .class-info { flex: 1; min-width: 0; }
body.is-teacher .class-title { font-size: 14px; font-weight: 700; color: #2d3748; margin-bottom: 2px; }
body.is-teacher .class-meta { font-size: 12px; color: #94a3b8; }
body.is-teacher .class-actions { display: flex; gap: 6px; flex-shrink: 0; }

/* 弹窗：批量增班 */
body.is-teacher .batch-add-class-modal { min-width: 520px; }
body.is-teacher .batch-add-tabs { display: flex; gap: 4px; margin-bottom: 14px; padding: 4px; background: #f1f5f9; border-radius: 10px; }
body.is-teacher .bat-tab { flex: 1; padding: 8px 0; border: none; background: transparent; border-radius: 8px; font-size: 13px; color: #64748b; cursor: pointer; transition: .15s; font-family: inherit; }
body.is-teacher .bat-tab:hover { color: #2d3748; }
body.is-teacher .bat-tab-on { background: #fff; color: #2563eb; font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
body.is-teacher .batch-add-body { padding: 4px 0; }
body.is-teacher .batch-add-body textarea { width: 100%; padding: 10px 12px; border: 1px solid #e2e8f0; border-radius: 10px; font-size: 13px; font-family: inherit; resize: vertical; line-height: 1.6; }
body.is-teacher .batch-add-body textarea:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.1); }
body.is-teacher .bat-tip { font-size: 12px; color: #94a3b8; margin-top: 6px; }
body.is-teacher .bat-range-row { display: flex; align-items: flex-end; gap: 8px; margin-bottom: 12px; }
body.is-teacher .bat-range-dash { padding: 0 4px; font-size: 18px; color: #94a3b8; font-weight: 600; padding-bottom: 8px; }
body.is-teacher .bat-range-row .t-lc-field { flex: 1; margin-bottom: 0; }
body.is-teacher .bat-range-row .t-lc-field input { text-align: center; }
body.is-teacher .bat-preview { margin-top: 10px; padding: 10px 12px; background: #f7f9fc; border-radius: 8px; border: 1px dashed #e2e8f0; }
body.is-teacher .bat-preview-label { font-size: 12px; color: #94a3b8; margin-bottom: 4px; }
body.is-teacher .bat-preview-list { font-size: 13px; color: #2d3748; line-height: 1.6; }

/* ===== 批量导出学生名单：班级两列大卡片（保守布局：flex+wrap+width50%+padding 间隔，不用 calc/gap） ===== */
body.is-teacher .bat-export-grid { display: flex; flex-wrap: wrap; max-height: 480px; overflow-y: auto; overflow-x: hidden; border: 1px solid #d7deea; border-radius: 12px; padding: 12px; background: #f2f5fb; }
body.is-teacher .bat-export-grid .bat-export-empty { width: 100%; padding: 30px; text-align: center; color: #999; font-size: 14px; }
body.is-teacher .bat-export-cell { width: 50%; box-sizing: border-box; padding: 0 8px 12px 0; }
body.is-teacher .bat-export-cell:nth-child(even) { padding-left: 8px; padding-right: 0; }
body.is-teacher .bat-export-item { display: flex; align-items: center; padding: 12px 14px; border-radius: 10px; cursor: pointer; background: #fff; border: 2px solid #e2e8f0; box-sizing: border-box; min-height: 56px; }
body.is-teacher .bat-export-item:hover { border-color: #60a5fa; }
body.is-teacher .bat-export-item.is-on { background: #eaf2ff; border-color: #3b82f6; }
body.is-teacher .bat-export-item input[type=checkbox] { flex: 0 0 auto; width: 18px; height: 18px; margin: 0 12px 0 0; cursor: pointer; transform: scale(1.4); }
body.is-teacher .bat-export-item .bei-name { font-size: 19px; font-weight: 700; color: #1e293b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 0 1 auto; }
body.is-teacher .bat-export-item.is-on .bei-name { color: #1d4ed8; }
body.is-teacher .bat-export-item .bei-count { margin-left: auto; flex: 0 0 auto; font-size: 15px; color: #475569; white-space: nowrap; }
body.is-teacher .bat-export-item .bei-count b { color: #1d4ed8; font-weight: 700; }
body.is-teacher .bat-export-item .bei-count .bei-xiuxue { color: #d97706; }

/* ============================================================
   经典风格 · 学生端深色顶栏 / 底栏 / 互动按钮 / 信息卡
   ============================================================ */

/* —— 深色顶栏 —— */
.sl-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #1e2433;
  color: #fff;
  padding: 12px 22px;
  margin: -16px -16px 0;
  border-radius: 0;
  position: sticky;
  top: 0;
  z-index: 50;
  gap: 16px;
}
.sl-topbar-left { display: flex; align-items: center; gap: 16px; min-width: 0; flex: 1; }
.sl-topbar-right { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

.sl-back {
  display: inline-flex; align-items: center; gap: 7px;
  background: transparent; border: none; color: #cbd5e1;
  font-size: 15px; font-weight: 500; cursor: pointer;
  padding: 7px 12px; border-radius: 6px; transition: .15s;
  font-family: inherit;
}
.sl-back svg { width: 18px; height: 18px; flex: none; }
.sl-back:hover { background: rgba(255,255,255,.08); color: #fff; }

.sl-crumb {
  font-size: 16px; color: #94a3b8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  line-height: 1.35;
}
.sl-crumb b { color: #f1f5f9; font-weight: 600; }

.sl-btn-interact {
  display: inline-flex; align-items: center; gap: 6px;
  background: #22c55e; color: #fff;
  border: none; padding: 7px 16px; border-radius: 20px;
  font-size: 13px; font-weight: 600; cursor: pointer;
  font-family: inherit; transition: .15s;
  box-shadow: 0 2px 10px rgba(34,197,94,.3);
}
.sl-btn-interact:hover:not(.disabled) { background: #16a34a; transform: translateY(-1px); }
.sl-btn-interact.active { background: #eab308; box-shadow: 0 2px 10px rgba(234,179,8,.3); }
.sl-btn-interact.disabled { background: #475569; box-shadow: none; cursor: not-allowed; color: #94a3b8; }

.sl-self-progress {
  font-size: 12px; color: #94a3b8; background: rgba(255,255,255,.06);
  padding: 5px 12px; border-radius: 14px;
}
.sl-self-score { color: #fbbf24; font-weight: 700; margin-left: 4px; }

.sl-btn-ghost {
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent; border: none; color: #94a3b8;
  width: 32px; height: 32px; border-radius: 8px;
  cursor: pointer; transition: .15s;
}
.sl-btn-ghost:hover { background: rgba(255,255,255,.08); color: #fff; }

/* —— 深色底栏 —— */
.sl-bottombar {
  display: flex; align-items: center; justify-content: space-between;
  background: #1e2433;
  color: #fff;
  padding: 8px 16px;
  margin: 0 -16px -16px;
  border-radius: 0;
  gap: 16px;
}
.sl-bb-left { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.sl-bb-center {
  display: flex; align-items: center; gap: 10px; flex: 1;
  justify-content: center; max-width: 500px;
}
.sl-bb-right { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }

.sl-bb-btn {
  display: inline-flex; align-items: center; gap: 5px;
  background: transparent; border: none; color: #cbd5e1;
  font-size: 12px; cursor: pointer; padding: 6px 10px;
  border-radius: 6px; font-family: inherit; transition: .15s;
  white-space: nowrap;
}
.sl-bb-btn:hover:not(:disabled):not(.disabled) { background: rgba(255,255,255,.08); color: #fff; }
.sl-bb-btn:disabled, .sl-bb-btn.disabled { opacity: .3; cursor: not-allowed; }
.sl-bb-btn.on { background: rgba(255,107,53,.2); color: #ff6b35; }

.sl-bb-nav { padding: 6px 8px; }

.sl-bb-sep { width: 1px; height: 18px; background: rgba(255,255,255,.12); margin: 0 4px; }

.sl-bb-next {
  background: #ff6b35 !important; color: #fff !important;
  padding: 6px 14px !important; border-radius: 16px !important;
  box-shadow: 0 2px 10px rgba(255,107,53,.3);
}
.sl-bb-next:hover:not(:disabled) { background: #e55a2b !important; }
.sl-bb-next.blocked { background: #475569 !important; box-shadow: none; cursor: not-allowed; }

.sl-bb-finish {
  background: #22c55e !important; color: #fff !important;
  padding: 6px 14px !important; border-radius: 16px !important;
  box-shadow: 0 2px 10px rgba(34,197,94,.3);
}
.sl-bb-finish:hover:not(:disabled) { background: #16a34a !important; }
.sl-bb-finish.blocked { background: #475569 !important; box-shadow: none; cursor: not-allowed; }

.sl-bb-live-tag {
  background: rgba(59,130,246,.15) !important; color: #60a5fa !important;
  padding: 6px 14px !important; border-radius: 16px !important;
  cursor: default !important; font-weight: 600;
}

/* 2026-09-29 授课跟随中：学生回看/补做前测后一键回到老师当前页（醒目蓝色） */
.sl-bb-back {
  background: rgba(59,130,246,.22) !important; color: #93c5fd !important;
  padding: 6px 14px !important; border-radius: 16px !important;
  font-weight: 700;
}
.sl-bb-back:hover { background: rgba(59,130,246,.38) !important; }

/* 进度条（深色底栏内） */
.sl-progress-wrap {
  display: flex; align-items: center; gap: 10px; flex: 1;
}
.sl-progress-track {
  flex: 1; height: 4px; background: rgba(255,255,255,.12);
  border-radius: 2px; overflow: hidden;
}
.sl-progress-fill {
  height: 100%; background: #ff6b35; border-radius: 2px;
  transition: width .3s ease;
}
.sl-page-num { font-size: 12px; color: #94a3b8; white-space: nowrap; min-width: 50px; text-align: right; }
.sl-page-num b { color: #f1f5f9; font-weight: 700; font-size: 13px; }

/* —— "进入互动"悬浮按钮 —— */
.sl-enter-interact {
  position: fixed;
  right: 32px;
  bottom: 100px;
  z-index: 100;
  pointer-events: none;
}
.sl-btn-enter {
  display: inline-flex; align-items: center; gap: 8px;
  background: linear-gradient(135deg, #22c55e, #16a34a);
  color: #fff;
  border: none; padding: 12px 24px; border-radius: 24px;
  font-size: 14px; font-weight: 700; cursor: pointer;
  font-family: inherit; transition: .2s;
  box-shadow: 0 4px 20px rgba(34,197,94,.4);
  pointer-events: auto;
  animation: sl-float-in .3s ease-out;
}
.sl-btn-enter:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(34,197,94,.5); }
.sl-btn-enter:active { transform: scale(0.96); }

@keyframes sl-float-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* —— 互动信息卡（右侧） —— */
.sl-interact-card {
  position: absolute;
  right: 16px;
  top: 20px;
  width: 200px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,.1);
  overflow: hidden;
  z-index: 10;
  border: 1px solid #f1f5f9;
}
.sl-ic-badge {
  background: linear-gradient(135deg, #ff6b35, #f59e0b);
  color: #fff; font-size: 12px; font-weight: 700;
  padding: 6px 12px; text-align: center;
}
.sl-ic-body { padding: 12px; }
.sl-ic-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 5px 0; border-bottom: 1px dashed #f1f5f9;
}
.sl-ic-row:last-child { border-bottom: none; padding-bottom: 0; }
.sl-ic-k { font-size: 12px; color: #94a3b8; }
.sl-ic-v { font-size: 12px; color: #2d3748; font-weight: 600; }

/* 深色顶栏+底栏时，player 容器需要负 margin 扩展背景 */
.player { overflow: visible; }

/* 独立学习模式下，guide-bar 和原 control-bar 的过渡保留 */
/* （control-bar 现在已被 sl-bottombar 替代，但旧样式保留避免编译警告） */

/* 响应式：小屏隐藏互动信息卡，缩小顶栏按钮 */
@media (max-width: 900px) {
  .sl-interact-card { display: none; }
  .sl-crumb { font-size: 14px; }
  .sl-back { font-size: 14px; }
  .sl-btn-interact { padding: 6px 12px; font-size: 12px; }
  .sl-self-progress { display: none; }
}

@media (max-width: 600px) {
  .sl-enter-interact { right: 16px; bottom: 80px; }
  .sl-btn-enter { padding: 10px 18px; font-size: 13px; }
  .sl-bb-btn span:not(.sl-page-num) { display: none; }
}
body.is-teacher .class-manage-foot { font-size: 12px; color: #94a3b8; margin-top: 6px; padding-top: 10px; border-top: 1px solid #f1f5f9; }
body.is-teacher .pd-class-pill.on { background: #fff; color: #1e3aa8; }
body.is-teacher .pd-class-pill-min { font-size: 11px; opacity: .75; }
body.is-teacher .pd-class-spacer { flex: 1; }
body.is-teacher .pd-class-timer { font-size: 14px; font-weight: 800; color: #fff; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.25); padding: 6px 14px; border-radius: 999px; font-variant-numeric: tabular-nums; white-space: nowrap; }
body.is-teacher .pd-class-exit { background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.25); color: #fff; font-size: 12.5px; font-weight: 600; padding: 7px 14px; border-radius: 999px; cursor: pointer; font-family: inherit; white-space: nowrap; transition: .15s; }
body.is-teacher .pd-class-exit:hover { background: rgba(255,255,255,.26); }

/* —— 教学设计全文（黄底文档） —— */
body.is-teacher .pd-design-doc { background: #fffbea; border-color: #f3e5bd; }
body.is-teacher .pd-doc-head { text-align: center; padding: 6px 0 14px; border-bottom: 1px dashed #eadfb9; margin-bottom: 14px; }
body.is-teacher .pd-doc-title { font-size: 20px; font-weight: 800; color: #2d3748; margin: 0 0 12px; }
body.is-teacher .pd-doc-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; justify-content: center; text-align: left; }
body.is-teacher .pd-meta-item { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; }
body.is-teacher .pd-meta-item i { font-style: normal; color: #9a7b2d; background: #f5ecd0; border-radius: 6px; padding: 2px 8px; font-weight: 700; white-space: nowrap; }
body.is-teacher .pd-meta-item b { color: #5a4a1a; font-weight: 600; }
body.is-teacher .pd-seg-card { background: #fffdf6; border: 1px solid #f0e6c8; border-radius: 14px; margin-bottom: 12px; overflow: hidden; }
body.is-teacher .pd-seg-head { display: flex; align-items: center; gap: 10px; padding: 11px 16px; cursor: pointer; }
body.is-teacher .pd-seg-head:hover { background: #fff7e0; }
body.is-teacher .pd-seg-badge { background: #f59e0b; color: #fff; font-size: 11.5px; font-weight: 700; padding: 3px 12px; border-radius: 999px; white-space: nowrap; }
body.is-teacher .pd-seg-name { font-size: 13.5px; font-weight: 700; color: #2d3748; flex: 1; }
body.is-teacher .pd-seg-dur { font-size: 12px; color: #1d4ed8; background: #dbeafe; padding: 2px 10px; border-radius: 999px; white-space: nowrap; }
body.is-teacher .pd-seg-toggle { font-size: 12px; color: #f59e0b; font-weight: 600; white-space: nowrap; }
body.is-teacher .pd-seg-body { padding: 4px 18px 16px; border-top: 1px dashed #eadfb9; }
body.is-teacher .pd-seg-line { font-size: 13px; color: #334155; line-height: 1.9; margin: 8px 0 4px; }
body.is-teacher .pd-seg-line b { color: #2d3748; }
body.is-teacher .pd-seg-hint { color: #b08d3c; font-size: 12px; font-weight: 400; }
body.is-teacher .pd-ta-item { margin: 6px 0 6px 8px; }
body.is-teacher .pd-ta-name { font-size: 13px; color: #2d3748; font-weight: 600; margin: 0 0 2px; line-height: 1.9; }
body.is-teacher .pd-ta-say { font-size: 13px; color: #7c5a12; margin: 2px 0; line-height: 1.8; }
body.is-teacher .pd-ta-follow { font-size: 12.5px; color: #5a6b7f; margin: 2px 0; }
body.is-teacher .pd-chip { display: inline-flex; align-items: center; font-size: 11px; font-weight: 700; color: #1d4ed8; background: #dbeafe; border-radius: 6px; padding: 1px 8px; margin: 0 2px; font-family: monospace; vertical-align: 1px; }
body.is-teacher .pd-chip-act { color: #047857; background: #d1fae5; }
body.is-teacher .pd-stu-item { display: flex; gap: 8px; align-items: flex-start; margin: 5px 0 5px 8px; }
body.is-teacher .pd-stu-tag { flex-shrink: 0; font-size: 11px; font-weight: 700; padding: 2px 10px; border-radius: 999px; background: #dbeafe; color: #1d4ed8; margin-top: 2px; white-space: nowrap; }
body.is-teacher .pd-stu-tag-say { background: #ede9fe; color: #7c3aed; }
body.is-teacher .pd-stu-text { font-size: 13px; color: #334155; line-height: 1.7; }
body.is-teacher .pd-board-quote { display: inline-block; background: #dbeafe; color: #1d4ed8; border-radius: 8px; padding: 2px 10px; font-size: 12.5px; font-weight: 600; }

/* —— 教学设计 · 版本切换（送审版/内容版） —— */
body.is-teacher .pd-ver-switch { display: inline-flex; background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 999px; padding: 3px; margin-right: 10px; }
body.is-teacher .pd-ver-switch button { border: none; background: transparent; color: #5a6b7f; font-size: 12.5px; font-weight: 600; font-family: inherit; padding: 6px 16px; border-radius: 999px; cursor: pointer; transition: .15s; }
body.is-teacher .pd-ver-switch button.on { background: #2563eb; color: #fff; box-shadow: 0 2px 8px rgba(37,99,235,.28); }
body.is-teacher .pd-ver-switch button:not(.on):hover { color: #2d3748; }

/* —— 教学设计 · 送审版（纸张文档）补足元素 —— */
body.is-teacher .pd-doc-sub { font-size: 12.5px; color: #5a6b7f; margin: 0 0 4px; }
body.is-teacher .pd-doc-story { font-size: 12px; color: #b08d3c; margin: 0 0 10px; }
body.is-teacher .pd-doc-h2 { font-size: 15px; font-weight: 800; color: #2d3748; border-bottom: 1.5px solid #e5d9ae; padding-bottom: 5px; margin: 22px 0 10px; }
body.is-teacher .pd-doc-p { font-size: 13px; color: #334155; line-height: 1.9; margin: 0 0 6px; text-indent: 0; }
body.is-teacher .pd-doc-p b { color: #2d3748; }
body.is-teacher .pd-doc-say { color: #7c5a12; padding-left: 14px; border-left: 2px solid #d9c98a; margin-left: 10px; white-space: pre-line; }
body.is-teacher .pd-doc-proc { width: 100%; border-collapse: collapse; margin: 8px 0 14px; }
body.is-teacher .pd-doc-proc th { border: 1px solid #d9c98a; background: #fdf6dd; font-size: 12.5px; font-weight: 700; color: #2d3748; padding: 7px 10px; text-align: center; }
body.is-teacher .pd-doc-proc td { border: 1px solid #e5d9ae; padding: 10px 12px; vertical-align: top; }
body.is-teacher .pd-doc-board { border: 2px solid #2d3748; border-radius: 10px; padding: 12px 16px; margin: 8px 0 14px; background: #fffdf6; }
body.is-teacher .pd-doc-board-title { text-align: center; font-size: 15px; font-weight: 800; color: #2d3748; margin: 0 0 8px; }
body.is-teacher .pd-doc-ann { color: #b91c1c; background: #fef2f2; border-radius: 8px; padding: 6px 12px; margin: 0 0 6px; }
body.is-teacher .pd-doc-ann b { color: #b91c1c; }

/* —— 教学设计 · 内容版（章节导航 + 十章节） —— */
body.is-teacher .pd-dv { background: #ffffff; }
body.is-teacher .pd-dv-chips { display: flex; flex-wrap: wrap; gap: 6px 14px; padding: 10px 14px; background: #f8fafc; border: 1px solid #eef2f7; border-radius: 14px; margin-bottom: 16px; }
body.is-teacher .pd-dv-chips .pd-meta-item i { color: #2563eb; background: #eff6ff; }
body.is-teacher .pd-dv-chips .pd-meta-item b { color: #2d3748; }
body.is-teacher .pd-dv-layout { display: flex; gap: 16px; align-items: flex-start; }
body.is-teacher .pd-dv-nav { flex-shrink: 0; width: 176px; position: sticky; top: 12px; background: #f8fafc; border: 1px solid #eef2f7; border-radius: 14px; padding: 10px 8px; max-height: calc(calc(var(--vhpx, 1vh) * 100) - 220px); overflow-y: auto; }
body.is-teacher .pd-dv-nav-head { font-size: 12.5px; font-weight: 800; color: #2d3748; padding: 2px 10px 8px; border-bottom: 1px solid #eef2f7; margin-bottom: 6px; }
body.is-teacher .pd-dv-nav-item { display: block; font-size: 12px; font-weight: 600; color: #5a6b7f; text-decoration: none; padding: 6px 10px; border-radius: 8px; line-height: 1.5; transition: .12s; }
body.is-teacher .pd-dv-nav-item:hover { color: #2563eb; background: #eff6ff; }
body.is-teacher .pd-dv-nav-foot { font-size: 11px; color: #94a3b8; padding: 8px 10px 2px; border-top: 1px dashed #e2e8f0; margin-top: 6px; }
body.is-teacher .pd-dv-main { flex: 1; min-width: 0; }
body.is-teacher .pd-sec { background: #ffffff; border: 1px solid #eef2f7; border-radius: 16px; padding: 16px 20px 18px; margin-bottom: 18px; }
body.is-teacher .pd-sec-title { font-size: 16px; font-weight: 800; color: #2563eb; border-left: 4px solid #2563eb; background: #eff6ff; border-radius: 0 10px 10px 0; padding: 7px 14px; margin: 0 0 12px; line-height: 1.5; }
body.is-teacher .pd-sec-tail { background: #f8fafc; }
body.is-teacher .pd-p { font-size: 13px; color: #334155; line-height: 1.9; margin: 0 0 8px; }
body.is-teacher .pd-h4 { font-size: 13.5px; font-weight: 700; color: #2d3748; margin: 14px 0 8px; }
body.is-teacher .pd-ul { margin: 4px 0 8px; padding-left: 20px; }
body.is-teacher .pd-ul li { font-size: 13px; color: #334155; line-height: 1.85; margin-bottom: 3px; }
body.is-teacher .pd-ol { margin: 4px 0 8px; padding-left: 22px; }
body.is-teacher .pd-ol li { font-size: 13px; color: #334155; line-height: 1.85; margin-bottom: 4px; }
body.is-teacher .pd-note { font-size: 12px; color: #1d4ed8; background: #fef7e6; border-radius: 8px; padding: 7px 12px; margin: 8px 0; }
body.is-teacher .pd-table { width: 100%; border-collapse: collapse; margin: 8px 0 12px; }
body.is-teacher .pd-table th { background: #f7f9fc; border: 1px solid #e2e8f0; font-size: 12px; font-weight: 600; color: #5a6b7f; padding: 7px 10px; text-align: left; }
body.is-teacher .pd-table td { border: 1px solid #e8edf3; font-size: 12.5px; color: #2d3748; padding: 7px 10px; vertical-align: top; line-height: 1.7; text-align: left; }
body.is-teacher .pd-table tbody tr:nth-child(even) td { background: #fafcfe; }
body.is-teacher .pd-td-code { font-family: monospace; font-weight: 700; color: #1d4ed8; white-space: nowrap; }
body.is-teacher .pd-td-act { color: #047857; }
body.is-teacher .pd-td-star { color: #f59e0b; font-size: 13px; letter-spacing: 2px; white-space: nowrap; }
body.is-teacher .pd-td-quote { color: #1d4ed8; font-weight: 700; }
body.is-teacher .pd-chip-code { color: #1d4ed8; background: #dbeafe; }
body.is-teacher .pd-chip-media { color: #1d4ed8; background: #dbeafe; }
body.is-teacher .pd-kv { display: flex; gap: 10px; align-items: flex-start; padding: 8px 12px; border-radius: 10px; background: #f8fafc; border: 1px solid #eef2f7; margin-bottom: 8px; }
body.is-teacher .pd-kv-k { flex-shrink: 0; font-size: 12px; font-weight: 700; color: #2563eb; background: #eff6ff; border-radius: 8px; padding: 3px 10px; margin-top: 1px; white-space: nowrap; }
body.is-teacher .pd-kv-v { font-size: 13px; color: #334155; line-height: 1.8; }
/* 内容版 · 资源微缩预览 */
body.is-teacher .pd-thumb-strip { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 12px; }
body.is-teacher .pd-thumb { width: 132px; margin: 0; cursor: pointer; border: 1px solid #e2e8f0; border-radius: 10px; overflow: hidden; background: #f8fafc; transition: .15s; }
body.is-teacher .pd-thumb:hover { border-color: #2563eb; box-shadow: 0 4px 14px rgba(37,99,235,.16); transform: translateY(-2px); }
body.is-teacher .pd-thumb img { width: 100%; height: 76px; object-fit: contain; display: block; background: #fff; padding: 4px; box-sizing: border-box; }
body.is-teacher .pd-thumb figcaption { padding: 5px 8px; }
/* 内容版 · 重难点双栏 */
body.is-teacher .pd-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
body.is-teacher .pd-focus-box { border-radius: 12px; padding: 12px 14px; border: 1px solid; }
body.is-teacher .pd-focus-zhong { background: #eff6ff; border-color: #bfdbfe; }
body.is-teacher .pd-focus-nan { background: #f5f9ff; border-color: #cfe0fb; }
body.is-teacher .pd-focus-head { font-size: 13px; font-weight: 800; margin-bottom: 6px; }
body.is-teacher .pd-focus-zhong .pd-focus-head { color: #1d4ed8; }
body.is-teacher .pd-focus-nan .pd-focus-head { color: #1d4ed8; }
body.is-teacher .pd-focus-box .pd-ul { margin: 0; }
/* 内容版 · 详案环节卡（蓝徽章浅色卡） */
body.is-teacher .pd-dv-seg { background: #fafcff; border: 1px solid #e3ecfa; border-radius: 14px; margin-bottom: 12px; overflow: hidden; }
body.is-teacher .pd-dv-seg-head { display: flex; align-items: center; gap: 10px; padding: 11px 16px; cursor: pointer; }
body.is-teacher .pd-dv-seg-head:hover { background: #f1f6ff; }
body.is-teacher .pd-dv-seg-badge { background: #3b82f6; color: #fff; font-size: 11.5px; font-weight: 700; padding: 3px 12px; border-radius: 999px; white-space: nowrap; }
body.is-teacher .pd-dv-seg-name { font-size: 13.5px; font-weight: 700; color: #1e3a8a; flex: 1; }
body.is-teacher .pd-dv-seg-dur { font-size: 12px; font-weight: 600; color: #1d4ed8; background: #dbeafe; padding: 2px 10px; border-radius: 999px; white-space: nowrap; }
body.is-teacher .pd-dv-seg-toggle { font-size: 12px; font-weight: 600; color: #3b82f6; white-space: nowrap; }
body.is-teacher .pd-dv-seg-body { padding: 4px 18px 16px; border-top: 1px dashed #cfe0fb; }
body.is-teacher .pd-dv-line { font-size: 13px; color: #334155; line-height: 1.9; margin: 8px 0 4px; }
body.is-teacher .pd-dv-line b { color: #2d3748; }
body.is-teacher .pd-dv-hint { color: #64748b; font-size: 12px; font-weight: 400; }
body.is-teacher .pd-dv-ta { margin: 6px 0 6px 8px; }
body.is-teacher .pd-dv-ta-name { font-size: 13px; font-weight: 600; color: #2d3748; margin: 0 0 2px; line-height: 1.9; }
body.is-teacher .pd-dv-ta-say { font-size: 13px; color: #475569; margin: 2px 0; line-height: 1.8; padding-left: 10px; border-left: 2px solid #bfdbfe; white-space: pre-line; }
body.is-teacher .pd-dv-stu { display: flex; gap: 8px; align-items: flex-start; margin: 5px 0 5px 8px; }
body.is-teacher .pd-dv-stu-tag { flex-shrink: 0; font-size: 11px; font-weight: 700; padding: 2px 10px; border-radius: 999px; margin-top: 2px; white-space: nowrap; }
body.is-teacher .pd-dv-stu-tag.is-preset { background: #d1fae5; color: #047857; }
body.is-teacher .pd-dv-stu-tag.is-say { background: #ede9fe; color: #7c3aed; }
body.is-teacher .pd-dv-stu-text { font-size: 13px; color: #334155; line-height: 1.7; }
body.is-teacher .pd-dv-quote { display: inline-block; background: #dbeafe; color: #1d4ed8; border-radius: 8px; padding: 2px 10px; font-size: 12.5px; font-weight: 600; }
/* 内容版 · 板书结构表 + 黑板预览 */
body.is-teacher .pd-board-table .pd-bt-title { background: #eff6ff; color: #1d4ed8; font-weight: 800; text-align: center; font-size: 13px; }
body.is-teacher .pd-bt-sub { font-size: 11px; color: #f59e0b; font-weight: 600; margin-top: 3px; }
body.is-teacher .pd-bt-empty { background: #fafcfe; }
body.is-teacher .pd-blackboard { display: flex; gap: 14px; background: #1e293b; border-radius: 14px; padding: 16px 18px; margin: 8px 0 12px; box-shadow: inset 0 0 0 4px #334155, 0 4px 14px rgba(30,41,59,.25); }
body.is-teacher .pd-bb-main { flex: 2; min-width: 0; }
body.is-teacher .pd-bb-title { text-align: center; font-size: 17px; font-weight: 800; color: #fefce8; letter-spacing: 2px; border-bottom: 1px dashed #64748b; padding-bottom: 8px; margin-bottom: 10px; }
body.is-teacher .pd-bb-cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
body.is-teacher .pd-bb-col { border: 1px dashed #64748b; border-radius: 8px; padding: 6px 8px; }
body.is-teacher .pd-bb-colhead { font-size: 11px; font-weight: 700; color: #fbbf24; text-align: center; border-bottom: 1px solid #64748b; padding-bottom: 4px; margin-bottom: 5px; }
body.is-teacher .pd-bb-item { font-size: 11.5px; color: #f1f5f9; line-height: 1.7; padding: 1px 0; }
body.is-teacher .pd-bb-item::before { content: '· '; color: #fbbf24; }
body.is-teacher .pd-bb-side { flex: 1; border-left: 1px dashed #64748b; padding-left: 12px; }
body.is-teacher .pd-bb-sidehead { font-size: 11px; font-weight: 700; color: #fbbf24; text-align: center; margin-bottom: 8px; }
body.is-teacher .pd-bb-quote { font-size: 11.5px; color: #f1f5f9; line-height: 1.6; padding: 4px 0; border-bottom: 1px dotted #475569; }
/* 内容版 · 反思 / 批注 / 修改记录 */
body.is-teacher .pd-reflect-sample { background: #f8fafc; border: 1px dashed #cbd5e1; border-radius: 10px; padding: 10px 14px; }
body.is-teacher .pd-second-edit { font-size: 12.5px; color: #7c3aed; background: #faf5ff; border: 1.5px dashed #c4b5fd; border-radius: 10px; padding: 10px 14px; margin-top: 12px; line-height: 1.8; }
body.is-teacher .pd-annot { display: flex; gap: 8px; align-items: flex-start; background: #fef2f2; border: 1px solid #fecaca; border-radius: 10px; padding: 8px 12px; margin-bottom: 8px; }
body.is-teacher .pd-annot-n { flex-shrink: 0; font-size: 11px; font-weight: 800; color: #fff; background: #ef4444; border-radius: 999px; padding: 2px 10px; margin-top: 1px; white-space: nowrap; }
body.is-teacher .pd-annot-where { flex-shrink: 0; font-size: 12px; font-weight: 700; color: #b91c1c; margin-top: 2px; white-space: nowrap; }
body.is-teacher .pd-annot-text { font-size: 12.5px; color: #7f1d1d; line-height: 1.7; }
body.is-teacher .pd-chlog { display: flex; gap: 10px; align-items: flex-start; padding: 6px 4px; border-bottom: 1px dashed #e2e8f0; }
body.is-teacher .pd-chlog:last-child { border-bottom: none; }
body.is-teacher .pd-chlog-date { flex-shrink: 0; font-family: monospace; font-size: 12px; font-weight: 700; color: #64748b; background: #eef2f7; border-radius: 6px; padding: 2px 8px; margin-top: 1px; }
body.is-teacher .pd-chlog-text { font-size: 12.5px; color: #334155; line-height: 1.7; }

/* —— 逐字稿（导轨 + 分步块） —— */
body.is-teacher .pd-rail-use { font-size: 12.5px; font-weight: 700; color: #2563eb; background: #eff6ff; border-radius: 10px; margin: 8px 10px; padding: 8px 12px; cursor: pointer; }
body.is-teacher .pd-rail-seg { font-size: 12px; font-weight: 700; color: #5a6b7f; padding: 10px 16px 4px; line-height: 1.5; }
body.is-teacher .pd-rail-item { flex-direction: row; align-items: center; gap: 8px; padding: 7px 16px; }
body.is-teacher .pd-rail-item .pd-rail-title { flex: 1; }
body.is-teacher .pd-script-usebox { font-size: 13px; font-weight: 700; color: #2563eb; background: #eff6ff; border: 1px dashed #bfdbfe; border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; }
body.is-teacher .pd-sb-head { display: flex; align-items: center; gap: 8px; background: #f7f9fc; border: 1px solid #eef2f7; border-radius: 10px; padding: 8px 12px; margin: 14px 0 8px; }
body.is-teacher .pd-sb-code { font-family: monospace; font-size: 11.5px; font-weight: 700; color: #64748b; background: #eef2f7; border-radius: 6px; padding: 2px 8px; white-space: nowrap; }
body.is-teacher .pd-sb-kind { font-size: 11px; font-weight: 700; color: #7c3aed; background: #ede9fe; border-radius: 999px; padding: 2px 10px; white-space: nowrap; }
body.is-teacher .pd-sb-title { font-size: 13px; font-weight: 700; color: #2d3748; flex: 1; }
body.is-teacher .pd-sb-min { font-size: 11.5px; color: #1d4ed8; background: #dbeafe; padding: 2px 10px; border-radius: 999px; white-space: nowrap; }
body.is-teacher .pd-sb-quote { border-left: 3px solid #3b82f6; background: #f5f9ff; border-radius: 0 10px 10px 0; padding: 10px 14px; margin: 8px 0; }
body.is-teacher .pd-sb-tag { display: inline-block; font-size: 11px; font-weight: 700; color: #1d4ed8; background: #dbeafe; border-radius: 999px; padding: 2px 10px; margin-bottom: 6px; }
body.is-teacher .pd-sb-quote p { font-size: 13px; color: #334155; line-height: 1.8; margin: 0; white-space: pre-line; }
body.is-teacher .pd-sb-actbox { border: 1px solid #bbe7d0; background: #f3fbf7; border-radius: 10px; padding: 10px 14px; margin: 8px 0; }
body.is-teacher .pd-sb-act-head { display: flex; justify-content: space-between; font-size: 12px; font-weight: 700; color: #047857; margin-bottom: 4px; }
body.is-teacher .pd-sb-actbox p { font-size: 12.5px; color: #334155; line-height: 1.7; margin: 0; white-space: pre-line; }
body.is-teacher .pd-sb-trans { display: flex; align-items: center; gap: 8px; background: #eff6ff; border: 1px dashed #bfdbfe; border-radius: 10px; padding: 8px 12px; margin: 8px 0; }
body.is-teacher .pd-sb-trans-tag { font-size: 11px; font-weight: 700; color: #1d4ed8; background: #dbeafe; border-radius: 999px; padding: 2px 10px; white-space: nowrap; }
body.is-teacher .pd-sb-trans-text { font-size: 12.5px; color: #7c5a12; }
body.is-teacher .pd-toolbar-mid { color: #94a3b8; margin-left: 18px; }
body.is-teacher .pd-toolbar-rule { font-size: 12px; color: #94a3b8; }
body.is-teacher .pd-toolbar-rule b { color: #2563eb; font-size: 15px; font-weight: 800; margin: 0 2px; }

/* —— 课件页头 —— */
body.is-teacher .pd-ware-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
body.is-teacher .pd-ware-top-info { font-size: 12.5px; color: #5a6b7f; }

/* 响应式 */
@media (max-width: 1100px) {
  body.is-teacher .pd-design-grid { grid-template-columns: 1fr 1fr; }
  body.is-teacher .pd-script { grid-template-columns: 220px 1fr; }
}
@media (max-width: 768px) {
  body.is-teacher .pd-design-grid { grid-template-columns: 1fr; }
  body.is-teacher .pd-script { grid-template-columns: 1fr; }
  body.is-teacher .pd-script-rail { max-height: none; border-right: none; border-bottom: 1px solid #e2e8f0; }
}

/* ===========================================================
 * 机房座次（.seat-admin）
 * =========================================================== */
body.is-teacher .seat-admin { display: flex; flex-direction: column; gap: 16px; }
body.is-teacher .seat-toolbar { background: #fff; border-radius: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 20px; padding: 12px 16px; box-shadow: 0 1px 4px rgba(0,0,0,.05); }
body.is-teacher .st-item { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #475569; }
body.is-teacher .st-item b { min-width: 22px; text-align: center; font-size: 16px; }
body.is-teacher .st-btn { width: 26px; height: 26px; border: 1px solid #cbd5e1; border-radius: 8px; font-size: 15px; font-weight: 700; color: #475569; background: #fff; cursor: pointer; }
body.is-teacher .st-hint { color: #94a3b8; margin-left: auto; font-size: 12px; }
body.is-teacher .seat-board { background: #fff; border-radius: 16px; padding: 18px; overflow-x: auto; box-shadow: 0 2px 10px rgba(30,41,59,.06); }
body.is-teacher .seat-podium { text-align: center; color: #fff; letter-spacing: 6px; background: linear-gradient(135deg, #1e293b, #334155); border-radius: 10px; width: 60%; max-width: 460px; margin: 0 auto 18px; padding: 14px 20px; font-size: 24px; font-weight: 700; }
body.is-teacher .seat-admin .seat-grid { display: grid; gap: 10px; min-width: fit-content; margin: 0; }
body.is-teacher .seat-admin .seat { cursor: pointer; border: 2px dashed #cbd5e1; border-radius: 12px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; min-height: 144px; padding: 12px 6px; position: relative; background: #fff; aspect-ratio: auto; }
body.is-teacher .seat-admin .seat.filled { cursor: default; background: #f8faff; border: 2px solid #93c5fd; }
body.is-teacher .seat-plus { color: #cbd5e1; font-size: 22px; font-weight: 700; }
body.is-teacher .seat-hint { color: #94a3b8; font-size: 13px; }
body.is-teacher .seat-avatar { width: 58px; height: 58px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 26px; font-weight: 800; letter-spacing: 1px; box-shadow: 0 2px 6px rgba(0,0,0,.15); }
body.is-teacher .seat-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 26px; font-weight: 700; color: #0f172a; letter-spacing: 1px; font-family: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", sans-serif; text-shadow: 0 1px 1px rgba(15,23,42,.10); }
body.is-teacher .seat-machine { color: #1e293b; font-size: 13px; font-weight: 900; font-family: "SimHei", "Microsoft YaHei", "PingFang SC", sans-serif; letter-spacing: 1px; }
body.is-teacher .seat-admin .seat.hit { border: 2.5px solid #2563eb; background: #eff6ff; box-shadow: 0 0 0 4px rgba(37,99,235,.18); animation: seatHitPulse 1.2s ease-in-out infinite; }
body.is-teacher .seat-admin .seat.hit .seat-name { color: #2563eb; }
body.is-teacher .seat-admin .seat-pos { position: absolute; top: 4px; left: 6px; font-size: 12px; color: #94a3b8; font-weight: 600; pointer-events: none; line-height: 1; }
@keyframes seatHitPulse { 0%, 100% { box-shadow: 0 0 0 3px rgba(255,107,53,.14); } 50% { box-shadow: 0 0 0 7px rgba(255,107,53,.28); } }
body.is-teacher .seat-roster { background: #fff; border-radius: 16px; padding: 16px 18px; box-shadow: 0 2px 10px rgba(30,41,59,.06); }
body.is-teacher .seat-roster-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
body.is-teacher .seat-roster h3 { font-size: 15px; color: #2d3748; margin: 0 0 12px; }
body.is-teacher .seat-roster-head h3 { margin: 0; }
body.is-teacher .seat-roster-head .seat-search { flex: 0 1 220px; min-width: 160px; }
body.is-teacher .sr-grid { display: flex; flex-wrap: wrap; gap: 8px; }
body.is-teacher .sr-stu { cursor: pointer; background: #fff; border: 1.5px solid #e2e8f0; border-radius: 999px; display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; font-size: 13px; }
body.is-teacher .sr-stu:hover { border-color: #3b82f6; }
body.is-teacher .sr-avatar { width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 12px; font-weight: 800; }
body.is-teacher .sr-name { color: #334155; font-weight: 700; }
body.is-teacher .sr-no { color: #94a3b8; font-size: 11px; }

/* 「💾 保存布局」按钮（机房座次·标准版式） */
body.is-teacher .seat-save-btn { border-radius: 9999px; padding: 8px 18px; font-size: 14px; font-weight: 600; min-height: 36px; transition: background .15s, box-shadow .15s, opacity .15s; }
body.is-teacher .seat-save-btn:hover:not(:disabled) { box-shadow: 0 4px 16px rgba(37,99,235,.35); transform: translateY(-1px); }
/* 禁用态：无改动时灰显，标准版式 disabled 视觉 */
body.is-teacher .seat-save-btn:disabled { background: #e2e8f0; color: #94a3b8; box-shadow: none; cursor: not-allowed; opacity: .85; transform: none; }

/* 座次布局锁定状态徽章 */
body.is-teacher .seat-lock-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; padding: 6px 12px; border-radius: 9999px; border: 1.5px solid; white-space: nowrap; }
body.is-teacher .seat-lock-badge.locked { color: #b91c1c; background: #fef2f2; border-color: #fecaca; }
body.is-teacher .seat-lock-badge.editing { color: #1d4ed8; background: #eff6ff; border-color: #bfdbfe; }
/* 默认（未锁定且未编辑）态使用次要灰 */
body.is-teacher .seat-lock-badge:not(.locked):not(.editing) { color: #475569; background: #f1f5f9; border-color: #e2e8f0; }

@media (max-width: 1100px) {
  body.is-teacher .ga-grid { grid-template-columns: repeat(4, 1fr); }
  body.is-teacher .week-rail { width: 240px; }
  body.is-teacher .ov-cards { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
}
@media (max-width: 700px) {
  body.is-teacher .ga-grid { grid-template-columns: repeat(2, 1fr); }
  body.is-teacher .prep-body { flex-direction: column; }
  body.is-teacher .week-rail { width: 100%; border-right: none; border-bottom: 1px solid #e2e8f0; }
}

/* ===========================================================
 * 打字练习专区 · 键盘小达人训练营（标准版式）
 * 作用域：.typ-root（不影响其他页面）
 * =========================================================== */
.typ-root {
  min-height: calc(var(--vhpx, 1vh) * 100); display: flex; flex-direction: column;
  background: var(--bg-page); position: relative;
}
.typ-root:fullscreen { overflow-y: auto; }

/* —— 顶栏 —— */
.typ-header {
  background: #fff; box-shadow: var(--shadow-sm); z-index: 30;
  position: sticky; top: 0;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px 20px;
  padding: 14px 28px;
}
.typ-header-left { display: flex; align-items: center; gap: 18px; }
.typ-back {
  display: inline-flex; align-items: center; gap: 8px;
  border: none; background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff;
  font-size: 19px; font-weight: 700; font-family: inherit;
  padding: 10px 22px 10px 16px; border-radius: 999px; cursor: pointer; transition: all .2s ease;
  box-shadow: 0 4px 14px rgba(59, 130, 246, .35);
}
.typ-back svg { width: 18px; height: 18px; flex-shrink: 0; }
.typ-back:hover { background: linear-gradient(135deg, #2563eb, #1d4ed8); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(59, 130, 246, .45); color: #fff; }
.typ-crumb { font-size: 19px; color: #666; font-weight: 600; }
.typ-page-title { font-size: 28px; font-weight: 800; color: #000; line-height: 1.3; }
.typ-header-right { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.typ-runs { font-size: 21px; font-weight: 700; color: #333; background: #f1f5f9; border-radius: 999px; padding: 8px 18px; }

/* HUD（训练中） */
.hud-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: #fff; border: 2px solid #e2e8f0; border-radius: 999px;
  padding: 9px 18px; font-size: 26px; font-weight: 800; color: #333;
  font-variant-numeric: tabular-nums;
}
.hud-badge.timer svg { color: #64748b; width: 22px; height: 22px; }
.hud-badge.wpm { color: #d97706; border-color: #fde68a; background: #fffbeb; }
.hud-badge.wpm svg { color: #f59e0b; width: 22px; height: 22px; }
.hud-badge.acc { color: #16a34a; border-color: #bbf7d0; background: #f0fdf4; }
.hud-badge.acc svg { color: #22c55e; width: 22px; height: 22px; }
.hud-badge.acc.bad { color: #dc2626; border-color: #fecaca; background: #fef2f2; }
.hud-badge.acc.bad svg { color: #ef4444; width: 22px; height: 22px; }
.hud-progress { display: flex; align-items: baseline; gap: 2px; font-weight: 800; font-size: 27px; color: #334155; font-variant-numeric: tabular-nums; }
.hud-progress .hp-total { font-size: 21px; color: #666; font-weight: 700; }
.btn-act-icon {
  width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center;
  border: 2px solid #e2e8f0; background: #fff; color: #94a3b8;
  border-radius: 12px; cursor: pointer; transition: .15s;
}
.btn-act-icon:hover { color: #ea580c; border-color: #fdba74; }
.btn-act-icon.on { color: #fff; background: linear-gradient(135deg, #fb923c, #f97316); border-color: #ea580c; }
.btn-act-icon svg { width: 20px; height: 20px; }

/* —— 主内容容器 —— */
.typ-main { width: 100%; max-width: 980px; margin: 0 auto; padding: 20px 24px 48px; display: flex; flex-direction: column; gap: 22px; }
.typ-main-train { max-width: 100%; width: 100%; padding: 18px 28px 32px; gap: 24px; }

/* —— 每日激励横幅 —— */
.zone-banner {
  display: flex; align-items: center; gap: 16px;
  background: linear-gradient(135deg, #fff3e8, #ffe7d1);
  border: 1px solid #ffd9b8; border-radius: 18px; padding: 18px 24px;
}
.zone-mascot {
  width: 58px; height: 58px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 30px; border-radius: 50%;
  background: linear-gradient(135deg, #fb923c, #f97316);
  box-shadow: 0 6px 16px rgba(249, 115, 22, .35);
  animation: typ-float 3s ease-in-out infinite;
}
.zone-title { font-size: 24px; font-weight: 800; color: #4a2510; line-height: 1.5; }
.zone-sub { font-size: 19px; color: #b0764a; margin-top: 5px; line-height: 1.5; }

/* —— 段位卡 —— */
.rank-panel {
  display: flex; align-items: center; flex-wrap: wrap; gap: 12px 18px;
  background: #fff; border: 1.5px solid #f3d9c8;
  border-radius: 18px; padding: 16px 22px; box-shadow: var(--shadow-sm);
}
.rank-left { display: flex; align-items: center; gap: 12px; }
.rank-big-icon {
  width: 50px; height: 50px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 26px; border-radius: 14px;
  background: var(--rk-bg, #FFEDD5);
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px rgba(154, 52, 18, .18), 0 4px 12px rgba(0,0,0,.08);
}
.rank-name { font-size: 24px; font-weight: 800; color: var(--rk-c, #9A3412); line-height: 1.4; }
.rank-sub { font-size: 17px; color: #666; font-weight: 600; margin-top: 3px; line-height: 1.4; }
.rank-path { display: flex; align-items: center; gap: 4px; }
.rk-node {
  font-size: 22px; line-height: 1; display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 50%;
  filter: grayscale(1); opacity: .4; transition: .2s;
}
.rk-node.past { filter: none; opacity: .75; }
.rk-node.cur {
  filter: none; opacity: 1; font-size: 27px;
  width: 42px; height: 42px; background: #fff;
  border: 2.5px solid var(--rk-c, #9A3412);
  box-shadow: 0 0 0 4px var(--rk-bg, #FFEDD5), 0 4px 12px rgba(0,0,0,.1);
}
.rank-req { flex: 1; min-width: 180px; font-size: 19px; color: #333; font-weight: 600; line-height: 1.5; }
.btn-rank-match {
  border: none; cursor: pointer; font-family: inherit;
  background: linear-gradient(135deg, #a78bfa, #7c3aed);
  color: #fff; font-size: 20px; font-weight: 800;
  padding: 10px 22px; border-radius: 999px;
  box-shadow: 0 4px 16px rgba(124, 58, 237, .35); transition: .15s;
  white-space: nowrap;
}
.btn-rank-match:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(124, 58, 237, .45); }

/* —— 易错键诊所 —— */
.weak-panel {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  background: linear-gradient(135deg, #fff1eb, #ffe4d6);
  border: 1px solid #ffd0b3; border-radius: 16px; padding: 15px 20px;
}
.weak-icon { font-size: 30px; }
.weak-title { font-size: 20px; font-weight: 800; color: #c2410c; line-height: 1.4; }
.weak-sub { font-size: 18px; color: #a1633d; margin-top: 4px; line-height: 1.5; }
.weak-sub b { color: #dc2626; }
.btn-weak {
  border: none; cursor: pointer; font-family: inherit;
  background: linear-gradient(135deg, #fb923c, #ef4444);
  color: #fff; font-size: 19px; font-weight: 800;
  padding: 9px 20px; border-radius: 999px;
  box-shadow: 0 4px 14px rgba(239, 68, 68, .3); transition: .15s; white-space: nowrap;
}
.btn-weak:hover { transform: translateY(-1px); }

/* —— 训练组网格（3 列，卡片高度独立） —— */
.group-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: start; }
.group-card { background: #fff; border-radius: 18px; overflow: hidden; box-shadow: var(--shadow-sm); }

/* ===========================================================
 * 登录页 v2 · 深空科技风（2026-09-02）
 * 仅作用于学生端登录路由（.login-page），不影响其他页面浅色主题
 * 深蓝渐变 + 透视网格 + 星点闪烁 + 玻璃拟态卡片 + 霓虹青点缀
 * =========================================================== */

/* —— 1. 深空背景（不透明，覆盖全局白云/浅色底） —— */
.login-page {
  background:
    radial-gradient(1100px 520px at 18% -8%, rgba(0, 212, 255, 0.28), transparent 60%),
    radial-gradient(950px 620px at 88% 108%, rgba(99, 102, 241, 0.30), transparent 62%),
    linear-gradient(178deg, #1A2550 0%, #20306B 52%, #28408A 100%);
  background-attachment: fixed;
  color: #E8EEFF;
  /* 整页锁定一屏：内容再高也不出现页面滚动条（内部弹性收缩适配） */
  height: calc(var(--vhpx, 1vh) * 100); overflow: hidden;
}
/* 透视网格（中心亮、四周淡出） */
.login-page::before {
  content: ''; position: fixed; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; z-index: 0;
  background:
    linear-gradient(rgba(0, 212, 255, 0.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 212, 255, 0.10) 1px, transparent 1px);
  background-size: 46px 46px;
  -webkit-mask-image: radial-gradient(ellipse 92% 72% at 50% 42%, #000 22%, transparent 78%);
  mask-image: radial-gradient(ellipse 92% 72% at 50% 42%, #000 22%, transparent 78%);
}
/* 稀疏星点闪烁 */
.login-page::after {
  content: ''; position: fixed; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; z-index: 0;
  background-image:
    radial-gradient(2px 2px at 12% 22%, rgba(255,255,255,0.95), transparent),
    radial-gradient(1.5px 1.5px at 27% 64%, rgba(255,255,255,0.7), transparent),
    radial-gradient(1.8px 1.8px at 41% 15%, rgba(180,235,255,0.85), transparent),
    radial-gradient(1.4px 1.4px at 55% 78%, rgba(255,255,255,0.6), transparent),
    radial-gradient(2.1px 2.1px at 68% 30%, rgba(210,240,255,0.9), transparent),
    radial-gradient(1.5px 1.5px at 79% 58%, rgba(255,255,255,0.65), transparent),
    radial-gradient(1.9px 1.9px at 88% 18%, rgba(180,235,255,0.8), transparent),
    radial-gradient(1.4px 1.4px at 8% 82%, rgba(255,255,255,0.55), transparent),
    radial-gradient(1.6px 1.6px at 93% 86%, rgba(255,255,255,0.7), transparent),
    radial-gradient(1.5px 1.5px at 33% 90%, rgba(210,240,255,0.65), transparent);
  animation: login-twinkle 5s ease-in-out infinite alternate;
}
@keyframes login-twinkle { from { opacity: 0.45; } to { opacity: 1; } }
.login-page .login-container { position: relative; z-index: 1; }

/* —— 2. 教师入口：固定在页面右下角（高亮橙 · 全页最醒目） —— */
.login-page .login-teacher-link {
  position: fixed; right: 26px; bottom: 22px; z-index: 30;
  background: linear-gradient(135deg, #FFB020, #FF7A2F);
  border-color: rgba(255,190,80,0.9); color: #2B1500;
  font-size: 17px; padding: 12px 26px;
  box-shadow: 0 0 18px rgba(255,138,47,0.65), 0 4px 14px rgba(0,0,0,0.35);
}
.login-page .login-teacher-link .lt-arrow { font-size: 19px; font-weight: 800; }
.login-page .login-teacher-link:hover {
  background: linear-gradient(135deg, #FFC24D, #FF8F3F); color: #1F0F00;
  box-shadow: 0 0 30px rgba(255,150,60,0.85), 0 6px 18px rgba(0,0,0,0.4);
  transform: translateY(-2px);
}

/* —— 3. 头部：科技徽标 + 发光标题 —— */
.login-logo { display: inline-block; margin-bottom: 8px; line-height: 0; }
.login-logo svg {
  width: clamp(48px, calc(var(--vhpx, 1vh) * 6.5), 68px); height: clamp(48px, calc(var(--vhpx, 1vh) * 6.5), 68px);
  filter: drop-shadow(0 0 16px rgba(0,212,255,0.4));
  animation: login-float 4.5s ease-in-out infinite;
}
@keyframes login-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
.login-page .big-title {
  font-size: clamp(38px, calc(var(--vhpx, 1vh) * 5.8), 56px); letter-spacing: 6px; white-space: nowrap;
  background: linear-gradient(95deg, #7FE7FF 0%, #4DA3FF 55%, #8F9FFF 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 22px rgba(0,212,255,0.3));
}
.login-page .sub { color: rgba(214,226,255,0.75); font-size: clamp(14px, calc(var(--vhpx, 1vh) * 2), 19px); letter-spacing: 2px; margin-bottom: 8px; white-space: nowrap; }
.login-page .badge-item {
  background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.22);
  color: rgba(230,240,255,0.92); box-shadow: none;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  font-size: clamp(13px, calc(var(--vhpx, 1vh) * 1.9), 17px); padding: clamp(6px, calc(var(--vhpx, 1vh) * 1.1), 10px) 22px;
}
.login-page .badge-item::before {
  content: ''; display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  background: #00D4FF; margin-right: 10px; vertical-align: 2px;
  box-shadow: 0 0 6px rgba(0,212,255,0.8);
}

/* —— 4. 步骤条：玻璃胶囊 + 霓虹三态（下移贴舞台、距舞台上方一点） —— */
.login-page .steps-bar {
  background: rgba(255,255,255,0.11); border: 1px solid rgba(255,255,255,0.2);
  box-shadow: none;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  padding: clamp(8px, calc(var(--vhpx, 1vh) * 1.4), 12px) clamp(20px, calc(var(--vhpx, 1vh) * 3), 30px);
  margin-top: auto;                  /* 弹性自动下移：远离标题、贴到舞台上方一点 */
  margin-bottom: clamp(6px, calc(var(--vhpx, 1vh) * 0.9), 10px); /* 与舞台的缝隙：留一点但不贴太近 */
}
.login-page .step { color: rgba(210,224,255,0.6); font-size: clamp(15px, calc(var(--vhpx, 1vh) * 2.1), 19px); padding: 0 clamp(10px, calc(var(--vhpx, 1vh) * 1.8), 16px); gap: 10px; }
.login-page .step.on { color: #7FEEFF; }
.login-page .step.clickable:hover .step-lbl { color: #7FEEFF; }
.login-page .step-num {
  width: clamp(28px, calc(var(--vhpx, 1vh) * 4.2), 38px); height: clamp(28px, calc(var(--vhpx, 1vh) * 4.2), 38px); font-size: clamp(14px, calc(var(--vhpx, 1vh) * 2), 18px);
  background: rgba(255,255,255,0.14); color: rgba(224,234,255,0.85);
  border: 1px solid rgba(255,255,255,0.24);
}
.login-page .step.on .step-num {
  background: linear-gradient(135deg, #00D4FF, #2F7BFF); color: #04122B;
  border-color: transparent;
  box-shadow: 0 0 0 4px rgba(0,212,255,0.16), 0 0 16px rgba(0,212,255,0.5);
}
.login-page .step.done .step-num {
  background: rgba(0,255,178,0.14); color: #5CFFC5; border-color: rgba(0,255,178,0.4);
  box-shadow: 0 0 0 4px rgba(0,255,178,0.1);
}
.login-page .step.done .step-lbl { color: #5CFFC5; }
.login-page .step-line { background: rgba(255,255,255,0.13); width: 42px; height: 3px; }
.login-page .step-line.done { background: linear-gradient(90deg, #00D4FF, #5CFFC5); }

/* —— 5. 中部舞台：玻璃拟态面板 —— */
.login-page .login-stage {
  background: rgba(38, 54, 110, 0.38);
  border: 1px solid rgba(150, 190, 255, 0.24);
  box-shadow: 0 24px 60px rgba(10, 18, 50, 0.35), inset 0 1px 0 rgba(255,255,255,0.12);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  margin-bottom: clamp(14px, calc(var(--vhpx, 1vh) * 2.5), 24px); /* 与下方页脚留够距离，不贴太近 */
}
.login-page .prompt-q { color: #F2F6FF; }
.login-page .qmark { color: #00D4FF; text-shadow: 0 0 14px rgba(0,212,255,0.6); }
.login-page .prompt-red { color: #FF5A5A; }
.prompt-q .prompt-red { font-weight: 900; }
.login-page .login-crumb {
  background: rgba(255,255,255,0.11); border: 1px solid rgba(160,190,255,0.28);
  color: rgba(224,234,255,0.88); box-shadow: none;
}
.login-page .login-crumb .crumb-current { color: #7FEEFF; }
.login-page .roster-empty-tip {
  background: rgba(255,178,56,0.08); border: 2px dashed rgba(255,178,56,0.45);
  color: #FFCF8A;
}

/* —— 6. 选册卡：真实课本封面图 + 底部文字压暗，整体更小巧 —— */
.login-page .book-card {
  background: linear-gradient(150deg, rgba(255,255,255,0.16), rgba(255,255,255,0.06));
  border: 1px solid rgba(160,195,255,0.34);
  box-shadow: 0 18px 40px -18px rgba(10,18,50,0.6);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.login-page .book-card .book-emoji { display: none; }
/* 卡片比例：与真实课本封面一致（约0.71），高度随屏幕自适应 */
.login-page .book-card.book-orange, .login-page .book-card.book-blue {
  width: auto; height: clamp(220px, calc(var(--vhpx, 1vh) * 32), 340px); aspect-ratio: 5 / 7; padding: 0;
}
.login-page .book-grid { margin-bottom: clamp(14px, calc(var(--vhpx, 1vh) * 2), 22px); }
.login-page .book-card.book-orange::before, .login-page .book-card.book-orange::after,
.login-page .book-card.book-blue::before, .login-page .book-card.book-blue::after { display: none; }
/* 封面图：铺满整卡 */
.login-page .book-card .book-cover-img {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
}
.login-page .book-card .book-cover { height: 100%; justify-content: flex-end; padding-bottom: 14px; }
/* AI 册封面左上角「上册/下册」徽标：封面图未印分册信息，用徽标区分两学期 */
.book-vol-badge {
  position: absolute; top: 12px; left: 12px; z-index: 3;
  background: var(--grad-purple); color: #fff;
  font-size: 15px; font-weight: 900; letter-spacing: 3px;
  padding: 5px 13px 4px; border-radius: 9px;
  box-shadow: 0 3px 10px rgba(142,92,246,0.5), 0 0 0 2px rgba(255,255,255,0.85);
  pointer-events: none;
}
.login-page .book-card .book-cover .book-tag {
  position: relative; z-index: 2; font-size: 13.5px; letter-spacing: 1px;
  color: rgba(240,246,255,0.95); background: rgba(12,18,40,0.45);
  padding: 5px 14px; border-radius: 999px; margin-top: 0;
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
/* 描边与选中光晕：跟随真实封面色系 */
.login-page .book-card.book-orange { background: linear-gradient(150deg, rgba(255,140,50,0.55), rgba(255,170,80,0.22) 55%, rgba(30,48,110,0.30)); border-color: rgba(255,170,80,0.65); }
.login-page .book-card.book-blue { background: linear-gradient(150deg, rgba(70,150,255,0.55), rgba(90,170,255,0.22) 55%, rgba(30,48,110,0.30)); border-color: rgba(110,180,255,0.6); }
.login-page .book-card.book-orange:hover {
  transform: translateY(-8px);
  box-shadow: 0 26px 50px -16px rgba(10,18,50,0.6), 0 0 30px rgba(255,160,60,0.3);
}
.login-page .book-card.book-blue:hover {
  transform: translateY(-8px);
  box-shadow: 0 26px 50px -16px rgba(10,18,50,0.6), 0 0 30px rgba(90,170,255,0.32);
}
.login-page .book-card.book-orange.selected { box-shadow: 0 0 0 2.5px #FFB25C, 0 0 38px rgba(255,160,60,0.45); }
.login-page .book-card.book-blue.selected { box-shadow: 0 0 0 2.5px #5FB0FF, 0 0 38px rgba(90,170,255,0.45); }
/* AI初识·上册（紫）：与课本卡统一 5:7 比例，四张卡片大小完全一致（封面为 3:4，左右仅裁白边约 2.4%） */
.login-page .book-card.book-purple {
  width: auto; height: clamp(220px, calc(var(--vhpx, 1vh) * 32), 340px); aspect-ratio: 5 / 7; padding: 0;
}
.login-page .book-card.book-purple::before, .login-page .book-card.book-purple::after { display: none; }
.login-page .book-card.book-purple { background: linear-gradient(150deg, rgba(139,92,246,0.55), rgba(159,122,234,0.22) 55%, rgba(30,48,110,0.30)); border-color: rgba(167,139,250,0.6); }
.login-page .book-card.book-purple:hover {
  transform: translateY(-8px);
  box-shadow: 0 26px 50px -16px rgba(10,18,50,0.6), 0 0 30px rgba(159,122,234,0.32);
}
.login-page .book-card.book-purple.selected { box-shadow: 0 0 0 2.5px #B79AFA, 0 0 38px rgba(159,122,234,0.45); }
/* AI初识·下册（玫红）：与上册同尺寸 5:7 竖版封面卡，仅色系不同便于学生一眼区分 */
.login-page .book-card.book-magenta {
  width: auto; height: clamp(220px, calc(var(--vhpx, 1vh) * 32), 340px); aspect-ratio: 5 / 7; padding: 0;
}
.login-page .book-card.book-magenta::before, .login-page .book-card.book-magenta::after { display: none; }
.login-page .book-card.book-magenta { background: linear-gradient(150deg, rgba(232,74,134,0.55), rgba(255,122,162,0.22) 55%, rgba(30,48,110,0.30)); border-color: rgba(244,142,180,0.6); }
.login-page .book-card.book-magenta:hover {
  transform: translateY(-8px);
  box-shadow: 0 26px 50px -16px rgba(10,18,50,0.6), 0 0 30px rgba(232,74,134,0.32);
}
.login-page .book-card.book-magenta.selected { box-shadow: 0 0 0 2.5px #F08CB4, 0 0 38px rgba(232,74,134,0.45); }
.login-page .book-card.book-magenta .book-vol-badge {
  background: var(--grad-magenta);
  box-shadow: 0 3px 10px rgba(232,74,134,0.5), 0 0 0 2px rgba(255,255,255,0.85);
}

/* —— 7. 班级卡（8列网格）：阳光暖色卡 —— */
.login-page .book-card.class-card-16 {
  background: linear-gradient(155deg, #FFECA8 0%, #FFD064 48%, #FFB04E 100%);
  border: 1.5px solid rgba(255, 242, 205, 0.95);
  color: #7A4A12;
  min-height: 96px;
  box-shadow: 0 12px 26px -12px rgba(255, 150, 50, 0.65), inset 0 1.5px 0 rgba(255,255,255,0.6);
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
/* 右上角太阳光晕 */
.login-page .book-card.class-card-16::before {
  content: '';
  position: absolute; top: -36px; right: -36px;
  width: 96px; height: 96px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.85) 0%, rgba(255,255,255,0) 70%);
  opacity: 0.9;
}
/* 左下角暖反光 */
.login-page .book-card.class-card-16::after {
  content: '';
  position: absolute; left: -30px; bottom: -32px;
  width: 84px; height: 84px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,170,60,0.45) 0%, rgba(255,170,60,0) 70%);
  opacity: 0.9;
}
.login-page .book-card.class-card-16:hover {
  transform: translateY(-4px) scale(1.03);
  border-color: #ffffff;
  box-shadow: 0 16px 32px -10px rgba(255,150,50,0.75), 0 0 22px rgba(255,205,90,0.55);
}
.login-page .book-card.class-card-16 .book-emoji {
  display: block;
  font-size: 22px;
  margin-bottom: 2px;
  filter: drop-shadow(0 2px 3px rgba(180,90,0,0.35));
  transition: transform 0.18s ease;
}
.login-page .book-card.class-card-16 .book-name {
  color: #7A4A12;
  margin-top: 0;
  text-shadow: 0 1px 0 rgba(255,255,255,0.45);
}
/* 人数标签：白色胶囊 */
.login-page .book-card.class-card-16 .book-tag {
  color: #8A5418;
  background: rgba(255,255,255,0.55);
  border-radius: 999px;
  padding: 2px 10px;
  font-size: 10.5px;
  font-weight: 700;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.4);
}
.login-page .book-card.class-card-16.selected {
  background: linear-gradient(155deg, #FFD86E 0%, #FFB43D 50%, #FF9628 100%);
  border-color: #ffffff;
  box-shadow: 0 0 0 2.5px #ffffff, 0 0 0 6px rgba(255,160,40,0.6),
              0 16px 34px -8px rgba(255,140,20,0.8), 0 0 28px rgba(255,195,70,0.6);
}
.login-page .book-card.class-card-16.selected .book-name {
  color: #ffffff;
  text-shadow: 0 1px 3px rgba(170,80,0,0.5);
}
.login-page .book-card.class-card-16.selected .book-tag {
  background: rgba(255,255,255,0.92);
  color: #E8760C;
}
.login-page .book-card.class-card-16.selected .book-emoji {
  transform: scale(1.18) rotate(-8deg);
}

/* —— 8. 名字头像卡：深色玻璃 + 霓虹选中 —— */
.login-page .avatar-card {
  background: rgba(255,255,255,0.10);
  border: 1.5px solid rgba(160,190,255,0.24);
}
.login-page .avatar-card:hover {
  border-color: rgba(0,212,255,0.55);
  box-shadow: 0 6px 14px rgba(10,18,50,0.3);
}
.login-page .avatar-card.selected {
  border-color: #00D4FF;
  background: rgba(0,212,255,0.16);
  box-shadow: 0 0 0 2px rgba(0,212,255,0.35), 0 0 20px rgba(0,212,255,0.32);
}
.login-page .avatar-circle { box-shadow: 0 0 12px rgba(255,255,255,0.14); }
.login-page .avatar-name { color: #EAF1FF; }
.login-page .avatar-no { color: rgba(190,205,240,0.55); }

/* —— 9. 操作按钮 —— */
.login-page .btn-back { color: rgba(200,214,255,0.65); }
.login-page .btn-back:hover { color: #fff; background: rgba(255,255,255,0.08); }
.login-page .btn-enter {
  background: linear-gradient(135deg, #00B3E6, #2F6BFF);
  box-shadow: 0 12px 28px rgba(0,150,255,0.4), 0 0 22px rgba(0,212,255,0.22);
}
.login-page .btn-enter:hover:not(:disabled) {
  box-shadow: 0 16px 34px rgba(0,150,255,0.5), 0 0 30px rgba(0,212,255,0.32);
}
.login-page .btn-enter:disabled {
  background: rgba(255,255,255,0.09); color: rgba(200,214,255,0.4); box-shadow: none;
}

/* —— 10. 底部：流式贴底（任何屏宽都与内容不重叠） —— */
.login-page .login-container {
  min-height: calc(calc(var(--vhpx, 1vh) * 100) - 28px);
  padding-bottom: 2cm;                 /* 页脚整体上移约2cm，底部留空 */
  display: flex; flex-direction: column; justify-content: center;
}
.login-page .login-footer {
  margin-top: auto; padding-top: clamp(8px, calc(var(--vhpx, 1vh) * 1.6), 16px); gap: clamp(8px, calc(var(--vhpx, 1vh) * 1.4), 13px);
  font-size: 18px; color: rgba(214,226,250,0.85);
}
.login-page .lf-dot {
  width: 10px; height: 10px;
  background: #5CFFC5;
  box-shadow: 0 0 0 3px rgba(0,255,178,0.14), 0 0 10px rgba(0,255,178,0.5);
}
.login-page .lf-teacher-btn {
  font-size: 16px; padding: 12px 30px;
  background: rgba(139,125,255,0.10); border: 1.5px dashed rgba(139,125,255,0.55); color: #B7ABFF;
}
.login-page .lf-teacher-btn:hover {
  background: rgba(139,125,255,0.2);
  box-shadow: 0 6px 16px rgba(139,125,255,0.25);
}

/* —— 11. 窄屏微调 —— */
@media (max-width: 760px) {
  .login-page .book-card.book-orange, .login-page .book-card.book-blue,
  .login-page .book-card.book-purple, .login-page .book-card.book-magenta { width: 210px; height: 294px; }
  .login-page .book-card.class-card-16 { min-height: 84px; }
  .login-page .login-footer { font-size: 16px; }
  .login-page .login-teacher-link { right: 16px; bottom: 96px; }
}

.group-head { display: flex; align-items: center; gap: 8px; padding: 13px 16px; }
.group-card:nth-child(1) .group-head { background: linear-gradient(135deg, #ff9a56, #ff5e3a); }
.group-card:nth-child(2) .group-head { background: linear-gradient(135deg, #fbb35a, #f59e0b); }
.group-card:nth-child(3) .group-head { background: linear-gradient(135deg, #fb9d3c, #ea6c0c); }
.group-card:nth-child(4) .group-head { background: linear-gradient(135deg, #f87a6b, #ef4444); }
.group-card:nth-child(5) .group-head { background: linear-gradient(135deg, #f0664a, #dc2626); }
.gh-ico { font-size: 21px; }
.gh-title { flex: 1; font-size: 20px; font-weight: 800; color: #fff; }
.gh-count { font-size: 16px; font-weight: 700; color: #fff; background: rgba(255,255,255,.22); border-radius: 999px; padding: 2px 10px; }
.item-row {
  display: flex; align-items: center; gap: 10px;
  margin: 6px 8px; padding: 10px 12px; border-radius: 12px;
  cursor: pointer; transition: .13s; background: #f8fafc;
}
.item-row:hover { background: #fff2e8; transform: translateX(2px); }
.item-ico {
  width: 40px; height: 40px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 23px; background: #fff; border: 1px solid #eef2f7; border-radius: 9px;
}
.item-main { flex: 1; min-width: 0; }
.item-title { display: flex; align-items: center; gap: 6px; font-size: 19px; font-weight: 700; color: #000; line-height: 1.4; }
.cert-flag { font-size: 15px; font-weight: 700; color: #16a34a; background: #dcfce7; border-radius: 999px; padding: 1px 8px; white-space: nowrap; }
.item-desc { font-size: 16px; color: #666; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.item-best { text-align: right; flex-shrink: 0; }
.ib-wpm { font-size: 16px; font-weight: 800; color: #ea580c; }
.ib-acc { font-size: 15px; color: #666; margin-top: 2px; }
.item-go { flex-shrink: 0; font-size: 16px; color: #cbd5e1; }

/* —— CapsLock 警告 —— */
.caps-warn {
  background: #fef9c3; border: 2px solid #fde047; color: #854d0e;
  font-size: 25px; font-weight: 700; text-align: center;
  padding: 14px 24px; border-radius: 14px;
}

/* —— 打字面板 —— */
/* —— 2026-09-03 二次改版：材料横向排版（不换行+水平滚动跟随），键盘固定在下方，整页不超一屏 —— */
.type-panel {
  background: #fff; border-radius: 20px; box-shadow: var(--shadow-sm);
  padding: 22px 30px;
  font-family: 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  font-size: 34px; line-height: 2.4; letter-spacing: 2px;
  max-width: 1160px; margin: 0 auto; width: 100%;
  text-align: left;
}
.sprint-line {
  font-size: 36px; line-height: 2.3;
}
.type-line { white-space: nowrap; text-align: center; transition: opacity .25s; }
.type-line.done { opacity: .32; }
.tchar {
  display: inline-block; min-width: .6em; text-align: center;
  border-radius: 6px; padding: 0 2px; color: #b6c2d6; transition: color .1s, background .1s;
}
.tchar.ok { color: #16a34a; }
.tchar.bad { color: #fff; background: #ef4444; }
.tchar.cur { background: #ffedd5; box-shadow: inset 0 0 0 3px #fb923c; animation: typ-blink 1.1s ease-in-out infinite; }
.tchar.wronging { animation: typ-shake .3s ease; }
/* 拼音模式（横向单行：汉字在左，拼音向右延伸不换行） */
.py-row { display: flex; align-items: baseline; gap: 20px; padding: 10px 14px; border-radius: 12px; width: max-content; min-width: 100%; }
.py-row.cur { background: #fffbeb; }
.py-han { flex-shrink: 0; min-width: 7.5em; text-align: right; font-family: 'Microsoft YaHei', sans-serif; font-size: 24px; color: #94a3b8; letter-spacing: 3px; }
.py-text { white-space: nowrap; }

/* —— 虚拟键盘（2026-09-11 联想深色·仿真3D键帽 + 正规英文字体） —— */
.typ-kbd {
  background: linear-gradient(145deg, #2a2a35 0%, #1a1a24 100%);
  border-radius: 20px; box-shadow: 0 12px 36px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
  padding: 18px 24px 16px; overflow-x: auto;
  max-width: 1160px; margin: 0 auto; width: 100%;
}
.kbd-space-row { display: flex; justify-content: center; margin-bottom: 2px; }
.kbd-tip { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 16px; margin-bottom: 14px; min-height: 48px; }
.kt-label { font-size: 24px; color: #e2e8f0; font-weight: 700; }
.tip-key {
  font-family: 'Segoe UI', system-ui, sans-serif;
  font-size: 34px; font-weight: 800; color: #fb923c;
  background: rgba(251,146,60,.12); border: 2.5px solid rgba(251,146,60,.5); border-radius: 12px;
  padding: 2px 20px; min-width: 60px; text-align: center;
}
.tip-key.spacekey { font-family: inherit; font-size: 28px; }
.kbd-finger { font-size: 21px; font-weight: 700; color: #fff; border-radius: 999px; padding: 4px 14px; }
.tip-shift { font-size: 22px; color: #f87171; font-weight: 700; }
.tip-calm { font-size: 22px; color: #f87171; font-weight: 700; animation: typ-fade .5s ease; }
.kbd-row { display: flex; justify-content: center; gap: 8px; margin-bottom: 10px; }
.kbd-row.math-row { gap: 10px; }
.kbd-row.math-row .kbd-key { min-width: 78px; font-size: 30px; }
.kbd-row.math-row.letter-row { gap: 7px; margin-bottom: 14px; border-bottom: 2px solid rgba(255,255,255,.08); padding-bottom: 10px; }
.kbd-row.math-row.letter-row .kbd-key { min-width: 50px; height: 50px; font-size: 22px; }
.kbd-key {
  position: relative; min-width: 60px; height: 60px; padding: 0 8px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid #3a3a45; border-bottom: 5px solid var(--fk, #4a4a55);
  background: linear-gradient(to bottom, #33333d 0%, #22222a 100%);
  color: #f1f5f9;
  border-radius: 8px;
  font-family: 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  font-size: 30px; font-weight: 600;
  box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.08);
  transition: all .12s; user-select: none;
}
.kbd-key.home::after {
  content: ''; position: absolute; bottom: 6px; left: 50%; transform: translateX(-50%);
  width: 8px; height: 8px; border-radius: 50%; background: #6b7280;
}
.kbd-key.next {
  background: linear-gradient(to bottom, #fb923c 0%, #f97316 100%); color: #fff;
  border-color: #ea580c; border-bottom-color: #c2410c;
  transform: translateY(2px); border-bottom-width: 3px;
  box-shadow: 0 5px 18px rgba(249,115,22,.5), inset 0 1px 0 rgba(255,255,255,.3);
}
.kbd-key.next.home::after { background: rgba(255,255,255,.85); }
.kbd-key.pressed { transform: translateY(2px); border-bottom-width: 3px; background: linear-gradient(to bottom, #1a1a24, #111118); box-shadow: 0 1px 2px rgba(0,0,0,.3); }
.kbd-key.next.pressed { transform: translateY(3px); }
.kbd-key.special {
  background: linear-gradient(to bottom, #2e2e38 0%, #1e1e26 100%);
  color: #9ca3af; font-size: 18px; font-weight: 700;
  border-color: #383843; border-bottom-color: #2a2a35;
}
.kbd-key.tab { min-width: 90px; }
.kbd-key.caps { min-width: 106px; }
.kbd-key.enter { min-width: 112px;
  background: linear-gradient(to bottom, #dc2626 0%, #991b1b 100%); color: #fff;
  border-color: #7f1d1d; border-bottom-color: #5c1010;
}
.kbd-key.back { min-width: 122px; }
.kbd-key.shift { min-width: 138px; font-size: 18px; }
.kbd-key.shift.hint {
  background: linear-gradient(to bottom, #fbbf24 0%, #f59e0b 100%); color: #fff;
  border-color: #d97706; border-bottom-color: #b45309;
  box-shadow: 0 5px 18px rgba(245,158,11,.5), inset 0 1px 0 rgba(255,255,255,.3);
}
.kbd-key.space { width: 520px; max-width: calc(var(--vwpx, 1vw) * 70); font-size: 16px; font-weight: 700;
  background: linear-gradient(to bottom, #33333d 0%, #22222a 100%); color: #f1f5f9;
  border-color: #3a3a45; border-bottom-color: #4a4a55;
}
.kbd-legend { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 12px; }
.kl-item {
  font-size: 19px; font-weight: 700; background: rgba(255,255,255,.92);
  border: 2px solid; border-radius: 999px; padding: 3px 14px; opacity: .95;
}

/* ===========================================================
 * 一屏布局（2026-09-03）：训练中锁页高，材料面板内部滚动，
 * 键盘始终固定在材料下方可见，整页不超出一屏。
 * =========================================================== */
.typ-root--train { height: calc(var(--vhpx, 1vh) * 100); overflow: hidden; }
.typ-root--train:fullscreen { overflow: hidden; }
.typ-root--train .typ-main-train {
  flex: 1; min-height: 0;
  display: flex; flex-direction: column;
  padding: 14px 24px 16px; gap: 18px;
  overflow: hidden;
}
.typ-root--train .type-panel {
  flex: 1 1 auto; min-height: 0;
  overflow: hidden;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  gap: 18px;
}
.typ-root--train .typ-kbd { flex-shrink: 0; }
.typ-root--train .caps-warn { flex-shrink: 0; padding: 10px 20px; font-size: 16px; }

/* —— 结算卡 —— */
.result-card {
  background: #fff; border-radius: 22px; box-shadow: var(--shadow-md);
  max-width: 580px; width: 100%; margin: 12px auto 0;
  padding: 30px 34px 26px; text-align: center;
}
.result-stars { font-size: 42px; letter-spacing: 6px; color: #e5e7eb; line-height: 1; }
.result-stars .lit { color: #f59e0b; text-shadow: 0 2px 10px rgba(245, 158, 11, .45); }
.result-title { font-size: 32px; font-weight: 800; color: #000; margin: 10px 0 4px; }
.rank-up {
  display: inline-block; margin-top: 8px;
  background: linear-gradient(135deg, #fbbf24, #f59e0b); color: #fff;
  font-size: 20px; font-weight: 800; padding: 8px 20px; border-radius: 999px;
  box-shadow: 0 4px 14px rgba(245, 158, 11, .4);
}
.rank-up.max { background: linear-gradient(135deg, #c084fc, #7c3aed); box-shadow: 0 4px 14px rgba(124, 58, 237, .4); }
.cert-badge {
  display: inline-block; margin-top: 8px;
  background: #dcfce7; color: #16a34a; border: 1.5px solid #86efac;
  font-size: 19px; font-weight: 800; padding: 7px 18px; border-radius: 999px;
}
.cert-badge.fail { background: #fef2f2; color: #dc2626; border-color: #fecaca; }
.new-best { font-size: 20px; font-weight: 800; color: #ea580c; margin-top: 10px; animation: typ-pop .45s ease; }
.result-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 20px 0 4px; }
.rk { background: #f8fafc; border: 1px solid #eef2f7; border-radius: 14px; padding: 14px 8px; }
.r-num { font-size: 33px; font-weight: 800; color: #000; font-variant-numeric: tabular-nums; }
.rk:first-child .r-num { color: #ea580c; }
.r-label { font-size: 17px; color: #666; font-weight: 600; margin-top: 3px; }
/* 键位诊断 */
.diag-box { text-align: left; background: #f8fafc; border: 1px solid #eef2f7; border-radius: 16px; padding: 18px 20px; margin-top: 16px; }
.diag-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
.diag-label { font-size: 18px; font-weight: 700; color: #333; margin-right: 2px; }
.diag-key {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: 'Cascadia Mono', Consolas, monospace;
  font-size: 19px; font-weight: 800; border-radius: 8px; padding: 5px 12px;
}
.diag-key i { font-style: normal; font-size: 15px; font-weight: 600; opacity: .85; font-family: 'Microsoft YaHei', sans-serif; }
.diag-key.bad { background: #fee2e2; color: #dc2626; border: 1px solid #fecaca; }
.diag-key.good { background: #dcfce7; color: #16a34a; border: 1px solid #bbf7d0; }
/* 键位热力图 */
.heat-map { margin: 16px 0 6px; overflow-x: auto; }
.heat-row { display: flex; justify-content: center; gap: 5px; margin-bottom: 5px; }
.hk-key {
  min-width: 30px; height: 30px; padding: 0 4px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 6px; font-family: 'Cascadia Mono', Consolas, monospace;
  font-size: 16px; font-weight: 700; border: 1px solid transparent;
}
.hk-key.ok { background: #dcfce7; color: #16a34a; border-color: #bbf7d0; }
.hk-key.warn { background: #fef9c3; color: #ca8a04; border-color: #fde68a; }
.hk-key.bad { background: #fee2e2; color: #dc2626; border-color: #fecaca; }
.hk-key.none { background: #f1f5f9; color: #cbd5e1; border-color: #e2e8f0; }
.heat-legend { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px; margin-top: 12px; }
.hl-item { display: inline-flex; align-items: center; gap: 5px; font-size: 16px; color: #333; font-weight: 600; }
.hl-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.hl-dot.ok { background: #86efac; }
.hl-dot.warn { background: #fde047; }
.hl-dot.bad { background: #fca5a5; }
.hl-dot.none { background: #e2e8f0; }
.result-goal { font-size: 19px; color: #666; font-weight: 600; margin: 16px 0 0; line-height: 1.5; }
.result-btns { display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; margin-top: 18px; }
.btn-primary {
  border: none; cursor: pointer; font-family: inherit;
  background: linear-gradient(135deg, #60a5fa, #2563eb); color: #fff;
  font-size: 20px; font-weight: 800; padding: 12px 30px; border-radius: 999px;
  box-shadow: 0 4px 16px rgba(249, 115, 22, .35); transition: .15s;
}
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(249, 115, 22, .45); }
.result-btns .btn-weak { font-size: 20px; padding: 12px 26px; }
.btn-exit {
  border: 1.5px solid #e2e8f0; background: #fff; color: #333;
  font-size: 20px; font-weight: 700; font-family: inherit;
  padding: 12px 26px; border-radius: 999px; cursor: pointer; transition: .15s;
}
.btn-exit:hover { color: #000; border-color: #cbd5e1; }

/* —— 动画 —— */
@keyframes typ-blink { 0%, 100% { box-shadow: inset 0 0 0 2px #fb923c; } 50% { box-shadow: inset 0 0 0 2px rgba(251, 146, 60, .3); } }
@keyframes typ-shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
@keyframes typ-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes typ-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes typ-pop { 0% { transform: scale(.6); opacity: 0; } 70% { transform: scale(1.12); } 100% { transform: scale(1); opacity: 1; } }

/* —— 响应式 —— */
@media (max-width: 1280px) {
  .kbd-key { min-width: 58px; height: 58px; font-size: 22px; }
  .kbd-key.tab { min-width: 86px; }
  .kbd-key.caps { min-width: 102px; }
  .kbd-key.enter { min-width: 106px; }
  .kbd-key.back { min-width: 116px; }
  .kbd-key.shift { min-width: 134px; }
  .kbd-key.special { font-size: 15px; }
  .kbd-key.space { width: 500px; }
  .kbd-row.math-row .kbd-key { min-width: 64px; }
  .kbd-row.math-row.letter-row .kbd-key { min-width: 42px; height: 46px; font-size: 18px; }
  .type-panel { font-size: 30px; }
  .sprint-line { font-size: 36px; }
  .tip-key { font-size: 28px; }
  .py-han { font-size: 18px; }
}
@media (max-width: 980px) {
  .group-grid { grid-template-columns: repeat(2, 1fr); }
  .kbd-key { min-width: 44px; height: 46px; font-size: 17px; }
  .kbd-key.tab { min-width: 66px; }
  .kbd-key.caps { min-width: 78px; }
  .kbd-key.enter { min-width: 82px; }
  .kbd-key.back { min-width: 90px; }
  .kbd-key.shift { min-width: 102px; }
  .kbd-key.special { font-size: 13px; }
  .kbd-key.space { width: 380px; max-width: calc(var(--vwpx, 1vw) * 62); }
  .kbd-row { gap: 7px; margin-bottom: 7px; }
  .kbd-row.math-row { gap: 8px; }
  .kbd-row.math-row .kbd-key { min-width: 48px; }
  .kbd-row.math-row.letter-row .kbd-key { min-width: 32px; height: 38px; font-size: 14px; }
  .type-panel { font-size: 24px; padding: 26px 28px; }
  .sprint-line { font-size: 28px; }
  .tip-key { font-size: 23px; padding: 2px 16px; min-width: 54px; }
  .kt-label { font-size: 16px; }
  .kbd-finger { font-size: 14px; padding: 4px 12px; }
  .tip-shift { font-size: 15px; }
  .tip-calm { font-size: 15px; }
  .py-han { font-size: 15px; }
  .py-row { gap: 12px; }
  .hud-badge { padding: 7px 14px; font-size: 15px; }
  .hud-progress { font-size: 16px; }
  .kbd-tip { gap: 10px; margin-bottom: 12px; min-height: 38px; }
  .typ-kbd { padding: 18px 20px 14px; }
  .kbd-legend { gap: 8px; margin-top: 14px; }
  .kl-item { font-size: 13px; padding: 3px 12px; }
}
@media (max-width: 700px) {
  .group-grid { grid-template-columns: 1fr; }
  .result-kpis { grid-template-columns: repeat(2, 1fr); }
  .typ-main { padding: 14px 12px 40px; }
  .typ-main-train { padding: 12px 14px 24px; gap: 14px; }
  .kbd-key { min-width: 32px; height: 38px; font-size: 14px; }
  .kbd-key.tab { min-width: 48px; }
  .kbd-key.caps { min-width: 56px; }
  .kbd-key.enter { min-width: 58px; }
  .kbd-key.back { min-width: 64px; }
  .kbd-key.shift { min-width: 72px; }
  .kbd-key.special { font-size: 11px; }
  .kbd-key.space { width: 260px; max-width: calc(var(--vwpx, 1vw) * 58); }
  .kbd-row.math-row .kbd-key { min-width: 36px; }
  .kbd-row.math-row.letter-row .kbd-key { min-width: 26px; height: 32px; font-size: 12px; }
  .type-panel { font-size: 19px; padding: 18px 16px; letter-spacing: 1px; }
  .sprint-line { font-size: 22px; }
  .tip-key { font-size: 18px; padding: 1px 12px; min-width: 40px; }
}

/* ============================================================
   基础训练 · 电脑小当家养成记（标准版式）
   ============================================================ */
.bas-root { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 40; display: flex; flex-direction: column; background: #f4f6f9; overflow: hidden; }
.bas-topbar { flex: 0 0 64px; height: 64px; background: #fff; display: flex; align-items: center; justify-content: space-between; padding: 0 20px; box-shadow: 0 2px 8px rgba(0,0,0,.08); position: sticky; top: 0; z-index: 6; }
.bas-root .sim-back { background: linear-gradient(135deg, #f97316, #ea580c); box-shadow: 0 4px 14px rgba(249, 115, 22, .35); font-size: 16px; padding: 10px 20px 10px 14px; }
.bas-root .sim-back:hover { background: linear-gradient(135deg, #ea580c, #c2410c); box-shadow: 0 6px 20px rgba(249, 115, 22, .45); }
.bas-root .sim-crumb { font-size: 17px; }
.bas-root .sim-page-title { font-size: 26px; }
.bas-root .sim-done { font-size: 16px; }
.bas-topbar-left { display: flex; align-items: center; gap: 16px; min-width: 0; }
.bas-topbar-right { display: flex; align-items: center; gap: 6px; }

/* —— 列表视图 —— */
.bas-list { width: 100%; max-width: 100%; margin: 0 auto; padding: 20px 20px 20px; flex: 1; min-height: 0; display: flex; flex-direction: column; overflow-y: auto; }
.bas-hero { display: flex; align-items: center; gap: 20px; max-width: 1320px; margin: 0 auto; background: linear-gradient(135deg, #fff7ef, #fffdfa); border: 1.5px solid #ffd9b3; border-radius: 22px; padding: 22px 28px; box-shadow: 0 6px 22px rgba(255, 107, 53, .08); }
.bas-hero-ico { width: 80px; height: 80px; flex: 0 0 80px; border-radius: 18px; background: linear-gradient(135deg, #ff8a4c, #ff6b35); display: flex; align-items: center; justify-content: center; font-size: 44px; box-shadow: 0 6px 16px rgba(255, 107, 53, .30); }
.bas-hero-title { font-size: 29px; font-weight: 800; color: #000; }
.bas-hero-sub { font-size: 18px; color: #333; margin-top: 5px; }

.bas-progress { display: flex; align-items: center; gap: 22px; max-width: 1320px; margin: 16px auto 0; background: #fff; border-radius: 22px; padding: 20px 28px; box-shadow: 0 2px 10px rgba(45, 55, 72, .06); }
.bas-ring { position: relative; width: 100px; height: 100px; flex: 0 0 100px; }
.bas-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.bas-ring-bg { fill: none; stroke: #edf0f5; stroke-width: 9; }
.bas-ring-fg { fill: none; stroke: #ff6b35; stroke-width: 9; stroke-linecap: round; stroke-dasharray: 226.2; stroke-dashoffset: calc(226.2 - 226.2 * var(--p, 0) / 100); transition: stroke-dashoffset .6s ease; }
.bas-ring b { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center; font-size: 29px; font-weight: 800; color: #ff6b35; }
.bas-ring b i { font-style: normal; font-size: 14px; margin-left: 1px; }
.bas-progress-main { flex: 1; min-width: 0; }
.bas-progress-title { font-size: 23px; font-weight: 800; color: #000; }
.bas-progress-sub { font-size: 17px; color: #333; margin-top: 4px; }
.bas-progress-sub b { color: #ff6b35; }
.bas-progress-track { height: 9px; background: #edf0f5; border-radius: 999px; margin-top: 10px; overflow: hidden; }
.bas-progress-track i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #ff9a62, #ff6b35); transition: width .6s ease; }
.bas-continue { flex: 0 0 auto; border: none; cursor: pointer; font-family: inherit; background: linear-gradient(135deg, #ff8a4c, #ff6b35); color: #fff; font-size: 18px; font-weight: 700; padding: 14px 26px; border-radius: 999px; box-shadow: 0 5px 16px rgba(255, 107, 53, .30); transition: transform .15s, box-shadow .15s; }
.bas-continue:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(255, 107, 53, .38); }
.bas-continue.finished { background: linear-gradient(135deg, #ffd08a, #ffb25c); cursor: default; }

.bas-units { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; max-width: 1320px; margin: 16px auto 0; align-content: start; }
.bas-unit { background: #fff; border-radius: 22px; padding: 22px 24px 20px; box-shadow: 0 2px 10px rgba(45, 55, 72, .06); display: flex; flex-direction: column; }
.bas-unit-head { display: flex; align-items: center; gap: 12px; cursor: default; }
.bas-unit-ico { width: 58px; height: 58px; flex: 0 0 58px; border-radius: 13px; display: flex; align-items: center; justify-content: center; font-size: 32px; }
.bas-unit-name { flex: 1; min-width: 0; line-height: 1.3; }
.bas-unit-no { display: block; font-size: 15px; color: #333; }
.bas-unit-name b { font-size: 23px; font-weight: 800; color: #000; }
.bas-unit-lock, .bas-unit-ok { width: 30px; height: 30px; flex: 0 0 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.bas-unit-lock { background: #f1f3f7; }
.bas-unit-ok { background: #fff4e0; }
.bas-unit-divider { height: 2px; border-radius: 2px; margin: 14px 0 10px; }
.bas-unit-meta { font-size: 16px; color: #333; margin-bottom: 6px; }
.bas-unit-meta b { font-weight: 700; }

.bas-lessons { display: flex; flex-direction: column; }
.bas-lesson { display: flex; align-items: center; gap: 12px; border: none; background: none; text-align: left; font-family: inherit; cursor: pointer; padding: 11px 8px; border-radius: 14px; transition: background .15s; }
.bas-lesson:hover { background: #f7f9fc; }
.bas-lesson-ico { width: 48px; height: 48px; flex: 0 0 48px; border-radius: 11px; background: #f4f6f9; display: flex; align-items: center; justify-content: center; font-size: 26px; }
.bas-lesson-main { flex: 1; min-width: 0; }
.bas-lesson-title { display: block; font-size: 19px; font-weight: 700; color: #000; }
.bas-lesson-desc { display: block; font-size: 16px; color: #333; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bas-lesson-go { flex: 0 0 auto; width: 26px; text-align: center; font-size: 17px; color: #ff8a4c; }
.bas-lesson-go.star { font-size: 20px; }
.bas-lesson.done .bas-lesson-title { color: #666; }
.bas-lesson.done .bas-lesson-desc { color: #666; }

.bas-tag { display: inline-block; font-style: normal; font-size: 13px; font-weight: 700; border-radius: 6px; padding: 2px 8px; margin-left: 7px; vertical-align: 1px; }
.bas-tag.tu { color: #7b68ee; background: #efedff; border: 1px solid #ddd8ff; }
.bas-tag.lv { color: #ff6b35; background: #fff1e8; border: 1px solid #ffd9c2; }

.bas-unit.locked { opacity: .62; }
.bas-unit.locked .bas-lesson { cursor: not-allowed; }
.bas-unit.locked .bas-lesson:hover { background: none; }
.bas-unit.locked .bas-lesson-go { color: #666; }

/* —— 课程视图 —— */
.bas-course { width: 100%; flex: 1; min-height: 0; overflow-y: auto; }
.bas-course-grid { width: 100%; max-width: 1320px; margin: 0 auto; padding: 18px 20px 30px; min-height: 100%; box-sizing: border-box; display: grid; grid-template-columns: 11fr 9fr; gap: 18px; align-content: start; }
.bas-card { background: #fff; border-radius: 22px; padding: 20px 26px; box-shadow: 0 2px 10px rgba(45, 55, 72, .06); }
.bas-card.wide { grid-column: 1 / -1; }
.bas-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.bas-card-head h3 { font-size: 28px; font-weight: 800; color: #000; margin: 0; flex: 1; }
.bas-card-crumb { font-size: 18px; color: #333; }
.bas-card-badge { flex: 0 0 auto; font-size: 17px; font-weight: 700; border-radius: 8px; padding: 5px 12px; }
.bas-card-badge.tu { color: #7b68ee; background: #efedff; }
.bas-card-badge.kn { color: #f39c12; background: #fdf3e0; }
.bas-card-badge.qz { color: #ff6b35; background: #fff1e8; }

.bas-illu { position: relative; border-radius: 16px; overflow: hidden; cursor: zoom-in; border: 1px solid #eef1f6; }
.bas-illu svg { display: block; width: 100%; height: auto; }
.bas-illu-img { display: block; width: 100%; height: 430px; max-height: 430px; object-fit: contain; border-radius: 0; }
.bas-illu-hint { position: absolute; right: 10px; bottom: 10px; font-size: 17px; font-weight: 600; color: #333; background: rgba(255, 255, 255, .92); border-radius: 999px; padding: 5px 14px; box-shadow: 0 2px 8px rgba(45, 55, 72, .14); }

.bas-know { font-size: 21px; line-height: 1.9; color: #000; background: #fffaf2; border: 1px solid #f5e6cc; border-radius: 14px; padding: 15px 18px; margin: 0 0 16px; }

/* —— 知识充电站：编号知识点（标准版式） —— */
.bas-know-list { display: flex; flex-direction: column; gap: 12px; margin: 0 0 16px; }
.bas-know-point { display: flex; align-items: flex-start; gap: 10px; font-size: 21px; line-height: 1.85; color: #000; background: #fffaf2; border: 1px solid #f5e6cc; border-radius: 12px; padding: 14px 18px; }
.bas-know-no { flex: 0 0 auto; font-size: 21px; font-weight: 800; color: #ff9a3d; }
.bas-know-txt b.bas-know-tt { color: #000; font-weight: 800; }

.bas-steps-title { font-size: 23px; font-weight: 800; color: #000; margin-bottom: 12px; }
.bas-steps-sub { font-size: 17px; font-weight: 600; color: #333; }
/* —— 上机试一试：点一步勾一步（标准版式） —— */
.bas-step { display: flex; align-items: flex-start; gap: 12px; padding: 10px 8px; margin: 0 -8px; border: none; background: none; font-family: inherit; text-align: left; cursor: pointer; border-radius: 10px; transition: background .15s; width: calc(100% + 16px); }
.bas-step:hover { background: #f7f9fc; }
.bas-step + .bas-step { border-top: 1px dashed #eef1f6; border-radius: 10px 10px 0 0; }
.bas-step.ok .bas-step-txt { color: #666; }
.bas-step.ok .bas-step-no { box-shadow: 0 3px 10px rgba(39, 174, 96, .35); }
.bas-step-no { flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; color: #fff; font-size: 18px; font-weight: 800; display: flex; align-items: center; justify-content: center; margin-top: 1px; }
.bas-step-txt { font-size: 20px; line-height: 1.65; color: #000; }

.bas-quiz + .bas-quiz { margin-top: 22px; border-top: 1px dashed #eef1f6; padding-top: 22px; }
.bas-quiz-q { font-size: 30px; font-weight: 800; color: #000; line-height: 1.5; margin-bottom: 14px; }
.bas-quiz-no { display: inline-block; font-size: 30px; font-weight: 800; color: #000; margin-right: 8px; }
.bas-quiz-ok { font-size: 19px; color: #27ae60; font-weight: 700; margin-left: 12px; }
.bas-quiz-opts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.bas-opt { display: flex; align-items: center; gap: 10px; border: 1.5px solid #e5e9f0; background: #fbfcfe; border-radius: 13px; padding: 14px 16px; font-family: inherit; font-size: 24px; color: #000; cursor: pointer; text-align: left; transition: border-color .15s, background .15s, transform .1s; }
.bas-opt:hover { border-color: #ffb28a; background: #fff8f3; }
.bas-opt-key { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 8px; background: #eef1f6; color: #333; font-size: 20px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.bas-opt.pick { border-color: #ff9a62; background: #fff8f3; }
.bas-opt.pick .bas-opt-key { background: #ff6b35; color: #fff; }
.bas-opt.right { border-color: #7dd8a5; background: #f0fbf5; }
.bas-opt.right .bas-opt-key { background: #27ae60; color: #fff; }
.bas-opt.right .bas-opt-mark { color: #27ae60; }
.bas-opt.wrong { border-color: #f3b0b0; background: #fdf3f3; animation: basShake .3s; }
.bas-opt.wrong .bas-opt-key { background: #e74c3c; color: #fff; }
.bas-opt.wrong .bas-opt-mark { color: #e74c3c; }
.bas-opt-mark { margin-left: auto; font-weight: 800; font-size: 24px; }
@keyframes basShake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }

/* —— 随堂小测：答错锁定 / 重答这题 / 完成学习（标准版式） —— */
.bas-opt:disabled { cursor: default; }
.bas-opt:disabled:hover { border-color: #e5e9f0; background: #fbfcfe; }
.bas-opt.right:disabled, .bas-opt.right:disabled:hover { border-color: #7dd8a5; background: #f0fbf5; }
.bas-opt.wrong:disabled, .bas-opt.wrong:disabled:hover { border-color: #f3b0b0; background: #fdf3f3; }
.bas-retry { margin-top: 12px; border: 1.5px solid #ffd9c2; background: #fff8f3; color: #ff6b35; font-family: inherit; font-size: 18px; font-weight: 700; border-radius: 999px; padding: 9px 18px; cursor: pointer; transition: background .15s; }
.bas-retry:hover { background: #fff1e8; }
.bas-submit-row { margin-top: 20px; }
.bas-submit { width: 100%; border: none; cursor: default; font-family: inherit; background: #edf0f5; color: #666; font-size: 22px; font-weight: 800; padding: 16px; border-radius: 14px; transition: background .2s, color .2s, transform .15s, box-shadow .2s; }
.bas-submit:not(:disabled) { cursor: pointer; background: linear-gradient(135deg, #ff8a4c, #ff6b35); color: #fff; box-shadow: 0 6px 18px rgba(255, 107, 53, .30); }
.bas-submit:not(:disabled):hover { transform: translateY(-2px); box-shadow: 0 9px 22px rgba(255, 107, 53, .38); }

/* —— 顶栏音效文字按钮（标准版式） —— */
.bas-snd { border: 1.5px solid #e5e9f0; background: #fbfcfe; color: #333; font-family: inherit; font-size: 17px; font-weight: 600; border-radius: 999px; padding: 8px 16px; cursor: pointer; white-space: nowrap; transition: border-color .15s, color .15s; }
.bas-snd:hover { border-color: #ffb28a; color: #ff6b35; }

/* —— 列表行：★已完成 + 最高100分（标准版式） —— */
.bas-done-flag { display: inline-block; font-style: normal; font-size: 13px; font-weight: 700; color: #f5a623; background: #fff7e6; border: 1px solid #ffe3ad; border-radius: 6px; padding: 2px 8px; margin-left: 7px; vertical-align: 1px; }
.bas-lesson-score { font-style: normal; font-weight: 700; color: #27ae60; }

/* —— 过关庆祝弹窗 —— */
.bas-modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 90; background: rgba(23, 32, 46, .55); display: flex; align-items: center; justify-content: center; animation: basFade .25s; }
.bas-modal-card { width: min(400px, calc(var(--vwpx, 1vw) * 88)); background: #fff; border-radius: 26px; padding: 34px 30px 26px; text-align: center; animation: basPop .35s cubic-bezier(.34, 1.56, .64, 1); }
.bas-modal-emoji { font-size: 54px; line-height: 1; }
.bas-modal-card h3 { font-size: 26px; font-weight: 800; color: #000; margin: 12px 0 6px; }
.bas-modal-card p { font-size: 16px; color: #333; margin: 0; }
.bas-modal-star { font-size: 44px; margin: 14px 0 4px; animation: basStar .8s cubic-bezier(.34, 1.56, .64, 1); display: inline-block; }
.bas-modal-btns { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
.bas-btn { border: none; cursor: pointer; font-family: inherit; font-size: 16px; font-weight: 700; border-radius: 999px; padding: 12px 20px; transition: transform .15s, box-shadow .15s; }
.bas-btn.primary { background: linear-gradient(135deg, #ff8a4c, #ff6b35); color: #fff; box-shadow: 0 5px 16px rgba(255, 107, 53, .30); }
.bas-btn.primary:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(255, 107, 53, .38); }
.bas-btn.ghost { background: #fff; color: #333; border: 1.5px solid #e2e8f0; }
.bas-btn.ghost:hover { border-color: #ffb28a; color: #ff6b35; }
@keyframes basFade { from { opacity: 0; } }
@keyframes basPop { from { opacity: 0; transform: scale(.82); } }
@keyframes basStar { 0% { transform: scale(0) rotate(-30deg); } 60% { transform: scale(1.25) rotate(8deg); } 100% { transform: scale(1) rotate(0); } }

/* —— 图解放大灯箱 —— */
.bas-lightbox { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 95; background: rgba(23, 32, 46, .72); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; cursor: zoom-out; animation: basFade .2s; padding: calc(var(--vhpx, 1vh) * 4) calc(var(--vwpx, 1vw) * 4); }
.bas-lightbox-inner { width: min(880px, calc(var(--vwpx, 1vw) * 92)); background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 20px 60px rgba(0, 0, 0, .35); }
.bas-lightbox-inner svg { display: block; width: 100%; height: auto; }
.bas-zoom-img { display: block; width: 100%; height: auto; max-height: calc(var(--vhpx, 1vh) * 78); object-fit: contain; }
.bas-lightbox-tip { font-size: 12.5px; color: rgba(255, 255, 255, .75); }

/* —— 响应式 —— */
@media (max-width: 900px) {
  .bas-units { grid-template-columns: 1fr; }
  .bas-course-grid { grid-template-columns: 1fr; }
  .bas-progress { flex-wrap: wrap; }
}



/* ===== 触屏 + 大屏增强 ===== */
@media (pointer: coarse) {
  * { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
  a, button, [role=button], .clickable { -webkit-touch-callout: none; user-select: none; }
  button, .btn, .btn-coze, .tb, .stu-btn, body.is-teacher .stu-btn, body.is-teacher .kpi-tab { min-height: 44px !important; padding: 10px 18px !important; font-size: 15px !important; }
  button:hover, .btn:hover, .stu-btn:hover { transform: none !important; box-shadow: none !important; }
  button:active, .btn:active, .stu-btn:active { transform: scale(0.97) !important; background: rgba(0,0,0,0.05) !important; }
  input, select, textarea { min-height: 44px !important; font-size: 16px !important; }
  body.is-teacher .sidebar { width: 280px !important; }
  body.is-teacher .sidebar-item { min-height: 56px !important; font-size: 16px !important; padding: 14px 16px !important; }
  body.is-teacher .main-topbar { min-height: 72px !important; }
  body.is-teacher table th, body.is-teacher table td { padding: 14px 16px !important; min-height: 48px !important; font-size: 15px !important; }
  body.is-teacher .modal, body.is-teacher .confirm-modal { min-width: 480px !important; padding: 32px !important; }
  body.is-teacher .modal h2, body.is-teacher .confirm-modal h2 { font-size: 22px !important; margin-bottom: 18px !important; }
  body.is-teacher .tag, body.is-teacher .state-tag { min-height: 44px !important; padding: 10px 18px !important; font-size: 15px !important; }
  body.is-teacher .stu-ops { gap: 10px !important; }
  body.is-teacher .kpi { padding: 20px 24px !important; min-height: 96px !important; }
  body.is-teacher .kpi .v { font-size: 32px !important; }
  body.is-teacher .cls-stat-tag { min-height: 44px !important; padding: 10px 22px !important; font-size: 15px !important; }
  body:not(.is-teacher) .book-emoji { font-size: 72px !important; }
  body:not(.is-teacher) .book-name { font-size: 36px !important; letter-spacing: 3px !important; }
  /* 阳光班级卡保持紧凑字号（覆盖上面的放大规则） */
  body:not(.is-teacher) .book-card.class-card-16 .book-emoji { font-size: 22px !important; }
  body:not(.is-teacher) .book-card.class-card-16 .book-name { font-size: 17px !important; letter-spacing: 0.5px !important; }
  body:not(.is-teacher) .book-card.class-card-16 .book-tag { font-size: 10.5px !important; padding: 2px 8px !important; }
  body:not(.is-teacher) .unit-grid { gap: 36px 64px !important; padding: 40px 60px !important; }
}

/* ==================================================================
   软件实训 v2 —— 高仿真窗口（Office / Scratch / IDLE）
   ================================================================== */
.sim-office-win, .sc-win, .py-win {
  flex: 1; display: flex; flex-direction: column; min-height: 0; overflow: hidden;
  background: #f5f6fa; border: 1px solid #e2e8f0; border-radius: 14px;
  box-shadow: 0 10px 32px rgba(40, 60, 90, .16);
}
/* —— 标题栏 —— */
.ow-titlebar {
  flex: 0 0 40px; display: flex; align-items: center; gap: 8px; padding: 0 14px;
  background: linear-gradient(180deg, #fff, #f1f3f8); border-bottom: 1px solid #e2e8f0;
  font-size: 16px; color: #333; user-select: none;
}
.ow-ico { font-size: 19px; font-weight: 800; }
.ow-titlebar b { font-size: 16px; color: #000; font-weight: 700; }
.ow-sub { font-size: 14px; color: #666; }
.ow-dots { margin-left: auto; display: flex; gap: 6px; }
.ow-dots i { width: 11px; height: 11px; border-radius: 50%; background: #e2e8f0; }
.ow-dots i:nth-child(1) { background: #fc8181; }
.ow-dots i:nth-child(2) { background: #f6e05e; }
.ow-dots i:nth-child(3) { background: #68d391; }
/* —— 功能区 Ribbon —— */
.ow-ribbon { flex: 0 0 auto; background: #fff; border-bottom: 1px solid #e2e8f0; }
.rb-tabs { display: flex; gap: 2px; padding: 5px 10px 0; background: #f5f6fa; }
.rb-tab { padding: 5px 15px; font-size: 15px; font-weight: 600; color: #666; cursor: pointer; border-radius: 8px 8px 0 0; transition: color .15s; }
.rb-tab:hover { color: #000; }
.rb-tab.on { background: #fff; color: #2b579a; }
.sim-office-win.xl .rb-tab.on { color: #217346; }
.sim-office-win.ppt .rb-tab.on { color: #d24726; }
.rb-body { display: flex; align-items: stretch; gap: 8px; padding: 8px 14px 10px; min-height: 66px; flex-wrap: wrap; }
.rb-group { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 0 4px; }
.rb-gname { font-size: 13px; color: #666; white-space: nowrap; }
.rb-btn {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  min-width: 54px; padding: 5px 9px; border: none; background: transparent; border-radius: 8px;
  cursor: pointer; font-family: inherit; transition: background .15s;
}
.rb-btn i { font-style: normal; font-size: 22px; line-height: 1.2; }
.rb-btn span { font-size: 13px; color: #333; white-space: nowrap; }
.rb-btn:hover { background: #eef4fd; }
.rb-btn.hot { animation: sim-pulse 1.2s infinite; background: #fff7ed; box-shadow: 0 0 0 3px rgba(255, 107, 53, .3); }
.rb-btn.hit { background: #c6f6d5; }
.rb-btn.shake { animation: sim-shake .4s; }
.rb-btn.armed { background: #fff7ed; box-shadow: 0 0 0 2px #ff6b35 inset; }
.rb-sep { width: 1px; background: #e2e8f0; margin: 2px 0; }
.bi-b { font-weight: 900; font-family: Georgia, serif; font-size: 17px; color: #2d3748; }
.bi-c { color: #e74c3c; font-weight: 800; font-family: Georgia, serif; font-size: 16px; }
.bi-s { color: #2b6cb0; font-weight: 800; font-family: Georgia, serif; font-size: 16px; }
.rb-ddwrap { position: relative; }
.rb-ddmenu {
  position: absolute; top: calc(100% + 4px); left: 0; z-index: 40; min-width: 158px;
  background: #fff; border: 1px solid #e2e8f0; border-radius: 10px;
  box-shadow: 0 10px 28px rgba(40, 60, 90, .2); padding: 6px;
}
.rb-dditem { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 10px; border: none; background: transparent; border-radius: 7px; font-size: 15px; font-family: inherit; cursor: pointer; color: #333; }
.rb-dditem:hover { background: #f7fafc; }
.rb-dditem.hot { animation: sim-pulse 1.2s infinite; box-shadow: 0 0 0 3px rgba(255, 107, 53, .3); border-radius: 7px; }
.dd-thumb { flex: 0 0 40px; height: 26px; border: 1px solid #cbd5e0; border-radius: 3px; background: #fff; position: relative; }
.dd-thumb.title::after { content: ''; position: absolute; left: 5px; right: 5px; top: 7px; height: 5px; background: #cbd5e0; border-radius: 1px; }
/* —— 主体 / 状态栏 —— */
.sim-office-win .ow-body, .py-body { align-items: stretch; justify-content: flex-start; }
.ow-body { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: auto; padding: 14px; }
.ow-status { flex: 0 0 28px; display: flex; align-items: center; gap: 20px; padding: 0 14px; background: #fff; border-top: 1px solid #e2e8f0; font-size: 14px; color: #666; user-select: none; }
.ow-saved.unsaved { color: #dd6b20; font-weight: 700; }
/* —— Word —— */
.ow-ruler { width: 100%; max-width: 720px; height: 15px; border-radius: 3px; margin: 0 auto 8px; opacity: .75;
  background: repeating-linear-gradient(90deg, #e2e8f0 0 1px, transparent 1px 24px); }
.sim-office-win .sim-doc { margin: 0 auto; }
.sim-doc-p { text-indent: 2em; margin-bottom: 10px; }
.sim-doc-title.w-sel { background: rgba(43, 108, 176, .18); border-radius: 3px; }
.sim-doc-title.w-bold { font-weight: 800; }
.sim-doc-title.w-center { text-align: center; }
.sim-doc-title.w-color { color: #e74c3c; }
.sim-doc-title.w-size { font-size: 30px; }
/* —— Excel —— */
.xl-fbar { flex: 0 0 34px; display: flex; align-items: center; background: #fff; border-bottom: 1px solid #e2e8f0; padding: 0 10px; gap: 0; }
.xl-namebox { width: 70px; height: 22px; display: flex; align-items: center; justify-content: center; border: 1px solid #cbd5e0; border-radius: 4px; font-size: 14px; color: #333; background: #fff; }
.xl-fx { padding: 0 9px; font-style: italic; font-weight: 700; color: #666; font-size: 15px; }
.xl-finput { flex: 1; height: 22px; border: 1px solid #cbd5e0; border-radius: 4px; padding: 0 8px; font-size: 15px; font-family: inherit; outline: none; color: #000; }
.xl-finput:focus { border-color: #217346; }
.sim-office-win.xl .ow-body { padding: 12px; align-items: stretch; }
.sim-office-win.xl .sim-xlsheet { max-width: 460px; }
.sim-xlcell { user-select: none; cursor: cell; }
.sim-xlcell.sel { box-shadow: inset 0 0 0 2px #217346; background: #e6f4ea; }
.sim-xlcell.ranged { background: #e8f1fd; }
.sim-xlcell.colsel { background: #d7e5f9; }
.sim-xlcell.colh.colsel { background: #217346; color: #fff; }
.sim-xlcell.hot { animation: sim-pulse 1.2s infinite; box-shadow: inset 0 0 0 2px #ff6b35; }
.sim-office-win.xl .sim-chart { cursor: pointer; transition: transform .15s, box-shadow .15s; }
.sim-office-win.xl .sim-chart:hover { transform: translateY(-2px); box-shadow: 0 8px 26px rgba(40, 60, 90, .2); }
.sim-office-win.xl .sim-chart.hot { animation: sim-pulse 1.2s infinite; }
.xl-sheet-tab { border: 1px solid #cbd5e0; border-bottom: none; border-radius: 7px 7px 0 0; background: #fff; font-size: 14px; padding: 3px 12px; cursor: pointer; color: #217346; font-weight: 600; font-family: inherit; }
.xl-plus { color: #718096; }
/* —— PowerPoint —— */
.ppt-body { flex: 1; min-height: 0; display: flex; gap: 12px; padding: 12px; background: #f5f6fa; }
.ppt-left { flex: 0 0 104px; display: flex; flex-direction: column; gap: 8px; overflow: auto; }
.ppt-thumb { display: flex; align-items: center; gap: 6px; padding: 6px; background: #fff; border: 2px solid #e2e8f0; border-radius: 9px; cursor: pointer; transition: border-color .15s, transform .15s; }
.ppt-thumb:hover { transform: translateX(2px); }
.ppt-thumb.active { border-color: #d24726; box-shadow: 0 3px 10px rgba(210, 71, 38, .2); }
.ppt-thumb.hot, .ppt-thumb.active.hot { animation: sim-pulse 1.2s infinite; }
.pt-no { font-size: 11px; color: #718096; font-weight: 700; }
.pt-mini { flex: 1; height: 44px; background: #fff; border: 1px solid #e2e8f0; border-radius: 4px; position: relative; overflow: hidden; }
.pt-mini.title::after { content: ''; position: absolute; left: 10%; top: 24%; width: 80%; height: 7px; background: #cbd5e0; border-radius: 2px; }
.ppt-thumb-info { font-size: 10.5px; color: #a0aec0; text-align: center; }
.ppt-stage-wrap { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ppt-stage { position: relative; flex: 1; min-height: 260px; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; overflow: hidden; }
.ppt-stage-wrap.crosshair .ppt-stage { cursor: crosshair; }
.ppt-stage.hot { animation: sim-pulse 1.2s infinite; }
.ppt-ph { position: absolute; left: 8%; right: 8%; top: 38%; padding: 14px 10px; border: 1.5px dashed #cbd5e0; border-radius: 5px; color: #a0aec0; font-size: 13.5px; text-align: center; }
.ppt-ph.title-ph { top: 16%; font-size: 19px; padding: 20px 10px; }
.ppt-it-text { position: absolute; min-width: 130px; padding: 7px 12px; border: 1.5px dashed #90cdf4; border-radius: 5px; font-size: 17px; font-weight: 700; color: #2d3748; outline: none; background: rgba(255, 255, 255, .65); }
.ppt-it-img { position: absolute; font-size: 54px; line-height: 1.2; filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .18)); transition: transform .25s ease; }
.ppt-handle { position: absolute; right: -8px; bottom: -8px; width: 13px; height: 13px; border-radius: 50%; background: #fff; border: 2px solid #d24726; cursor: nwse-resize; }
.ppt-handle.hot { animation: sim-pulse 1.2s infinite; }
.ppt-playpage { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #0d1120; }
.ppt-playpage .ppt-it-text { border: none; background: transparent; color: #fff; }
.ppt-playpage .ppt-it-img { filter: drop-shadow(0 4px 14px rgba(0, 0, 0, .5)); }
.ppt-play-empty { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center; color: rgba(255, 255, 255, .55); font-size: 15px; }
.ppt-play-no { position: absolute; right: 14px; bottom: 10px; color: rgba(255, 255, 255, .55); font-size: 11.5px; }
.ppt-arm-tip { font-size: 11.5px; color: #d24726; font-weight: 700; }
/* —— Scratch —— */
.sc-main { flex: 1; min-height: 0; display: flex; gap: 10px; padding: 10px; background: #eceff5; }
.sc-left { flex: 0 0 216px; display: flex; flex-direction: column; gap: 8px; min-height: 0; }
.sc-cats { flex: 0 0 auto; display: flex; flex-direction: column; gap: 2px; background: #fff; border-radius: 11px; padding: 8px; }
.sc-cat { display: flex; align-items: center; gap: 9px; padding: 7px 11px; border: none; background: transparent; border-radius: 8px; font-size: 12.5px; font-family: inherit; color: #5c6b7a; cursor: pointer; font-weight: 700; text-align: left; transition: background .15s, color .15s; }
.sc-cat:hover { background: #f1f5f9; }
.sc-cat.on { color: #fff; }
.sc-cat-dot { width: 11px; height: 11px; border-radius: 50%; flex: 0 0 11px; }
.sc-palette { flex: 1; min-height: 0; overflow: auto; background: #fff; border-radius: 11px; padding: 12px; display: flex; flex-direction: column; gap: 7px; align-items: flex-start; }
.sc-block { position: relative; display: inline-flex; align-items: center; gap: 5px; width: fit-content; color: #fff; font-size: 12px; font-weight: 700; padding: 8px 13px; border-radius: 7px; cursor: pointer; border: none; font-family: inherit; text-align: left; box-shadow: 0 1px 2px rgba(30, 50, 80, .25); transition: filter .12s; }
.sc-block:hover { filter: brightness(1.06); }
.sc-block.hat { border-radius: 16px 16px 7px 7px; padding-top: 9px; }
.sc-block.hot { animation: sim-pulse 1.2s infinite; box-shadow: 0 0 0 3px rgba(255, 107, 53, .45); }
.sc-num { background: #fff; color: #2d3748; border-radius: 10px; padding: 1px 8px; font-weight: 800; min-width: 26px; text-align: center; font-size: 11.5px; }
.sc-num.editable { cursor: pointer; }
.sc-num.editable:hover { box-shadow: 0 0 0 2px #ff6b35; }
.sc-unit { opacity: .95; }
.sc-txt { background: rgba(255, 255, 255, .25); border-radius: 10px; padding: 1px 8px; }
.sc-del { position: absolute; right: -8px; top: -8px; width: 19px; height: 19px; border-radius: 50%; background: #e53e3e; color: #fff; font-size: 10px; border: 2px solid #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; line-height: 1; }
.sc-code { flex: 1; min-width: 0; min-height: 0; overflow: auto; border-radius: 11px; padding: 16px; display: flex; flex-direction: column; align-items: flex-start; gap: 3px;
  background-color: #f7f9fc; background-image: radial-gradient(#dde5ee 1px, transparent 1px); background-size: 19px 19px; }
.sc-code-empty { color: #a0aec0; font-size: 12.5px; margin: auto; text-align: center; line-height: 2; }
.sc-run-hint { font-size: 11px; color: #a0aec0; margin-top: 10px; }
.sc-right { flex: 0 0 252px; display: flex; flex-direction: column; gap: 8px; min-height: 0; }
.sc-stage-top { display: flex; gap: 7px; }
.sc-flag, .sc-stopbtn { width: 36px; height: 31px; border-radius: 9px; border: none; cursor: pointer; font-size: 15px; background: #fff; box-shadow: 0 1px 4px rgba(40, 60, 90, .18); transition: transform .12s; }
.sc-flag:hover, .sc-stopbtn:hover { transform: translateY(-1px); }
.sc-flag.hot, .sc-stopbtn.hot { animation: sim-pulse 1.2s infinite; }
.sc-stage { position: relative; flex: 1; min-height: 215px; border-radius: 11px; overflow: hidden; border: 2px solid #fff; box-shadow: 0 2px 10px rgba(40, 60, 90, .15); }
.sc-bg0 { background: #fff; }
.sc-bg1 { background: linear-gradient(180deg, #bfe3ff 55%, #d9f0d3 55%); }
.sc-bg2 { background: linear-gradient(180deg, #ffd9a8 62%, #ffeccb 62%); }
.sc-stage.hot { animation: sim-pulse 1.2s infinite; }
.sc-sprite { position: absolute; left: 50%; top: 50%; width: 92px; height: 92px; margin: -46px 0 0 -46px; transition: transform .45s ease; }
.sc-cat-svg { width: 100%; height: 100%; }
.sc-dog { position: absolute; right: 11%; bottom: 9%; font-size: 46px; filter: drop-shadow(0 2px 5px rgba(0, 0, 0, .15)); }
.sc-bubble { position: absolute; left: calc(50% + 34px); top: calc(50% - 64px); background: #fff; border: 1.5px solid rgba(45, 55, 72, .25); border-radius: 13px; padding: 5px 13px; font-size: 13px; font-weight: 700; color: #2d3748; transition: transform .45s ease; box-shadow: 0 2px 8px rgba(40, 60, 90, .12); white-space: nowrap; }
.sc-bubble::after { content: ''; position: absolute; left: -7px; top: 62%; border: 7px solid transparent; border-right-color: #fff; }
.sc-sprites { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; background: #fff; border-radius: 11px; padding: 9px; flex-wrap: wrap; }
.sc-sprite-chip { display: flex; flex-direction: column; align-items: center; gap: 2px; border: 2px solid transparent; border-radius: 9px; padding: 4px 9px; font-size: 10.5px; color: #5c6b7a; cursor: default; }
.sc-sprite-chip.on { border-color: #4d97ff; background: #f0f6ff; }
.sc-chip-svg { width: 34px; height: 34px; }
.sc-chip-emoji { font-size: 27px; line-height: 34px; }
.sc-add-sprite, .sc-add-bg { width: 38px; height: 38px; border-radius: 50%; border: none; background: #4d97ff; color: #fff; font-size: 16px; cursor: pointer; box-shadow: 0 2px 6px rgba(77, 151, 255, .35); transition: transform .12s; }
.sc-add-bg { background: #9966ff; box-shadow: 0 2px 6px rgba(153, 102, 255, .35); }
.sc-add-sprite:hover, .sc-add-bg:hover { transform: scale(1.08); }
.sc-add-sprite.hot, .sc-add-bg.hot { animation: sim-pulse 1.2s infinite; }
/* —— Python IDLE —— */
.py-menubar { flex: 0 0 30px; display: flex; align-items: center; gap: 15px; padding: 0 12px; background: #ececec; border-bottom: 1px solid #d9d9d9; font-size: 12px; color: #444; user-select: none; }
.py-menubar span { padding: 2px 3px; }
.py-toolbar { flex: 0 0 42px; display: flex; align-items: center; gap: 6px; padding: 0 10px; background: #fff; border-bottom: 1px solid #e2e8f0; }
.py-tb { width: 33px; height: 29px; border: none; background: #f1f3f6; border-radius: 7px; font-size: 14px; cursor: pointer; transition: background .15s; }
.py-tb:hover { background: #e2e8f0; }
.py-tb.hot { animation: sim-pulse 1.2s infinite; }
.py-tb.run { width: auto; padding: 0 14px; background: #0f9d58; color: #fff; font-weight: 800; font-size: 12.5px; }
.py-tb.run:hover { background: #0b8045; }
.py-tb-sep { width: 1px; height: 20px; background: #e2e8f0; margin: 0 4px; }
.py-body { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 10px; padding: 12px; overflow: hidden; }
.py-body .sim-editor { border: 1px solid #e2e8f0; box-shadow: none; border-radius: 10px; }
.py-body .sim-shell { box-shadow: none; border-radius: 10px; }
/* —— 通用保存对话框 —— */
.sim-savedlg-mask { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 60; background: rgba(20, 30, 50, .38); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(1.5px); }
.sim-savedlg { width: 330px; background: #fff; border-radius: 13px; box-shadow: 0 18px 50px rgba(20, 30, 50, .3); padding: 18px 20px; }
.sd-title { font-size: 14px; font-weight: 800; color: #2d3748; margin-bottom: 14px; }
.sd-row { display: flex; align-items: center; gap: 10px; margin-bottom: 11px; }
.sd-row label { flex: 0 0 62px; font-size: 12px; color: #718096; text-align: right; }
.sd-row input { flex: 1; height: 30px; border: 1px solid #cbd5e0; border-radius: 7px; padding: 0 10px; font-size: 12.5px; font-family: inherit; outline: none; color: #2d3748; }
.sd-row input:focus { border-color: #4299e1; box-shadow: 0 0 0 3px rgba(66, 153, 225, .15); }
.sd-row input.sd-type { background: #f7fafc; color: #718096; }
.sd-btns { display: flex; justify-content: flex-end; gap: 9px; margin-top: 15px; }
.sd-cancel, .sd-ok { height: 32px; padding: 0 20px; border-radius: 8px; font-size: 12.5px; font-weight: 700; cursor: pointer; font-family: inherit; border: 1px solid #cbd5e0; background: #fff; color: #4a5568; }
.sd-ok { background: #2b579a; border-color: #2b579a; color: #fff; }
.sd-ok.hot { animation: sim-pulse 1.2s infinite; }
/* —— 高亮呼吸动画（v2 复用） —— */
@keyframes sim-pulse { 0%, 100% { box-shadow: 0 0 0 3px rgba(255, 107, 53, .3); } 50% { box-shadow: 0 0 0 6px rgba(255, 107, 53, .12); } }
.sim-app-col { position: relative; }

/* ===========================================================
 * 登录页 v3 · 双栏品牌式（2026-09-04）
 * 左栏：品牌区（字标 + 大标题 + 主视觉插画 + 数据亮点 + 底部标语）
 * 右栏：三步登录玻璃卡（步骤条 + 舞台 + 按钮）
 * 延续 v2 深空背景 / 透视网格 / 星点闪烁，仅重构布局与入场动画
 * =========================================================== */

/* —— 1. 双栏骨架 —— */
.login-page .login-split {
  max-width: 2300px;
  min-height: calc(calc(var(--vhpx, 1vh) * 100) - 28px);
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(26px, calc(var(--vwpx, 1vw) * 3.6), 60px);
  align-items: stretch;
  padding: clamp(18px, calc(var(--vhpx, 1vh) * 3), 40px) clamp(22px, calc(var(--vwpx, 1vw) * 4), 56px) clamp(16px, calc(var(--vhpx, 1vh) * 2.6), 30px);
}

/* 左栏：品牌（左侧滑入） */
.login-page .login-brand {
  display: flex; flex-direction: column;
  min-width: 0; text-align: left;
  animation: v3BrandIn .7s cubic-bezier(.22, .8, .32, 1) both;
}
@keyframes v3BrandIn {
  from { opacity: 0; transform: translateX(-30px); }
  to { opacity: 1; transform: none; }
}

/* 右栏：登录卡（右侧滑入，轻微延迟） */
.login-page .login-panel {
  display: flex; flex-direction: column; justify-content: center;
  min-width: 0; min-height: 0;
  animation: v3PanelIn .7s .12s cubic-bezier(.22, .8, .32, 1) both;
}
@keyframes v3PanelIn {
  from { opacity: 0; transform: translateX(30px); }
  to { opacity: 1; transform: none; }
}

/* —— 2. 品牌字标行：徽标 + 平台名 —— */
.login-page .brand-head {
  display: flex; align-items: center; gap: 15px;
  margin-bottom: clamp(12px, calc(var(--vhpx, 1vh) * 2.2), 22px);
}
.login-page .login-brand .login-logo { margin-bottom: 0; }
.login-page .login-brand .login-logo svg {
  width: clamp(44px, calc(var(--vhpx, 1vh) * 5.8), 58px); height: clamp(44px, calc(var(--vhpx, 1vh) * 5.8), 58px);
}
.login-page .brand-wordmark { min-width: 0; }
.login-page .brand-wordmark .bw-title {
  font-size: clamp(19px, calc(var(--vhpx, 1vh) * 2.6), 25px); font-weight: 800;
  color: #EAF2FF; letter-spacing: 0.5px; white-space: nowrap;
}
.login-page .brand-wordmark .bw-sub {
  font-size: clamp(12px, calc(var(--vhpx, 1vh) * 1.7), 14.5px); color: rgba(200, 214, 255, 0.62);
  margin-top: 3px; letter-spacing: 1.5px; white-space: nowrap;
}

/* —— 3. 大标题 + 口号（左对齐，更大更稳） —— */
.login-page .login-brand .big-title {
  text-align: left; white-space: nowrap;
  font-size: clamp(32px, calc(var(--vhpx, 1vh) * 5.4), 54px);
  letter-spacing: clamp(2px, calc(var(--vwpx, 1vw) * 0.45), 6px);
  margin: 2px 0 clamp(6px, calc(var(--vhpx, 1vh) * 1.2), 12px);
}
.login-page .brand-slogan {
  color: rgba(214, 226, 255, 0.72);
  font-size: clamp(13.5px, calc(var(--vhpx, 1vh) * 1.9), 17px);
  letter-spacing: 1px;
  margin-bottom: clamp(10px, calc(var(--vhpx, 1vh) * 2), 18px);
}

/* —— 4. 主视觉插画：取景窗式发光相框 —— */
.login-page .brand-hero {
  position: relative;
  flex: 1 1 200px; min-height: 130px;
  border-radius: 22px; overflow: hidden;
  border: 1px solid rgba(120, 170, 255, 0.24);
  box-shadow: 0 26px 60px -24px rgba(4, 10, 36, 0.9), inset 0 1px 0 rgba(255, 255, 255, 0.10);
  background: linear-gradient(160deg, rgba(20, 32, 74, 0.6), rgba(30, 44, 100, 0.35));
}
.login-page .brand-hero img {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 32%;
  animation: v3HeroIn 1s .2s cubic-bezier(.22, .8, .32, 1) backwards;
}
@keyframes v3HeroIn {
  from { opacity: 0; transform: scale(1.06); }
  to { opacity: 1; transform: scale(1); }
}
/* 上下渐隐压暗，与深空背景融合 */
.login-page .brand-hero::after {
  content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none;
  background: linear-gradient(180deg,
    rgba(26, 37, 80, 0.30) 0%, rgba(26, 37, 80, 0) 26%,
    rgba(26, 37, 80, 0) 62%, rgba(24, 34, 76, 0.55) 100%);
}

/* —— 5. 数据亮点：四枚玻璃胶囊 —— */
.login-page .brand-stats {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: clamp(8px, calc(var(--vwpx, 1vw) * 1), 14px);
  margin-top: clamp(12px, calc(var(--vhpx, 1vh) * 2.2), 20px);
}
.login-page .bs-chip {
  display: flex; flex-direction: column; align-items: center; gap: 1px;
  padding: clamp(8px, calc(var(--vhpx, 1vh) * 1.6), 15px) 6px;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(160, 190, 255, 0.18);
  border-radius: 15px;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  animation: v3ChipIn .55s cubic-bezier(.34, 1.35, .44, 1) backwards;
}
.login-page .bs-chip:nth-child(1) { animation-delay: .34s; }
.login-page .bs-chip:nth-child(2) { animation-delay: .42s; }
.login-page .bs-chip:nth-child(3) { animation-delay: .50s; }
.login-page .bs-chip:nth-child(4) { animation-delay: .58s; }
@keyframes v3ChipIn {
  from { opacity: 0; transform: translateY(16px) scale(.92); }
  to { opacity: 1; transform: none; }
}
.login-page .bs-num {
  font-size: clamp(22px, calc(var(--vhpx, 1vh) * 3.4), 33px); font-weight: 900; line-height: 1.15;
  background: linear-gradient(120deg, #7FE7FF, #8F9FFF);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.login-page .bs-lbl {
  font-size: clamp(11.5px, calc(var(--vhpx, 1vh) * 1.6), 14.5px);
  color: rgba(200, 214, 255, 0.72); letter-spacing: 2px;
}

/* —— 6. 品牌栏底部：标语 + 教师通道（贴底） —— */
.login-page .login-brand .login-footer {
  margin-top: auto; padding-top: clamp(10px, calc(var(--vhpx, 1vh) * 2), 18px);
  align-items: flex-start;
}
.login-page .login-brand .lf-teacher-row { justify-content: flex-start; margin-top: 8px; }
.login-page .login-brand .lf-info span:last-child {
  font-size: clamp(12px, calc(var(--vhpx, 1vh) * 1.7), 14.5px); letter-spacing: 1px;
}
.login-page .login-brand .lf-beian {
  position: fixed; left: 0; right: 0; bottom: 8px;
  justify-content: center; margin: 0; z-index: 60;
  pointer-events: auto;
}
.login-page .login-brand .lf-beian a { color: rgba(214,226,250,0.7); font-size: clamp(11px, calc(var(--vhpx, 1vh) * 1.5), 13px); }

/* —— 7. 右栏头部：欢迎语 + 日期胶囊（透明，清除旧弹窗组件白色底/边框） —— */
.login-page .panel-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-bottom: clamp(6px, calc(var(--vhpx, 1vh) * 1.2), 14px);
  background: transparent; border-bottom: none; padding: 0;
}
.login-page .ph-title {
  font-size: clamp(18px, calc(var(--vhpx, 1vh) * 2.7), 26px); font-weight: 800;
  color: #F2F6FF; letter-spacing: 1.5px; white-space: nowrap;
}
.login-page .ph-date {
  font-size: clamp(12px, calc(var(--vhpx, 1vh) * 1.7), 14.5px); color: rgba(200, 214, 255, 0.72);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(160, 190, 255, 0.2);
  padding: 4px 14px; border-radius: 999px; white-space: nowrap;
}

/* —— 8. 步骤条贴舞台（取消旧版自动下移） —— */
.login-page .login-panel .steps-bar { margin-top: 0; }

/* —— 9. 舞台内部自适应：右栏变窄后卡片更紧凑 —— */
/* 选册：两本书并列居中 */
.login-page .login-panel .book-grid { gap: clamp(20px, calc(var(--vwpx, 1vw) * 2.6), 36px); margin-bottom: clamp(12px, calc(var(--vhpx, 1vh) * 2), 20px); }
.login-page .login-panel .book-card.book-orange,
.login-page .login-panel .book-card.book-blue,
.login-page .login-panel .book-card.book-purple,
.login-page .login-panel .book-card.book-magenta {
  /* 360极速(Chromium 78/86)不支持 aspect-ratio(88+)，78 连 clamp(79+) 也不支持：
     width:auto 会让选册卡塌成底部文字的宽度、封面图 object-fit:cover 被裁成一竖条（"课本只显示一半"）。
     先用 calc(var(--vhpx)) 实值兜底（全内核支持），再用 clamp 覆盖（新内核严格同步比例）。
     四册卡统一 5:7 比例 */
  height: calc(var(--vhpx, 1vh) * 30);
  height: clamp(200px, calc(var(--vhpx, 1vh) * 30), 320px);
  width: calc(var(--vhpx, 1vh) * 30 * 5 / 7);
  width: calc(clamp(200px, calc(var(--vhpx, 1vh) * 30), 320px) * 5 / 7);
}
/* 选册两行分组：七年级上下册一行、人工智能上下册一行。
   每行固定不换行、居中；行间距略收紧，两行在视觉上自然成组（仅作用于登录选册，不影响地图书架） */
.login-page .login-panel .book-grid.login-book-row {
  flex-wrap: nowrap;
  margin-bottom: clamp(10px, calc(var(--vhpx, 1vh) * 1.6), 16px);
}
.login-page .login-panel .book-grid.login-book-row:last-child {
  margin-bottom: clamp(12px, calc(var(--vhpx, 1vh) * 2), 20px);
}
/* 选班：自适应列网格（班多时密排、班少时卡片自动加宽，不显空旷） */
.login-page .login-panel .class-grid-16 { grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 10px; max-width: none; }
.login-page .login-panel .book-card.class-card-16 { min-height: clamp(76px, calc(var(--vhpx, 1vh) * 11), 98px); padding: 9px 4px 8px; }
/* 选班卡 v4：大数字＋每班一色（班号%8 循环取色；数字一眼锁定，颜色圈定范围） */
.login-page .login-panel .book-card.class-card-16 .cls-num {
  display: flex; align-items: baseline; justify-content: center; gap: 3px;
  line-height: 1; margin-bottom: 6px;
}
.login-page .login-panel .book-card.class-card-16 .cls-code {
  font-size: clamp(24px, calc(var(--vhpx, 1vh) * 3.4), 32px); font-weight: 900; letter-spacing: 1px;
  color: var(--cc-ink, #7A4A12); font-variant-numeric: tabular-nums;
}
.login-page .login-panel .book-card.class-card-16 .cls-unit {
  font-size: clamp(13px, calc(var(--vhpx, 1vh) * 1.9), 17px); font-weight: 800; color: var(--cc-ink, #7A4A12);
}
/* 非数字班名兜底（如"英才班"）：退回普通字号整名显示 */
.login-page .login-panel .book-card.class-card-16 .cls-code.cls-code-txt {
  font-size: clamp(16px, calc(var(--vhpx, 1vh) * 2.4), 21px); letter-spacing: 0.5px;
}
.login-page .login-panel .book-card.class-card-16 .book-tag { color: var(--cc-tag, #8A5418); }

/* —— 8 色循环：2601→cc1 琥珀 … 2608→cc0 玫红，2609 起继续循环 —— */
.login-page .book-card.class-card-16.cc0 { background: linear-gradient(155deg, #FFE2DE 0%, #FFC5BE 48%, #FFB0A8 100%); border-color: rgba(255,235,232,0.95); --cc-ink: #99332A; --cc-tag: #A24A42; }
.login-page .book-card.class-card-16.cc1 { background: linear-gradient(155deg, #FFF1C6 0%, #FFDA8E 48%, #FFC86E 100%); border-color: rgba(255,246,218,0.95); --cc-ink: #7A4A00; --cc-tag: #8A6520; }
.login-page .book-card.class-card-16.cc2 { background: linear-gradient(155deg, #E6F9D0 0%, #C6ED9F 48%, #ADE07F 100%); border-color: rgba(234,250,214,0.95); --cc-ink: #256B2E; --cc-tag: #3A7A42; }
.login-page .book-card.class-card-16.cc3 { background: linear-gradient(155deg, #DCEFFF 0%, #B4DBF9 48%, #97CCF2 100%); border-color: rgba(226,240,254,0.95); --cc-ink: #0E5A8A; --cc-tag: #2A6C93; }
.login-page .book-card.class-card-16.cc4 { background: linear-gradient(155deg, #FFE3EC 0%, #FFC6D6 48%, #FFB3C8 100%); border-color: rgba(255,233,240,0.95); --cc-ink: #99365C; --cc-tag: #A34E6E; }
.login-page .book-card.class-card-16.cc5 { background: linear-gradient(155deg, #ECE4FF 0%, #D5C6F6 48%, #C2AEF1 100%); border-color: rgba(240,234,254,0.95); --cc-ink: #55399B; --cc-tag: #6A52A8; }
.login-page .book-card.class-card-16.cc6 { background: linear-gradient(155deg, #FFE8D2 0%, #FFD2A6 48%, #FFC088 100%); border-color: rgba(255,238,220,0.95); --cc-ink: #94490E; --cc-tag: #A2622E; }
.login-page .book-card.class-card-16.cc7 { background: linear-gradient(155deg, #D6F4EE 0%, #AEE8DC 48%, #92DECD 100%); border-color: rgba(224,246,241,0.95); --cc-ink: #0E6B5C; --cc-tag: #2A7A6D; }

/* 角落反光与悬停/选中：中性白光，适配所有班色 */
.login-page .login-panel .book-card.class-card-16::after {
  background: radial-gradient(circle, rgba(255,255,255,0.38) 0%, rgba(255,255,255,0) 70%);
}
.login-page .login-panel .book-card.class-card-16:hover {
  transform: translateY(-4px) scale(1.03);
  border-color: #ffffff;
  box-shadow: 0 16px 32px -10px rgba(25,45,90,0.4), 0 0 20px rgba(255,255,255,0.4);
}
.login-page .login-panel .book-card.class-card-16.selected {
  transform: translateY(-4px) scale(1.04);
  border-color: #FFFFFF;
  filter: brightness(1.06) saturate(1.08);
  box-shadow: 0 0 0 3px rgba(255,255,255,0.75), 0 18px 36px -10px rgba(25,45,90,0.5), 0 0 26px rgba(255,255,255,0.5);
}
.login-page .login-panel .book-card.class-card-16.selected .book-tag {
  background: rgba(255,255,255,0.8); color: var(--cc-tag, #8A5418);
}
/* 选名：自动列数 + 尺寸随视口高度自适应（无滚动条，全班一页显示） */
.login-page .login-panel .avatar-grid {
  grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));
  gap: 7px; max-width: none; max-height: none; overflow: visible;
  padding: 4px 2px 4px;
}
.login-page .login-panel .avatar-card { padding: 6px 2px 5px; gap: 2px; border-radius: 10px; }
.login-page .login-panel .avatar-circle {
  width: clamp(34px, calc(var(--vhpx, 1vh) * 4.6), 44px); height: clamp(34px, calc(var(--vhpx, 1vh) * 4.6), 44px);
  font-size: clamp(15px, calc(var(--vhpx, 1vh) * 2), 19px);
}
.login-page .login-panel .avatar-name { font-size: clamp(11.5px, calc(var(--vhpx, 1vh) * 1.55), 13.5px); }
.login-page .login-panel .avatar-no { font-size: clamp(9px, calc(var(--vhpx, 1vh) * 1.25), 10.5px); }
/* 按钮区：步3与网格拉开一点距离 */
.login-page .login-panel .login-actions { margin-top: clamp(18px, calc(var(--vhpx, 1vh) * 3), 34px) !important; }

/* —— 10. 卡片入场：错峰弹出（backwards 不阻碍 hover 位移） —— */
.login-page .book-card,
.login-page .book-card.class-card-16,
.login-page .avatar-card {
  animation: v3CardPop .5s cubic-bezier(.34, 1.4, .44, 1) backwards;
}
.login-page .book-card { animation-delay: calc(.22s + var(--i, 0) * .09s); }
.login-page .book-card.class-card-16 { animation-delay: calc(.2s + var(--i, 0) * .035s); }
.login-page .avatar-card { animation-delay: calc(.18s + var(--i, 0) * .02s); }
@keyframes v3CardPop {
  from { opacity: 0; transform: translateY(14px) scale(.94); }
  to { opacity: 1; transform: none; }
}

/* —— 11. CTA 扫光 —— */
.login-page .btn-enter { position: relative; overflow: hidden; }
.login-page .btn-enter::after {
  content: ''; position: absolute; top: 0; bottom: 0; left: -70%;
  width: 45%; transform: skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.45), transparent);
  animation: v3Shine 3s 1s ease-in-out infinite;
  pointer-events: none;
}
@keyframes v3Shine {
  0%, 58% { left: -70%; }
  100% { left: 135%; }
}
.login-page .btn-enter:disabled::after { display: none; }

/* —— 11.5 登录拦截提示（教师未给本班开课时，点名字也进不去学习页面，2026-09-04） —— */
.login-page .login-panel .login-block-tip {
  margin: clamp(2px, calc(var(--vhpx, 1vh) * 0.6), 6px) auto 0;
  max-width: 620px;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: clamp(6px, calc(var(--vhpx, 1vh) * 1.2), 12px) 16px;
  border-radius: 12px;
  background: rgba(255, 107, 53, 0.12);
  border: 1.5px dashed rgba(255, 138, 96, 0.60);
  color: #FFC29E;
  font-size: clamp(12px, calc(var(--vhpx, 1vh) * 1.8), 14.5px); font-weight: 600; line-height: 1.5;
  text-align: center;
  animation: lbTipIn .28s ease both;
}
/* 放行提示（老师已开始上课）：绿色 */
.login-page .login-panel .login-block-tip.ok {
  background: rgba(63, 222, 160, 0.12);
  border: 1.5px solid rgba(63, 222, 160, 0.55);
  color: #7DEFB8;
}
@keyframes lbTipIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

/* —— 12. 窄屏回退：单栏纵排（隐藏插画保登录空间；小屏恢复自然高度与滚动） —— */
@media (max-width: 1180px) {
  .login-page { height: auto; min-height: calc(var(--vhpx, 1vh) * 100); overflow: visible; }
  .login-page .login-split {
    grid-template-columns: 1fr;
    max-width: 1080px; height: auto; min-height: 0;
    gap: 16px;
    padding-bottom: 96px;
  }
  .login-page .login-brand { align-items: center; text-align: center; animation: none; }
  .login-page .login-brand .brand-head { justify-content: center; }
  .login-page .login-brand .big-title { text-align: center; }
  .login-page .login-brand .brand-hero { display: none; }
  .login-page .login-brand .login-footer { display: none; }
  .login-page .login-brand .login-footer .lf-beian { display: flex; }
  .login-page .login-panel { animation: none; justify-content: flex-start; }
  .login-page .login-panel .login-stage { display: block; }
  .login-page .login-panel .avatar-grid { flex: none; max-height: none; overflow: visible; }
}

/* —— 13. 矮屏兜底（物理高度 ≤720px 的环境，如未走整站缩放）：隐藏面包屑、收紧间距 —— */
@media (max-height: 720px) {
  .login-page .login-panel .login-stage .login-crumb { display: none !important; }
  .login-page .panel-head { margin-bottom: 4px; }
  .login-page .login-panel .steps-bar { margin-bottom: 6px; padding-top: 8px; padding-bottom: 8px; }
  .login-page .login-panel .login-stage .prompt-q { margin-bottom: 6px !important; }
  .login-page .login-panel .login-block-tip { padding: 6px 14px; line-height: 1.4; }
}

/* ===========================================================
 * 学习地图 · 海平面世界（方案 A+C，2026-09-04）
 * 天空→海面纵向渐变；书架沉入海底色带：双层波浪顶边 + 全幅贴底收尾横幅
 * 兼容：不用 inset 简写 / color-mix，仅 rgba 与线性渐变（Chromium 69+ 可用）
 * =========================================================== */
.map-page {
  background: linear-gradient(180deg,
    #dceefe 0%,
    #d2e4fa 34%,
    #b8d6f3 58%,
    #9dbdee 80%,
    #8ab1e8 100%);
}

/* —— 书架 → 海底色带（收尾横幅，贴住页面底边） —— */
.bookshelf.bookshelf-sea {
  position: relative;
  width: 100%;
  max-width: none;
  margin-top: auto;        /* 保持贴底（抵消上方留白） */
  margin-right: -24px;     /* 抵消 map-page 左右 padding，色带全幅贴边 */
  margin-bottom: 0;        /* 贴住页面最底（map-page 底 padding 已为 0） */
  margin-left: -24px;
  padding: 10px 24px 12px;
  background: linear-gradient(180deg, #5b8ed2 0%, #4a7cc4 46%, #3a63a8 100%);
  border: none;
  border-radius: 0;
  box-shadow: 0 -18px 48px rgba(23, 45, 94, 0.22);
  flex-shrink: 0;
}
/* 双层波浪顶边：后浪浅 #7fa8dd + 前浪深 #5b8ed2（与色带顶部同色无缝衔接） */
.bookshelf.bookshelf-sea::before {
  content: '';
  position: absolute;
  top: -30px;
  right: 0;
  bottom: auto;
  left: 0;
  height: 30px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath fill='%237fa8dd' d='M0 30 C 120 10, 250 50, 390 36 C 530 22, 650 54, 800 40 C 950 26, 1070 52, 1210 36 C 1310 25, 1390 38, 1440 31 L1440 64 L0 64 Z'/%3E%3Cpath fill='%235b8ed2' d='M0 46 C 150 28, 300 60, 460 46 C 620 32, 760 62, 930 48 C 1100 34, 1250 58, 1440 42 L1440 64 L0 64 Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}
/* 头部文字白字化，适配深海底色 */
.bookshelf.bookshelf-sea .bookshelf-head { margin-bottom: 8px; }
.bookshelf.bookshelf-sea .bookshelf-tip { color: rgba(255, 255, 255, 0.88); }
.bookshelf.bookshelf-sea .bookshelf-tip b { color: #ffe3c2; }
/* 白卡片浮在海面上：加深投影增强悬浮感 */
.bookshelf.bookshelf-sea .shelf-card {
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(16, 38, 84, 0.32);
}
.bookshelf.bookshelf-sea .shelf-card:hover { box-shadow: 0 16px 34px rgba(16, 38, 84, 0.42); }
/* 当前册：恢复主题色渐变底，避免白底+白字不可见（优先级需高于上面的白卡规则） */
.bookshelf.bookshelf-sea .shelf-card.active {
  background: linear-gradient(180deg, var(--c) 0%, var(--c-light) 100%);
  border-color: var(--c);
  box-shadow: 0 14px 32px rgba(16, 38, 84, 0.45);
}
.bookshelf.bookshelf-sea .shelf-card.active .shelf-name,
.bookshelf.bookshelf-sea .shelf-card.active .shelf-tag-row,
.bookshelf.bookshelf-sea .shelf-card.active .shelf-emoji { color: #ffffff; }
.bookshelf.bookshelf-sea .shelf-card:not(.active) .shelf-name { color: var(--c); }
.bookshelf.bookshelf-sea .shelf-card:not(.active) .shelf-tag-row { color: #3d4d6e; }

/* 窄屏：跟随 map-page padding 12px 收窄负边距 */
@media (max-width: 760px) {
  .bookshelf.bookshelf-sea {
    margin-right: -12px;
    margin-bottom: 0;
    margin-left: -12px;
    padding: 8px 14px 10px;
  }
  .bookshelf.bookshelf-sea::before { top: -24px; height: 24px; }
}

/* ===========================================================
 * v91 沉浸式播放器（影院式设计优化）
 * 深色全屏影院 + 白色 16:9 幻灯片卡片 + 翻页动画 + 数字页码导航
 * =========================================================== */

/* —— 1. 影院容器：player 路由整页深色，纵向 flex 撑满 —— */
.main.player-main {
  display: flex; flex-direction: column;
  padding: 0; margin: 0; max-width: none;
  height: calc(var(--vhpx, 1vh) * 100); height: calc(var(--vhpx, 1vh) * 100);  /* 固定视口高度，防止内容撑高整页；calc(var(--vhpx, 1vh) * 100) 是动态视口回退 */
  overflow: hidden;               /* 外层不滚动，内部各自滚动 */
  background:
    radial-gradient(1100px 520px at 82% -8%, rgba(79,140,255,0.13), transparent 60%),
    radial-gradient(900px 460px at 6% 108%, rgba(255,107,53,0.10), transparent 55%),
    linear-gradient(180deg, #171d33 0%, #12172a 60%, #0e1322 100%);
}
.main.player-main .player {
  flex: 1; display: flex; flex-direction: column;
  width: 100%; min-height: 0; margin: 0;  /* min-height:0 允许 flex 子项压缩 */
}

/* —— 2. 顶栏：毛玻璃融入深色影院 —— */
.main.player-main .sl-topbar {
  margin: 0; position: sticky; top: 0; z-index: 50;
  background: rgba(14, 19, 36, 0.66);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

/* —— 3. 引领导航条：深色玻璃 + 数字页码胶囊 —— */
.main.player-main .guide-bar {
  display: flex; align-items: center; gap: 14px;
  background: rgba(255, 255, 255, 0.04);
  border: none; border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 0; padding: 10px 20px; margin: 0;
  box-shadow: none; flex-shrink: 0;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.main.player-main .guide-step { color: rgba(255, 255, 255, 0.72); font-size: 13px; flex-shrink: 0; }
.main.player-main .guide-dots {
  display: flex; align-items: center; gap: 6px; flex: 1; flex-wrap: nowrap;
  overflow-x: auto; padding: 3px 2px;
  scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 18px, #000 calc(100% - 18px), transparent);
  mask-image: linear-gradient(90deg, transparent, #000 18px, #000 calc(100% - 18px), transparent);
}
.main.player-main .guide-dots::-webkit-scrollbar { height: 4px; }
.main.player-main .guide-dots::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.22); border-radius: 2px; }
.main.player-main .gdot {
  min-width: 34px; height: 34px; padding: 0 7px; border-radius: 11px;
  background: rgba(255, 255, 255, 0.10); border: 1.5px solid transparent;
  color: rgba(255, 255, 255, 0.72); font-size: 13.5px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all .18s ease; flex-shrink: 0;
  font-variant-numeric: tabular-nums; line-height: 1;
}
.main.player-main .gdot:hover:not(.lock) { background: rgba(255, 255, 255, 0.22); color: #fff; transform: translateY(-1px); }
.main.player-main .gdot.work { background: rgba(255, 143, 94, 0.16); border-color: rgba(255, 178, 94, 0.55); color: #ffb25e; }
.main.player-main .gdot.done { background: rgba(52, 199, 148, 0.15); border-color: rgba(52, 199, 148, 0.45); color: #7fe6c0; }
.main.player-main .gdot.cur {
  background: var(--book-7a); border-color: rgba(255, 255, 255, 0.4); color: #fff;
  transform: scale(1.12); box-shadow: 0 3px 14px rgba(79, 140, 255, 0.55);
}
.main.player-main .gdot.cur.work { background: linear-gradient(135deg, #ff8a5c, #ff6b35); box-shadow: 0 3px 14px rgba(255, 107, 53, 0.55); }
.main.player-main .gdot.cur.done { background: var(--green); box-shadow: 0 3px 14px rgba(63, 174, 142, 0.5); }
.main.player-main .gdot.lock { opacity: 0.32; cursor: not-allowed; }

/* —— 4. 舞台：白色 16:9 幻灯片卡片（居中悬浮 · 内部滚动） —— */
/* [已整合到下方 line 8529 处，此处删除避免冲突] */
/* 输入框内文本仍可选中编辑 */
.main.player-main .player-stage textarea,
.main.player-main .player-stage input { user-select: text; -webkit-user-select: text; }
/* 舞台内滚动条美化 */
.main.player-main .player-stage::-webkit-scrollbar { width: 8px; }
.main.player-main .player-stage::-webkit-scrollbar-track { background: transparent; }
.main.player-main .player-stage::-webkit-scrollbar-thumb { background: rgba(30, 50, 90, 0.22); border-radius: 4px; }
.main.player-main .player-stage::-webkit-scrollbar-thumb:hover { background: rgba(30, 50, 90, 0.38); }

/* —— 5. 翻页动画：新页从右滑入（原版式 pvSlideIn） —— */
@keyframes pvSlideIn {
  0% { opacity: 0; transform: translateX(30px); }
  100% { opacity: 1; transform: none; }
}
.main.player-main .player-stage > div { animation: pvSlideIn .35s ease both; flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.main.player-main .player-stage > div > div:not(.slide-footer) { min-height: 100%; display: flex; flex-direction: column; justify-content: center; }

/* —— 6. 底栏：毛玻璃深色，固定影院底部 —— */
.main.player-main .sl-bottombar {
  margin: 0; flex-shrink: 0;
  background: rgba(10, 13, 24, 0.72);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

/* —— 7. 互动信息卡：fixed 悬浮于顶栏下方右侧（修复被sticky顶栏遮挡问题） —— */
.main.player-main .sl-interact-card {
  position: fixed;
  top: 74px; right: 28px;
  z-index: 90;
  width: 208px;
  background: #fff;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.45), 0 4px 12px rgba(0, 0, 0, 0.30);
  animation: pvCardIn .35s ease both;
}
@keyframes pvCardIn {
  0% { opacity: 0; transform: translateX(24px); }
  100% { opacity: 1; transform: none; }
}
/* "进入互动"悬浮按钮与信息卡同侧，避免重叠 */
.main.player-main .sl-enter-interact { right: 28px; bottom: 104px; }

/* —— 8. 辅助元素深色适配 —— */
/* 复习模式横幅 */
.main.player-main .review-strip {
  background: rgba(255, 196, 84, 0.10);
  border: 1px solid rgba(255, 196, 84, 0.35);
  color: #ffe9c2; border-radius: 0; margin: 0;
}
.main.player-main .review-strip .rs-text b { color: #ffd98f; }
/* 翻页阻断提示（先完成本页） */
.main.player-main .pager-hint {
  background: rgba(255, 107, 53, 0.14);
  border: 1px solid rgba(255, 107, 53, 0.42);
  color: #ffd9c4;
}
/* 课堂锁定遮罩下保持白卡聚焦（原样式已为深色遮罩，无需改动） */

/* —— 9. 窄屏适配：缩小舞台留白与胶囊 —— */
@media (max-width: 760px) {
  .main.player-main .player-stage {
    width: calc(100% - 20px);
    padding: 20px 22px;
    border-radius: 14px;
  }
  .main.player-main .gdot { min-width: 30px; height: 30px; font-size: 12.5px; border-radius: 9px; }
  .main.player-main .guide-bar { padding: 8px 12px; gap: 10px; }
}

/* ============================================================
   r67 影院式播放器改造：大舞台 / 全幅封面 / 左文右图 /
   视频不出框 / 右侧互动栏 / 数字页码底栏 / 进入互动开始卡
   ============================================================ */

/* —— 主体：舞台区 + 右侧互动栏 —— */
.main.player-main .player-body {
  flex: 1; display: flex; flex-direction: row;
  align-items: stretch; min-height: 0;
  padding: 12px 14px 4px; gap: 12px;
}
.main.player-main .stage-area {
  flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center;
  position: relative;
}

/* —— 舞台放大：严格 16:9，宽高双向适配，永远不变形不出框 —— */
/* 完整属性定义：兼顾现代浏览器 + 旧 Chromium（360极速等）兼容性 */
.main.player-main .player-stage {
  /* === 基础结构 === */
  display: flex;                       /* 内部 flex 布局 */
  flex-direction: column;
  width: 100%;
  margin: 0 auto;
  position: relative;

  /* === 尺寸约束：固定值兜底 + @supports 增强 === */
  /* 旧 Chromium (<88) 不支持 aspect-ratio/clamp 时，用明确值 */
  max-width: calc((calc(var(--vhpx, 1vh) * 100) - 168px) * 1.7778);
  height: calc(calc(var(--vhpx, 1vh) * 100) - 168px);         /* 固定高度兜底（360 旧内核） */
  max-height: calc(calc(var(--vhpx, 1vh) * 100) - 168px);
  min-height: 0;
  padding: 24px 32px;                  /* 固定 padding 兜底（clamp 不生效时） */

  /* === 视觉 === */
  background: #fff;
  border: none;
  border-radius: 18px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.50), 0 6px 20px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.8);

  /* === 滚动与溢出：关键！确保内容多时内部滚动，不截断 === */
  overflow-y: auto;
  overflow-x: hidden;

  /* === 文本选择 === */
  user-select: none; -webkit-user-select: none;
}

/* === aspect-ratio + clamp 增强 ===
   支持的浏览器（Chrome 88+/Edge 88+/360极速X/Chromium 88+）用更精确的自适应值 */
@supports (aspect-ratio: 16/9) and (font-size: clamp(12px, calc(var(--vwpx, 1vw) * 1), 20px)) {
  .main.player-main .player-stage {
    height: auto;                       /* 让 aspect-ratio 接管高度计算 */
    aspect-ratio: 16 / 9;              /* 严格 16:9 比例 */
    padding: clamp(16px, calc(var(--vhpx, 1vh) * 2.2), 30px) clamp(22px, calc(var(--vwpx, 1vw) * 2.6), 44px);  /* 动态 padding */
  }
}

/* —— 全幅封面：图片铺满 + 文字叠加（参照封面） —— */
/* 兜底值 + @supports clamp 增强 */
.cover-full { position: absolute; border-radius: 18px; overflow: hidden;
  top: -24px; bottom: -24px; left: -32px; right: -32px; }
@supports (font-size: clamp(12px, calc(var(--vwpx, 1vw) * 1), 20px)) {
  .cover-full {
    top: calc(clamp(16px, calc(var(--vhpx, 1vh) * 2.2), 30px) * -1); bottom: calc(clamp(16px, calc(var(--vhpx, 1vh) * 2.2), 30px) * -1);
    left: calc(clamp(22px, calc(var(--vwpx, 1vw) * 2.6), 44px) * -1); right: calc(clamp(22px, calc(var(--vwpx, 1vw) * 2.6), 44px) * -1);
  }
}
.cover-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.cover-mask { position: absolute; top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(180deg, rgba(10,16,32,.18) 0%, rgba(10,16,32,.10) 38%, rgba(10,16,32,.72) 78%, rgba(9,14,28,.9) 100%); }
.cover-content { position: absolute; left: 0; right: 0; bottom: 7%; text-align: center; color: #fff; padding: 0 7%; }
.cover-chip-top { display: inline-block; background: #ff6b35; color: #fff; font-weight: 700;
  font-size: clamp(13px, calc(var(--vwpx, 1vw) * 1.2), 17px); padding: 8px 24px; border-radius: 999px; margin-bottom: 16px;
  box-shadow: 0 6px 20px rgba(255,107,53,.45); letter-spacing: 1px; }
.cover-title-main { font-size: clamp(32px, calc(var(--vwpx, 1vw) * 4.2), 58px); font-weight: 800; letter-spacing: 4px;
  text-shadow: 0 4px 24px rgba(0,0,0,.55); line-height: 1.25; }
.cover-sub-main { font-size: clamp(13.5px, calc(var(--vwpx, 1vw) * 1.3), 18px); opacity: .94; margin-top: 14px;
  text-shadow: 0 2px 10px rgba(0,0,0,.5); }
.cover-content .cover-chips { margin-top: 20px; display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.cover-content .cover-chips span { background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.35);
  color: #fff; font-size: clamp(12px, calc(var(--vwpx, 1vw) * 1), 14.5px); font-weight: 600; padding: 7px 18px; border-radius: 999px;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }

/* —— 舞台基础字号放大 —— */
.main.player-main .player-stage .ptitle { font-size: clamp(22px, calc(var(--vwpx, 1vw) * 2), 30px); font-weight: 800; }
.main.player-main .player-stage .body { font-size: clamp(16px, calc(var(--vwpx, 1vw) * 1.25), 18.5px); }

/* —— 左文右图（twocol） —— */
.main.player-main .twocol-grid { grid-template-columns: 1fr 1.05fr; grid-template-rows: 1fr; gap: clamp(20px, calc(var(--vwpx, 1vw) * 3), 46px); align-items: stretch; flex: 1 1 auto; height: auto; min-height: 0; }
.main.player-main .twocol-txt { display: flex; flex-direction: column; justify-content: center; min-height: 0; }
.main.player-main .twocol-txt .ptitle { font-size: clamp(23px, calc(var(--vwpx, 1vw) * 2.2), 32px); margin-bottom: 14px; }
.main.player-main .twocol-lead { font-size: clamp(15px, calc(var(--vwpx, 1vw) * 1.3), 18.5px); line-height: 1.7; }
.main.player-main .twocol-points { gap: 6px; }
.main.player-main .twocol-points li { font-size: clamp(14.5px, calc(var(--vwpx, 1vw) * 1.2), 17.5px); line-height: 1.5; padding: 7px 14px 7px 42px; }
.main.player-main .twocol-points li::before { width: 20px; height: 20px; left: 10px; }
.main.player-main .twocol-points li::after { width: 20px; line-height: 20px; left: 10px; font-size: 11px; }
.main.player-main .twocol-img { display: flex; align-items: center; justify-content: center; min-height: 0; min-width: 0; }
.main.player-main .twocol-img img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain;
  border-radius: 18px; box-shadow: 0 16px 40px rgba(30,50,90,.18); border: 1px solid var(--border); background: #FBFDFF; }

/* —— twocol·ilr 左图右文（覆盖基础规则，给图片高度上限） —— */
.main.player-main .twocol-grid.ilr .twocol-img img { width: auto; max-width: 100%; max-height: 55vh; object-fit: contain; }

/* —— twocol·ilr 左图右文（player-main） —— */
.main.player-main .twocol-grid.ilr {
  grid-template-columns: 1.4fr 1fr; /* 图片占更大 */
}
.main.player-main .twocol-grid.ilr .twocol-img { order: 1; }
.main.player-main .twocol-grid.ilr .twocol-txt { order: 2; }
.main.player-main .twocol-grid.ilr .twocol-txt .ptitle { font-size: clamp(19px, calc(var(--vwpx, 1vw) * 1.7), 26px); margin-bottom: 8px; }
.main.player-main .twocol-grid.ilr .twocol-lead { font-size: clamp(12px, calc(var(--vwpx, 1vw) * 1), 15px); line-height: 1.5; padding: 8px 12px; }
.main.player-main .twocol-grid.ilr .twocol-points { gap: 4px; }
.main.player-main .twocol-grid.ilr .twocol-points li {
  font-size: clamp(11px, calc(var(--vwpx, 1vw) * 0.95), 14px); line-height: 1.45; padding: 5px 10px 5px 32px;
}
.main.player-main .twocol-grid.ilr .twocol-points li::before,
.main.player-main .twocol-grid.ilr .twocol-points li::after { width: 16px; height: 16px; left: 6px; }
.main.player-main .twocol-grid.ilr .twocol-points li::after { font-size: 9px; line-height: 16px; }

/* —— twocol·tb 模式：上图下文（大图弹性撑满剩余高度，文字紧凑在下，整页不溢出） —— */
.main.player-main .imgtop-wrap { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.main.player-main .imgtop-wrap .ptitle { flex: none; margin-bottom: 6px; }
.main.player-main .imgtop-img { flex: 1 1 0; min-height: 0; display: flex; align-items: center; justify-content: center; }
.main.player-main .imgtop-img img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain;
  border-radius: 16px; box-shadow: 0 14px 36px rgba(30,50,90,.16); border: 1px solid var(--border); background: #FBFDFF; }
.main.player-main .imgtop-txt { flex: none; display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.main.player-main .imgtop-txt .twocol-lead {
  font-size: clamp(14px, calc(var(--vwpx, 1vw) * 1.2), 17.5px); line-height: 1.55; font-weight: 700; text-align: center;
  color: var(--text-primary);
  background: linear-gradient(135deg, rgba(59,130,246,.10), rgba(59,130,246,.04));
  border: 1px solid rgba(59,130,246,.30); border-radius: 12px; padding: 8px 16px;
}
.main.player-main .imgtop-points { list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.main.player-main .imgtop-points li {
  background: var(--surface); border: 1px solid var(--border); border-radius: 12px;
  font-size: clamp(13px, calc(var(--vwpx, 1vw) * 1.05), 15.5px); line-height: 1.5; color: var(--text-primary);
  padding: 8px 12px; box-shadow: var(--shadow-sm); transition: border-color .16s ease;
}
.main.player-main .imgtop-points li:hover { border-color: var(--book-7a); }

/* —— 视频页：视频横向撑满无黑边、下方任务卡醒目加粗 —— */
.main.player-main .video-page { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; }
.main.player-main .vp-head { display: flex; align-items: center; gap: 12px; flex: none; margin-bottom: 10px; }
.main.player-main .vp-emo { font-size: clamp(22px, calc(var(--vwpx, 1vw) * 2), 30px); }
.main.player-main .vp-title { flex: 1; margin: 0; font-weight: 900; }
.main.player-main .player-stage .video-page .vp-body { flex: none; font-size: clamp(15px, calc(var(--vwpx, 1vw) * 1.3), 18px); font-weight: 700; color: var(--text-primary);
  margin: 18px 0 0; line-height: 1.8; padding: 12px 18px; background: linear-gradient(135deg, #fff7ed, #ffffff);
  border-left: 5px solid #ff7a45; border-radius: 12px; box-shadow: 0 4px 14px rgba(255,122,69,.12); }
/* 单视频：弹性占满剩余高度，视频严格 16:9、宽高双向自适应、居中不出页 */
.main.player-main .video-card-fit { flex: 1 1 0; min-height: 96px; width: 100%;
  margin: 0; display: flex; align-items: center; justify-content: center;
  background: transparent; border: none; box-shadow: none; border-radius: 0; overflow: visible; }
.main.player-main .video-card-fit video { width: auto; height: auto;
  max-width: 100%; max-height: 100%; aspect-ratio: 16 / 9; object-fit: contain;
  display: block; background: #0f172a; border-radius: 16px;
  border: 1px solid rgba(15,23,42,.18); box-shadow: 0 12px 30px rgba(15,23,42,.20); }
/* 多段视频连播：同样弹性适配，每段严格 16:9 */
.main.player-main .video-multi { flex: 1 1 0; min-height: 0; width: 100%; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; gap: 16px;
  align-content: stretch; margin: 0; }
.main.player-main .video-multi-item { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
.main.player-main .video-multi-item .vm-label { flex: none; }
.main.player-main .vm-fit { flex: 1 1 0; min-height: 0; display: flex; align-items: center; justify-content: center; }
.main.player-main .vm-fit video { width: auto; height: auto;
  max-width: 100%; max-height: 100%; aspect-ratio: 16 / 9; object-fit: contain;
  border-radius: 12px; background: #0f172a; border: 1px solid rgba(15,23,42,.18); }
/* 视频页收窄舞台内边距，给 16:9 视频让出横向空间 */
.main.player-main .player-stage.stage-video { padding: 22px 36px; }
/* 标题条固定；思考卡可收缩（窄视口文字换行多时内部滚动，保证视频+文字永远不超出一页） */
.main.player-main .video-page .pc-video-head { flex: none; }
.main.player-main .video-page .pc-video-think { flex: 0 1 auto; min-height: 0; margin-top: 12px; overflow-y: auto; overscroll-behavior: contain; }

/* —— 金句页 / 大图页填充 —— */
.main.player-main .quote-wrap { height: 100%; min-height: 320px; border-radius: 18px; position: relative;
  display: flex; align-items: center; justify-content: center; background-size: cover; background-position: center; overflow: hidden; }
.main.player-main .quote-wrap::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(135deg, rgba(12,20,44,.78), rgba(30,44,84,.62)); border-radius: 18px; }
.main.player-main .quote-inner { position: relative; z-index: 1; text-align: center; color: #fff; padding: 30px; width: 100%; }
.main.player-main .quote-inner .ptitle { color: #fff; }
.main.player-main .quote-line { font-size: clamp(17px, calc(var(--vwpx, 1vw) * 1.9), 26px); font-weight: 700; margin: 12px 0; text-shadow: 0 2px 12px rgba(0,0,0,.4); }
.main.player-main .quote-kw { color: #ffb25e; }
.main.player-main .imagefull-grid { flex: 1 1 auto; min-height: 0; height: auto; grid-template-rows: 1fr; align-items: stretch; }
.main.player-main .imagefull-img { display: flex; align-items: center; justify-content: center; min-height: 0; min-width: 0; }
.main.player-main .imagefull-img img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 16px; }
.main.player-main .imagefull-stats { justify-content: center; min-height: 0; }
.main.player-main .imagefull-note { flex: none; }
@media (max-width: 900px) {
  .main.player-main .imagefull-grid { grid-template-rows: minmax(140px, 152px) auto; gap: 16px; }
  .main.player-main .imagefull-note { margin-top: 8px; }
  .main.player-main .imagefull-stats { gap: 8px; }
  .main.player-main .if-stat { padding: 8px 14px; }
}

/* —— 双图对比页（dualimg）—— 教师端课时播放器 · 上下排列 */
.main.player-main .pc-dualimg { display: flex; flex-direction: column; align-items: stretch; flex: 1 1 auto; min-height: 0; }
.main.player-main .pc-di-item { flex: 1; display: flex; flex-direction: column; align-items: center; margin: 0.3vh 0; min-width: 0; min-height: 0; }
.main.player-main .pc-di-img { width: 100%; flex: 1; object-fit: contain; border-radius: 10px; box-shadow: 0 4px 18px rgba(0,0,0,.10); }
.main.player-main .pc-di-label { flex: none; margin-bottom: 0.4vh; font-size: 1.9vh; font-weight: 700; color: #333; text-align: center; }

.main.player-main .summary3-wrap { display: flex; flex-direction: row; gap: 24px; align-items: flex-start; height: 100%; }
.main.player-main .summary3-img { flex: 0 0 40%; max-width: 40%; }
.main.player-main .summary3-img img { max-height: 360px; border-radius: 16px; object-fit: contain; }
.main.player-main .pc-s3 { flex: 1; display: flex; flex-direction: column; gap: 10px; }
/* —— 三点小结 / 通用插图：纵向 flex 内不撑爆舞台 —— */
.main.player-main .summary3-list { flex: 1 1 auto; min-height: 0; justify-content: flex-start; margin-top: 2px; gap: 10px; }
.main.player-main .summary3-item { flex: none; padding: 10px 16px; font-size: clamp(18px, calc(var(--vwpx, 1vw) * 1.8), 22px); line-height: 1.55; gap: 12px; }
.main.player-main .summary3-item .s3-num { flex: 0 0 36px; height: 36px; font-size: 17px; }
.main.player-main .stage-img { display: flex; align-items: center; justify-content: center;
  min-height: 0; min-width: 0; flex: 0 0 auto; max-height: 42%; margin: 2px 0 6px; }
.main.player-main .stage-img img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
.main.player-main .stage-img.sm { flex: 0 0 auto; max-height: 45%; }
.main.player-main .stage-img.sm img { width: 100%; }
.main.player-main .emo { flex: none; font-size: clamp(22px, calc(var(--vwpx, 1vw) * 2), 34px); line-height: 1.1; margin: 0 0 3px; }

/* —— 互动答题界面：大字卡片版（整块安全居中，紧凑不溢出） —— */
/* wp-root：答题页根容器；margin:auto 技巧实现垂直居中——空间不足时自动归零不裁切 */
.main.player-main .wp-root > *:first-child { margin-top: auto; }
.main.player-main .wp-root > *:last-child { margin-bottom: auto; }
.main.player-main .score-badge { flex: none; margin: 0 0 3px; padding: 4px 14px; font-size: clamp(12px, .calc(var(--vwpx, 1vw) * 98), 14.5px); border-radius: 999px; }
.main.player-main .player-stage .body { flex: none; margin: 2px 0; }
.main.player-main .act-row { flex: none; padding: 3px 0 0; margin-top: 8px; }
.main.player-main .q-card { flex: none; padding: 8px 18px; margin: 3px 0; border-left-width: 5px; border-radius: 13px; box-shadow: 0 4px 14px rgba(255,122,69,.10); }
.main.player-main .q-card .q-text { font-size: clamp(15.5px, calc(var(--vwpx, 1vw) * 1.25), 18.5px); line-height: 1.45; font-weight: 700; }
.main.player-main .qz-prog { flex: none; margin: 3px 0 2px; padding: 4px 14px; font-size: clamp(12px, .calc(var(--vwpx, 1vw) * 98), 14.5px); }

/* 单选 / 题组选项：大卡片 + 大圆标（紧跟题面，不撑满） */
.main.player-main .q-opts { flex: none; display: flex; flex-direction: column;
  gap: 7px; margin-top: 8px; }
.main.player-main .q-opt { padding: 8px 18px; font-size: clamp(14.5px, calc(var(--vwpx, 1vw) * 1.15), 17.5px); gap: 12px; border-radius: 12px; border-width: 1.5px; box-shadow: 0 2px 8px rgba(30,50,90,.06); }
.main.player-main .qo-key { flex: 0 0 34px; height: 34px; font-size: 15.5px; }

/* 勾选题：大卡片 + 大方框 */
.main.player-main .check-list { flex: none; display: flex; flex-direction: column;
  gap: 6px; margin-top: 8px; }
.main.player-main .check-item { padding: 7px 16px; gap: 12px; border-radius: 12px; border-width: 1.5px; box-shadow: 0 2px 8px rgba(30,50,90,.06); }
.main.player-main .ck-txt { font-size: clamp(14.5px, calc(var(--vwpx, 1vw) * 1.15), 17px); line-height: 1.4; font-weight: 600; }
.main.player-main .ck-box { flex: 0 0 25px; height: 25px; border-radius: 8px; font-size: 14px; }
.main.player-main .ck-tip { padding: 5px 14px; font-size: clamp(12px, .calc(var(--vwpx, 1vw) * 98), 14px); }

/* 配对题 */
.main.player-main .match-wrap { flex: none; gap: 8px; margin-top: 10px; }

/* 配对题 · 原版式连连看棋盘（课件内页一屏模式：紧凑不溢出） */
.main.player-main .mp-root { flex: none; height: auto; gap: 8px; margin-top: 8px; }
.main.player-main .mp-instr { padding: 8px 15px; gap: 10px; border-radius: 12px; box-shadow: none; }
.main.player-main .mp-instr-ico { width: 32px; height: 32px; font-size: 17px; border-radius: 9px; }
.main.player-main .mp-instr-t { font-size: clamp(14px, calc(var(--vwpx, 1vw) * 1.15), 16.5px); line-height: 1.35; }
.main.player-main .mp-instr-sub { font-size: clamp(11px, calc(var(--vwpx, 1vw) * .85), 12.5px); }
.main.player-main .mp-board { flex: none; min-height: 0; gap: 22px; padding: 10px 16px; border-radius: 14px; }
.main.player-main .mp-col { gap: 7px; }
.main.player-main .mp-col-head { font-size: clamp(11.5px, calc(var(--vwpx, 1vw) * .95), 13.5px); padding: 0; }
.main.player-main .mp-card {
  flex: none; min-height: 0; padding: 7px 13px; gap: 9px;
  font-size: clamp(13px, calc(var(--vwpx, 1vw) * 1.05), 15.5px); line-height: 1.35;
  border-radius: 11px; border-width: 2px;
}
.main.player-main .mp-card-icon { font-size: 19px; }
.main.player-main .mp-card-no, .main.player-main .mp-check { width: 23px; height: 23px; font-size: 12px; }
.main.player-main .mp-bubble { bottom: 8px; padding: 6px 15px; font-size: 12.5px; border-radius: 11px; }
.main.player-main .mp-tip { margin-top: 2px; padding: 6px 15px; font-size: clamp(12px, calc(var(--vwpx, 1vw) * .95), 13.5px); border-radius: 10px; line-height: 1.35; }
.main.player-main .mp-many { gap: 14px; padding: 8px 12px; }
.main.player-main .mp-many .mp-col { gap: 5px; }
.main.player-main .mp-many .mp-card { padding: 5px 11px; font-size: clamp(12px, calc(var(--vwpx, 1vw) * .95), 14px); border-radius: 10px; }
.main.player-main .mp-many .mp-card-icon { font-size: 16px; }
.main.player-main .mp-many .mp-card-no,
.main.player-main .mp-many .mp-check { width: 19px; height: 19px; font-size: 10.5px; }
.main.player-main .mp-many .mp-bubble { display: none; }

/* ============================================================
 * 登录页「一屏适配」覆盖块（2026-09-07）
 * 目标：选册 / 选班 / 选名（52+ 头像）三步在 1366×768 教室机整屏可见、无滚动条。
 * 机制：.login-page 已锁 100vhpx+overflow:hidden；此处让双栏满高、舞台与头像
 *       网格弹性分配剩余空间并垂直居中，尺寸全部按 vhpx/vwpx 缩放（zoom 体系下
 *       设计视口恒 ≥1920×1080，1080 设计像素为最坏高度）。
 * 放文件末尾 + 高特异性，保证覆盖上方所有同主题规则；窄屏走 @media 回退恢复滚动。
 * ============================================================ */
@media (min-width: 1181px) {
  .login-page .login-split {
    height: calc(var(--vhpx, 1vh) * 100); min-height: 0;
    padding-top: clamp(12px, calc(var(--vhpx, 1vh) * 2.2), 36px);
    padding-bottom: clamp(10px, calc(var(--vhpx, 1vh) * 1.8), 26px);
  }
  .login-page .login-brand { min-height: 0; }
  .login-page .login-panel { min-height: 0; }
  .login-page .brand-hero { flex: 1 1 auto; min-height: 90px; }
  .login-page .panel-head { margin-bottom: clamp(6px, calc(var(--vhpx, 1vh) * 1.2), 14px); }

  /* 舞台玻璃面板：占满右栏剩余高度，内部弹性居中 */
  .login-page .login-panel .login-stage {
    flex: 1 1 auto; min-height: 0;
    display: flex; flex-direction: column; justify-content: center;
    padding: clamp(6px, calc(var(--vhpx, 1vh) * 1.2), 10px) clamp(18px, calc(var(--vwpx, 1vw) * 2), 24px) clamp(8px, calc(var(--vhpx, 1vh) * 1.4), 12px);
    margin-bottom: 0;
  }
  /* 面包屑：再放大一档字号，与标题间距进一步拉开 */
  .login-page .login-panel .login-stage .login-crumb {
    padding: 7px 20px !important;
    margin-bottom: clamp(16px, calc(var(--vhpx, 1vh) * 2.6), 28px) !important;
    font-size: clamp(14px, calc(var(--vhpx, 1vh) * 1.95), 19px) !important;
    letter-spacing: 0.5px;
  }
  .login-page .login-panel .login-stage .prompt-q {
    font-size: clamp(20px, calc(var(--vhpx, 1vh) * 3.0), 28px) !important;
    margin: 0 0 clamp(16px, calc(var(--vhpx, 1vh) * 2.6), 28px) !important;
  }

  /* 选名网格：固定 11 列，行组从标题下方起排，行距放宽不拥挤 */
  .login-page .login-panel .avatar-grid {
    width: 100%;
    grid-template-columns: repeat(11, 1fr);
    gap: clamp(9px, calc(var(--vhpx, 1vh) * 1.6), 17px) clamp(5px, calc(var(--vwpx, 1vw) * 0.55), 7px);
    max-width: none; max-height: none; overflow: visible;
    padding: 2px;
    flex: 1 1 auto; min-height: 0; align-content: start;
  }
  .login-page .login-panel .book-grid,
  .login-page .login-panel .class-grid-16 { width: 100%; }
  .login-page .login-panel .avatar-card {
    padding: clamp(4px, calc(var(--vhpx, 1vh) * 0.8), 7px) 2px clamp(4px, calc(var(--vhpx, 1vh) * 0.7), 6px);
    gap: 1px; border-radius: 10px;
  }
  .login-page .login-panel .avatar-circle {
    width: clamp(28px, calc(var(--vhpx, 1vh) * 5.6), 58px);
    height: clamp(28px, calc(var(--vhpx, 1vh) * 5.6), 58px);
    font-size: clamp(13px, calc(var(--vhpx, 1vh) * 1.9), 20px);
    line-height: 1;        /* 彻底消除 baseline 差异导致的视觉中线不齐 */
    place-items: center;   /* 严格水平垂直居中 */
  }
  .login-page .login-panel .avatar-name {
    font-size: clamp(10.5px, calc(var(--vhpx, 1vh) * 1.55), 15px);
    line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .login-page .login-panel .avatar-no {
    font-size: clamp(8.5px, calc(var(--vhpx, 1vh) * 1.25), 12px);
    line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  /* 按钮区：avatar-grid 吃满 + align-content:end 把网格推到黄线处，按钮紧贴其后 */
  .login-page .login-panel .login-actions { margin-top: clamp(4px, calc(var(--vhpx, 1vh) * 0.6), 10px) !important; }
  .login-page .login-panel .btn-enter {
    font-size: clamp(16px, calc(var(--vhpx, 1vh) * 2.4), 20px);
    padding: clamp(10px, calc(var(--vhpx, 1vh) * 1.7), 16px) clamp(30px, calc(var(--vwpx, 1vw) * 4), 42px);
  }
  .login-page .login-panel .login-block-tip {
    margin: clamp(2px, calc(var(--vhpx, 1vh) * 0.6), 6px) auto 0;
    padding: clamp(6px, calc(var(--vhpx, 1vh) * 1.2), 12px) 16px;
    font-size: clamp(12px, calc(var(--vhpx, 1vh) * 1.8), 14.5px); line-height: 1.5;
  }
}

/* 窄屏（≤1180 设计像素，未走整站缩放的小窗/手机）：恢复自然高度与滚动，不锁一屏 */
@media (max-width: 1180px) {
  .login-page { height: auto; min-height: calc(var(--vhpx, 1vh) * 100); overflow: visible; }
  .login-page .login-split { height: auto; min-height: 0; }
  .login-page .login-panel .login-stage { display: block; }
  .login-page .login-panel .avatar-grid { flex: none; max-height: none; overflow: visible; }
}
.main.player-main .match-item { padding: 9px 16px; font-size: clamp(14px, calc(var(--vwpx, 1vw) * 1.1), 16.5px); border-radius: 13px; min-height: 0; line-height: 1.45; border-width: 1.5px; box-shadow: 0 2px 10px rgba(30,50,90,.07); }

/* 排序题（sortn 输入序号 / sortd 拖拽 / timeline 时间轴） */
.main.player-main .sortn-list { flex: none; display: flex; flex-direction: column;
  gap: 5px; margin-top: 6px; }
.main.player-main .sortn-row { padding: 5px 14px; gap: 12px; border-radius: 12px; border-width: 1.5px; box-shadow: 0 2px 8px rgba(30,50,90,.06); }
.main.player-main .sortn-input { flex: 0 0 38px; height: 38px; font-size: 18px; border-radius: 10px; }
.main.player-main .sortn-label { font-size: clamp(13.5px, calc(var(--vwpx, 1vw) * 1.1), 16px); font-weight: 700; line-height: 1.4; }
.main.player-main .sortn-sub { font-size: clamp(11.5px, .calc(var(--vwpx, 1vw) * 92), 13px); line-height: 1.4; margin-top: 1px; }
.main.player-main .sort-list { flex: none; display: flex; flex-direction: column; gap: 6px; margin-top: 7px; }
.main.player-main .sort-row { padding: 6px 14px; border-radius: 12px; gap: 10px; border-width: 1.5px; box-shadow: 0 2px 8px rgba(30,50,90,.06); }
.main.player-main .sort-txt, .main.player-main .tl-txt { font-size: clamp(13.5px, calc(var(--vwpx, 1vw) * 1.08), 16px); line-height: 1.45; font-weight: 600; }
.main.player-main .sort-no { flex: 0 0 28px; height: 28px; font-size: 13.5px; }
.main.player-main .sort-hint { flex: none; margin: 4px 0; padding: 6px 14px; font-size: clamp(12px, .calc(var(--vwpx, 1vw) * 98), 14px); border-radius: 10px; }

/* 反馈条 / 提示框 */
.main.player-main .fb { flex: none; margin: 5px 0 0; padding: 8px 16px; font-size: clamp(14px, calc(var(--vwpx, 1vw) * 1.1), 16.5px); border-radius: 13px; border-width: 1.5px; }
.main.player-main .fb b { font-size: clamp(14.5px, calc(var(--vwpx, 1vw) * 1.15), 17px); }
.main.player-main .fb .ex, .main.player-main .fb .hint { font-size: clamp(12.5px, calc(var(--vwpx, 1vw) * 1), 15px); line-height: 1.6; }
.main.player-main .hint-box, .main.player-main .hint-box-locked { flex: none; margin: 3px 0 0; padding: 6px 14px; font-size: clamp(12.5px, calc(var(--vwpx, 1vw) * 1), 14.5px); border-radius: 11px; }

/* 开放作答 */
.main.player-main .write-q { flex: none; margin: 6px 0; padding: 12px 20px; border-left-width: 6px; border-radius: 16px; font-size: clamp(16px, calc(var(--vwpx, 1vw) * 1.3), 18.5px); line-height: 1.6; }
.main.player-main .write-area { flex: none; margin-top: 10px; padding: 12px 16px; font-size: clamp(14.5px, calc(var(--vwpx, 1vw) * 1.15), 17px); line-height: 1.8; border-radius: 14px; }
.main.player-main .write-count { font-size: clamp(12.5px, calc(var(--vwpx, 1vw) * 1), 14.5px); }

/* 随堂练习结果回顾 */
.main.player-main .qz-result { flex: none; margin-top: 14px; }
.main.player-main .qz-review { padding: 11px 18px; border-radius: 14px; }
.main.player-main .qz-rq { font-size: clamp(15px, calc(var(--vwpx, 1vw) * 1.2), 17.5px); line-height: 1.6; }
.main.player-main .qz-ra { font-size: clamp(14px, calc(var(--vwpx, 1vw) * 1.1), 16px); }
.main.player-main .qz-ex { font-size: clamp(13px, calc(var(--vwpx, 1vw) * 1.05), 15px); line-height: 1.65; }

/* 操作按钮放大醒目 */
.main.player-main .panel-btn { padding: 10px 26px; font-size: clamp(14px, calc(var(--vwpx, 1vw) * 1.15), 17px); border-radius: 999px; border-width: 1.5px; font-weight: 700; }
.main.player-main .sort-mv { width: 34px; height: 34px; font-size: 15px; border-radius: 10px; }
.main.player-main .mi-tag { font-size: clamp(11.5px, .calc(var(--vwpx, 1vw) * 95), 13.5px); }
.main.player-main .tl-year { font-size: clamp(13px, calc(var(--vwpx, 1vw) * 1.05), 15.5px); padding: 5px 15px; }
.main.player-main .sort-locked-tag { font-size: clamp(12px, calc(var(--vwpx, 1vw) * 1), 14px); padding: 5px 14px; }
.main.player-main .sort-grip { font-size: 20px; }
.main.player-main .sortn-mark { font-size: 21px; }

/* sortn 完成态：答案图清晰可辨，顶部留白收紧，保证不出框 */
.main.player-main .all-done .sort-hint { display: none; }
.main.player-main .all-done .act-row { display: none; }
.main.player-main .all-done .sortn-row { padding: 4px 14px; }
.main.player-main .all-done .sortn-input { flex: 0 0 36px; height: 36px; font-size: 17px; }
.main.player-main .all-done .sortn-sub { display: none; }
.main.player-main .all-done.wp-root > *:first-child { margin-top: 0; }
.main.player-main .all-done .sortn-answer { flex: none; width: 100%; max-height: 300px; margin: 10px 0 0; display: flex; align-items: center; justify-content: center; }
.main.player-main .all-done .sortn-answer img { width: 100%; max-width: 100%; max-height: 290px; height: auto; }

/* —— 互动开始卡（点「进入互动」打开答题界面） —— */
.work-intro { position: relative; height: 100%; min-height: 340px; border-radius: 20px; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 13px; text-align: center;
  color: #1f2738; padding: 30px;
  background: #fff; border: 1px solid #e6e9f2; box-shadow: 0 18px 50px rgba(30,41,59,.10); }
.wi-deco { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none;
  background: radial-gradient(600px 300px at 82% -10%, rgba(255,180,90,.12), transparent 60%),
              radial-gradient(520px 280px at 8% 112%, rgba(90,160,255,.10), transparent 60%); }
.wi-emo { position: relative; font-size: clamp(52px, calc(var(--vwpx, 1vw) * 5.6), 80px); line-height: 1; }
.wi-badge { position: relative; background: #fff1e6; border: 1px solid #ffd4b3;
  padding: 7px 20px; border-radius: 999px; font-size: clamp(13px, calc(var(--vwpx, 1vw) * 1.1), 15.5px); font-weight: 700; letter-spacing: 1px; color: #ea6b1f; }
.wi-title { position: relative; font-size: clamp(25px, calc(var(--vwpx, 1vw) * 2.9), 38px); font-weight: 800; letter-spacing: 2px;
  color: #1f2738; line-height: 1.3; }
.wi-rule { position: relative; font-size: clamp(13px, calc(var(--vwpx, 1vw) * 1.1), 16px); color: #6b7280; font-weight: 600; }
.wi-start { position: relative; margin-top: 12px; background: linear-gradient(135deg, #34d17f, #16a34a); color: #fff; border: none;
  font-size: clamp(16px, calc(var(--vwpx, 1vw) * 1.45), 21px); font-weight: 800; padding: 15px 44px; border-radius: 999px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 10px; font-family: inherit; letter-spacing: 1px;
  box-shadow: 0 10px 28px rgba(34,197,94,.45); animation: wiPulse 1.9s ease-in-out infinite; transition: transform .15s; }
.wi-start:hover { transform: translateY(-2px) scale(1.03); }
@keyframes wiPulse {
  0%, 100% { box-shadow: 0 10px 28px rgba(34,197,94,.45), 0 0 0 0 rgba(34,197,94,.45); }
  50% { box-shadow: 0 10px 28px rgba(34,197,94,.5), 0 0 0 14px rgba(34,197,94,0); }
}
.wi-tip { position: relative; font-size: 13.5px; color: #9ca3af; }
/* 互动开始卡·等待教师开启锁定态（上课中、教师未点「开始互动」时替换绿色开始按钮） */
.wi-locked { position: relative; margin: 18px auto 4px; max-width: 78%; display: flex; flex-direction: column; align-items: center; gap: 7px;
  padding: 24px 36px; background: #f0f4ff; border: 2px dashed #8aa5ff; border-radius: 18px; }
.wi-locked-ico { font-size: clamp(34px, calc(var(--vwpx,1vw)*3.2), 48px); line-height: 1; animation: wiLockedPulse 1.5s ease-in-out infinite; }
.wi-locked-text { font-size: clamp(17px, calc(var(--vwpx,1vw)*1.5), 23px); font-weight: 800; color: #3b5bdb; letter-spacing: 1px; }
.wi-locked-sub { font-size: clamp(13px, calc(var(--vwpx,1vw)*1.05), 16px); color: #7c8bb5; font-weight: 600; }
@keyframes wiLockedPulse { 0%,100% { opacity: .55; transform: scale(.92); } 50% { opacity: 1; transform: scale(1.08); } }

/* —— 原版式 slide-footer 页码：右下角白色字（第1页不显示，如 2/15 样式） —— */
.slide-footer { position: absolute; right: 22px; bottom: 14px; z-index: 5;
  color: #fff; font-size: 13px; font-weight: 500; letter-spacing: .4px;
  line-height: 1.6; pointer-events: none; text-shadow: 0 1px 4px rgba(0,0,0,.45); }

/* ============================================================ */
/* 互动答题对话框（原版式弹窗式）                                 */
/* ============================================================ */
.im-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; inset: 0; z-index: 9000; background: #f7f4ee;
  display: flex; align-items: center; justify-content: center; padding: 24px; }
.im-modal { width: min(960px, calc(var(--vwpx, 1vw) * 96)); max-height: calc(var(--vhpx, 1vh) * 92); background: #fff; border-radius: 20px;
  overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 24px 60px rgba(30,41,59,.12);
  animation: imPop .28s cubic-bezier(.2,.9,.3,1.2); }
/* —— 开始卡：小卡片样式 —— */
.im-modal.im-mode-intro {
  width: min(520px, calc(var(--vwpx, 1vw) * 92));
  max-height: calc(var(--vhpx, 1vh) * 80);
}
/* —— 答题界面：全屏化（对齐演示站，顶栏/答题区/底栏铺满整个窗口） —— */
.im-overlay { transition: background .2s ease; }
.im-overlay.im-ov-do { background: #f7f4ee; padding: 0; display: block; }
.im-modal.im-mode-do {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  width: auto; height: auto; max-height: none;
  border-radius: 0; box-shadow: none;
  animation: imPageIn .24s ease;
}
@keyframes imPageIn { from { opacity: 0; } to { opacity: 1; } }
/* 全屏态顶栏/底栏向两侧舒展 */
.im-overlay.im-ov-do .im-topbar { padding: 11px 28px; }
.im-overlay.im-ov-do .im-bottombar { padding: 13px 30px; }
/* 答题内容居中限宽：超宽屏（含 1920 设计基准）不被拉成超长一行 */
.im-overlay.im-ov-do .im-do,
.im-overlay.im-ov-do .im-body-result { width: 100%; max-width: 1560px; margin-left: auto; margin-right: auto; }
@media (max-width: 700px) {
  .im-overlay.im-ov-do .im-topbar { padding: 9px 12px; }
  .im-overlay.im-ov-do .im-bottombar { padding: 10px 14px; }
}
/* —— 开始卡小卡片模式下，顶栏隐藏次要元素避免溢出 —— */
.im-modal.im-mode-intro .im-tool,
.im-modal.im-mode-intro .im-logout,
.im-modal.im-mode-intro .im-hud-center,
.im-modal.im-mode-intro .im-badge,
.im-modal.im-mode-intro .im-score {
  display: none;
}
@keyframes imPop { from { transform: scale(.92) translateY(18px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ============ 顶栏 act-header（原版式 1:1） ============ */
.im-topbar { flex: none; display: flex; align-items: center; gap: 12px; padding: 10px 16px;
  background: #fff; border-bottom: 1px solid #e6e9f2; }
/* —— 左侧：返回课堂 + 活动类型/名称 + 徽标 —— */
.im-hdr-left { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 10px; }
.im-back { flex: none; display: inline-flex; align-items: center; gap: 8px; background: linear-gradient(135deg, #ff8a5c, #ff6b35);
  color: #fff; font-size: 17px; font-weight: 800; padding: 10px 20px; border-radius: 999px; border: none;
  cursor: pointer; font-family: inherit; box-shadow: 0 4px 14px rgba(255,107,53,.35); transition: .15s; white-space: nowrap; }
.im-back:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(255,107,53,.45); }
.im-title-wrap { flex: 0 1 auto; min-width: 0; display: flex; align-items: center; gap: 10px; }
.im-act-label { flex: none; font-size: 19px; font-weight: 800; color: #ea6b1f; background: #fff1e6;
  border: 1px solid #ffd4b3; padding: 4px 13px; border-radius: 7px; white-space: nowrap; }
.im-act-name { font-size: 25px; font-weight: 800; color: #1f2738; line-height: 1.25;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.im-campus-badge { flex: none; display: inline-flex; align-items: center; gap: 5px; background: #ecfdf5;
  color: #059669; border: 1px solid #a7f3d0; font-size: 18px; font-weight: 800; padding: 4px 13px;
  border-radius: 999px; white-space: nowrap; }
.im-campus-badge .cb-icon { width: 18px; height: 18px; }
.im-campus-badge .cb-text { font-weight: 800; }
/* —— 中部：题目圆点进度 + 进度徽标（原版式 q-dots / progress-badge） —— */
.im-hud-center { flex: none; display: flex; align-items: center; gap: 10px; }
.im-q-dots { display: flex; align-items: center; gap: 5px; }
.im-q-dot { width: 30px; height: 30px; border-radius: 50%; background: #eef1f7; color: #98a2b8;
  font-size: 17px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center;
  border: 2px solid transparent; transition: all .2s; }
.im-q-dot.correct { background: #34c77a; color: #fff; }
.im-q-dot.current { border-color: #ff6b35; color: #ff6b35; background: #fff1e6; }
.im-progress { flex: none; display: inline-flex; align-items: center; gap: 6px; background: #fff;
  border: 1px solid #e2e6f0; color: #2a3142; font-size: 19px; font-weight: 700; padding: 8px 18px;
  border-radius: 999px; box-shadow: 0 1px 4px rgba(100,116,139,.08); white-space: nowrap; }
.im-prog-ico { font-size: 21px; }
.im-prog-text { white-space: nowrap; }
/* —— 右侧：得分 + 素养标签 + 音效/全屏工具 + 退出登录（原版式 score-badge / lit-tag / btn-act-icon / btn-logout） —— */
.im-topbar-right { flex: 1 1 0; min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.im-score { flex: none; display: inline-flex; align-items: baseline; gap: 2px; background: #fffbeb;
  color: #d97706; font-weight: 800; font-size: 19px; padding: 8px 16px; border-radius: 999px; border: 1px solid #fde68a; white-space: nowrap; }
.im-score-num { font-size: 25px; line-height: 1; }
.im-score-max { font-size: 16px; font-weight: 700; color: #b45309; }
.im-badge { flex: none; background: #eef4ff; color: #2563eb; font-size: 17px; font-weight: 700; padding: 7px 13px; border-radius: 6px; white-space: nowrap; }
.im-tool { flex: none; background: #f0f2f8; border: 1px solid #e2e6f0; width: 44px; height: 44px; border-radius: 10px;
  cursor: pointer; color: #4a5468; display: inline-flex; align-items: center; justify-content: center; transition: .15s; }
.im-tool:hover { background: #e6e9f2; color: #ff6b35; border-color: #ffd4b3; }
.im-logout { flex: none; background: #fef2f2; border: 1px solid #fecaca; color: #dc2626; font-size: 18px; font-weight: 800;
  padding: 10px 17px; border-radius: 999px; cursor: pointer; display: inline-flex; align-items: center; gap: 5px;
  font-family: inherit; transition: .15s; white-space: nowrap; }
.im-logout:hover { background: #fee2e2; }

/* —— 图2底栏新增：正在作答状态、禁用提交按钮 —— */
.im-bb-doing { font-size: 19px; font-weight: 700; color: #3b82f6; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.im-bb-doing svg { flex: none; }
.im-bb-mptip { color: #b45309; font-size: 20px; }
.im-bb-ready { font-size: 19px; font-weight: 700; color: #8b5cf6; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.im-bb-ready svg { flex: none; }
.im-bottombar.bb-intro .im-submit { background: #c9cdd8; color: #fff; cursor: default; box-shadow: none; }
.im-submit.disabled { background: #c9cdd8; color: #fff; cursor: not-allowed; box-shadow: none; }

/* ============ 成绩结果面板 result-panel（原版式 1:1） ============ */
/* 结果态：内容区居中展示结果卡片（margin:auto 保证超高时可正常滚动，不被裁切） */
.im-body-result { display: flex; align-items: stretch; justify-content: center; padding: 18px 24px; }
.imr-panel { margin: auto; width: min(580px, 100%); background: #fff; border: 1px solid #e6e9f2;
  border-radius: 20px; box-shadow: 0 18px 50px rgba(30,41,59,.12);
  padding: 26px 30px 24px; text-align: center; animation: imrPop .35s cubic-bezier(.2,.9,.3,1.2); }
@keyframes imrPop { from { transform: scale(.92) translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }
/* 吉祥物机器人 + 奖杯角标 */
.imr-mascot { position: relative; width: 132px; height: 132px; margin: 0 auto 4px; }
.imr-mascot svg { width: 100%; height: 100%; filter: drop-shadow(0 6px 14px rgba(255,107,53,.22)); }
.imr-emoji { position: absolute; right: -8px; top: 2px; font-size: 38px; line-height: 1;
  animation: imrTrophy .6s .35s cubic-bezier(.34,1.56,.64,1) both; }
@keyframes imrTrophy { 0% { transform: scale(0) rotate(-30deg); opacity: 0; } 100% { transform: scale(1) rotate(0); opacity: 1; } }
.imr-title { font-size: 23px; font-weight: 800; color: #1f2738; margin-top: 4px; line-height: 1.3; }
.imr-subtitle { font-size: 14px; color: #6b7280; margin-top: 6px; font-weight: 600; }
/* 三星：未得星灰色，得星依次弹跳 */
.imr-stars { display: flex; justify-content: center; gap: 10px; margin: 14px 0 16px; }
.imr-star { font-size: 34px; line-height: 1; opacity: .3; filter: grayscale(1); transform: scale(.8); }
.imr-star.earned { opacity: 1; filter: none; animation: imrStar .5s cubic-bezier(.34,1.56,.64,1) both; }
@keyframes imrStar { 0% { transform: scale(.2) rotate(-20deg); opacity: 0; } 60% { transform: scale(1.25) rotate(8deg); } 100% { transform: scale(1) rotate(0); opacity: 1; } }
/* 三统计卡片：正确卡片 / 检查次数 / 得分 */
.imr-scorebox { display: flex; gap: 12px; justify-content: center; margin-bottom: 16px; }
.imr-stat { flex: 1; max-width: 160px; background: linear-gradient(180deg,#fff,#faf8ff); border: 1px solid #e6e9f2;
  border-radius: 16px; padding: 14px 8px 12px; box-shadow: 0 2px 8px rgba(100,116,139,.06); }
.imr-stat-num { font-size: 25px; font-weight: 800; color: #ff6b35; letter-spacing: -.5px; line-height: 1.1; }
.imr-stat-label { font-size: 12px; color: #94a3b8; margin-top: 4px; font-weight: 600; white-space: nowrap; }
/* 正确答案明细（原版式 result-breakdown 1:1） */
.imr-breakdown { background: #f8fafc; border: 1px solid #e6e9f2; border-radius: 14px; padding: 12px 14px;
  text-align: left; margin-bottom: 18px; max-height: 268px; overflow-y: auto; }
.imr-bd-title { font-size: 13px; font-weight: 800; color: #1f2738; margin-bottom: 8px; }
.imr-bd-item { display: flex; align-items: center; gap: 8px; padding: 7px 10px; background: #fff;
  border: 1px solid #e6e9f2; border-radius: 10px; font-size: 13px; color: #2a3142; font-weight: 600; margin-bottom: 6px; }
.imr-bd-item:last-child { margin-bottom: 0; }
.imr-bd-text { flex: 1; min-width: 0; line-height: 1.5; }
.imr-bd-sub { font-style: normal; color: #94a3b8; font-size: 12px; font-weight: 600; margin-left: 8px; white-space: nowrap; }
.imr-ok { flex: none; width: 20px; height: 20px; border-radius: 50%; background: #34c77a; color: #fff;
  font-size: 12px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }
/* 随堂练习明细：答错小题红叉（原版式图4） */
.imr-bad { flex: none; width: 20px; height: 20px; border-radius: 50%; background: #ef4444; color: #fff;
  font-size: 12px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }
.imr-bd-item-bad { background: #fef2f2 !important; border-color: #fecaca !important; }
/* 配对题口诀条（原版式 result-summary） */
.imr-summary { background: #ecfdf5; border: 1px solid #a7f3d0; color: #065f46; border-radius: 12px;
  padding: 11px 15px; font-size: 13.5px; font-weight: 700; line-height: 1.6; margin-bottom: 16px; text-align: left; }
/* 操作按钮：返回课堂 / 再玩一次 */
.imr-actions { display: flex; gap: 12px; justify-content: center; }
.imr-btn { padding: 11px 26px; border-radius: 999px; font-size: 14.5px; font-weight: 800; cursor: pointer;
  font-family: inherit; transition: .15s; white-space: nowrap; }
.imr-btn-sec { background: #f0f2f8; color: #4a5468; border: 1px solid #e2e6f0; }
.imr-btn-sec:hover { background: #e6e9f2; }
.imr-btn-pri { background: linear-gradient(135deg,#ff8a5c,#ff6b35); color: #fff; border: none;
  box-shadow: 0 6px 16px rgba(255,107,53,.35); }
.imr-btn-pri:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(255,107,53,.45); }

.im-body { flex: 1 1 auto; overflow-y: auto; padding: 22px 28px; }
/* 开始卡 */
.im-intro { min-height: 380px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; text-align: center; }
.imi-deco { position: absolute; }
.imi-emo { font-size: 100px; line-height: 1; }
.imi-badge { background: #fff1e6; border: 1px solid #ffd4b3; color: #ea6b1f; padding: 8px 26px; border-radius: 999px; font-size: 21px; font-weight: 800; }
.imi-title { font-size: 41px; font-weight: 800; color: #1f2738; }
.imi-rule { color: #6b7280; font-size: 22px; font-weight: 600; }
.imi-start { margin-top: 12px; background: linear-gradient(135deg, #ff8a5c, #ff6b35); color: #fff; border: none;
  font-size: 27px; font-weight: 800; padding: 19px 54px; border-radius: 999px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 12px; font-family: inherit; letter-spacing: 1px;
  box-shadow: 0 12px 30px rgba(255,107,53,.4); transition: transform .15s; }
.imi-start:hover { transform: translateY(-2px) scale(1.03); }
/* 等待老师开启互动 */
.imi-wait { margin-top: 14px; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 20px 34px; background: #f0f4ff; border: 1.5px dashed #8aa5ff; border-radius: 16px; }
.imi-wait-ico { font-size: 42px; animation: imiPulse 1.4s ease-in-out infinite; }
.imi-wait-text { font-size: 24px; font-weight: 800; color: #3b5bdb; }
.imi-wait-sub { font-size: 18px; color: #7c8bb5; font-weight: 600; }
@keyframes imiPulse { 0%,100% { opacity: .5; transform: scale(.9); } 50% { opacity: 1; transform: scale(1.1); } }
/* 答题界面 */
.im-do { }
.im-do .q-card { background: #fff; border: 1px solid #e6e9f2; border-radius: 14px; padding: 24px 28px; margin-bottom: 20px; }
.im-do .q-text { font-size: 26px; font-weight: 700; color: #1f2738; line-height: 1.55; }
.im-do .q-opts { display: flex; flex-direction: column; gap: 16px; }
.im-do .q-opt.big { display: flex; align-items: center; gap: 14px; background: #fff; border: 1.5px solid #e2e6f0;
  border-radius: 12px; padding: 20px 26px; font-size: 23px; line-height: 1.4; color: #2a3142; cursor: pointer; text-align: left; font-family: inherit; transition: .15s; }
.im-do .q-opt.big:hover { border-color: #ff8a5c; background: #fff8f3; }
.im-do .q-opt.big.right { border-color: #34c77a; background: #ecfdf5; color: #065f46; }
.im-do .q-opt.big.wrong { border-color: #ef4444; background: #fef2f2; color: #991b1b; }
.im-do .qo-key { flex: none; width: 40px; height: 40px; border-radius: 50%; background: #f0f2f8; display: inline-flex;
  align-items: center; justify-content: center; font-weight: 800; font-size: 20px; color: #6b7280; }
.im-do .q-opt.big.right .qo-key { background: #34c77a; color: #fff; }
.im-do .q-opt.big.wrong .qo-key { background: #ef4444; color: #fff; }
.im-do .qo-text { flex: 1; }
.im-do .fb { border-radius: 12px; padding: 18px 22px; margin-top: 20px; font-size: 19px; line-height: 1.6; }
.im-do .fb.ok { background: #ecfdf5; border: 1px solid #a7f3d0; color: #065f46; }
.im-do .fb.no, .im-do .fb.no-tries { background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; }
.im-do .fb .ex, .im-do .fb .hint { margin-top: 6px; font-size: 18px; color: #4b5563; }
.im-do .panel-btn { background: #ff6b35; color: #fff; border: none; padding: 13px 28px; border-radius: 999px;
  font-size: 19px; font-weight: 700; cursor: pointer; font-family: inherit; margin-top: 8px; }
/* 悬停必须保持白字：通用 .panel-btn:hover 优先级更高，会把文字改成橙色 var(--book-7a)，
   导致橙底橙字、按钮文字"消失"（所有互动题弹窗的提交/再试一次按钮都受影响） */
.im-do .panel-btn:hover:not(:disabled) { color: #fff; filter: brightness(1.06); }
.im-do .panel-btn.ghost { background: #fff; color: #6b7280; border: 1px solid #e2e6f0; }
.im-do .panel-btn.ghost:hover:not(:disabled) { color: #ff6b35; border-color: #ff8a5c; background: #fff8f3; }

/* 排序行 */
.im-do .sort-list { display: flex; flex-direction: column; gap: 8px; margin: 12px 0; }
.im-do .sort-row { display: flex; align-items: center; gap: 10px; background: #fff; border: 1.5px solid #e2e6f0;
  border-radius: 12px; padding: 12px 16px; cursor: grab; transition: .15s; }
.im-do .sort-row:hover { border-color: #ff8a5c; }
/* sortn 逐卡锁定（绿底）/ 错位红 ✗ 标记 */
.im-do .sort-row-ok { border-color: #34c77a; background: #ecfdf5; box-shadow: 0 2px 10px rgba(52,199,122,.18); cursor: default; }
.im-do .sort-row-ok:hover { border-color: #34c77a; background: #ecfdf5; }
.im-do .sort-bad-tag { flex: none; width: 22px; height: 22px; border-radius: 50%; background: #ef4444; color: #fff;
  display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800; }
.im-do .sortn-fb { margin-top: 12px; }
.im-do .sort-grip { color: #c0c5d0; font-size: 26px; }
.im-do .sort-no { width: 36px; height: 36px; border-radius: 50%; background: #fff1e6; color: #ea6b1f;
  display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 19px; flex: none; }
.im-do .sort-txt { flex: 1; font-size: 21px; color: #2a3142; font-weight: 600; line-height: 1.4; }
.im-do .sort-btns { display: flex; gap: 5px; }
.im-do .sort-mv { width: 38px; height: 38px; border-radius: 8px; background: #f0f2f8; border: 1px solid #e2e6f0;
  color: #6b7280; cursor: pointer; font-size: 19px; font-weight: 700; }
.im-do .sort-mv:disabled { opacity: .35; cursor: not-allowed; }
.im-do .act-row { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.im-do .sort-hint, .im-do .ck-tip { font-size: 19px; color: #6b7280; }

/* 配对 */
.im-do .match-wrap { display: flex; flex-direction: column; gap: 10px; }
.im-do .match-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.im-do .match-item { background: #fff; border: 1.5px solid #e2e6f0; border-radius: 12px; padding: 18px 22px;
  font-size: 19px; color: #2a3142; cursor: pointer; text-align: center; font-weight: 600; transition: .15s; }
.im-do .match-item:hover { border-color: #ff8a5c; background: #fff8f3; }
.im-do .match-item.l.sel { border-color: #ff6b35; background: #fff1e6; }
.im-do .match-item.l.done { border-color: #34c77a; background: #ecfdf5; color: #065f46; }
.im-do .match-item.l.wrong { border-color: #ef4444; background: #fef2f2; animation: shake .4s; }
.im-do .match-item.r.used { opacity: .4; pointer-events: none; }
@keyframes shake { 0%,100%{transform:translateX(0);} 25%{transform:translateX(-6px);} 75%{transform:translateX(6px);} }
.im-do .mi-txt { font-weight: 700; font-size: 19px; }
.im-do .mi-tag { display: block; font-size: 14px; color: #34c77a; margin-top: 4px; }

/* 配对（原版式连连看棋盘：弹窗全屏态放大） */
.im-do .mp-root { height: 100%; min-height: 520px; gap: 16px; }
.im-do .mp-instr { padding: 16px 26px; border-radius: 16px; }
.im-do .mp-instr-ico { width: 50px; height: 50px; font-size: 27px; border-radius: 13px; }
.im-do .mp-instr-t { font-size: 22px; }
.im-do .mp-instr-sub { font-size: 16px; margin-top: 2px; }
.im-do .mp-board { padding: 24px 36px; gap: 58px; border-radius: 22px; }
.im-do .mp-col { gap: 16px; }
.im-do .mp-col-head { font-size: 19px; padding: 2px 0 4px; }
.im-do .mp-card {
  flex: 1 1 0; min-height: 70px; max-height: 118px;
  padding: 16px 22px; font-size: 21px; border-radius: 17px;
}
.im-do .mp-card-icon { font-size: 31px; }
.im-do .mp-card-no, .im-do .mp-check { width: 34px; height: 34px; font-size: 18px; }
.im-do .mp-many { gap: 34px; padding: 16px 24px; }
.im-do .mp-many .mp-col { gap: 9px; }
.im-do .mp-many .mp-card { flex: none; min-height: 48px; max-height: none; padding: 10px 18px; font-size: 18px; }
.im-do .mp-many .mp-col-head { font-size: 16px; }
.im-do .mp-many .mp-card-icon { font-size: 22px; }
.im-do .mp-many .mp-card-no, .im-do .mp-many .mp-check { width: 27px; height: 27px; font-size: 14px; }
.im-do .mp-bubble { bottom: 20px; font-size: 18px; padding: 13px 28px; }
.im-do .mp-tip { margin-top: 6px; padding: 10px 22px; font-size: 16.5px; border-radius: 13px; line-height: 1.4; }

/* 勾选 */
.im-do .check-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.im-do .check-item { display: flex; align-items: center; gap: 12px; background: #fff; border: 1.5px solid #e2e6f0;
  border-radius: 12px; padding: 18px 22px; cursor: pointer; font-size: 21px; line-height: 1.4; color: #2a3142; transition: .15s; }
.im-do .check-item:hover { border-color: #ff8a5c; }
.im-do .check-item.on { border-color: #34c77a; background: #ecfdf5; }
.im-do .check-item.bad { border-color: #ef4444; background: #fef2f2; }
.im-do .ck-box { width: 30px; height: 30px; border-radius: 6px; border: 2px solid #d1d5db; display: inline-flex;
  align-items: center; justify-content: center; color: #fff; font-weight: 800; flex: none; }
.im-do .check-item.on .ck-box { background: #34c77a; border-color: #34c77a; }
.im-do .ck-txt { flex: 1; }

/* 随堂练习 */
.im-do .qz-prog { text-align: center; font-size: 19px; color: #8b93a7; font-weight: 700; margin-bottom: 12px; }
.im-do .qz-result { margin-top: 20px; }
.im-do .qz-review { background: #fff; border: 1px solid #e6e9f2; border-radius: 10px; padding: 14px 18px; margin-top: 8px; font-size: 19px; line-height: 1.5; }
.im-do .qz-rq { font-weight: 700; color: #2a3142; margin-bottom: 4px; }
.im-do .qz-ra.ok { color: #065f46; }
.im-do .qz-ra.no { color: #991b1b; }
.im-do .qz-ex { color: #6b7280; margin-top: 3px; font-size: 17px; }

/* —— 随堂练习 quizset 原版式逐题反馈：头部徽标 / 选项锁定与对错标记 / 反馈条 / 橙色"下一题"按钮 —— */
.qz-head { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; }
.qz-head .qz-prog { display: inline-block; margin: 0; padding: 0; background: none; box-shadow: none;
  color: #8b93a7; font-size: 19px; font-weight: 700; letter-spacing: 0; }
.im-do .qz-head { margin-bottom: 2px; }
.qz-chip { display: inline-flex; align-items: center; background: #eef4ff; color: #3b6fe0; border: 1px solid #cfe0ff;
  font-size: 18px; font-weight: 700; border-radius: 999px; padding: 5px 18px; }
.qz-retry-tag { display: inline-flex; align-items: center; background: #fff1f0; color: #e0524d; border: 1px solid #ffd4d1;
  font-size: 18px; font-weight: 700; border-radius: 999px; padding: 5px 15px; }
/* 作答后选项锁定（答错只标红错项、不揭示答案；答对正确项变绿） */
.q-opt.big { position: relative; }
.q-opt.big.locked { opacity: .6; cursor: default; }
.q-opt.big.locked:hover { transform: none; border-color: var(--border); background: var(--surface); }
.q-opt.big:disabled { cursor: default; }
.im-do .q-opt.big.locked:hover { transform: none; border-color: #e2e6f0; background: #fff; }
.im-do .q-opt.big.locked .qo-key { background: #f0f2f8; color: #9aa2b5; }
.qo-mark { flex: none; font-size: 21px; font-weight: 900; line-height: 1; }
.qo-mark-ok { color: #22c55e; }
.qo-mark-bad { color: #ef4444; }
/* 反馈条（原版式：emoji + 标题 + 解析 + 重试按钮） */
.qz-fb { display: flex; align-items: flex-start; gap: 12px; }
.qz-fb-emo { font-size: 28px; line-height: 1.3; flex: none; }
.qz-fb-main { flex: 1; min-width: 0; }
.qz-fb-main b { font-size: 18px; }
.im-do .qz-fb-main b { font-size: 17px; }
.qz-fb-main .ex { margin-top: 5px; }
.im-do .qz-fb { margin-top: 12px; padding: 11px 15px; }
.qz-retry-btn { background: #fff !important; color: #ea580c !important; border: 1.5px solid #fdba74 !important; }
.qz-retry-btn:hover:not(:disabled) { background: #fff7ed !important; color: #ea580c !important; filter: none !important; }
/* 橙色"下一题 / 查看成绩"胶囊按钮 */
.qz-next-wrap { display: flex; justify-content: center; margin-top: 13px; }
.qz-next-btn { display: inline-flex; align-items: center; gap: 9px; border: none; cursor: pointer; font-family: inherit;
  background: linear-gradient(135deg, #ff8a5c, #ff6b35); color: #fff; font-size: 17px; font-weight: 800;
  padding: 12px 46px; border-radius: 999px; box-shadow: 0 8px 20px rgba(255,107,53,.35);
  transition: filter .15s, transform .15s; }
.qz-next-btn:hover { filter: brightness(1.07); }
.qz-next-btn:active { transform: scale(.98); }
.qz-next-btn svg { transition: transform .15s; }
.qz-next-btn:hover svg { transform: translateX(3px); }
.im-do .qz-next-btn { font-size: 16px; padding: 10px 44px; }
/* 顶栏进度点：答错（跳过）的题红色 */
.im-q-dot.wrong { background: #fecaca; color: #b91c1b; border-color: #fca5a5; }

/* 写入 */
.im-do .write-q { font-size: 22px; font-weight: 700; color: #2a3142; margin-bottom: 12px; }
.im-do .write-area { width: 100%; border: 1.5px solid #e2e6f0; border-radius: 12px; padding: 16px; font-size: 20px;
  line-height: 1.5; font-family: inherit; resize: vertical; min-height: 100px; }
.im-do .write-count { flex: 1; font-size: 17px; color: #8b93a7; }

/* 底部提交栏 act-footer（原版式 1:1：完成提示 + 提交并返回课堂） */
.im-bottombar { flex: none; display: flex; align-items: center; justify-content: space-between; padding: 12px 20px;
  background: #fff; border-top: 1px solid #e6e9f2; }
.im-bb-left { display: flex; align-items: center; min-width: 0; }
.im-bb-done { font-size: 20px; font-weight: 700; color: #4a5468; display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.im-bb-done svg { flex: none; }
.im-submit { display: inline-flex; align-items: center; gap: 8px; background: #c9cdd8; color: #fff; border: none;
  font-size: 21px; font-weight: 800; padding: 15px 34px; border-radius: 999px; cursor: not-allowed; font-family: inherit; white-space: nowrap; }
.im-submit.done { background: linear-gradient(135deg, #ff8a5c, #ff6b35); cursor: pointer; box-shadow: 0 6px 18px rgba(255,107,53,.4); }
.im-submit.done:hover { transform: translateY(-1px); }
.im-submit:disabled { opacity: 1; }

/* 中宽屏：素养标签隐藏，保证顶栏三段不重叠 */
@media (max-width: 1200px) {
  .im-badge { display: none; }
}
/* 窄窗口：圆点/胶囊/工具按钮整体收紧（进度胶囊隐藏：圆点+底栏已承载进度信息） */
@media (max-width: 900px) {
  .im-topbar { gap: 8px; padding: 9px 12px; }
  .im-hdr-left { gap: 7px; }
  .im-back { padding: 6px 10px; font-size: 12.5px; }
  .im-act-name { font-size: 13.5px; }
  .im-hud-center { gap: 7px; }
  .im-progress { display: none; }
  .im-q-dots { gap: 4px; }
  .im-q-dot { width: 19px; height: 19px; font-size: 11px; }
  .im-topbar-right { gap: 6px; }
  .im-score { padding: 5px 9px; }
  .im-score-num { font-size: 14px; }
  .im-tool { width: 29px; height: 29px; border-radius: 8px; }
  .im-logout { padding: 6px 10px; font-size: 11.5px; }
}

@media (max-width: 700px) {
  .im-modal { width: calc(var(--vwpx, 1vw) * 98); max-height: calc(var(--vhpx, 1vh) * 96); }
  .im-body, .im-body-result { padding: 14px; }
  .im-topbar { padding: 9px 12px; gap: 8px; }
  .im-act-name { font-size: 13px; }
  .im-campus-badge { display: none; }
  .im-score, .im-badge { font-size: 11px; padding: 4px 8px; }
  .im-logout { padding: 6px 9px; font-size: 11px; }
  .imr-panel { padding: 20px 16px 18px; }
  .imr-scorebox { gap: 8px; }
  .imr-stat-num { font-size: 20px; }
  .imr-title { font-size: 19px; }
}

/* —— 右侧互动栏（参照右栏） —— */
.main.player-main .sl-rail { flex: none; width: 186px; align-self: center; display: flex; flex-direction: column; gap: 10px;
  padding: 14px 12px; border-radius: 18px; background: rgba(20,26,48,.72); border: 1px solid rgba(255,255,255,.08);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  max-height: calc(calc(var(--vhpx, 1vh) * 100) - 170px); overflow-y: auto; }
.main.player-main .sl-rail-title { color: #ffb25e; font-weight: 800; font-size: 14px; text-align: center;
  padding-bottom: 9px; border-bottom: 1px solid rgba(255,255,255,.1); letter-spacing: 1px; }
.main.player-main .sl-rail-item { display: flex; align-items: center; gap: 9px; background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1); border-radius: 13px; padding: 11px 12px; color: #dbe4f5;
  font-size: 13.5px; font-weight: 600; cursor: pointer; text-align: left; font-family: inherit; transition: .16s; }
.main.player-main .sl-rail-item:hover { background: rgba(255,255,255,.16); transform: translateX(-2px); }
.main.player-main .sl-rail-item.cur { background: linear-gradient(135deg, #ff8a5c, #ff6b35); border-color: rgba(255,255,255,.35);
  color: #fff; box-shadow: 0 6px 18px rgba(255,107,53,.4); }
.main.player-main .sl-rail-item.done { border-color: rgba(52,199,148,.5); color: #7fe6c0; }
.main.player-main .sl-rail-item.done.cur { color: #fff; }
.main.player-main .sl-rail-item.lock { opacity: .4; cursor: not-allowed; }
.main.player-main .sl-rail-ico { flex: none; font-size: 17px; }
.main.player-main .sl-rail-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.main.player-main .sl-rail-state { flex: none; font-size: 13px; font-weight: 800; }
.main.player-main .sl-rail-tip { text-align: center; font-size: 12px; color: rgba(255,255,255,.55); margin-top: 2px; }
@media (max-width: 1150px) { .main.player-main .sl-rail { display: none; } }

/* —— 底栏数字页码（2026-10-06：胶囊条居中，页数多时横向滑动、两侧箭头控制；🎮=互动页，橙=当前，✓=完成） —— */
.main.player-main .sl-bb-center { flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; gap: 5px; justify-content: center; min-width: 0; max-width: 1200px; }
.main.player-main .sl-bb-pillrow { display: flex; align-items: center; gap: 10px; width: 100%; justify-content: center; min-width: 0; }
.main.player-main .sl-pills { position: relative; overflow-anchor: none; display: flex; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; padding: 10px 0; margin: -10px 0;
  overflow-x: auto; overflow-y: hidden; scroll-behavior: smooth;
  scrollbar-width: none; -webkit-mask-image: none; mask-image: none; }
.main.player-main .sl-pills::-webkit-scrollbar { display: none; }
.main.player-main .sl-pill { flex: 1 1 auto; min-width: 36px; height: 48px; padding: 0; border-radius: 14px;
  background: rgba(255,255,255,.10); border: 1.5px solid rgba(255,255,255,.08); color: rgba(255,255,255,.85);
  font-size: clamp(15px, calc(var(--vwpx, 1vw) * 1.2), 20px); font-weight: 800; cursor: pointer; font-family: inherit; transition: .15s; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center; }
.main.player-main .sl-pill span { display: flex; align-items: center; justify-content: center; }
.main.player-main .sl-pill:hover:not(.lock) { background: rgba(255,255,255,.22); color: #fff; }
.main.player-main .sl-pill.work { border-color: rgba(255,140,60,.85); color: #ffb37a; background: rgba(255,107,53,.14); }
.main.player-main .sl-pill.work span { font-size: clamp(19px, calc(var(--vwpx, 1vw) * 1.7), 27px); }
.main.player-main .sl-pill.done { background: rgba(52,199,148,.20); border-color: rgba(52,199,148,.55); color: #7fe6c0; }
.main.player-main .sl-pill.done.work { border-color: rgba(52,199,148,.55); }
.main.player-main .sl-pill.lock { opacity: .45; cursor: not-allowed; }
/* 教师同步模式：非当前页的页码胶囊显示为不可点击 */
.main.player-main .sl-pill.sync-lock { opacity: .38; cursor: not-allowed; filter: grayscale(.5); }
.main.player-main .sl-pills-locked .sl-pill:not(.cur) { opacity: .38; cursor: not-allowed; }
.main.player-main .sl-page-num.sync-tag b { color: #5eead4; }
.main.player-main .sl-page-num.sync-tag::after { content: ' · 同步中'; font-size: 12px; color: #5eead4; font-weight: 600; }
.main.player-main .sl-pill.cur { background: #ff6b35; border-color: rgba(255,255,255,.5); color: #fff;
  transform: scale(1.22); box-shadow: 0 4px 18px rgba(255,107,53,.6); z-index: 2; }
/* 2026-10-06 页码条左右滑动箭头：胶囊溢出时点亮，未溢出时隐藏占位（布局不跳动） */
.main.player-main .sl-pill-scroll { flex: none; width: 32px; height: 48px; padding: 0; border-radius: 10px;
  background: rgba(255,255,255,.10); border: 1.5px solid rgba(255,255,255,.14); color: #e2e8f0;
  font-size: 24px; font-weight: 800; line-height: 1; cursor: pointer; font-family: inherit; transition: .15s;
  display: inline-flex; align-items: center; justify-content: center; }
.main.player-main .sl-pill-scroll:hover:not(:disabled) { background: rgba(255,255,255,.22); color: #fff; }
.main.player-main .sl-pill-scroll:disabled { visibility: hidden; cursor: default; }
.main.player-main .sl-page-num { font-size: 16px; color: rgba(255,255,255,.6); white-space: nowrap; text-align: center; font-weight: 600; line-height: 1.1; }
.main.player-main .sl-page-num b { color: #fff; font-size: 19px; font-weight: 800; }

/* —— 悬浮「进入互动」绿色呼吸按钮 —— */
.main.player-main .sl-enter-interact { right: 26px; bottom: 92px; z-index: 60; position: fixed; }
.main.player-main .sl-btn-enter {
  background: linear-gradient(135deg, #34d17f, #16a34a); color: #fff; border: none;
  font-weight: 800; font-size: 16px; padding: 14px 28px; border-radius: 999px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px; font-family: inherit; letter-spacing: 1px;
  box-shadow: 0 10px 30px rgba(34,197,94,.5); animation: wiPulse 1.9s ease-in-out infinite; transition: transform .15s; }
.main.player-main .sl-btn-enter:hover { transform: translateY(-2px) scale(1.04); }

/* —— 窄屏适配 —— */
@media (max-width: 900px) {
  .main.player-main .sl-bb-txt { display: none; }
  .main.player-main .sl-bb-left, .main.player-main .sl-bb-right { gap: 2px; }
  .main.player-main .sl-bb-btn { padding: 6px 7px; }
  .main.player-main .sl-bb-pillrow { gap: 8px; }
  .main.player-main .sl-pills { gap: 5px; }
  .main.player-main .sl-pill { min-width: 28px; height: 38px; border-radius: 11px; font-size: clamp(13px, calc(var(--vwpx, 1vw) * 1.1), 17px); }
  .main.player-main .sl-pill-scroll { width: 26px; height: 38px; border-radius: 8px; font-size: 19px; }
  .main.player-main .sl-pill.work span { font-size: clamp(15px, calc(var(--vwpx, 1vw) * 1.4), 20px); }
  .main.player-main .sl-page-num { font-size: 13px; }
  .main.player-main .sl-page-num b { font-size: 16px; }
}
@media (max-width: 760px) {
  .main.player-main .player-stage { padding: 18px 20px; }
  .main.player-main .player-body { padding: 8px 8px 4px; gap: 8px; }
}

/* ============================================================ */
/* 答对奖励浮层 + confetti + 最终成绩弹窗                        */
/* ============================================================ */
.reward-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.45);z-index:99999;display:flex;align-items:center;justify-content:center;pointer-events:auto}
.reward-fade-enter-active,.reward-fade-leave-active{transition:opacity .25s}
.reward-fade-enter-from,.reward-fade-leave-to{opacity:0}
.confetti-wrap{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;pointer-events:none}
.confetti-p{position:absolute;top:-20px;border-radius:2px;animation:confetti-fall 2.2s cubic-bezier(.25,.9,.35,1.2) forwards}
@keyframes confetti-fall{0%{transform:translate3d(0,0,0) rotate(0);opacity:1}100%{transform:translate3d(0,calc(var(--vhpx, 1vh) * 85),0) rotate(720deg);opacity:.9}}
.reward-card{position:relative;z-index:2;background:#fff;border-radius:22px;padding:36px 44px;text-align:center;min-width:320px;max-width:420px;box-shadow:0 20px 60px rgba(0,0,0,.35);animation:reward-pop .4s cubic-bezier(.25,1.5,.3,1)}
@keyframes reward-pop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}
.reward-bot{font-size:72px;line-height:1;margin-bottom:10px}
.reward-stars{font-size:36px;letter-spacing:6px;margin-bottom:10px}
.reward-star.on{color:#ffb800;text-shadow:0 2px 10px rgba(255,184,0,.6);animation:star-pop .3s ease both}
.reward-star.on:nth-child(2){animation-delay:.08s}.reward-star.on:nth-child(3){animation-delay:.16s}
.reward-star.off{color:#e4e4e4}
@keyframes star-pop{0%{transform:scale(0)}100%{transform:scale(1)}}
.reward-msg{font-size:24px;font-weight:700;color:#1f2937;margin-bottom:6px}
.reward-sub{font-size:15px;color:#6b7280}
.final-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);z-index:99999;display:flex;align-items:center;justify-content:center}
.final-card{background:#fff;border-radius:24px;padding:38px 44px 34px;text-align:center;min-width:360px;max-width:460px;box-shadow:0 24px 70px rgba(0,0,0,.4);animation:reward-pop .45s cubic-bezier(.25,1.5,.3,1)}
.final-bot{font-size:78px;line-height:1;margin-bottom:8px}
.final-msg{font-size:28px;font-weight:700;color:#1f2937;margin-bottom:6px}
.final-sub{font-size:15px;color:#6b7280;margin-bottom:14px}
.final-stars{font-size:32px;letter-spacing:6px;margin-bottom:20px}
.final-star.on{color:#ffb800;text-shadow:0 2px 10px rgba(255,184,0,.6);animation:star-pop .3s ease both}
.final-star.off{color:#e4e4e4}
.final-stats{display:flex;justify-content:center;gap:16px;margin-bottom:24px}
.fs-item{background:#f3f4f6;border-radius:14px;padding:14px 22px;flex:1}
.fs-num{font-size:26px;font-weight:700;color:#f97316}
.fs-label{font-size:12px;color:#6b7280;margin-top:2px}
.final-btns{display:flex;gap:14px;justify-content:center}
.final-btns .btn-primary{background:#2563eb;color:#fff;border:none;padding:12px 28px;border-radius:12px;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s}
.final-btns .btn-primary:hover{background:#1d4ed8}
.final-btns .btn-ghost{background:transparent;color:#6b7280;border:1.5px solid #d1d5db;padding:12px 28px;border-radius:12px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s}
.final-btns .btn-ghost:hover{color:#374151;border-color:#9ca3af;background:#f9fafb}
.hint-box{margin-top:12px;background:#fff7ed;border:1.5px solid #fed7aa;border-radius:12px;padding:10px 14px;font-size:14px;color:#9a3412}
.hint-box summary{cursor:pointer;font-weight:600;color:#ea580c}
.hint-box-locked{margin-top:12px;background:#f3f4f6;border:1.5px dashed #d1d5db;border-radius:12px;padding:10px 14px;font-size:14px;color:#9ca3af;text-align:center}
.fb{margin-top:14px;padding:14px 18px;border-radius:14px;font-size:15px;line-height:1.7}
.fb.ok{background:#dcfce7;color:#166534;border:1.5px solid #86efac}
.fb.ok b{font-weight:700}
.fb.ok .ex{margin-top:4px;color:#15803d}
.fb.ok .hint{margin-top:4px;color:#047857;font-size:14px}
.fb.no-tries{background:#fff7ed;color:#9a3412;border:1.5px solid #fed7aa}
.fb.no-tries b{font-weight:600;color:#c2410c}
.fb.no-tries .hint{color:#ea580c;margin-top:4px;font-size:14px}
.q-opt.big.right{background:#dcfce7!important;border-color:#22c55e!important;color:#166534!important;box-shadow:0 0 0 3px rgba(34,197,94,.2)}
.q-opt.big.wrong{background:#fee2e2!important;border-color:#ef4444!important;color:#991b1b!important}
/* ===== ��Ƶҳ�տư���r92�� ===== */
.player-stage .pc-video-head,
.stage-area .pc-video-head {
  display: flex; align-items: center; gap: 12px;
  background: #f1f5f9; border-radius: 10px; padding: 10px 18px;
  margin: 4px 0 12px;
}
.player-stage .pc-video-head-ico,
.stage-area .pc-video-head-ico {
  flex: none; width: 34px; height: 34px; border-radius: 8px;
  background: linear-gradient(135deg, #4f8cff, #2563eb);
  color: #fff; font-size: 16px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(37,99,235,.3);
}
.player-stage .pc-video-head-title,
.stage-area .pc-video-head-title {
  font-size: 22px; font-weight: 800; color: #1e293b; letter-spacing: .5px;
}
.player-stage .pc-video-think,
.stage-area .pc-video-think {
  margin-top: 20px; background: linear-gradient(135deg, #fff7ed, #ffffff);
  border: 1px solid #fed7aa; border-left: 5px solid #ff7a45;
  border-radius: 12px; padding: 14px 18px; display: flex; flex-direction: column; gap: 10px;
  box-shadow: 0 4px 14px rgba(255,122,69,.12);
}
.player-stage .pc-video-think-row,
.stage-area .pc-video-think-row {
  display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap;
}
.player-stage .pc-video-tag,
.stage-area .pc-video-tag {
  flex: none; display: inline-block;
  background: linear-gradient(135deg, #ff8a5c, #ff6b35);
  color: #fff; font-size: 14px; font-weight: 700;
  padding: 5px 14px; border-radius: 999px; line-height: 1.4; white-space: nowrap;
  box-shadow: 0 2px 6px rgba(255,107,53,.25);
}
.player-stage .pc-video-text,
.stage-area .pc-video-text {
  flex: 1; min-width: 200px;
  font-size: 17px; font-weight: 700; color: #1e293b; line-height: 1.75;
}

/* ===== 试卷测验闭环 · 教师端（v113）：成绩弹窗班级筛选 + 单元组卷弹窗 ===== */
body.is-teacher .pa-cls-filter {
  padding: 9px 12px; border: 1.5px solid #e2e8f0; border-radius: 10px;
  font-size: 14px; color: #2d3748; background: #fff; font-family: inherit;
  cursor: pointer; flex-shrink: 0;
}
body.is-teacher .pa-cls-filter:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
body.is-teacher .um-tip {
  margin: 12px 0 4px; padding: 10px 14px; border-radius: 10px;
  background: #eff6ff; border: 1px solid #bfdbfe;
  font-size: 13px; color: #9a3412; line-height: 1.7;
}
/* ===== 按班级发布（v114）：列表范围小字 + 发布弹窗班级多选 ===== */
body.is-teacher .pa-td-title .pa-scope {
  font-size: 12px; color: #64748b; margin-top: 3px; font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 220px;
}

/* ============================================================
 * 教师端主内容区文字整体放大（2026-09-16 · 用户要求）
 * 左侧目录（.sidebar .nav-item/.nav-group/.logo/.sidebar-logout）
 * 保持不变，保证一页放下；其余（页面标题/副标题/统计卡/表格/
 * 筛选/按钮/输入框/卡片/作品/作业/日程/试卷等）文字放大约 +25%。
 * 仅作用于教师端 body.is-teacher，不影响学生端。
 * ============================================================ */

/* —— 页面主/副标题 —— */
body.is-teacher .pg-title { font-size: 25px !important; }
body.is-teacher .pg-sub { font-size: 18px !important; line-height: 1.5 !important; }
body.is-teacher .view-title { font-size: 28px !important; }
body.is-teacher .view-subtitle { font-size: 17px !important; }
body.is-teacher .dash-view .view-title { font-size: 30px !important; }
body.is-teacher .dash-view .view-subtitle { font-size: 18px !important; }
body.is-teacher .crumb { font-size: 16px !important; }
body.is-teacher .crumb b { font-size: 16px !important; }

/* —— 顶部栏（面包屑 / 页签 / 上课状态）—— */
body.is-teacher .main-topbar .crumbs { font-size: 18px !important; }
body.is-teacher .main-topbar .crumbs .current { font-size: 18px !important; }
body.is-teacher .main-topbar .tab-btn { font-size: 18px !important; }
body.is-teacher .main-topbar .conn-pill { font-size: 18px !important; }
body.is-teacher .main-topbar .user-pill { font-size: 18px !important; }
body.is-teacher .main-topbar .student-view-btn { font-size: 18px !important; }
body.is-teacher .main-topbar .lock-pill { font-size: 18px !important; }

/* —— 顶栏通用工具按钮 —— */
body.is-teacher .topbar .tb { font-size: 16px !important; }
body.is-teacher .topbar .tb.mini { font-size: 15px !important; }
body.is-teacher .tag { font-size: 15px !important; }
body.is-teacher .tag.tag-super { font-size: 15px !important; }

/* —— 统计卡 —— */
body.is-teacher .stat-label { font-size: 16px !important; }
body.is-teacher .stat-value { font-size: 40px !important; }
body.is-teacher .stat-value .unit { font-size: 20px !important; }
body.is-teacher .stat-value small { font-size: 18px !important; }
body.is-teacher .stat-trend { font-size: 15px !important; }
body.is-teacher .kpi .v { font-size: 40px !important; }
body.is-teacher .kpi .l { font-size: 16px !important; }
body.is-teacher .bs-label { font-size: 15px !important; }
body.is-teacher .bs-value { font-size: 24px !important; }
body.is-teacher .bs-value small { font-size: 16px !important; }
body.is-teacher .bs-value.bs-time { font-size: 19px !important; }
body.is-teacher .bs-icon { font-size: 24px !important; }

/* —— 卡片标题 / 描述 —— */
body.is-teacher .card h3 { font-size: 17px !important; }
body.is-teacher .card .desc { font-size: 16px !important; line-height: 1.6 !important; }

/* —— 通用表格（学生/教师账号/报告等）—— */
body.is-teacher table th, body.is-teacher table td { font-size: 16px !important; line-height: 1.5 !important; }
body.is-teacher table.grid-table { font-size: 16px !important; }
body.is-teacher table.grid-table thead th { font-size: 15px !important; }
body.is-teacher table.grid-table thead th.unit-header { font-size: 16px !important; }
body.is-teacher table.grid-table .student-name { font-size: 16px !important; }
body.is-teacher table.grid-table .student-id { font-size: 15px !important; }
body.is-teacher table.grid-table .student-avatar { font-size: 20px !important; }
body.is-teacher .score-cell, body.is-teacher .avg-cell, body.is-teacher .personal-avg { font-size: 16px !important; }
body.is-teacher .dash-hint { font-size: 15px !important; }

/* —— 训练成绩页（.tc-root 系列）—— */
body.is-teacher .tc-subtab { font-size: 16px !important; }
body.is-teacher .tc-top-sub { font-size: 17px !important; }
body.is-teacher .tec-cat { font-size: 14px !important; }
body.is-teacher .tec-diff { font-size: 13px !important; }
body.is-teacher .tec-title { font-size: 17px !important; }
body.is-teacher .tec-meta, body.is-teacher .tec-stat { font-size: 14px !important; }
body.is-teacher .tec-btn { font-size: 14px !important; }
body.is-teacher .tc-entry-empty { font-size: 17px !important; }
body.is-teacher .tc-table { font-size: 16px !important; }
body.is-teacher .tc-table th { font-size: 20px !important; }
body.is-teacher .tc-table td { font-size: 18px !important; }
body.is-teacher .tc-avatar { font-size: 20px !important; }
body.is-teacher .tc-no-badge { font-size: 19px !important; }
body.is-teacher .tc-badge { font-size: 15px !important; }

/* —— 课后报告 / 作品 / 座位 / 证书 —— */
body.is-teacher .report-table th, body.is-teacher .report-table td { font-size: 16px !important; }
body.is-teacher .badge-report { font-size: 15px !important; }
body.is-teacher .hist-cls { font-size: 16px !important; }
body.is-teacher .history-head h3 { font-size: 19px !important; }
body.is-teacher .report-item .ri-lesson { font-size: 16px !important; }
body.is-teacher .report-item .ri-meta { font-size: 15px !important; }
body.is-teacher .work-card .wc-type { font-size: 14px !important; }
body.is-teacher .work-card .wc-title { font-size: 17px !important; }
body.is-teacher .work-card .wc-meta { font-size: 15px !important; }
body.is-teacher .work-card .wc-desc { font-size: 16px !important; }
body.is-teacher .like-btn { font-size: 16px !important; }
body.is-teacher .roster-card .rc-name { font-size: 16px !important; }
body.is-teacher .roster-card .rc-meta { font-size: 15px !important; }
body.is-teacher .cert { font-size: 14px !important; }
body.is-teacher .seat { font-size: 16px !important; }
body.is-teacher .seat .sn { font-size: 14px !important; }
body.is-teacher .podium { font-size: 15px !important; }

/* —— 学期报告（权重 / 学生卡）—— */
body.is-teacher .weight-row { font-size: 16px !important; }
body.is-teacher .weight-row .bar { height: 10px !important; }
body.is-teacher .stu-card { font-size: 16px !important; }
body.is-teacher .stu-card .av { font-size: 15px !important; }
body.is-teacher .parent-link { font-size: 15px !important; }

/* —— 作业收发 —— */
body.is-teacher .hw-item .hw-title { font-size: 16px !important; }
body.is-teacher .hw-item .hw-meta { font-size: 15px !important; }
body.is-teacher .hw-item .hw-note { font-size: 16px !important; line-height: 1.6 !important; }
body.is-teacher .hw-table { font-size: 16px !important; }
body.is-teacher .hw-table th { font-size: 17px !important; }
body.is-teacher .hw-table td { font-size: 16px !important; }
body.is-teacher .pa-stat-num { font-size: 28px !important; }
body.is-teacher .pa-stat-label { font-size: 15px !important; }
body.is-teacher .hw-meta-bar { font-size: 15px !important; }
body.is-teacher .hw-grade-label { font-size: 16px !important; }
body.is-teacher .hw-grade-chip { font-size: 16px !important; }

/* —— 日程中心（周课表）—— */
body.is-teacher .sched-table { font-size: 15px !important; }
body.is-teacher .sched-table thead th { font-size: 16px !important; }
body.is-teacher .sched-table tbody td { font-size: 15px !important; }
body.is-teacher .sched-table .sched-wubie { font-size: 17px !important; }
body.is-teacher .sched-table .sched-shike { font-size: 15px !important; }
body.is-teacher .sched-row-tools .sched-tools-label { font-size: 16px !important; }
body.is-teacher .sched-row-tools .sched-tools-hint { font-size: 15px !important; }

/* —— 备课中心 —— */
body.is-teacher .prep-cat-head b { font-size: 17px !important; }
body.is-teacher .prep-it-title { font-size: 16px !important; }
body.is-teacher .prep-it-meta { font-size: 13.5px !important; }
body.is-teacher .prep-tip { font-size: 16px !important; }
body.is-teacher .ov-title h2 { font-size: 25px !important; }
body.is-teacher .ov-title p { font-size: 16px !important; }
body.is-teacher .ov-prog-compact, body.is-teacher .opc-meta { font-size: 15px !important; }
body.is-teacher .ov-unit-name { font-size: 18px !important; }
body.is-teacher .ov-tcard-name { font-size: 15px !important; }
body.is-teacher .ov-tcard-state, body.is-teacher .ov-tact { font-size: 14px !important; }
body.is-teacher .pd-title { font-size: 26px !important; }
body.is-teacher .pd-goals-title { font-size: 17px !important; }
body.is-teacher .pd-goal-text { font-size: 16px !important; }
body.is-teacher .pd-tab { font-size: 16px !important; }
body.is-teacher .pd-act { font-size: 16px !important; }

/* —— 学生管理 —— */
body.is-teacher .stu-btn { font-size: 15px !important; }
body.is-teacher .stu-btn.stu-btn-search { font-size: 16px !important; }
body.is-teacher .stu-search { font-size: 16px !important; }
body.is-teacher .stu-search::placeholder { font-size: 15px !important; }
body.is-teacher .stu-search-ico { font-size: 16px !important; }
body.is-teacher .stu-search-clear { font-size: 13px !important; }
body.is-teacher .stu-toolbar select, body.is-teacher .stu-root select { font-size: 15px !important; }

/* —— 通用筛选 / 下拉 / 输入 / 按钮 —— */
body.is-teacher .select-wrap select, body.is-teacher select, body.is-teacher input[type=text] { font-size: 16px !important; }
body.is-teacher .dash-view .select-wrap select { font-size: 17px !important; }
body.is-teacher .dash-view .btn-ghost, body.is-teacher .btn-ghost { font-size: 17px !important; }
body.is-teacher .btn { font-size: 16px !important; }
body.is-teacher .btn.mini { font-size: 15px !important; }
body.is-teacher .stu-btn { font-size: 15px !important; }
body.is-teacher .btn-coze { font-size: 16px !important; }
body.is-teacher .topbar .tb { font-size: 16px !important; }

/* —— 试卷测验 —— */
body.is-teacher .pa-td-title { font-size: 16px !important; }
body.is-teacher .pa-td-title .pa-scope { font-size: 14px !important; }
body.is-teacher .pa-cls-filter { font-size: 16px !important; }
body.is-teacher .pub-all-btn { font-size: 18px !important; }
body.is-teacher .pub-cls-chip { font-size: 16px !important; }
body.is-teacher .paper-q .pq-head { font-size: 16px !important; }
body.is-teacher .pq-opt { font-size: 17px !important; }
body.is-teacher .result-chip { font-size: 16px !important; }
body.is-teacher .pub-scope-row { margin-bottom: 12px; }
body.is-teacher .pub-all-btn {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 12px 16px; border-radius: 12px; cursor: pointer; font-family: inherit;
  font-size: 15px; font-weight: 700; color: #2d3748;
  background: #fff; border: 2px solid #e2e8f0; transition: .15s;
}
body.is-teacher .pub-all-btn:hover { border-color: #93c5fd; }
body.is-teacher .pub-all-btn.on {
  background: #eff6ff; border-color: #2563eb; color: #1d4ed8;
}
body.is-teacher .pub-all-ico { font-size: 18px; }
body.is-teacher .pub-all-check { margin-left: auto; font-size: 16px; font-weight: 800; color: #2563eb; }
body.is-teacher .pub-cls-grid {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 4px;
  max-height: 240px; overflow-y: auto; padding: 2px;
}
body.is-teacher .pub-cls-chip {
  padding: 8px 14px; border-radius: 999px; cursor: pointer; font-family: inherit;
  font-size: 13.5px; font-weight: 600; color: #475569;
  background: #f8fafc; border: 1.5px solid #e2e8f0; transition: .12s;
}
body.is-teacher .pub-cls-chip:hover { border-color: #93c5fd; }
body.is-teacher .pub-cls-chip.on {
  background: #2563eb; border-color: #2563eb; color: #fff;
  box-shadow: 0 2px 8px rgba(37,99,235,.3);
}
/* ===== 试卷测验闭环 · 学生端（r78）：老师发布的试卷列表 ===== */
.tp-list-head {
  font-size: 15px; font-weight: 800; color: #1e293b;
  margin: 2px 0 10px; display: flex; align-items: center; gap: 6px;
}
.tp-card {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 14px; margin-bottom: 10px; border-radius: 14px;
  background: #f8fafc; border: 1.5px solid #e2e8f0; cursor: pointer;
  transition: .15s; text-align: left; width: 100%; font-family: inherit;
}
.tp-card:hover { border-color: #ff6b35; background: #fff7ed; transform: translateY(-1px); }
.tp-card:active { transform: translateY(0); }
.tp-title { font-size: 15px; font-weight: 800; color: #1e293b; margin-bottom: 4px; }
.tp-meta { font-size: 12px; color: #64748b; }
.tp-side { flex-shrink: 0; text-align: center; }
.tp-go { font-size: 13px; font-weight: 800; color: #ff6b35; }
.tp-score { font-size: 17px; font-weight: 800; color: #16a34a; }
.tp-score.bad { color: #ef4444; }
.tp-act { font-size: 11px; color: #94a3b8; margin-top: 2px; }
.tp-locked { font-size: 12px; color: #94a3b8; }
.tp-self {
  margin-top: 14px; padding: 12px 14px; border-radius: 14px;
  background: #f0f9ff; border: 1.5px dashed #bae6fd;
}
.tp-self-title { font-size: 14px; font-weight: 800; color: #0369a1; margin-bottom: 4px; }
.tp-self-desc { font-size: 12px; color: #64748b; margin-bottom: 10px; }
.tp-loading, .tp-empty-tip { font-size: 12px; color: #94a3b8; margin-bottom: 10px; }

/* ===== 作业收发闭环 · 学生端「我的作业」（r79）===== */
/* 列表催交横幅 */
.hw-remind-banner {
  display: flex; align-items: center; gap: 6px;
  margin-bottom: 12px; padding: 10px 14px; border-radius: 12px;
  background: #fef2f2; border: 1.5px solid #fecaca;
  color: #b91c1c; font-size: 13px; font-weight: 700;
  animation: hwPulse 1.6s ease-in-out infinite;
}
@keyframes hwPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(239,68,68,0); } 50% { box-shadow: 0 0 0 4px rgba(239,68,68,.12); } }
/* 列表卡片 */
.hw-card-s { border-left: 4px solid #0ea5a0; }
.hw-dot-s {
  display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 999px;
  background: #ef4444; color: #fff; font-size: 11px; font-weight: 700; vertical-align: 2px;
}
.hw-state-s { font-size: 12.5px; font-weight: 800; color: #f59e0b; }
.hw-state-s.ok { color: #16a34a; }
.hw-state-s.late { color: #ef4444; }
.hw-go-s { font-size: 13px; font-weight: 800; color: #0ea5a0; margin-top: 2px; }
/* 列表/详情等第大字 */
.hw-grade-s { font-size: 20px; font-weight: 900; line-height: 1.1; }
.hw-grade-s.excellent, .hwg-val.excellent, .hwr-grade.excellent { color: #e06000; }
.hw-grade-s.good, .hwg-val.good, .hwr-grade.good { color: #16a34a; }
.hw-grade-s.pass, .hwg-val.pass, .hwr-grade.pass { color: #2563eb; }
.hw-grade-s.fail, .hwg-val.fail, .hwr-grade.fail { color: #ef4444; }
/* 详情卡片 */
.hw-topbar { margin-top: 0; margin-bottom: 12px; justify-content: flex-start; align-items: center; }
.hw-submit-title { font-size: 13px; font-weight: 800; color: #475569; }
.hw-detail-card {
  padding: 14px 16px; border-radius: 14px; margin-bottom: 12px;
  background: #f0fdfa; border: 1.5px solid #99f6e4;
}
.hw-detail-title { font-size: 16px; font-weight: 900; color: #134e4a; margin-bottom: 6px; }
.hw-detail-meta { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; color: #64748b; margin-bottom: 8px; }
.hw-overdue { color: #ef4444; font-weight: 800; }
.hw-detail-desc {
  font-size: 13px; color: #334155; line-height: 1.7; white-space: pre-wrap;
  padding: 10px 12px; border-radius: 10px; background: #fff; border: 1px solid #e2e8f0;
}
.hw-attach {
  display: inline-block; margin-top: 10px; padding: 7px 12px; border-radius: 10px;
  background: #fff; border: 1.5px dashed #0ea5a0; color: #0f766e;
  font-size: 12.5px; font-weight: 700; text-decoration: none;
}
.hw-attach:hover { background: #f0fdfa; }
/* 我的提交卡片 */
.hw-mine-card {
  padding: 14px 16px; border-radius: 14px; margin-bottom: 12px;
  background: #f8fafc; border: 1.5px solid #e2e8f0;
}
.hw-mine-head { font-size: 14px; font-weight: 800; color: #1e293b; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hw-late-tag {
  padding: 1px 8px; border-radius: 999px; font-size: 11px; font-weight: 700;
  background: #fef3c7; color: #b45309;
}
.hw-file-item {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 9px 12px; margin-bottom: 8px; border-radius: 10px;
  background: #fff; border: 1.5px solid #e2e8f0; text-decoration: none;
}
.hw-file-item:hover { border-color: #0ea5a0; }
.hw-file-name {
  font-size: 12.5px; font-weight: 700; color: #334155;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.hw-file-view { flex-shrink: 0; font-size: 12px; font-weight: 800; color: #0ea5a0; }
.hw-file-del {
  flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; border: none; cursor: pointer;
  background: #fee2e2; color: #ef4444; font-size: 14px; font-weight: 800; line-height: 1;
}
.hw-file-del:hover { background: #ef4444; color: #fff; }
.hw-file-count { font-size: 11.5px; color: #94a3b8; margin-top: 2px; }
.hw-text-show {
  font-size: 13px; color: #334155; line-height: 1.8; white-space: pre-wrap;
  padding: 10px 12px; border-radius: 10px; background: #fff; border: 1px solid #e2e8f0;
}
.hw-quiz-score {
  display: flex; align-items: baseline; gap: 10px; padding: 8px 12px;
  border-radius: 10px; background: #fff; border: 1px solid #e2e8f0;
}
.hqs-num { font-size: 17px; font-weight: 900; color: #0ea5a0; }
.hqs-rate { font-size: 12px; color: #64748b; }
.hw-grade-bar {
  display: flex; align-items: center; gap: 8px; margin-top: 10px;
  padding: 10px 12px; border-radius: 10px; background: #fffbeb; border: 1px solid #fde68a;
}
.hwg-label { font-size: 12px; color: #92400e; font-weight: 700; }
.hwg-val { font-size: 18px; font-weight: 900; }
.hwg-by { margin-left: auto; font-size: 11px; color: #b45309; }
.hw-comment {
  margin-top: 8px; padding: 10px 12px; border-radius: 10px;
  background: #fff; border: 1px dashed #fbbf24; font-size: 12.5px; color: #334155; line-height: 1.7;
}
.hw-wait-grade { margin-top: 10px; font-size: 12.5px; color: #94a3b8; }
.hw-submit-entry { justify-content: center; }

/* ===== 教师端 · 作业收发：统计卡 / 列表表格 / 批改弹窗（v39 补齐） ===== */
/* 顶部统计卡（作业批改弹窗 + 试卷成绩弹窗共用） */
body.is-teacher .pa-stats { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
body.is-teacher .pa-stat {
  flex: 1 1 110px; min-width: 110px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  padding: 12px 8px; border-radius: 12px; background: #f8fafc; border: 1.5px solid #e2e8f0;
}
body.is-teacher .pa-stat-num { font-size: 24px; font-weight: 900; color: #2563eb; line-height: 1.1; }
body.is-teacher .pa-stat-label { font-size: 12px; color: #64748b; font-weight: 600; white-space: nowrap; }
body.is-teacher .pa-stat-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding-left: 4px; }
/* 作业元信息条 */
body.is-teacher .hw-meta-bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px;
  font-size: 12.5px; color: #475569; font-weight: 600;
  padding: 10px 14px; margin-bottom: 12px; border-radius: 10px; background: #f8fafc; border: 1px solid #e2e8f0;
}
body.is-teacher .hw-meta-desc { flex-basis: 100%; color: #334155; font-weight: 500; line-height: 1.6; white-space: pre-wrap; }
/* 作业列表 / 名单表格：数字列居中对齐，作业名称列左对齐（表头与内容统一） */
body.is-teacher .hw-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
body.is-teacher .hw-table th {
  text-align: center; font-size: 14px; font-weight: 800; color: #fff;
  padding: 15px 12px; background: linear-gradient(135deg,#0fa9a3,#0c8f8a);
  border-bottom: 2px solid #0c8f8a; white-space: nowrap; letter-spacing: .5px;
}
body.is-teacher .hw-table td { padding: 12px 12px; border-bottom: 1px solid #f1f5f9; color: #334155; vertical-align: middle; text-align: center; }
body.is-teacher .hw-table th:first-child, body.is-teacher .hw-table td:first-child { text-align: left; }
body.is-teacher .hw-table tbody tr:hover { background: #f0fdfa; }
body.is-teacher .pa-td-title { font-weight: 700; color: #1e293b; text-align: left; }
body.is-teacher .pa-scope { font-size: 11.5px; color: #94a3b8; font-weight: 500; margin-top: 2px; text-align: left; }
body.is-teacher .pa-td-op { white-space: nowrap; }
body.is-teacher .rpt-empty { text-align: center; color: #94a3b8; padding: 26px 0; font-size: 13px; }
/* 批改展开行 */
body.is-teacher .pa-detail-row > td { background: #fbfcfe; padding: 0 !important; }
body.is-teacher .hw-detail { padding: 16px 18px; }
body.is-teacher .hw-sub-files { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 6px; }
body.is-teacher .hw-file-chip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 7px 12px; border-radius: 10px; text-decoration: none;
  background: #fff; border: 1.5px solid #bae6fd; color: #0369a1; font-size: 12.5px; font-weight: 700;
}
body.is-teacher .hw-file-chip:hover { background: #f0f9ff; border-color: #0ea5e9; }
body.is-teacher .hw-img-preview { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 0 4px; }
body.is-teacher .hw-sub-img {
  width: 150px; height: 105px; object-fit: cover; border-radius: 10px;
  border: 2px solid #fff; box-shadow: 0 2px 8px rgba(15,23,42,.12); cursor: zoom-in; transition: .15s;
}
body.is-teacher .hw-sub-img:hover { transform: scale(1.03); box-shadow: 0 6px 16px rgba(15,23,42,.2); }
body.is-teacher .hw-sub-text {
  font-size: 13.5px; color: #1e293b; line-height: 1.85; white-space: pre-wrap;
  padding: 12px 14px; border-radius: 10px; background: #fff; border: 1px solid #e2e8f0;
}
/* 习题作答明细 */
body.is-teacher .hw-sub-quiz { margin-bottom: 4px; }
body.is-teacher .pa-qdetail { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; }
body.is-teacher .pa-qd-item {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 8px 12px; border-radius: 8px; background: #fff; border: 1px solid #e2e8f0; font-size: 12.5px;
}
body.is-teacher .pa-qd-item.ok { border-left: 4px solid #16a34a; }
body.is-teacher .pa-qd-item.bad { border-left: 4px solid #ef4444; background: #fef2f2; }
body.is-teacher .pa-qd-no { flex-shrink: 0; width: 20px; height: 20px; border-radius: 50%; background: #e2e8f0; color: #475569; font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
body.is-teacher .pa-qd-q { font-weight: 700; color: #1e293b; }
body.is-teacher .pa-qd-ans, body.is-teacher .pa-qd-right { color: #64748b; }
body.is-teacher .pa-qd-mark { margin-left: auto; font-size: 15px; font-weight: 900; }
body.is-teacher .pa-qd-item.ok .pa-qd-mark { color: #16a34a; }
body.is-teacher .pa-qd-item.bad .pa-qd-mark { color: #ef4444; }
/* 批改区 */
body.is-teacher .hw-grade-area {
  margin-top: 12px; padding: 14px 16px; border-radius: 12px;
  background: #eff6ff; border: 1.5px solid #fde68a;
}
body.is-teacher .hw-grade-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
body.is-teacher .hw-grade-label { font-size: 13px; font-weight: 800; color: #1e3a8a; flex-shrink: 0; }
body.is-teacher .hw-graded-by { margin-left: auto; font-size: 12px; color: #1d4ed8; font-weight: 700; white-space: nowrap; }
/* 等第胶囊 */
body.is-teacher .hw-grade-chip {
  border: 1.5px solid #e2e8f0; background: #fff; color: #64748b;
  padding: 6px 18px; border-radius: 999px; font-size: 13.5px; font-weight: 800; cursor: pointer; transition: .15s;
}
body.is-teacher .hw-grade-chip:hover { border-color: #f59e0b; }
body.is-teacher .hw-grade-chip.hg-优.on { background: #1d4ed8; border-color: #1d4ed8; color: #fff; box-shadow: 0 2px 8px rgba(234,88,12,.3); }
body.is-teacher .hw-grade-chip.hg-良.on { background: #16a34a; border-color: #16a34a; color: #fff; box-shadow: 0 2px 8px rgba(22,163,74,.3); }
body.is-teacher .hw-grade-chip.hg-合格.on { background: #2563eb; border-color: #2563eb; color: #fff; box-shadow: 0 2px 8px rgba(37,99,235,.3); }
body.is-teacher .hw-grade-chip.hg-需改进.on { background: #dc2626; border-color: #dc2626; color: #fff; box-shadow: 0 2px 8px rgba(220,38,38,.3); }
/* 快捷评语胶囊 */
body.is-teacher .hw-cmt-chip {
  border: 1.5px solid #bfdbfe; background: #fff; color: #1d4ed8;
  padding: 5px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: .15s;
}
body.is-teacher .hw-cmt-chip:hover { background: #dbeafe; border-color: #93c5fd; }
body.is-teacher .hw-cmt-chip.hw-cmt-warn { border-color: #fecaca; background: #fff; color: #b91c1c; }
body.is-teacher .hw-cmt-chip.hw-cmt-warn:hover { background: #fef2f2; border-color: #ef4444; }
/* 评语输入大框 */
body.is-teacher .hw-cmt-input {
  width: 100%; box-sizing: border-box; min-height: 110px; resize: vertical;
  padding: 10px 12px; border-radius: 10px; font-family: inherit;
  font-size: 13.5px; line-height: 1.75; color: #1e293b;
  background: #fff; border: 1.5px solid #fcd34d; outline: none; transition: .15s;
}
body.is-teacher .hw-cmt-input:focus { border-color: #f59e0b; box-shadow: 0 0 0 3px rgba(245,158,11,.12); }
/* 批改操作按钮行 */
body.is-teacher .hw-grade-ops { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
/* 发布作业弹窗：类型切换页签 + 附件行 */
body.is-teacher .hw-type-tabs { display: flex; gap: 10px; margin-bottom: 16px; }
body.is-teacher .hw-type-tab {
  flex: 1; padding: 10px 6px; border-radius: 10px; border: 1.5px solid #e2e8f0; background: #fff;
  font-size: 13.5px; font-weight: 700; color: #64748b; cursor: pointer; transition: .15s;
}
body.is-teacher .hw-type-tab:hover { border-color: #2563eb; }
body.is-teacher .hw-type-tab.active { background: #2563eb; border-color: #2563eb; color: #fff; box-shadow: 0 3px 10px rgba(37,99,235,.25); }
body.is-teacher .hw-attach-row { margin-top: 16px; padding: 14px 16px; border-radius: 12px; background: #f8fafc; border: 1px dashed #cbd5e1; }
body.is-teacher .hw-attach-label { display: block; font-size: 13px; font-weight: 700; color: #475569; margin-bottom: 10px; line-height: 1.6; }
body.is-teacher .hw-attach-btn {
  display: inline-block; padding: 9px 16px; border-radius: 10px; cursor: pointer;
  background: #fff; border: 1.5px solid #0ea5a0; color: #0f766e; font-size: 13px; font-weight: 700; transition: .15s;
}
body.is-teacher .hw-attach-btn:hover { background: #f0fdfa; }
body.is-teacher .hw-attach-file { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 700; color: #0f766e; }
/* 提交页 */
.hw-up-zone {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  padding: 26px 14px; border-radius: 14px; margin-bottom: 12px; cursor: pointer;
  background: #f0fdfa; border: 2px dashed #5eead4; transition: .15s; text-align: center;
}
.hw-up-zone:hover { border-color: #0ea5a0; background: #ccfbf1; }
.hw-up-ico { font-size: 30px; line-height: 1; }
.hw-up-txt { font-size: 14.5px; font-weight: 800; color: #0f766e; }
.hw-up-sub { font-size: 11.5px; color: #94a3b8; }
.hw-text-area {
  width: 100%; box-sizing: border-box; min-height: 180px; resize: vertical;
  padding: 12px 14px; border-radius: 12px; font-family: inherit;
  font-size: 13.5px; line-height: 1.8; color: #1e293b;
  background: #fff; border: 1.5px solid #e2e8f0; outline: none;
}
.hw-text-area:focus { border-color: #0ea5a0; }
.hw-text-count { text-align: right; font-size: 11.5px; color: #94a3b8; margin-top: 4px; }
.hw-text-count.max { color: #ef4444; font-weight: 800; }
.hw-quiz-q {
  padding: 12px 14px; border-radius: 12px; margin-bottom: 10px;
  background: #f8fafc; border: 1.5px solid #e2e8f0;
}
.hqq-num { font-size: 12px; font-weight: 800; color: #0ea5a0; margin-bottom: 4px; }
.hqq-score { color: #94a3b8; font-weight: 600; margin-left: 4px; }
.hqq-text { font-size: 13.5px; font-weight: 700; color: #1e293b; margin-bottom: 10px; line-height: 1.6; }
.hw-quiz-q .q-opt { display: block; width: 100%; text-align: left; margin-bottom: 8px; }
.hw-quiz-q .q-opt:last-child { margin-bottom: 0; }
/* 回执页 */
.hw-receipt {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 30px 16px 16px; text-align: center;
}
.hwr-ico { font-size: 46px; line-height: 1; }
.hwr-title { font-size: 17px; font-weight: 900; color: #1e293b; }
.hwr-score { font-size: 26px; font-weight: 900; color: #0ea5a0; }
.hwr-grade { font-size: 15px; font-weight: 800; }
.hwr-sub { font-size: 12.5px; color: #94a3b8; }

/* ==================== AI 教学助手（对话式操作平台）==================== */
/* 悬浮球：右下角固定，渐变蓝金双色 */
.ai-fab {
  position: fixed; right: 28px; bottom: 28px; z-index: 9600;
  width: 60px; height: 60px; border: none; border-radius: 50%;
  background: linear-gradient(135deg, #4f8cff 0%, #46c8e0 100%);
  box-shadow: 0 6px 22px rgba(79, 140, 255, 0.45);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.ai-fab:hover { transform: translateY(-3px) scale(1.05); box-shadow: 0 10px 28px rgba(79, 140, 255, 0.55); }
.ai-fab.on { background: linear-gradient(135deg, #64748b 0%, #94a3b8 100%); box-shadow: 0 6px 18px rgba(71, 85, 105, 0.4); }
.ai-fab-ico { color: #fff; font-size: 19px; font-weight: 900; letter-spacing: 0.5px; font-family: Consolas, 'Microsoft YaHei', sans-serif; }
.ai-fab-dot {
  position: absolute; top: 4px; right: 4px; width: 12px; height: 12px;
  background: #fbbf24; border: 2px solid #fff; border-radius: 50%;
  animation: aiPulse 1s infinite alternate;
}
@keyframes aiPulse { from { opacity: 0.4; } to { opacity: 1; } }

/* 对话面板：悬浮球上方弹出 */
.ai-panel {
  position: fixed; right: 28px; bottom: 100px; z-index: 9601;
  width: 400px; height: 540px; max-height: calc(100vh - 140px);
  background: #ffffff; border-radius: 18px;
  box-shadow: 0 18px 55px rgba(15, 23, 42, 0.28);
  border: 1px solid #e2e8f0;
  display: flex; flex-direction: column; overflow: hidden;
}
/* 面板头 */
.ai-head {
  display: flex; align-items: center; gap: 10px;
  padding: 14px 16px; background: linear-gradient(135deg, #4f8cff 0%, #46c8e0 100%);
  flex-shrink: 0;
}
.ai-head-ico { font-size: 24px; }
.ai-head-txt { flex: 1; min-width: 0; }
.ai-head-txt b { display: block; color: #fff; font-size: 15px; font-weight: 800; }
.ai-head-txt i { display: block; color: rgba(255, 255, 255, 0.85); font-size: 12px; font-style: normal; margin-top: 2px; }
.ai-head-close {
  border: none; background: rgba(255, 255, 255, 0.22); color: #fff;
  width: 28px; height: 28px; border-radius: 8px; font-size: 16px;
  cursor: pointer; line-height: 1;
}
.ai-head-close:hover { background: rgba(255, 255, 255, 0.35); }

/* 消息区 */
.ai-msgs { flex: 1; overflow-y: auto; padding: 14px 14px 8px; background: #f6f8fb; }
.ai-m { display: flex; margin-bottom: 10px; align-items: flex-start; }
.ai-m.user { justify-content: flex-end; }
.ai-m-who {
  flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 800; color: #fff;
}
.ai-m.user .ai-m-who { order: 2; margin-left: 8px; background: #2563eb; }
.ai-m.assistant .ai-m-who { margin-right: 8px; background: #4f8cff; }
.ai-m-bub {
  max-width: 78%; padding: 9px 12px; border-radius: 12px;
  font-size: 13.5px; line-height: 1.65; word-break: break-word;
}
.ai-m.user .ai-m-bub { order: 1; background: #4f8cff; color: #fff; border-top-right-radius: 4px; }
.ai-m.assistant .ai-m-bub { background: #ffffff; color: #1e293b; border: 1px solid #e2e8f0; border-top-left-radius: 4px; }
.ai-m.sys { justify-content: center; }
.ai-m.sys .ai-m-bub {
  max-width: 92%; background: #ecfdf5; color: #047857;
  border: 1px solid #a7f3d0; font-size: 12.5px; text-align: center; border-radius: 10px;
}
/* AI 正在输入动画（三个点） */
.ai-typing { display: flex; gap: 5px; align-items: center; padding: 12px 14px; }
.ai-typing i {
  width: 7px; height: 7px; border-radius: 50%; background: #94a3b8;
  animation: aiTyping 1.2s infinite;
}
.ai-typing i:nth-child(2) { animation-delay: 0.2s; }
.ai-typing i:nth-child(3) { animation-delay: 0.4s; }
@keyframes aiTyping { 0%, 60%, 100% { transform: translateY(0); opacity: 0.4; } 30% { transform: translateY(-5px); opacity: 1; } }

/* 输入行 */
.ai-input-row {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 14px; background: #ffffff; border-top: 1px solid #e2e8f0; flex-shrink: 0;
}
.ai-mic {
  flex-shrink: 0; width: 40px; height: 40px; border-radius: 12px;
  border: 1.5px solid #e2e8f0; background: #ffffff; font-size: 18px;
  cursor: pointer; transition: all 0.15s ease;
}
.ai-mic:hover { border-color: #4f8cff; background: #f0f7ff; }
.ai-mic.rec { background: #ef4444; border-color: #ef4444; animation: aiPulse 0.8s infinite alternate; }
.ai-input {
  flex: 1; min-width: 0; height: 40px; padding: 0 12px;
  border: 1.5px solid #e2e8f0; border-radius: 12px;
  font-size: 13.5px; color: #1e293b; outline: none;
  font-family: 'Microsoft YaHei', sans-serif;
}
.ai-input:focus { border-color: #4f8cff; }
.ai-input:disabled { background: #f1f5f9; color: #94a3b8; }
.ai-send {
  flex-shrink: 0; height: 40px; padding: 0 16px; border: none; border-radius: 12px;
  background: linear-gradient(135deg, #4f8cff 0%, #46c8e0 100%);
  color: #fff; font-size: 13.5px; font-weight: 800; cursor: pointer;
  font-family: 'Microsoft YaHei', sans-serif;
}
.ai-send:hover { opacity: 0.92; }
.ai-send.off { background: #cbd5e1; cursor: not-allowed; }

/* ============================================================
 * 课件文字放大 & 图文一页排版（2026-09-11 · r86）
 * 学生端播放器舞台 + 互动答题弹窗整体放大一档；
 * 教师端投影课件见 课时播放器.html 内联覆盖（同步方案）。
 * 设计视口 1920×1080：舞台标题 26-36 / 正文 18-23 /
 * 图文卡片 16.5-22 / 金句 20-33 / 互动题 17-22
 * ============================================================ */

/* —— ① 舞台基础：页标题 / 正文 —— */
.main.player-main .player-stage .ptitle { font-size: clamp(26px, calc(var(--vwpx, 1vw) * 2.6), 36px); }
.main.player-main .player-stage .body { font-size: clamp(18px, calc(var(--vwpx, 1vw) * 1.55), 23px); line-height: 1.75; }

/* —— ② twocol 左文右图 —— */
.main.player-main .twocol-grid { gap: clamp(24px, calc(var(--vwpx, 1vw) * 3.4), 54px); }
.main.player-main .twocol-txt .ptitle { font-size: clamp(26px, calc(var(--vwpx, 1vw) * 2.5), 35px); margin-bottom: 12px; }
.main.player-main .twocol-lead { font-size: clamp(17px, calc(var(--vwpx, 1vw) * 1.55), 23px); line-height: 1.65; }
.main.player-main .twocol-points { gap: 9px; }
.main.player-main .twocol-points li { font-size: clamp(16.5px, calc(var(--vwpx, 1vw) * 1.5), 22px); line-height: 1.55; padding: 10px 16px 10px 48px; }
.main.player-main .twocol-points li::before { width: 24px; height: 24px; left: 12px; }
.main.player-main .twocol-points li::after { width: 24px; line-height: 24px; left: 12px; font-size: 13px; }
.main.player-main .twocol-tip { font-size: clamp(15px, calc(var(--vwpx, 1vw) * 1.25), 19px); padding: 11px 16px; }

/* —— twocol·ilr 左图右文（最终字号版） —— */
.main.player-main .twocol-grid.ilr { grid-template-columns: 1.4fr 1fr; gap: clamp(16px, calc(var(--vwpx, 1vw) * 2), 28px); }
.main.player-main .twocol-grid.ilr .twocol-img { order: 1; }
.main.player-main .twocol-grid.ilr .twocol-txt { order: 2; }
.main.player-main .twocol-grid.ilr .twocol-txt .ptitle { font-size: clamp(20px, calc(var(--vwpx, 1vw) * 1.8), 28px); margin-bottom: 8px; }
.main.player-main .twocol-grid.ilr .twocol-lead { font-size: clamp(13px, calc(var(--vwpx, 1vw) * 1.15), 17px); line-height: 1.5; padding: 9px 13px; }
.main.player-main .twocol-grid.ilr .twocol-points { gap: 5px; }
.main.player-main .twocol-grid.ilr .twocol-points li {
  font-size: clamp(12px, calc(var(--vwpx, 1vw) * 1.05), 16px); line-height: 1.45; padding: 6px 12px 6px 36px;
}
.main.player-main .twocol-grid.ilr .twocol-points li::before,
.main.player-main .twocol-grid.ilr .twocol-points li::after { width: 18px; height: 18px; left: 8px; }
.main.player-main .twocol-grid.ilr .twocol-points li::after { font-size: 10px; line-height: 18px; }
.main.player-main .twocol-grid.ilr .twocol-tip { font-size: clamp(12px, calc(var(--vwpx, 1vw) * 1), 15px); padding: 8px 12px; }

/* —— ③ imgtop 上图下文（tb 模式）—— */
.main.player-main .imgtop-txt { gap: 10px; }
.main.player-main .imgtop-txt .twocol-lead { font-size: clamp(16px, calc(var(--vwpx, 1vw) * 1.35), 20.5px); }
.main.player-main .imgtop-points { gap: 12px; }
.main.player-main .imgtop-points li { font-size: clamp(15.5px, calc(var(--vwpx, 1vw) * 1.3), 19px); line-height: 1.55; padding: 10px 16px; }

/* —— ④ 大图数据页（imagefull）—— */
.main.player-main .imagefull-grid { gap: clamp(24px, calc(var(--vwpx, 1vw) * 3), 44px); }
.main.player-main .if-stat { padding: 15px 20px; }
.main.player-main .if-k { font-size: clamp(18px, calc(var(--vwpx, 1vw) * 1.6), 22.5px); }
.main.player-main .if-v { margin-top: 6px; font-size: clamp(15.5px, calc(var(--vwpx, 1vw) * 1.3), 19px); line-height: 1.6; }
.main.player-main .imagefull-note { margin-top: 14px; font-size: clamp(15px, calc(var(--vwpx, 1vw) * 1.25), 18.5px); padding: 13px 18px; }

/* —— ⑤ 金句页 —— */
.main.player-main .quote-lines { gap: 24px; }
.main.player-main .quote-line { font-size: clamp(20px, calc(var(--vwpx, 1vw) * 2.2), 30px); }
.main.player-main .quote-kw { font-size: clamp(22px, calc(var(--vwpx, 1vw) * 2.4), 33px); }
.main.player-main .quote-tip { margin-top: 26px; font-size: clamp(14px, calc(var(--vwpx, 1vw) * 1.15), 17.5px); padding: 10px 22px; }

/* —— ⑥ 三点小结 —— */
.main.player-main .summary3-item { padding: 12px 18px; font-size: clamp(19px, calc(var(--vwpx, 1vw) * 1.9), 25px); }
.main.player-main .summary3-item .s3-num { flex: 0 0 38px; height: 38px; font-size: 18px; }
.main.player-main .summary3-img img { max-height: 440px; }

/* —— ⑦ 视频页：标题条 + 思考卡放大 —— */
.main.player-main .pc-video-head { padding: 12px 22px; }
.main.player-main .pc-video-head-ico { width: 40px; height: 40px; font-size: 19px; }
.main.player-main .pc-video-head-title { font-size: clamp(21px, calc(var(--vwpx, 1vw) * 2), 28px); }
.main.player-main .pc-video-think { margin-top: 14px; padding: 15px 22px; gap: 11px; }
.main.player-main .pc-video-tag { font-size: clamp(14px, calc(var(--vwpx, 1vw) * 1.2), 17px); padding: 6px 16px; }
.main.player-main .pc-video-text { font-size: clamp(17px, calc(var(--vwpx, 1vw) * 1.5), 21.5px); line-height: 1.7; }
.main.player-main .vm-label { font-size: clamp(14px, calc(var(--vwpx, 1vw) * 1.15), 17px); }

/* —— ⑧ 互动答题弹窗（im-modal）：加宽 + 题面/选项/反馈放大 —— */
.im-modal { width: min(1100px, calc(var(--vwpx, 1vw) * 92)); }
.im-do .q-card { padding: 18px 22px; margin-bottom: 14px; }
.im-do .q-text { font-size: 21px; line-height: 1.6; }
.im-do .q-opts { gap: 12px; }
.im-do .q-opt.big { font-size: 19px; padding: 14px 22px; }
.im-do .qo-key { width: 34px; height: 34px; font-size: 17px; }
.im-do .fb { padding: 15px 18px; font-size: 16.5px; }
.im-do .fb b { font-size: 18px; }
.im-do .fb .ex, .im-do .fb .hint { font-size: 15.5px; }
.im-do .sort-hint, .im-do .ck-tip { font-size: 15px; }
.im-do .sort-list { gap: 10px; }
.im-do .sort-row { padding: 13px 18px; }
.im-do .sort-txt { font-size: 17.5px; }
.im-do .sort-no { width: 30px; height: 30px; font-size: 16px; }
.im-do .sortn-label { font-size: 18.5px; }
.im-do .sortn-sub { font-size: 15.5px; }
.im-do .sortn-year { font-size: 17px; padding: 5px 16px; }
.im-do .check-list { gap: 12px; }
.im-do .check-item { padding: 13px 18px; font-size: 17px; }
.im-do .ck-box { width: 26px; height: 26px; font-size: 15px; }
.im-do .qz-chip, .im-do .qz-prog { font-size: 14.5px; }
.im-do .qz-retry-tag { font-size: 14px; }
.im-do .qz-fb-main b { font-size: 16.5px; }
.im-do .qz-ex { font-size: 15px; }
.im-do .qz-next-btn { font-size: 17.5px; padding: 12px 48px; }
.im-do .write-q { font-size: 18px; }
.im-do .write-area { font-size: 16px; }
.im-do .write-count { font-size: 14px; }
.im-do .mp-card { font-size: 19.5px; }
.im-do .mp-instr-t { font-size: 20px; }
.im-do .mp-instr-sub { font-size: 14.5px; }
.im-do .mp-col-head { font-size: 17px; }
.im-do .mp-instr-ico { width: 48px; height: 48px; font-size: 25px; }
.im-do .stage-img.sm img { max-height: 380px; }
.im-do .panel-btn { font-size: 15.5px; padding: 10px 24px; }

/* ============================================================
 * quizset 看图闯关：顶部示意图放到最大（2026-09-16 · r104 · 用户要求）
 * 仅作用于随堂练习题组（.qz-run），不影响 choice/sortd 等其它互动题；
 * ① 答题态弹窗本就全屏（im-mode-do），图按 100% 宽等比放大；
 * ② 题图上限 500→560px；③ 同时压缩题面/选项/反馈间距，
 * 保证答完弹出反馈条后仍在一屏内完整显示（1920×1080 基准）。
 * ============================================================ */
.im-do .qz-run .qz-bigimg { margin: 2px 0 6px; }
.im-do .qz-run .qz-bigimg img { width: 100%; max-height: 560px; object-fit: contain; }
.im-do .qz-run .qz-head { margin-bottom: 0; }
.im-do .qz-run .qz-chip, .im-do .qz-run .qz-prog { font-size: 13.5px; padding: 3px 11px; }
.im-do .qz-run .qz-retry-tag { font-size: 13px; }
.im-do .qz-run .q-card { padding: 7px 16px; margin-bottom: 5px; }
.im-do .qz-run .q-card .q-text { font-size: 20px; line-height: 1.4; }
.im-do .qz-run .q-opts { gap: 6px; margin-top: 4px; }
.im-do .qz-run .q-opt.big { padding: 7px 15px; font-size: 19px; }
.im-do .qz-run .qo-key { width: 34px; height: 34px; font-size: 17px; }
.im-do .qz-run .qz-fb { margin-top: 5px; padding: 7px 12px; font-size: 16px; }
.im-do .qz-run .qz-fb .ex, .im-do .qz-run .qz-fb .hint { font-size: 15px; }
.im-do .qz-run .qz-fb-main b { font-size: 16px; }
.im-do .qz-run .qz-retry-btn { font-size: 15px; padding: 8px 16px; }
.im-do .qz-run .qz-next-wrap { margin-top: 5px; }
.im-do .qz-run .qz-next-btn { padding: 7px 32px; font-size: 16px; }
/* —— 有图 quizset：图左文右双栏（r112 动态图铺满左栏；右栏600px题面21px保最长题一行） —— */
.im-do .qz-run.qz-horiz { display: flex; align-items: stretch; justify-content: center; gap: 16px; min-height: 0; height: calc(var(--vhpx, 1vh) * 82); max-height: calc(var(--vhpx, 1vh) * 82); margin: 0 -28px; }
.im-do .qz-run.qz-horiz .qz-bigimg { flex: 1 1 auto; min-width: 0; min-height: 0; margin: 0; display: flex; align-items: stretch; justify-content: center; }
.im-do .qz-run.qz-horiz .qz-bigimg img { max-width: 100%; max-height: 100%; width: 100%; height: 100%; object-fit: contain; }
.im-do .qz-run.qz-horiz .qz-bigimg.wrap-img img { width: auto; height: auto; }
.im-do .qz-run.qz-horiz .qz-right { flex: 0 0 600px; min-width: 0; display: flex; justify-content: center; flex-direction: column; }
.im-do .qz-run.qz-horiz .qz-head { margin-bottom: 6px; }
.im-do .qz-run.qz-horiz .qz-chip, .im-do .qz-run.qz-horiz .qz-prog { font-size: 16px; padding: 4px 12px; }
.im-do .qz-run.qz-horiz .qz-retry-tag { font-size: 14px; }
.im-do .qz-run.qz-horiz .q-card { padding: 10px 14px; margin-bottom: 8px; }
.im-do .qz-run.qz-horiz .q-card .q-text { font-size: 21px; line-height: 1.45; white-space: nowrap; }
.im-do .qz-run.qz-horiz .q-opts { gap: 8px; margin-top: 2px; }
.im-do .qz-run.qz-horiz .q-opt.big { padding: 10px 14px; font-size: 24px; }
.im-do .qz-run.qz-horiz .qo-key { width: 42px; height: 42px; font-size: 21px; }
.im-do .qz-run.qz-horiz .qz-fb { margin-top: 8px; padding: 9px 14px; font-size: 19px; }
.im-do .qz-run.qz-horiz .qz-fb .ex, .im-do .qz-run.qz-horiz .qz-fb .hint { font-size: 17px; }
.im-do .qz-run.qz-horiz .qz-fb-main b { font-size: 19px; }
.im-do .qz-run.qz-horiz .qz-retry-btn { font-size: 17px; padding: 9px 18px; }
.im-do .qz-run.qz-horiz .qz-next-wrap { margin-top: 8px; }
.im-do .qz-run.qz-horiz .qz-next-btn { padding: 10px 34px; font-size: 19px; }
/* 引领式课件内嵌 quizset 页：题图上限 48%→52%（r103 放大；下方题目同步微缩让位） */
.main.player-main .stage-img.sm.qz-bigimg { max-height: 52%; margin-top: 2px; margin-bottom: 2px; }
.main.player-main .qz-run .q-card { padding: 6px 16px; margin: 2px 0; }
.main.player-main .qz-run .q-opts { gap: 5px; margin-top: 4px; }
.main.player-main .qz-run .q-opt { padding: 6px 16px; }
.main.player-main .qz-run .qz-head { margin: 2px 0 0; }
.main.player-main .qz-run .qz-fb { margin-top: 4px; padding: 6px 12px; }
.main.player-main .qz-run .qz-next-wrap { margin-top: 4px; }
.main.player-main .qz-run .qz-next-btn { padding: 6px 30px; font-size: 15px; }
/* —— 引领式：有图 quizset 图左文右双栏（r110 与 im-do 同步：题目标题两行内） —— */
.main.player-main .qz-run.qz-horiz { display: flex; align-items: stretch; justify-content: center; gap: 16px; flex: 1 1 auto; min-height: 0; }
.main.player-main .qz-run.qz-horiz .qz-bigimg { flex: 1 1 auto; min-width: 0; min-height: 0; max-height: none; margin: 0; display: flex; align-items: stretch; justify-content: center; }
.main.player-main .qz-run.qz-horiz .qz-bigimg img { max-width: 100%; max-height: 100%; width: 100%; height: 100%; object-fit: contain; }
.main.player-main .qz-run.qz-horiz .qz-right { flex: 0 0 560px; min-width: 0; display: flex; justify-content: center; flex-direction: column; }
.main.player-main .qz-run.qz-horiz .qz-head { margin: 0 0 4px; }
.main.player-main .qz-run.qz-horiz .qz-chip, .main.player-main .qz-run.qz-horiz .qz-prog { font-size: 16px; padding: 3px 11px; }
.main.player-main .qz-run.qz-horiz .q-card { padding: 9px 14px; margin: 2px 0; }
.main.player-main .qz-run.qz-horiz .q-card .q-text { font-size: 20px; line-height: 1.4; white-space: nowrap; }
.main.player-main .qz-run.qz-horiz .q-opts { gap: 6px; margin-top: 4px; }
.main.player-main .qz-run.qz-horiz .q-opt { padding: 9px 14px; font-size: 21px; }
.main.player-main .qz-run.qz-horiz .qz-fb { margin-top: 6px; padding: 8px 12px; }
.main.player-main .qz-run.qz-horiz .qz-next-wrap { margin-top: 6px; }
.main.player-main .qz-run.qz-horiz .qz-next-btn { padding: 8px 30px; font-size: 17.5px; }

/* ============================================================
 * 二轮：单页收纳与图文美化（2026-09-11 · r87）
 * 配合教师端二轮压缩方案：tb 上图下文页要点双列收纳（当前
 * U1T1 两处 tb 页均为 4 要点，2×2 网格让动画大图多出 ~250px）；
 * 教师投影与学生同屏均走学生端 player 视图，字号保持 r86 放大档。
 * ============================================================ */
.main.player-main .imgtop-points { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; }
.main.player-main .imgtop-points li { padding: 10px 14px; line-height: 1.5; }
.main.player-main .imgtop-img img { border-radius: 14px; box-shadow: 0 14px 36px rgba(30,50,90,.18); }

/* ============================================================
 * 教师端 · 左侧工作台目录放大（2026-09-16 · 用户要求）
 * 用 CSS 变量 --tsbw 统一管理侧栏宽度，并让主内容区 margin-left
 * 同步，避免侧栏（position:fixed）盖住主内容文字。
 * 仅作用于教师端 body.is-teacher，不影响学生端。
 * ============================================================ */
body.is-teacher { --tsbw: 300px; }
body.is-teacher .main { margin-left: var(--tsbw) !important; }
body.is-teacher .sidebar { width: var(--tsbw) !important; padding: 10px 14px 10px !important; }

/* —— 平台名 / 副标题 —— */
body.is-teacher .sidebar .logo { font-size: 24px !important; line-height: 1.2 !important; }
body.is-teacher .sidebar .logo small { font-size: 16px !important; line-height: 1.3 !important; }

/* —— 当前登录用户徽章 —— */
body.is-teacher .sidebar .user-pill { font-size: 19px !important; gap: 10px !important; padding: 9px 16px !important; line-height: 1.4 !important; }

/* —— 分组标题（学生管理 / 机房座次 / 作业收发 等小节）—— */
body.is-teacher .sidebar .nav-group { font-size: 17px !important; letter-spacing: .5px !important; padding: 8px 4px 3px !important; }

/* —— 菜单项（收紧行距保证一页放下）—— */
body.is-teacher .sidebar .nav-item,
body.is-teacher .sidebar .nav-item .ni-txt { font-size: 20px !important; line-height: 1.2 !important; }
body.is-teacher .sidebar .nav-item { gap: 11px !important; padding: 10px 16px !important; margin-bottom: 4px !important; min-height: 44px !important; max-height: none !important; border-radius: 11px !important; }

/* —— 菜单图标 —— */
body.is-teacher .nav-item .ni-ico,
body.is-teacher .sidebar .nav-item .ni-ico { width: 33px !important; height: 33px !important; font-size: 19px !important; border-radius: 9px !important; }

/* —— 底部登出 —— */
body.is-teacher .sidebar-logout { padding: 5px 4px 4px !important; }
body.is-teacher .sidebar-logout .tb { font-size: 18px !important; line-height: 1.4 !important; padding: 8px 6px !important; }

/* ============================================================
 * 教师端 · 训练成绩页 筛选标签放大 + 设计感（2026-09-17）
 * 三个分区 Tab（打字训练/计算机基础/软件操作）+ 排序下拉
 * ============================================================ */
/* —— Tab 容器：浅底卡片式分段切换器 —— */
body.is-teacher .tc-tabs-big {
  padding: 8px;
  border-radius: 18px;
  background: #f1f5ff;
  border: 1px solid #e3ecff;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: inset 0 1px 3px rgba(30,60,140,.05);
}

/* —— 分区 Tab：放大 + 高对比 —— */
body.is-teacher .tc-tab-big {
  font-size: 20px;
  font-weight: 800;
  padding: 12px 26px;
  gap: 8px;
  border-radius: 14px;
  letter-spacing: .5px;
  color: #42536d;
  transition: all .18s ease;
}
body.is-teacher .tc-tab-big .tc-tab-ico {
  font-size: 21px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* —— 激活态：亮橙渐变 + 白字 + 投影，一眼可见 —— */
body.is-teacher .tc-subtab.active {
  color: #fff;
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  box-shadow: 0 8px 20px rgba(255,90,31,.38);
}

/* —— 排序下拉：放大 —— */
body.is-teacher .tc-sort { margin-left: 14px; }
body.is-teacher .tc-sort select {
  font-size: 17px;
  font-weight: 700;
  padding: 11px 18px;
  border-radius: 13px;
  border: 1.6px solid #cfdcf2;
  color: #42536d;
  background: #fff;
  cursor: pointer;
}
body.is-teacher .tc-sort select:focus { border-color: #2563eb; }

/* ============================================================
   【教师端】行为管理模块（teachTab='beh'）v157
   ============================================================ */

/* ---- 子页签 ---- */
.beh-tabs { display: flex; gap: 10px; margin: 4px 0 16px; flex-wrap: wrap; }
.beh-tab {
  border: 2px solid #e2e8f0; background: #fff; color: #64748b;
  font-size: 14px; font-weight: 800; padding: 9px 22px; border-radius: 999px;
  cursor: pointer; transition: all .15s ease; letter-spacing: 1px;
}
.beh-tab:hover { border-color: #a5b4fc; color: #4f46e5; transform: translateY(-1px); }
.beh-tab.on {
  background: linear-gradient(135deg, #6366f1, #8b5cf6); border-color: transparent;
  color: #fff; box-shadow: 0 4px 14px rgba(99, 102, 241, .35);
}
.beh-log-filter { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.beh-log-filter .beh-tab { padding: 7px 16px; font-size: 13px; }
.beh-log-hint { font-size: 12.5px; color: #94a3b8; margin-left: 6px; }

/* ---- 课堂表现搜索框（积分榜/加分记录，随页签切换显示）---- */
.beh-search-wrap { position: relative; display: flex; align-items: center; flex: 0 1 300px; min-width: 200px; margin-left: auto; }
.beh-search-ico { position: absolute; left: 14px; font-size: 14px; pointer-events: none; }
.beh-search {
  width: 100%; height: 40px; border-radius: 999px; border: 2px solid #e2e8f0; background: #fff;
  font-size: 14px; font-weight: 600; font-family: inherit; color: #2d3748;
  padding: 0 36px; outline: none; transition: .15s;
}
.beh-search::placeholder { color: #a0aec0; font-size: 13px; font-weight: 400; }
.beh-search:hover { border-color: #a5b4fc; }
.beh-search:focus { border-color: #6366f1; box-shadow: 0 0 0 4px #eef2ff; }
.beh-search-clear {
  position: absolute; right: 9px; width: 20px; height: 20px; border-radius: 50%; border: none;
  background: #e2e8f0; color: #64748b; font-size: 11px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center; padding: 0;
}
.beh-search-clear:hover { background: #6366f1; color: #fff; }

/* ---- 批量删除（加分记录流水 · 勾选后一键删加分/扣分）---- */
.beh-tab.beh-batch-toggle.on {
  background: linear-gradient(135deg, #fb923c, #ef4444); border-color: transparent;
  color: #fff; box-shadow: 0 4px 14px rgba(239, 68, 68, .35);
}
.beh-batch-bar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  background: linear-gradient(135deg, #fff7ed, #fef2f2);
  border: 1.5px dashed #fdba74; border-radius: 12px;
  padding: 10px 14px; margin-bottom: 12px;
}
.beh-batch-chip {
  border: 1.5px solid #e2e8f0; background: #fff; color: #334155;
  border-radius: 999px; font-size: 12.5px; font-weight: 800; padding: 6px 14px;
  cursor: pointer; transition: all .12s ease; letter-spacing: .5px;
}
.beh-batch-chip:hover { border-color: #6366f1; color: #4f46e5; }
.beh-batch-chip.plus:hover { border-color: #10b981; color: #059669; }
.beh-batch-chip.minus:hover { border-color: #f59e0b; color: #b45309; }
.beh-batch-info { font-size: 13px; color: #475569; font-weight: 700; }
.beh-batch-info b { color: #dc2626; font-size: 15px; padding: 0 2px; }
.beh-batch-spacer { flex: 1; }
.beh-mini-btn.danger { background: linear-gradient(135deg, #f87171, #dc2626); color: #fff; box-shadow: 0 2px 8px rgba(220, 38, 38, .3); }
.beh-mini-btn.danger:hover { filter: brightness(1.06); }
.beh-mini-btn.danger:disabled { background: #e2e8f0; color: #94a3b8; box-shadow: none; cursor: not-allowed; transform: none; }
.beh-table .c-chk { width: 44px; min-width: 44px; text-align: center; }
.beh-batch-ckb { width: 17px; height: 17px; accent-color: #ef4444; cursor: pointer; vertical-align: middle; }
.beh-table tr.picked { background: #fff1f2; }
.beh-table tr.picked:hover { background: #ffe4e6; }
.beh-batch-tip { font-size: 12px; color: #cbd5e1; }

/* ---- 统计卡（横排四张彩色渐变卡）---- */
.beh-stat-row { display: flex; gap: 14px; margin-bottom: 14px; flex-wrap: wrap; }
.beh-stat-card {
  flex: 1; min-width: 210px; display: flex; align-items: center; gap: 14px;
  padding: 16px 18px; border-radius: 16px; color: #fff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, .13);
}
.beh-stat-card .bsc-ico {
  font-size: 28px; width: 54px; height: 54px; border-radius: 14px; flex: none;
  background: rgba(255, 255, 255, .22);
  display: flex; align-items: center; justify-content: center;
}
.beh-stat-card .bsc-num { font-size: 26px; font-weight: 900; line-height: 1.15; text-shadow: 0 1px 2px rgba(0, 0, 0, .18); }
.beh-stat-card .bsc-label { font-size: 12.5px; opacity: .93; margin-top: 3px; }
.beh-stat-card.plus  { background: linear-gradient(135deg, #34d399, #059669); }
.beh-stat-card.minus { background: linear-gradient(135deg, #60a5fa, #1d4ed8); }
.beh-stat-card.alert { background: linear-gradient(135deg, #f87171, #dc2626); }
.beh-stat-card.total { background: linear-gradient(135deg, #818cf8, #7c3aed); }

/* ---- 待关注条 ---- */
.beh-alert-strip {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
  background: #eff6ff; border: 1.5px solid #93c5fd; border-radius: 12px;
  padding: 10px 14px; margin-bottom: 14px;
}
.beh-alert-tit { font-weight: 900; color: #1d4ed8; }
.beh-alert-chip {
  display: inline-flex; align-items: center; gap: 6px; background: #fff;
  border: 1px solid #bfdbfe; border-radius: 999px; padding: 5px 10px;
  font-size: 13px; color: #1e3a8a;
}
.beh-alert-chip b { color: #431407; }
.beh-chip-btn { border: none; width: 26px; height: 26px; border-radius: 50%; cursor: pointer; font-size: 13px; line-height: 1; padding: 0; }
.beh-chip-btn.p { background: #dcfce7; }
.beh-chip-btn.m { background: #fee2e2; }
.beh-chip-btn:hover { filter: brightness(.95); }

/* ---- 积分榜表格（浅蓝渐变表头 · 靛蓝大字 · 橙色高亮下划线）---- */
.beh-table-card { padding: 0; overflow: hidden; }
.beh-table { width: 100%; border-collapse: collapse; font-size: 16px; }
.beh-table thead th {
  color: #4338ca; font-weight: 900; font-size: 32px !important; letter-spacing: 2px;
  padding: 20px 10px; text-align: center; border: none;
  background: linear-gradient(180deg, #f7fafe, #eef3fb);
  border-bottom: 2px solid #bfdbfe;
  box-shadow: inset 0 -3px 0 #2563eb;
}
.beh-table thead th:nth-child(2) { text-align: left; padding-left: 78px; } /* 姓名表头与下方姓名文字垂直对应（28内边距+40头像+10间距） */
.beh-table tbody td:nth-child(2) { padding-left: 28px; } /* 学生内容同起点，保证与表头对齐 */
.beh-table tbody td { padding: 12px 10px; text-align: center; border-bottom: 1px solid #e2e8f0; color: #334155; font-size: 15px; }
.beh-table tbody tr:hover { background: #f1f5f9; }
.beh-table tbody tr.alert { background: #fff1f2; }
.beh-table .c-rank { width: 72px; }
.beh-table .c-num { font-variant-numeric: tabular-nums; }
.beh-table .c-ops { width: 232px; white-space: nowrap; }
.beh-medal { font-size: 22px; }
.beh-rank-no {
  display: inline-flex; width: 27px; height: 27px; align-items: center; justify-content: center;
  border-radius: 50%; background: #eef2ff; color: #4f46e5; font-weight: 900; font-size: 13px;
}
.beh-empty { text-align: center; color: #64748b; padding: 26px 10px !important; font-weight: 600; }

/* 学生单元格：机号彩色圆圈 + 姓名 + 徽章 */
.beh-stu { display: flex; align-items: center; gap: 8px; text-align: left; }
.beh-ava {
  width: 30px; height: 30px; border-radius: 50%; color: #fff;
  font-weight: 900; font-size: 13px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 6px rgba(15, 23, 42, .2), inset 0 -2px 4px rgba(0, 0, 0, .12);
}
.beh-ava-no { font-size: 13.5px; text-shadow: 0 1px 1px rgba(0, 0, 0, .2); }
.beh-stu-name { font-weight: 800; color: #1e293b; }
.beh-stu-no { font-size: 12px; color: #94a3b8; }
.beh-badge { font-size: 11.5px; font-weight: 800; border-radius: 999px; padding: 2px 9px; flex: none; }
.beh-badge.leader { background: #dbeafe; color: #1d4ed8; border: 1px solid #fcd34d; }
.beh-badge.grp { background: #e0f2fe; color: #0369a1; border: 1px solid #7dd3fc; }

/* 分数与次数 */
.beh-score { font-size: 16px; font-weight: 900; }
.beh-score.pos { color: #059669; }
.beh-score.neg { color: #dc2626; }
.beh-cnt { font-weight: 800; color: #475569; }
.beh-cnt.pos { color: #059669; }
.beh-cnt.neg { color: #dc2626; }
.beh-batch-ico { margin-left: 4px; }
.beh-log-time { font-variant-numeric: tabular-nums; color: #475569; font-size: 14px; font-weight: 600; }

/* 操作小按钮 */
.beh-mini-btn {
  border: none; border-radius: 999px; font-size: 12.5px; font-weight: 800;
  padding: 6px 13px; cursor: pointer; margin: 0 2px; transition: all .12s ease;
}
.beh-mini-btn.plus { background: linear-gradient(135deg, #34d399, #10b981); color: #fff; box-shadow: 0 2px 8px rgba(16, 185, 129, .3); }
.beh-mini-btn.minus { background: linear-gradient(135deg, #fbbf24, #f59e0b); color: #1e3a8a; box-shadow: 0 2px 8px rgba(245, 158, 11, .3); }
.beh-mini-btn.ghost { background: #f1f5f9; color: #475569; }
.beh-mini-btn:hover { transform: translateY(-1px); filter: brightness(1.06); }

/* ---- 小组管理 ---- */
.beh-group-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; margin-bottom: 16px; }
.beh-group-card { background: #fff; border: 1.5px solid #e2e8f0; border-radius: 14px; padding: 14px; box-shadow: 0 2px 10px rgba(15, 23, 42, .05); }
.bgc-head { display: flex; align-items: center; gap: 8px; margin-bottom: 9px; flex-wrap: wrap; }
.bgc-name { font-weight: 900; color: #4f46e5; font-size: 15px; }
.bgc-leader { font-size: 12.5px; background: #dbeafe; color: #1d4ed8; border-radius: 999px; padding: 2px 10px; }
.bgc-leader.none { background: #f1f5f9; color: #94a3b8; }
.bgc-members { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; min-height: 26px; }
.bgc-member { font-size: 12.5px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 999px; padding: 3px 10px; color: #475569; }
.bgc-member.leader { background: #fef9c3; border-color: #fde047; color: #1e3a8a; font-weight: 800; }
/* 点成员快速任命组长 */
.bgc-member.pickable { cursor: pointer; user-select: none; transition: all .12s; display: inline-flex; align-items: center; gap: 3px; }
.bgc-member.pickable:hover { border-color: #fbbf24; background: #eff6ff; color: #1d4ed8; transform: translateY(-1px); box-shadow: 0 3px 8px rgba(245, 158, 11, .25); }
.bgc-member.pickable.leader {
  background: linear-gradient(135deg, #fde047, #f59e0b); border-color: #f59e0b; color: #1e3a8a;
  box-shadow: 0 2px 7px rgba(245, 158, 11, .4);
}
.bgc-member.pickable.leader:hover { filter: brightness(1.05); }
.bgc-crown { font-size: .95em; line-height: 1; }
.bgc-leader-tip { font-size: .82em; font-weight: 400; opacity: .75; margin-left: 2px; }
.bgc-leader.none { animation: bgcHintPulse 2.2s ease-in-out infinite; }
@keyframes bgcHintPulse { 0%,100% { opacity: .65; } 50% { opacity: 1; background: #fef9c3; color: #a16207; } }
.bgc-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; border-top: 1px dashed #e2e8f0; padding-top: 10px; }
.bgc-score { font-size: 12.5px; color: #64748b; }
.bgc-score b.pos { color: #059669; }
.bgc-score b.neg { color: #dc2626; }
.bgc-ops { display: flex; gap: 6px; }
.beh-assign-card { margin-top: 4px; padding: 0 0 8px; }
.beh-assign-title { font-weight: 900; color: #334155; padding: 14px 16px 10px; }
.beh-ungrouped { padding: 0 16px 10px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.beh-grp-select {
  border: 1.5px solid #e2e8f0; border-radius: 8px; padding: 6px 10px;
  font-size: 13.5px; color: #334155; background: #fff;
}
.beh-grp-select:focus { border-color: #818cf8; outline: none; }
.beh-leader-btn {
  border: 1.5px solid #e2e8f0; background: #fff; color: #64748b;
  border-radius: 999px; font-size: 12.5px; font-weight: 800;
  padding: 6px 14px; cursor: pointer; transition: all .12s;
}
.beh-leader-btn.on { background: linear-gradient(135deg, #f59e0b, #d97706); border-color: transparent; color: #fff; box-shadow: 0 2px 8px rgba(217, 119, 6, .35); }
.beh-leader-btn:disabled { opacity: .45; cursor: not-allowed; }

/* ---- 记分设置 ---- */
.beh-set-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 14px; margin-bottom: 12px; }
.beh-set-head { font-weight: 900; font-size: 15px; padding: 4px 6px 12px; }
.beh-set-head.plus { color: #059669; }
.beh-set-head.minus { color: #dc2626; }
.beh-set-head.club { color: #d97706; }

/* ---- 社团班绑定卡（记分设置顶部）---- */
.beh-club-bind { margin-bottom: 12px; }
.beh-club-bind-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.beh-club-select {
  border: 2px solid #fdba74; border-radius: 10px; padding: 9px 14px;
  font-size: 14px; font-weight: 800; color: #9a3412; background: #fff7ed;
  min-width: 260px; cursor: pointer;
}
.beh-club-select:focus { outline: none; border-color: #f97316; }

/* ---- 打分弹窗：社团纪律分组 ---- */
.bm-group-title {
  grid-column: 1 / -1; font-size: 13px; font-weight: 900; color: #64748b;
  padding: 2px 2px 0; letter-spacing: 1px;
}
.bm-group-title.club { color: #dc2626; }
.bm-item.club { border-color: #fecaca; background: #fef2f2; }
.bm-item.club:hover { border-color: #ef4444; background: #fee2e2; }

/* ---- 违纪档案（社团班预警名单）---- */
.beh-arch-summary { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.bas-item {
  font-size: 14px; font-weight: 800; color: #475569; background: #fff;
  border: 1.5px solid #e2e8f0; border-radius: 999px; padding: 8px 16px;
}
.bas-item b { color: #dc2626; font-size: 16px; padding: 0 2px; }
.bas-item.alert { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }
.beh-arch-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
.beh-arch-card {
  background: #fff; border: 1.5px solid #fecaca; border-left: 5px solid #ef4444;
  border-radius: 14px; padding: 14px 16px; box-shadow: 0 2px 10px rgba(15, 23, 42, .05);
}
.bac-head { display: flex; align-items: center; gap: 10px; }
.bac-info { flex: 1; min-width: 0; }
.bac-name { font-weight: 900; font-size: 16px; color: #1e293b; display: flex; align-items: center; gap: 6px; }
.bac-sub { font-size: 12.5px; color: #94a3b8; margin-top: 2px; }
.bac-count { text-align: center; background: #fef2f2; border-radius: 12px; padding: 6px 12px; flex-shrink: 0; }
.bac-count b { display: block; font-size: 24px; color: #dc2626; line-height: 1.1; }
.bac-count span { font-size: 11.5px; color: #b91c1c; font-weight: 800; }
.bac-reasons { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 8px; }
.beh-arch-chip {
  font-size: 12px; font-weight: 700; color: #9a3412; background: #fff7ed;
  border: 1px solid #fed7aa; border-radius: 999px; padding: 3px 10px;
}
.bac-foot { display: flex; align-items: center; justify-content: space-between; }
.bac-score { font-size: 13.5px; color: #475569; font-weight: 700; }
.bac-score b.neg { color: #dc2626; font-size: 16px; }
.beh-club-th { font-size: 13.5px; font-weight: 800; color: #475569; display: flex; align-items: center; gap: 6px; }
.beh-club-th-num {
  width: 64px; border: 2px solid #fdba74; border-radius: 8px; padding: 7px 8px;
  font-size: 14px; font-weight: 800; color: #9a3412; text-align: center; background: #fff;
}

/* 违纪档案空状态 / 未绑定提示（左对齐大字醒目版，占满整行不换行） */
.beh-arch-empty {
  grid-column: 1 / -1; text-align: left; padding: 22px 26px !important;
  border-left: 5px solid #ef4444; background: #fff;
}
.bae-title { font-size: 19px; font-weight: 900; color: #1e293b; line-height: 1.4; white-space: nowrap; }
.bae-sub { font-size: 15px; font-weight: 700; color: #475569; margin-top: 8px; line-height: 1.7; }

/* ---- 观察中名单（有扣分未达阈值）---- */
.beh-watch-list { display: flex; flex-direction: column; gap: 8px; }
.beh-watch-row { display: flex; align-items: center; gap: 10px; background: #fff; border: 1.5px solid #e2e8f0; border-radius: 10px; padding: 8px 14px; cursor: pointer; }
.beh-watch-row:hover { border-color: #94a3b8; background: #f8fafc; }
.bwr-name { font-size: 15px; font-weight: 900; color: #1e293b; flex-shrink: 0; }
.bwr-chips { flex: 1; display: flex; flex-wrap: wrap; gap: 5px; min-width: 0; }
.bwr-cnt { font-size: 13.5px; font-weight: 800; color: #ea580c; flex-shrink: 0; }

/* ---- 个人违纪档案弹窗（社团）---- */
.beh-arch-modal { max-width: 740px; }
.bam-body { padding: 18px 22px; max-height: 64vh; overflow-y: auto; display: flex; flex-direction: column; gap: 13px; }
.bam-stat-row { display: flex; align-items: center; gap: 12px; }
.bam-stat-info { flex: 1; min-width: 0; }
.bam-name { font-size: 19px; font-weight: 900; color: #1e293b; display: flex; align-items: center; gap: 8px; }
.bam-sub { font-size: 13px; color: #94a3b8; margin-top: 2px; }
.bam-num { text-align: center; background: #fef2f2; border: 1.5px solid #fecaca; border-radius: 12px; padding: 8px 16px; flex-shrink: 0; }
.bam-num b { display: block; font-size: 26px; color: #dc2626; line-height: 1.1; }
.bam-num span { font-size: 11.5px; color: #b91c1c; font-weight: 800; }
.bam-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.beh-arch-chip.time { color: #475569; background: #f1f5f9; border-color: #e2e8f0; }
.bam-sec-title { font-size: 15px; font-weight: 900; color: #334155; display: flex; align-items: center; gap: 10px; margin-top: 4px; }
.bam-log-list { background: #f8fafc; border: 1.5px solid #e2e8f0; border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 9px; }
.bam-log-row { display: flex; align-items: center; gap: 10px; }
.baml-no { width: 26px; height: 26px; border-radius: 50%; background: #fee2e2; color: #dc2626; font-size: 13px; font-weight: 900; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.baml-time { font-size: 12.5px; color: #94a3b8; flex-shrink: 0; min-width: 120px; }
.baml-reason { flex: 1; font-size: 14.5px; font-weight: 700; color: #1e293b; }
.baml-by { font-size: 12px; color: #94a3b8; flex-shrink: 0; }
.baml-delta { font-size: 15px; font-weight: 900; color: #dc2626; flex-shrink: 0; }
.bam-talk-form { display: flex; gap: 8px; flex-wrap: wrap; }
.bam-talk-type { border: 2px solid #fdba74; border-radius: 8px; padding: 8px 10px; font-size: 14px; font-weight: 800; color: #9a3412; background: #fff; }
.bam-talk-note { flex: 1; min-width: 200px; border: 1.5px solid #e2e8f0; border-radius: 8px; padding: 8px 12px; font-size: 14px; color: #1e293b; }
.bam-talk-note:focus { outline: none; border-color: #f97316; }
.bam-talk-list { display: flex; flex-direction: column; gap: 8px; }
.bam-talk-item { display: flex; gap: 10px; align-items: flex-start; background: #fff; border: 1.5px solid #e2e8f0; border-left: 4px solid #f97316; border-radius: 10px; padding: 10px 12px; }
.bamtk-type { font-size: 12.5px; font-weight: 900; color: #fff; background: #f97316; border-radius: 999px; padding: 4px 12px; flex-shrink: 0; margin-top: 2px; }
.bamtk-main { flex: 1; min-width: 0; }
.bamtk-note { font-size: 14px; font-weight: 700; color: #1e293b; line-height: 1.5; }
.bamtk-meta { font-size: 12px; color: #94a3b8; margin-top: 3px; }
.bamtk-del { border: none; background: none; color: #94a3b8; font-size: 14px; cursor: pointer; padding: 2px 4px; }
.bamtk-del:hover { color: #dc2626; }
.bam-comment { width: 100%; border: 1.5px solid #e2e8f0; border-radius: 10px; padding: 10px 14px; font-size: 14.5px; color: #1e293b; resize: vertical; font-family: inherit; box-sizing: border-box; }
.bam-comment:focus { outline: none; border-color: #f97316; }
.bam-comment-foot { display: flex; justify-content: flex-end; }

.beh-set-row { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.beh-set-ico, .beh-set-label, .beh-set-delta {
  border: 1.5px solid #e2e8f0; border-radius: 8px; padding: 7px 10px;
  font-size: 13.5px; color: #334155; background: #fff;
}
.beh-set-ico { width: 52px; text-align: center; }
.beh-set-label { flex: 1; }
.beh-set-label:focus, .beh-set-ico:focus, .beh-set-delta:focus { border-color: #818cf8; outline: none; }
.beh-set-delta { width: 76px; font-weight: 800; }
.beh-set-del { border: none; background: #fee2e2; color: #b91c1c; border-radius: 8px; padding: 7px 12px; font-weight: 800; cursor: pointer; font-size: 12.5px; }
.beh-set-del:hover { background: #fecaca; }
.beh-add-btn { margin-top: 6px; width: 100%; }
.beh-set-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

/* ---- 记分弹窗（选事项=选原因）---- */
.beh-overlay {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; inset: 0;
  background: rgba(15, 23, 42, .55); z-index: 9800;
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.beh-modal {
  background: #fff; border-radius: 20px; width: 680px; max-width: 94vw;
  max-height: 86vh; overflow: auto; box-shadow: 0 24px 64px rgba(0, 0, 0, .32);
}
.bm-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 20px; color: #fff; border-radius: 20px 20px 0 0; }
.bm-head.plus { background: linear-gradient(135deg, #10b981, #047857); }
.bm-head.minus { background: linear-gradient(135deg, #2563eb, #1d4ed8); }
.bm-head:not(.plus):not(.minus) { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
.bm-title { font-size: 17px; font-weight: 900; letter-spacing: 1.5px; }
.bm-close { border: none; background: rgba(255, 255, 255, .25); color: #fff; width: 30px; height: 30px; border-radius: 50%; cursor: pointer; font-size: 14px; }
.bm-close:hover { background: rgba(255, 255, 255, .4); }
.bm-targets { padding: 14px 20px 0; text-align: center; }
.bm-target-name { font-size: 20px; font-weight: 900; color: #0f172a; }
.bm-target-list { display: block; font-size: 12.5px; color: #94a3b8; margin-top: 4px; line-height: 1.6; }
.bm-switch { display: flex; gap: 10px; justify-content: center; padding: 14px 20px 4px; }
.bm-switch button {
  width: 132px; border: 2px solid #e2e8f0; background: #fff;
  border-radius: 999px; padding: 8px 0; font-weight: 900; font-size: 14px;
  color: #94a3b8; cursor: pointer; transition: all .13s;
}
.bm-switch button.on { color: #fff; border-color: transparent; }
.bm-switch button:first-child.on { background: linear-gradient(135deg, #10b981, #059669); box-shadow: 0 3px 10px rgba(5, 150, 105, .35); }
.bm-switch button:last-child.on { background: linear-gradient(135deg, #2563eb, #1d4ed8); box-shadow: 0 3px 10px rgba(234, 88, 12, .35); }
.bm-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(196px, 1fr)); gap: 10px; padding: 14px 20px; }
.bm-item {
  display: flex; align-items: center; gap: 10px;
  border: 2px solid #e2e8f0; background: #f8fafc; border-radius: 14px;
  padding: 12px 14px; cursor: pointer; transition: all .12s; text-align: left;
}
.bm-item .bmi-ico { font-size: 22px; flex: none; }
.bm-item .bmi-label { flex: 1; font-weight: 800; font-size: 13.5px; color: #334155; line-height: 1.35; }
.bm-item .bmi-delta { font-weight: 900; font-size: 16px; flex: none; }
.bm-item.plus:hover { border-color: #34d399; background: #ecfdf5; transform: translateY(-2px); box-shadow: 0 6px 16px rgba(16, 185, 129, .22); }
.bm-item.plus .bmi-delta { color: #059669; }
.bm-item.minus:hover { border-color: #60a5fa; background: #eff6ff; transform: translateY(-2px); box-shadow: 0 6px 16px rgba(249, 115, 22, .22); }
.bm-item.minus .bmi-delta { color: #dc2626; }
.bm-foot { display: flex; justify-content: space-between; gap: 10px; padding: 4px 20px 18px; }

/* ============ 授课工具箱 ============ */
.tool-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; margin-top: 12px; }
.tool-card {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 18px 12px; border: 2px solid #e2e8f0; border-radius: 14px;
  background: #f8fafc; cursor: pointer; transition: all .15s; text-align: center;
}
.tool-card:hover { border-color: #60a5fa; background: #eff6ff; transform: translateY(-2px); box-shadow: 0 6px 16px rgba(59, 130, 246, .18); }
.tool-ico { font-size: 32px; margin-bottom: 6px; }
.tool-name { font-weight: 800; font-size: 15px; color: #1e293b; }
.tool-desc { font-size: 12.5px; color: #64748b; margin-top: 4px; }

/* ============ 倒计时弹窗 ============ */
.timer-modal { width: 420px; max-width: 92vw; text-align: center; padding: 24px 28px 28px; }
.timer-modal.fullscreen { width: 100vw; height: 100vh; max-width: 100vw; border-radius: 0; padding: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #0f172a; }
.tm-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.tm-head h2 { margin: 0; font-size: 18px; }
.tm-display {
  font-size: 72px; font-weight: 900; font-family: 'Courier New', monospace;
  color: #1e293b; letter-spacing: 4px; margin: 16px 0 20px;
  transition: color .2s;
}
.timer-modal.fullscreen .tm-display { font-size: 220px; color: #fff; margin: 0; }
.tm-display.warning { color: #ef4444; animation: tm-blink 1s ease-in-out infinite; }
.timer-modal.fullscreen .tm-display.warning { color: #f87171; }
.tm-display.running { color: #2563eb; }
.timer-modal.fullscreen .tm-display.running { color: #60a5fa; }
@keyframes tm-blink { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }
.tm-presets { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 14px; }
.tm-preset {
  padding: 6px 14px; border: 2px solid #e2e8f0; background: #f8fafc;
  border-radius: 20px; cursor: pointer; font-size: 13px; font-weight: 600;
  color: #475569; transition: all .12s;
}
.tm-preset:hover { border-color: #60a5fa; background: #eff6ff; color: #2563eb; }
.tm-preset.active { border-color: #2563eb; background: #2563eb; color: #fff; }
.tm-custom { display: flex; align-items: center; justify-content: center; gap: 6px; margin-bottom: 18px; font-size: 13px; color: #64748b; }
.tm-input { width: 56px; padding: 6px 8px; border: 2px solid #e2e8f0; border-radius: 8px; text-align: center; font-size: 14px; font-weight: 700; }
.tm-input:focus { outline: none; border-color: #60a5fa; }
.tm-controls { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.timer-modal.fullscreen .tm-controls { margin-top: 40px; }
.tm-btn {
  padding: 10px 20px; border: 2px solid #e2e8f0; background: #f8fafc;
  border-radius: 10px; cursor: pointer; font-size: 14px; font-weight: 700;
  color: #475569; transition: all .12s;
}
.tm-btn:hover { border-color: #94a3b8; background: #f1f5f9; }
.tm-btn.primary { border-color: #2563eb; background: #2563eb; color: #fff; }
.tm-btn.primary:hover { background: #1d4ed8; border-color: #1d4ed8; }
.tm-btn.primary:disabled { opacity: .5; cursor: not-allowed; }
.tm-btn.warn { border-color: #f59e0b; background: #f59e0b; color: #fff; }
.tm-btn.warn:hover { background: #d97706; border-color: #d97706; }
.tm-fs-hint { position: fixed; bottom: 20px; right: 24px; color: rgba(255,255,255,.4); font-size: 13px; }

/* ============ 随机点名弹窗 ============ */
.picker-modal { width: 460px; max-width: 92vw; text-align: center; padding: 24px 28px 24px; }
.pk-display {
  font-size: 56px; font-weight: 900; color: #1e293b;
  margin: 20px 0 8px; min-height: 80px; display: flex; align-items: center; justify-content: center;
  transition: transform .1s;
}
.pk-display.rolling { animation: pk-shake .08s ease-in-out infinite alternate; color: #60a5fa; }
@keyframes pk-shake { from { transform: scale(1); } to { transform: scale(1.05); } }
.pk-placeholder { font-size: 20px; color: #94a3b8; font-weight: 500; }
.pk-info { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 16px; }
.pk-no { font-size: 14px; color: #64748b; background: #f1f5f9; padding: 4px 12px; border-radius: 12px; }
.pk-plus {
  padding: 6px 14px; border: none; background: #10b981; color: #fff;
  border-radius: 16px; cursor: pointer; font-size: 13px; font-weight: 700;
  transition: all .12s;
}
.pk-plus:hover { background: #059669; transform: scale(1.05); }
.pk-options { text-align: left; margin-bottom: 16px; padding: 10px 14px; background: #f8fafc; border-radius: 10px; }
.pk-check { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 13.5px; color: #475569; }
.pk-check input { cursor: pointer; }
.pk-controls { display: flex; gap: 10px; justify-content: center; margin-bottom: 16px; }
.pk-log { text-align: left; border-top: 1px solid #e2e8f0; padding-top: 14px; }
.pk-log-title { font-size: 13px; color: #64748b; margin-bottom: 8px; font-weight: 600; }
.pk-log-list { display: flex; flex-wrap: wrap; gap: 6px; max-height: 100px; overflow-y: auto; }
.pk-tag {
  display: inline-block; padding: 3px 10px; background: #eff6ff; color: #2563eb;
  border-radius: 12px; font-size: 12.5px; font-weight: 600;
}
.pk-empty { font-size: 12.5px; color: #94a3b8; }

/* ============ 教师端 · 授课工具箱 ============ */
.toolbox-card {
  background: #fff; border: 1px solid #e2e8f0; border-radius: 12px;
  padding: 16px 20px; margin-bottom: 16px;
}
.toolbox-title { font-size: 15px; font-weight: 700; color: #1e293b; margin-bottom: 12px; }
.toolbox-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.toolbox-item {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 18px 12px; border: 2px solid #e2e8f0; border-radius: 12px;
  background: #f8fafc; cursor: pointer; transition: all .15s; text-align: center;
}
.toolbox-item:hover { border-color: #3b82f6; background: #eff6ff; transform: translateY(-2px); box-shadow: 0 6px 16px rgba(59, 130, 246, .18); }
.tbi-ico { font-size: 30px; margin-bottom: 6px; }
.tbi-name { font-weight: 700; font-size: 14px; color: #1e293b; }
.tbi-desc { font-size: 12px; color: #64748b; margin-top: 4px; font-family: 'Courier New', monospace; }

/* ============ 教师端 · 倒计时弹窗 ============ */
.tch-timer-modal {
  width: 440px; max-width: 92vw; background: #fff; border-radius: 12px;
  padding: 20px 24px 24px; text-align: center;
}
.tch-timer-modal.fullscreen {
  width: 100vw; height: 100vh; max-width: 100vw; max-height: 100vh; border-radius: 0;
  padding: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: #0f172a;
}
.ttm-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.ttm-head h3 { margin: 0; font-size: 17px; font-weight: 700; color: #1e293b; }
.ttm-display {
  font-size: 72px; font-weight: 900; font-family: 'Courier New', monospace;
  color: #1e293b; letter-spacing: 4px; margin: 12px 0 18px;
  transition: color .2s;
}
.tch-timer-modal.fullscreen .ttm-display { font-size: 240px; color: #fff; margin: 0; }
.ttm-display.warning { color: #ef4444; animation: ttm-blink 1s ease-in-out infinite; }
.tch-timer-modal.fullscreen .ttm-display.warning { color: #f87171; }
.ttm-display.running { color: #2563eb; }
.tch-timer-modal.fullscreen .ttm-display.running { color: #60a5fa; }
@keyframes ttm-blink { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }
.ttm-presets { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 12px; }
.ttm-preset {
  padding: 6px 14px; border: 2px solid #e2e8f0; background: #f8fafc;
  border-radius: 20px; cursor: pointer; font-size: 13px; font-weight: 600;
  color: #475569; transition: all .12s;
}
.ttm-preset:hover { border-color: #3b82f6; background: #eff6ff; color: #2563eb; }
.ttm-preset.active { border-color: #2563eb; background: #2563eb; color: #fff; }
.ttm-custom { display: flex; align-items: center; justify-content: center; gap: 6px; margin-bottom: 16px; font-size: 13px; color: #64748b; }
.ttm-input { width: 56px; padding: 6px 8px; border: 2px solid #e2e8f0; border-radius: 8px; text-align: center; font-size: 14px; font-weight: 700; }
.ttm-input:focus { outline: none; border-color: #3b82f6; }
.ttm-controls { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.tch-timer-modal.fullscreen .ttm-controls { margin-top: 40px; }
.btn-warn { background: #f59e0b; color: #fff; border-color: #f59e0b; }
.btn-warn:hover { background: #d97706; border-color: #d97706; }
.ttm-fs-hint { position: fixed; bottom: 20px; right: 24px; color: rgba(255,255,255,.4); font-size: 13px; }

/* ============ 教师端 · 随机点名弹窗 ============ */
.tch-picker-modal {
  width: 480px; max-width: 92vw; background: #fff; border-radius: 12px;
  padding: 20px 24px 20px; text-align: center;
}
.tpm-display {
  font-size: 56px; font-weight: 900; color: #1e293b;
  margin: 16px 0 6px; min-height: 80px; display: flex; align-items: center; justify-content: center;
  transition: transform .1s;
}
.tpm-display.rolling { animation: tpm-shake .08s ease-in-out infinite alternate; color: #3b82f6; }
@keyframes tpm-shake { from { transform: scale(1); } to { transform: scale(1.05); } }
.tpm-placeholder { font-size: 20px; color: #94a3b8; font-weight: 500; }
.tpm-info { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 14px; }
.tpm-no { font-size: 14px; color: #64748b; background: #f1f5f9; padding: 4px 12px; border-radius: 12px; }
.tpm-plus {
  padding: 6px 14px; border: none; background: #10b981; color: #fff;
  border-radius: 16px; cursor: pointer; font-size: 13px; font-weight: 700;
  transition: all .12s;
}
.tpm-plus:hover { background: #059669; transform: scale(1.05); }
.tpm-options { text-align: left; margin-bottom: 14px; padding: 10px 14px; background: #f8fafc; border-radius: 10px; }
.tpm-check { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 13.5px; color: #475569; }
.tpm-check input { cursor: pointer; }
.tpm-controls { display: flex; gap: 10px; justify-content: center; margin-bottom: 14px; }
.tpm-log { text-align: left; border-top: 1px solid #e2e8f0; padding-top: 12px; }
.tpm-log-title { font-size: 13px; color: #64748b; margin-bottom: 8px; font-weight: 600; }
.tpm-log-list { display: flex; flex-wrap: wrap; gap: 6px; max-height: 100px; overflow-y: auto; }
.tpm-tag {
  display: inline-block; padding: 3px 10px; background: #eff6ff; color: #2563eb;
  border-radius: 12px; font-size: 12.5px; font-weight: 600;
}
.tpm-empty { font-size: 12.5px; color: #94a3b8; }
.bm-custom { border: 2px dashed #c7d2fe; background: #eef2ff; color: #4f46e5; border-radius: 12px; padding: 10px 16px; font-weight: 800; cursor: pointer; font-size: 13.5px; }
.bm-custom:hover { background: #e0e7ff; }
.bm-cancel { border: none; background: #f1f5f9; color: #64748b; border-radius: 12px; padding: 10px 16px; font-weight: 800; cursor: pointer; font-size: 13.5px; }

/* ---- 个人明细弹窗 ---- */
.beh-detail-modal { width: 560px; }
.bm-detail-list { padding: 14px 20px 18px; }
.bm-detail-row { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; margin-bottom: 6px; font-size: 13.5px; }
.bm-detail-row.plus { background: #ecfdf5; }
.bm-detail-row.minus { background: #eff6ff; }
.bmd-time { color: #94a3b8; font-size: 12px; flex: none; width: 112px; font-variant-numeric: tabular-nums; }
.bmd-reason { flex: 1; font-weight: 700; color: #334155; }
.bmd-delta { font-weight: 900; font-size: 15px; flex: none; }
.bm-detail-row.plus .bmd-delta { color: #059669; }
.bm-detail-row.minus .bmd-delta { color: #dc2626; }

/* ============================================================
   【学生端】行为分胶囊 + 明细弹层（map 顶栏）
   ============================================================ */
.beh-me-wrap { position: relative; display: inline-flex; margin-left: 8px; }
.pill-beh-me {
  display: inline-flex; align-items: center; gap: 6px; border: none; cursor: pointer;
  border-radius: 999px; padding: 7px 14px; font-size: 13.5px; font-weight: 900; color: #fff;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  box-shadow: 0 4px 12px rgba(217, 119, 6, .4); transition: transform .12s;
}
.pill-beh-me:hover { transform: translateY(-1px); }
.pill-beh-me b { font-size: 15px; }
.pill-beh-me.zero { background: linear-gradient(135deg, #94a3b8, #64748b); box-shadow: 0 4px 12px rgba(100, 116, 139, .35); }
.pill-beh-me .pbm-week { font-size: 11.5px; font-weight: 900; background: rgba(255, 255, 255, .25); border-radius: 999px; padding: 2px 8px; }
.pill-beh-me .pbm-week.up { background: #dcfce7; color: #15803d; }
.pill-beh-me .pbm-week.down { background: #fee2e2; color: #b91c1c; }
.beh-me-pop {
  position: absolute; top: calc(100% + 10px); right: 0; width: 322px; z-index: 9600;
  background: #fff; border-radius: 16px; overflow: hidden; text-align: left;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .28);
}
.bmp-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; background: linear-gradient(135deg, #f59e0b, #d97706); color: #fff; }
.bmp-head-tit { font-weight: 900; font-size: 15px; }
.bmp-head-score { font-size: 22px; font-weight: 900; }
.bmp-stats { display: flex; gap: 8px; padding: 12px 12px 4px; }
.bmp-stat { flex: 1; text-align: center; border-radius: 12px; padding: 10px 4px; }
.bmp-stat b { display: block; font-size: 17px; font-weight: 900; }
.bmp-stat span { font-size: 11px; color: #94a3b8; }
.bmp-stat.plus { background: #ecfdf5; }
.bmp-stat.plus b { color: #059669; }
.bmp-stat.minus { background: #fff7ed; }
.bmp-stat.minus b { color: #dc2626; }
.bmp-stat.week { background: #eff6ff; }
.bmp-stat.week b { color: #2563eb; }
.bmp-list { max-height: 224px; overflow: auto; padding: 8px 12px 4px; }
.bmp-row { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 8px; font-size: 12.5px; margin-bottom: 3px; }
.bmp-row.plus { background: #f0fdf4; }
.bmp-row.minus { background: #fff7ed; }
.bmp-d { font-weight: 900; width: 36px; flex: none; text-align: center; }
.bmp-row.plus .bmp-d { color: #059669; }
.bmp-row.minus .bmp-d { color: #dc2626; }
.bmp-r { flex: 1; color: #334155; font-weight: 600; }
.bmp-t { color: #94a3b8; font-size: 11px; flex: none; }
.bmp-empty { padding: 18px 16px; text-align: center; color: #94a3b8; font-size: 12.5px; line-height: 1.7; }
.bmp-foot { padding: 10px 12px 14px; }
.bmp-honor-link {
  display: block; width: 100%; border: none; cursor: pointer;
  background: linear-gradient(135deg, #6366f1, #8b5cf6); color: #fff;
  font-weight: 900; font-size: 14px; border-radius: 12px; padding: 11px 0;
}
.bmp-honor-link:hover { filter: brightness(1.08); }
.bmp-enter-active, .bmp-leave-active { transition: all .18s ease; }
.bmp-enter-from, .bmp-leave-to { opacity: 0; transform: translateY(-6px); }

/* ============================================================
   【学生端】行为习惯光荣榜大屏（#/honor 深蓝鎏金主题）
   ============================================================ */
.honor-page {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; inset: 0;
  z-index: 9000; overflow: hidden; display: flex; flex-direction: column;
  color: #f1f5f9;
  background:
    radial-gradient(ellipse 55% 38% at 50% -8%, rgba(250, 204, 21, .16), transparent 62%),
    radial-gradient(ellipse 40% 30% at 88% 108%, rgba(124, 58, 237, .28), transparent 62%),
    radial-gradient(ellipse 36% 26% at 6% 102%, rgba(6, 182, 212, .2), transparent 62%),
    linear-gradient(168deg, #0b1026 0%, #141b3d 46%, #1d1240 100%);
}
/* 星点装饰层 */
.honor-page::before {
  content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; inset: 0;
  pointer-events: none; opacity: .75; background-image:
    radial-gradient(1.6px 1.6px at 8% 18%, rgba(255,255,255,.7) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 21% 64%, rgba(255,255,255,.5) 50%, transparent 51%),
    radial-gradient(1.8px 1.8px at 32% 30%, rgba(253,224,71,.6) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 44% 78%, rgba(255,255,255,.45) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 57% 14%, rgba(255,255,255,.6) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 66% 52%, rgba(165,180,252,.6) 50%, transparent 51%),
    radial-gradient(1.8px 1.8px at 76% 26%, rgba(255,255,255,.55) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 85% 70%, rgba(253,224,71,.5) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 93% 38%, rgba(255,255,255,.6) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 14% 44%, rgba(255,255,255,.4) 50%, transparent 51%);
}
.honor-header {
  display: flex; align-items: flex-end; justify-content: space-between;
  padding: calc(var(--vhpx, 1vh) * 3) calc(var(--vwpx, 1vw) * 3) 0;
  position: relative; z-index: 2;
}
.honor-title {
  font-size: calc(var(--vwpx, 1vw) * 3); font-weight: 900;
  letter-spacing: calc(var(--vwpx, 1vw) * .32);
  background: linear-gradient(180deg, #fef9c3 8%, #fde047 52%, #f59e0b 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .45)) drop-shadow(0 0 26px rgba(250, 204, 21, .3));
}
.honor-sub {
  margin-top: calc(var(--vhpx, 1vh) * 1.1);
  font-size: calc(var(--vwpx, 1vw) * 1.12); color: #c7d2fe;
  letter-spacing: calc(var(--vwpx, 1vw) * .2);
}
.honor-right { display: flex; align-items: center; gap: calc(var(--vwpx, 1vw) * 1.1); }
.honor-cls-select {
  background: rgba(255, 255, 255, .1); border: 1.5px solid rgba(255, 255, 255, .35);
  color: #fff; font-size: calc(var(--vwpx, 1vw) * 1.02); font-weight: 800;
  border-radius: 999px; padding: calc(var(--vhpx, 1vh) * .9) calc(var(--vwpx, 1vw) * 1.2); cursor: pointer;
}
.honor-cls-select option { color: #1e293b; }
.honor-time { font-size: calc(var(--vwpx, 1vw) * .92); color: #8ea0c8; font-variant-numeric: tabular-nums; }
.honor-back {
  border: 1.5px solid rgba(255, 255, 255, .4); background: rgba(255, 255, 255, .1);
  color: #e2e8f0; font-size: calc(var(--vwpx, 1vw) * .98); font-weight: 800;
  border-radius: 999px; padding: calc(var(--vhpx, 1vh) * .9) calc(var(--vwpx, 1vw) * 1.3); cursor: pointer;
}
.honor-back:hover { background: rgba(255, 255, 255, .22); }

/* 空状态：大金奖杯 + 呼吸动画 */
.honor-empty-big { text-align: center; color: #cbd5e1; font-size: calc(var(--vwpx, 1vw) * 1.22); line-height: 1.9; }
.honor-empty-center {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: calc(var(--vhpx, 1vh) * 2.6); position: relative; z-index: 2;
  padding: 0 calc(var(--vwpx, 1vw) * 8); text-align: center;
}
.honor-empty-center::before {
  content: '🏆'; display: block; line-height: 1;
  font-size: calc(var(--vwpx, 1vw) * 8.5);
  filter: drop-shadow(0 0 46px rgba(250, 204, 21, .5)) drop-shadow(0 14px 24px rgba(0, 0, 0, .5));
  animation: honorPulse 2.6s ease-in-out infinite;
}
@keyframes honorPulse {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(calc(var(--vhpx, 1vh) * -1.4)) scale(1.04); }
}

/* 领奖台：银 · 金 · 铜 三柱 */
.honor-podium {
  flex: 1; min-height: 0; display: flex; align-items: flex-end; justify-content: center;
  gap: calc(var(--vwpx, 1vw) * 2.6); position: relative; z-index: 2;
  padding: 0 calc(var(--vwpx, 1vw) * 3);
}
.honor-pad {
  display: flex; flex-direction: column; align-items: center; justify-content: flex-end;
  width: calc(var(--vwpx, 1vw) * 14.5);
}
.honor-pad.p1 { width: calc(var(--vwpx, 1vw) * 17.5); }
.honor-medal { font-size: calc(var(--vwpx, 1vw) * 2.5); margin-bottom: calc(var(--vhpx, 1vh) * .8); filter: drop-shadow(0 5px 10px rgba(0, 0, 0, .45)); }
.honor-pad-ava {
  width: calc(var(--vwpx, 1vw) * 6.2); height: calc(var(--vwpx, 1vw) * 6.2); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: calc(var(--vwpx, 1vw) * 2.5); font-weight: 900; color: #fff;
  background: linear-gradient(160deg, #818cf8, #6366f1);
  border: calc(var(--vwpx, 1vw) * .2) solid rgba(255, 255, 255, .85);
  box-shadow: 0 0 0 calc(var(--vwpx, 1vw) * .45) rgba(99, 102, 241, .22), 0 12px 30px rgba(0, 0, 0, .42);
  text-shadow: 0 2px 4px rgba(0, 0, 0, .25);
}
.p1 .honor-pad-ava {
  width: calc(var(--vwpx, 1vw) * 7.8); height: calc(var(--vwpx, 1vw) * 7.8);
  font-size: calc(var(--vwpx, 1vw) * 3.1);
  background: linear-gradient(160deg, #fde047, #f59e0b);
  box-shadow: 0 0 0 calc(var(--vwpx, 1vw) * .55) rgba(250, 204, 21, .28), 0 0 52px rgba(250, 204, 21, .42), 0 12px 30px rgba(0, 0, 0, .4);
}
.p2 .honor-pad-ava { background: linear-gradient(160deg, #e2e8f0, #94a3b8); box-shadow: 0 0 0 calc(var(--vwpx, 1vw) * .45) rgba(203, 213, 225, .22), 0 12px 30px rgba(0, 0, 0, .4); }
.p3 .honor-pad-ava { background: linear-gradient(160deg, #fdba74, #ea580c); box-shadow: 0 0 0 calc(var(--vwpx, 1vw) * .45) rgba(251, 146, 60, .22), 0 12px 30px rgba(0, 0, 0, .4); }
.honor-pad-name { margin-top: calc(var(--vhpx, 1vh) * 1.2); font-size: calc(var(--vwpx, 1vw) * 1.45); font-weight: 900; color: #f8fafc; letter-spacing: .12em; }
.p1 .honor-pad-name { font-size: calc(var(--vwpx, 1vw) * 1.85); color: #fde047; }
.honor-pad-grp { margin-top: calc(var(--vhpx, 1vh) * .4); font-size: calc(var(--vwpx, 1vw) * .92); color: #a5b4fc; }
.honor-pad-score { margin-top: calc(var(--vhpx, 1vh) * .7); font-size: calc(var(--vwpx, 1vw) * 1.65); font-weight: 900; color: #fbbf24; }
.p1 .honor-pad-score { font-size: calc(var(--vwpx, 1vw) * 2.15); }
.honor-pad-praise { margin: calc(var(--vhpx, 1vh) * .4) 0 calc(var(--vhpx, 1vh) * 1.2); font-size: calc(var(--vwpx, 1vw) * .85); color: #8ea0c8; }
/* 三柱底座 */
.honor-pad::after {
  content: ''; width: 100%; margin-top: calc(var(--vhpx, 1vh) * 1);
  border-radius: calc(var(--vwpx, 1vw) * .55) calc(var(--vwpx, 1vw) * .55) 0 0;
  border: 1px solid rgba(255, 255, 255, .16); border-bottom: none;
  background: linear-gradient(180deg, rgba(148, 163, 184, .32), rgba(148, 163, 184, .06));
}
.p1::after {
  height: calc(var(--vhpx, 1vh) * 10.5);
  background: linear-gradient(180deg, rgba(250, 204, 21, .38), rgba(250, 204, 21, .05));
  box-shadow: inset 0 0 46px rgba(250, 204, 21, .12);
}
.p2::after { height: calc(var(--vhpx, 1vh) * 6); }
.p3::after { height: calc(var(--vhpx, 1vh) * 8.5); background: linear-gradient(180deg, rgba(251, 146, 60, .32), rgba(251, 146, 60, .05)); }

/* 下半部双面板 */
.honor-bottom {
  display: flex; gap: calc(var(--vwpx, 1vw) * 1.6);
  height: calc(var(--vhpx, 1vh) * 35);
  padding: 0 calc(var(--vwpx, 1vw) * 3) calc(var(--vhpx, 1vh) * 3.2);
  position: relative; z-index: 2; min-height: 0;
}
.honor-panel {
  flex: 1; display: flex; flex-direction: column; min-height: 0; overflow: hidden;
  background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14);
  border-radius: calc(var(--vwpx, 1vw) * .9); backdrop-filter: blur(6px);
}
.honor-panel-title {
  flex: none; font-size: calc(var(--vwpx, 1vw) * 1.15); font-weight: 900;
  color: #fde047; letter-spacing: calc(var(--vwpx, 1vw) * .14);
  padding: calc(var(--vhpx, 1vh) * 1.1) calc(var(--vwpx, 1vw) * 1.2);
  border-bottom: 1px solid rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .045);
}
.honor-list { flex: 1; min-height: 0; overflow: auto; padding: calc(var(--vhpx, 1vh) * .9) calc(var(--vwpx, 1vw) * 1.1); }
.honor-row {
  display: flex; align-items: center; gap: calc(var(--vwpx, 1vw) * .9);
  padding: calc(var(--vhpx, 1vh) * .75) calc(var(--vwpx, 1vw) * .8);
  border-radius: calc(var(--vwpx, 1vw) * .45); margin-bottom: calc(var(--vhpx, 1vh) * .45);
  background: rgba(255, 255, 255, .055);
  font-size: calc(var(--vwpx, 1vw) * 1.02);
}
.honor-rank {
  flex: none; width: calc(var(--vwpx, 1vw) * 1.85); height: calc(var(--vwpx, 1vw) * 1.85);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #64748b, #475569); color: #fff;
  font-weight: 900; font-size: calc(var(--vwpx, 1vw) * .92); box-shadow: 0 2px 8px rgba(0, 0, 0, .3);
}
.honor-row-ava {
  flex: none; width: calc(var(--vwpx, 1vw) * 1.8); height: calc(var(--vwpx, 1vw) * 1.8);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(160deg, #818cf8, #6366f1); color: #fff;
  font-weight: 900; font-size: calc(var(--vwpx, 1vw) * .88);
  border: 1.5px solid rgba(255, 255, 255, .5);
}
.honor-row-name { font-weight: 900; color: #f8fafc; min-width: calc(var(--vwpx, 1vw) * 5); }
.honor-row-grp { flex: 1; color: #a5b4fc; font-size: calc(var(--vwpx, 1vw) * .88); }
.honor-row-score { margin-left: auto; font-weight: 900; color: #fbbf24; font-size: calc(var(--vwpx, 1vw) * 1.1); }

/* ============================================================
   【学生端】光荣榜大屏 · 喜庆增强 r118
   冠军大奖杯 / 旋转金环 / 飘落礼花 / 冠军徽章 / 底座名次
   ============================================================ */
/* 星点轻轻闪烁、标题金色呼吸光晕 */
.honor-page::before { animation: honorStars 5s ease-in-out infinite; }
@keyframes honorStars { 0%, 100% { opacity: .5; } 50% { opacity: .95; } }
.honor-title { animation: honorTitleGlow 3.2s ease-in-out infinite; }
@keyframes honorTitleGlow {
  0%, 100% { filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .45)) drop-shadow(0 0 20px rgba(250, 204, 21, .22)); }
  50% { filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .45)) drop-shadow(0 0 42px rgba(250, 204, 21, .62)); }
}

/* 全屏飘落礼花层（位于内容 z-index:2 之下，不挡文字） */
.honor-fx { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; pointer-events: none; z-index: 1; }
.honor-fx span {
  position: absolute; top: -8%; line-height: 1; opacity: 0;
  will-change: transform;
  animation-name: honorFall; animation-timing-function: linear; animation-iteration-count: infinite;
}
.honor-fx span:nth-child(1) { left: 5%; font-size: calc(var(--vwpx, 1vw) * 2.1); animation-duration: 12s; animation-delay: -1s; }
.honor-fx span:nth-child(2) { left: 14%; font-size: calc(var(--vwpx, 1vw) * 1.5); animation-duration: 15s; animation-delay: -6s; }
.honor-fx span:nth-child(3) { left: 23%; font-size: calc(var(--vwpx, 1vw) * 1.9); animation-duration: 13s; animation-delay: -3s; }
.honor-fx span:nth-child(4) { left: 33%; font-size: calc(var(--vwpx, 1vw) * 1.3); animation-duration: 11s; animation-delay: -8s; }
.honor-fx span:nth-child(5) { left: 44%; font-size: calc(var(--vwpx, 1vw) * 1.7); animation-duration: 14s; animation-delay: -4s; }
.honor-fx span:nth-child(6) { left: 55%; font-size: calc(var(--vwpx, 1vw) * 2); animation-duration: 12.5s; animation-delay: -9s; }
.honor-fx span:nth-child(7) { left: 64%; font-size: calc(var(--vwpx, 1vw) * 1.4); animation-duration: 16s; animation-delay: -2s; }
.honor-fx span:nth-child(8) { left: 73%; font-size: calc(var(--vwpx, 1vw) * 1.8); animation-duration: 12s; animation-delay: -7s; }
.honor-fx span:nth-child(9) { left: 83%; font-size: calc(var(--vwpx, 1vw) * 1.5); animation-duration: 13.5s; animation-delay: -5s; }
.honor-fx span:nth-child(10) { left: 92%; font-size: calc(var(--vwpx, 1vw) * 2); animation-duration: 14.5s; animation-delay: -10s; }
.honor-fx span:nth-child(even) { animation-name: honorFallSway; }
@keyframes honorFall {
  0% { transform: translateY(calc(var(--vhpx, 1vh) * -6)) rotate(0deg); opacity: 0; }
  8% { opacity: .9; }
  88% { opacity: .9; }
  100% { transform: translateY(calc(var(--vhpx, 1vh) * 112)) rotate(380deg); opacity: 0; }
}
@keyframes honorFallSway {
  0% { transform: translateY(calc(var(--vhpx, 1vh) * -6)) translateX(0) rotate(0deg); opacity: 0; }
  8% { opacity: .85; }
  30% { transform: translateY(calc(var(--vhpx, 1vh) * 30)) translateX(calc(var(--vwpx, 1vw) * 1.6)) rotate(140deg); }
  62% { transform: translateY(calc(var(--vhpx, 1vh) * 66)) translateX(calc(var(--vwpx, 1vw) * -1.4)) rotate(240deg); }
  88% { opacity: .85; }
  100% { transform: translateY(calc(var(--vhpx, 1vh) * 112)) translateX(0) rotate(360deg); opacity: 0; }
}

/* 领奖柱相对定位（供底座名次数字锚定） */
.honor-pad { position: relative; }

/* ============================================================
   翻转课堂 · 学生端答题层（前置任务 / 综合监测）
   ============================================================ */
.flip-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; inset: 0; z-index: 9500;
  background: rgba(15,23,42,.55); display: flex; align-items: center; justify-content: center; padding: 24px; }
.flip-modal { position: relative; width: 94%; max-width: 900px; max-height: calc(var(--vhpx, 1vh) * 92);
  background: #fff; border-radius: 20px; overflow: hidden; display: flex; flex-direction: column;
  box-shadow: 0 24px 60px rgba(30,41,59,.18); animation: flipPop .28s cubic-bezier(.2,.9,.3,1.2); }
@keyframes flipPop { from { transform: scale(.94) translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }
/* —— 窗口形态对齐互动题（im）：intro 小卡片 / do·done 全屏铺满 —— */
.flip-modal.flip-mode-intro {
  width: min(520px, calc(var(--vwpx, 1vw) * 92));
  max-height: calc(var(--vhpx, 1vh) * 80);
}
.flip-overlay.flip-ov-do,
.flip-overlay.flip-ov-done {
  background:
    radial-gradient(circle at 12% 18%, rgba(59,130,246,.10) 0%, rgba(59,130,246,0) 38%),
    radial-gradient(circle at 88% 82%, rgba(168,85,247,.10) 0%, rgba(168,85,247,0) 38%),
    radial-gradient(circle at 50% 50%, rgba(99,102,241,.04) 0%, rgba(99,102,241,0) 60%),
    linear-gradient(135deg, #eef2ff 0%, #f0f9ff 50%, #faf5ff 100%);
  padding: 0; display: block;
}
.flip-modal.flip-mode-do,
.flip-modal.flip-mode-done {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  width: auto; height: auto; max-width: none; max-height: none;
  border-radius: 0; box-shadow: none;
  animation: flipPageIn .24s ease;
}
@keyframes flipPageIn { from { opacity: 0; } to { opacity: 1; } }
/* 全屏态顶栏向两侧舒展（对齐 im-ov-do .im-topbar） */
.flip-overlay.flip-ov-do .flip-topbar,
.flip-overlay.flip-ov-done .flip-topbar { padding: 11px 28px; }
/* 作答/完成内容居中限宽（对齐 im-do / im-body-result 的 1560px） */
.flip-overlay.flip-ov-do .flip-do,
.flip-overlay.flip-ov-done .flip-done { width: 100%; max-width: 1560px; margin-left: auto; margin-right: auto; }
/* 顶栏：阶段徽标 + 课时名 + 答题圆点 + 状态 */
.flip-topbar { flex: none; display: flex; align-items: center; padding: 14px 26px;
  background: linear-gradient(180deg, #ffffff 0%, #fafbff 100%);
  border-bottom: 1px solid #e6e9f2;
  box-shadow: 0 2px 10px rgba(30,41,59,.04);
  position: relative; }
.flip-topbar::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: linear-gradient(90deg, #3b82f6 0%, #6366f1 50%, #a855f7 100%); opacity: .55; }
.flip-hdr { flex: 1 1 0; min-width: 0; display: flex; align-items: center; }
.flip-phase-badge { flex: none; font-size: 18px; font-weight: 800; padding: 5px 16px; border-radius: 999px; white-space: nowrap; }
.flip-phase-badge.fpb-pre {
  background: linear-gradient(135deg, #dbeafe, #bfdbfe);
  color: #1d4ed8; border: 1px solid #93c5fd;
  box-shadow: 0 2px 6px rgba(59,130,246,.18), inset 0 1px 0 rgba(255,255,255,.5);
}
.flip-phase-badge.fpb-post {
  background: linear-gradient(135deg, #ede9fe, #ddd6fe);
  color: #6d28d9; border: 1px solid #c4b5fd;
  box-shadow: 0 2px 6px rgba(168,85,247,.18), inset 0 1px 0 rgba(255,255,255,.5);
}
.flip-task-name { font-size: 20px; font-weight: 800; color: #1f2738; margin-left: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.flip-dots { flex: none; display: flex; align-items: center; margin: 0 14px; }
.flip-dot { width: 34px; height: 34px; line-height: 32px; text-align: center; border-radius: 50%;
  border: 2px solid #e2e8f0; background: #f8fafc; color: #94a3b8; font-size: 16px; font-weight: 800; margin-left: 8px; cursor: pointer; }
.flip-dot.on { background: #3b82f6; border-color: #3b82f6; color: #fff; }
.flip-dot.cur { border-color: #f59e0b; box-shadow: 0 0 0 3px rgba(245,158,11,.18); }
.flip-step-tag { flex: none; font-size: 17px; font-weight: 700; color: #64748b; background: #f1f5f9;
  border-radius: 999px; padding: 5px 14px; margin-left: 12px; white-space: nowrap; }
.flip-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 26px 30px; }
/* —— intro：说明页 —— */
.flip-intro { text-align: center; padding: 32px 14px 22px; }
.flip-intro-ico {
  font-size: 56px; line-height: 1; margin-bottom: 18px;
  display: inline-flex; align-items: center; justify-content: center;
  width: 112px; height: 112px; border-radius: 50%;
  background: linear-gradient(135deg, #dbeafe 0%, #e0e7ff 50%, #ede9fe 100%);
  box-shadow: 0 14px 36px rgba(99,102,241,.22), inset 0 2px 4px rgba(255,255,255,.7), inset 0 -2px 6px rgba(99,102,241,.08);
  position: relative;
}
.flip-intro-ico::before {
  content: ''; position: absolute; top: 8px; left: 18px; right: 18px; height: 24px;
  background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0));
  border-radius: 999px; pointer-events: none;
}
.flip-intro-title {
  font-size: 32px; font-weight: 900; margin: 0 0 14px;
  color: #1e3a8a;
  background: linear-gradient(135deg, #1e3a8a 0%, #4f46e5 50%, #7c3aed 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.flip-intro-txt {
  font-size: 20px; color: #475569; line-height: 1.78; margin: 0 auto 24px;
  max-width: 680px; text-align: left;
  padding: 16px 22px; background: rgba(255,255,255,.6);
  border-radius: 14px; border: 1px solid rgba(199,210,254,.5);
  box-shadow: 0 4px 12px rgba(30,41,59,.04);
}
.flip-btn-row { display: flex; justify-content: center; flex-wrap: wrap; }
.flip-btn { font-family: inherit; font-size: 20px; font-weight: 800; padding: 13px 28px; border-radius: 999px;
  border: none; cursor: pointer; transition: .15s; margin: 0 8px 10px; }
.flip-btn.main {
  background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 45%, #6366f1 100%);
  color: #fff;
  box-shadow: 0 6px 20px rgba(59,130,246,.42), inset 0 1px 0 rgba(255,255,255,.3), inset 0 -2px 4px rgba(37,99,235,.25);
}
.flip-btn.main:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(59,130,246,.52), inset 0 1px 0 rgba(255,255,255,.4); }
.flip-btn.ghost {
  background: linear-gradient(180deg, #ffffff, #f8fafc);
  color: #475569; border: 1px solid #cbd5e1;
  box-shadow: 0 2px 6px rgba(30,41,59,.05);
}
.flip-btn.ghost:hover { background: linear-gradient(180deg, #f8fafc, #eef2ff); border-color: #93c5fd; color: #1d4ed8; }
.flip-btn:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
/* —— do：逐题作答 —— */
.flip-do { max-width: 820px; margin: 0 auto; }
.flip-q-no {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 15px; font-weight: 800; color: #1d4ed8;
  background: linear-gradient(135deg, #dbeafe, #e0e7ff);
  padding: 6px 16px; border-radius: 999px; margin-bottom: 14px;
  border: 1px solid #bfdbfe;
  box-shadow: 0 2px 6px rgba(59,130,246,.15);
}
.flip-q-text {
  font-size: 25px; font-weight: 700; color: #1f2738; line-height: 1.6;
  margin-bottom: 24px; padding: 18px 24px;
  background: linear-gradient(180deg, #ffffff, #fafbff);
  border-radius: 14px; border-left: 5px solid #3b82f6;
  box-shadow: 0 4px 16px rgba(30,41,59,.06), 0 1px 3px rgba(30,41,59,.04);
}
.flip-opts { display: block; }
.flip-opt {
  display: flex; align-items: center; width: 100%; text-align: left;
  background: linear-gradient(180deg, #ffffff, #f8fafc);
  border: 2px solid #e2e8f0;
  border-radius: 14px; padding: 16px 20px; font-size: 21px; color: #334155; line-height: 1.55;
  margin-bottom: 12px; cursor: pointer; font-family: inherit; transition: .15s;
  box-shadow: 0 2px 6px rgba(30,41,59,.04);
}
.flip-opt::before {
  content: attr(data-letter); flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  background: linear-gradient(135deg, #f1f5f9, #e2e8f0);
  color: #64748b; font-size: 16px; font-weight: 800;
  margin-right: 16px; transition: .15s;
  border: 1px solid #cbd5e1;
}
.flip-opt:hover {
  border-color: #93c5fd; background: linear-gradient(180deg, #f5f9ff, #eef2ff);
  transform: translateY(-1px); box-shadow: 0 6px 16px rgba(59,130,246,.12);
}
.flip-opt:hover::before { background: linear-gradient(135deg, #dbeafe, #bfdbfe); color: #1d4ed8; border-color: #93c5fd; }
.flip-opt.sel {
  border-color: #3b82f6;
  background: linear-gradient(135deg, #eff6ff 0%, #e0e7ff 50%, #f5f3ff 100%);
  color: #1d4ed8; font-weight: 700;
  box-shadow: 0 0 0 3px rgba(59,130,246,.18), 0 6px 18px rgba(59,130,246,.18);
}
.flip-opt.sel::before {
  background: linear-gradient(135deg, #3b82f6, #6366f1);
  color: #fff; border-color: #3b82f6;
  box-shadow: 0 2px 8px rgba(59,130,246,.4);
}
.flip-nav-row { display: flex; align-items: center; justify-content: space-between; margin-top: 20px;
  padding-top: 16px; border-top: 1px dashed #e2e8f0; }
.flip-tip-txt { font-size: 15px; color: #94a3b8; }
/* —— done：完成页 —— */
.flip-done { text-align: center; padding: 42px 14px 26px; }
.flip-score-line {
  padding: 20px 28px;
  background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 50%, #fef3c7 100%);
  border: 2px solid #86efac;
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(16,185,129,.22), inset 0 1px 0 rgba(255,255,255,.6);
  text-align: center;
  font-size: 22px; font-weight: 700;
  max-width: 480px;
  margin: 0 auto 14px;
}
.flip-score-line b {
  display: inline-block; vertical-align: middle;
  font-size: 46px; font-weight: 900;
  background: linear-gradient(135deg, #059669 0%, #10b981 50%, #047857 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  margin: 0 4px;
}
/* —— 课本图片查看层（盖在 flip-modal 之上） —— */
.flip-book { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(15,23,42,.82);
  display: flex; align-items: center; justify-content: center; padding: 20px; z-index: 5; }
.flip-book-box { position: relative; width: 96%; max-width: 1100px; height: 92%; background: #fff;
  border-radius: 16px; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,.4); }
.flip-book-bar { flex: none; display: flex; align-items: center; padding: 10px 18px; background: #1f2738; color: #fff; }
.flip-book-name { font-size: 18px; font-weight: 800; }
.flip-book-page { margin-left: auto; font-size: 16px; color: #cbd5e1; margin-right: 14px; }
.flip-book-close { background: none; border: none; color: #cbd5e1; font-size: 26px; cursor: pointer; line-height: 1; padding: 0 4px; }
.flip-book-close:hover { color: #fff; }
.flip-book-imgwrap { flex: 1 1 0; min-height: 0; background: #f1f5f9; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.flip-book-img { max-width: 100%; max-height: 100%; object-fit: contain; }
.flip-book-err { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #fff; color: #b45309;
  font-size: 20px; font-weight: 700; display: flex; align-items: center; justify-content: center; text-align: center; padding: 30px; }
.flip-book-nav { flex: none; display: flex; justify-content: center; padding: 12px; background: #fff; border-top: 1px solid #e2e8f0; }

/* ============================================================
   翻转课堂 · 教师端（三阶段指令按钮 + 学情面板 + 逐题讲评）
   ============================================================ */
body.is-teacher .live-view .cmd-btn.cmd-flip { background: #2563eb; border-color: #2563eb; color: #fff; }
body.is-teacher .live-view .cmd-btn.cmd-flip.on { background: #e74c3c; border-color: #e74c3c; }
/* —— 前测学情入口按钮行（2026-09-29：后测计分已入雷达口径，监测学情入口移除，仅留前测手动查看） —— */
body.is-teacher .fp-entry-row { display: flex; align-items: center; flex-wrap: wrap; margin: 0 0 14px; }
body.is-teacher .fp-entry-btn { font-family: inherit; font-size: 15px; font-weight: 700; color: #1d4ed8;
  background: linear-gradient(180deg, #ffffff, #eff6ff); border: 1px solid #93c5fd; border-radius: 999px;
  padding: 8px 18px; cursor: pointer; margin-right: 10px; transition: .14s;
  box-shadow: 0 2px 6px rgba(59,130,246,.12); }
body.is-teacher .fp-entry-btn:hover { background: linear-gradient(180deg, #eff6ff, #dbeafe); transform: translateY(-1px); }
body.is-teacher .fp-entry-tip { font-size: 13px; color: #94a3b8; }
body.is-teacher .fp-lesson-sel { font-family: inherit; font-size: 13px; color: #334155; background: #fff;
  border: 1px solid #cbd5e1; border-radius: 8px; padding: 5px 8px; margin-right: 16px; max-width: 220px; cursor: pointer; }
/* —— 基础弹窗类补齐（modal-overlay/head/close/foot 此前无样式定义，考勤弹窗一并受益） —— */
body.is-teacher .modal-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(15,23,42,.5);
  display: flex; align-items: center; justify-content: center; z-index: 12000; padding: 20px; }
body.is-teacher .modal .modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
body.is-teacher .modal .modal-head h3 { margin: 0; font-size: 17px; font-weight: 700; color: #2d3748; }
body.is-teacher .modal .modal-close { border: none; background: none; font-size: 22px; color: #a0aec0; cursor: pointer; padding: 0 4px; line-height: 1; }
body.is-teacher .modal .modal-close:hover { color: #2d3748; }
body.is-teacher .modal .modal-foot { display: flex; justify-content: flex-end; align-items: center; margin-top: 18px; }
/* —— 学情面板：按题错误率 —— */
body.is-teacher .flip-panel { background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; padding: 16px 20px; margin: 0 0 14px; }
body.is-teacher .fp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
body.is-teacher .fp-title { display: flex; align-items: center; }
body.is-teacher .fp-badge { font-size: 13px; font-weight: 700; padding: 3px 12px; border-radius: 999px; white-space: nowrap; }
body.is-teacher .fp-badge.fpb-pre { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; }
body.is-teacher .fp-badge.fpb-post { background: #f5f3ff; color: #7c3aed; border: 1px solid #ddd6fe; }
body.is-teacher .fp-title-txt { font-size: 16px; font-weight: 700; color: #2d3748; margin-left: 12px; }
body.is-teacher .fp-meta { display: flex; align-items: center; font-size: 14px; color: #5a6b7f; }
body.is-teacher .fp-meta span { margin-left: 16px; }
body.is-teacher .fp-live-tag { color: #1e40af; font-weight: 700; }
body.is-teacher .fp-close { border: none; background: #f1f5f9; color: #64748b; font-size: 13px; font-weight: 600;
  padding: 6px 14px; border-radius: 999px; cursor: pointer; margin-left: 16px; }
body.is-teacher .fp-close:hover { background: #e2e8f0; color: #2d3748; }
body.is-teacher .fp-qs { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 12px; }
body.is-teacher .fp-q { display: flex; align-items: stretch; background: #f8fafc; border: 1px solid #e2e8f0;
  border-radius: 12px; padding: 12px 14px; cursor: pointer; transition: .14s; }
body.is-teacher .fp-q:hover { border-color: #93c5fd; background: #eff6ff; }
body.is-teacher .fp-q.warm { border-color: #fcd34d; background: #eff6ff; }
body.is-teacher .fp-q.hot { border-color: #fca5a5; background: #fef2f2; }
body.is-teacher .fp-q-no { flex: none; width: 30px; height: 30px; line-height: 30px; text-align: center; border-radius: 50%;
  background: #e2e8f0; color: #475569; font-size: 14px; font-weight: 800; margin-right: 12px; margin-top: 2px; }
body.is-teacher .fp-q.warm .fp-q-no { background: #f59e0b; color: #fff; }
body.is-teacher .fp-q.hot .fp-q-no { background: #ef4444; color: #fff; }
body.is-teacher .fp-q-main { flex: 1 1 0; min-width: 0; }
body.is-teacher .fp-q-text { font-size: 14.5px; font-weight: 600; color: #2d3748; line-height: 1.5; margin-bottom: 6px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
body.is-teacher .fp-q-kp { font-size: 12.5px; color: #64748b; margin-bottom: 8px; }
body.is-teacher .fp-q-bar { height: 8px; background: #e2e8f0; border-radius: 999px; overflow: hidden; }
body.is-teacher .fp-q-fill { height: 100%; background: #3b82f6; border-radius: 999px; transition: width .3s; }
body.is-teacher .fp-q.warm .fp-q-fill { background: #f59e0b; }
body.is-teacher .fp-q.hot .fp-q-fill { background: #ef4444; }
body.is-teacher .fp-q-rate { flex: none; text-align: right; margin-left: 14px; }
body.is-teacher .fp-q-rate b { display: block; font-size: 22px; font-weight: 800; color: #2d3748; line-height: 1.1; }
body.is-teacher .fp-q.warm .fp-q-rate b { color: #f59e0b; }
body.is-teacher .fp-q.hot .fp-q-rate b { color: #ef4444; }
body.is-teacher .fp-q-rate small { font-size: 11.5px; color: #94a3b8; }
body.is-teacher .fp-empty { grid-column: 1 / -1; text-align: center; color: #94a3b8; font-size: 14px; padding: 18px 0; }
/* —— 逐题讲评弹窗 —— */
body.is-teacher .flip-explain { width: 640px; max-width: 94vw; max-height: 88vh; overflow-y: auto; }
body.is-teacher .fx-kp { display: inline-block; font-size: 12px; font-weight: 600; color: #2563eb;
  background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 999px; padding: 2px 10px; margin-left: 10px; vertical-align: middle; }
body.is-teacher .fx-err-line { font-size: 14px; color: #5a6b7f; margin-bottom: 12px; }
body.is-teacher .fx-err-line b { font-size: 20px; color: #10b981; }
body.is-teacher .fx-err-line b.fx-mid { color: #f59e0b; }
body.is-teacher .fx-err-line b.fx-hi { color: #ef4444; }
body.is-teacher .fx-q { font-size: 16.5px; font-weight: 700; color: #1e293b; line-height: 1.65;
  background: #f8fafc; border-left: 4px solid #3b82f6; border-radius: 8px; padding: 14px 16px; margin-bottom: 14px; }
body.is-teacher .fx-opts { margin-bottom: 14px; }
body.is-teacher .fx-opt { display: flex; align-items: center; background: #fff; border: 1px solid #e2e8f0;
  border-radius: 10px; padding: 11px 14px; margin-bottom: 8px; }
body.is-teacher .fx-opt.ok { border-color: #34d399; background: #ecfdf5; }
body.is-teacher .fx-opt-mark { flex: none; width: 26px; height: 26px; line-height: 26px; text-align: center; border-radius: 50%;
  background: #f1f5f9; color: #475569; font-size: 13px; font-weight: 800; margin-right: 12px; }
body.is-teacher .fx-opt.ok .fx-opt-mark { background: #10b981; color: #fff; }
body.is-teacher .fx-opt-txt { flex: 1 1 0; min-width: 0; font-size: 14.5px; color: #334155; line-height: 1.5; }
body.is-teacher .fx-opt.ok .fx-opt-txt { color: #065f46; font-weight: 700; }
body.is-teacher .fx-opt-n { flex: none; font-size: 13px; font-weight: 700; color: #64748b; margin-left: 12px; }
body.is-teacher .fx-ex { font-size: 14.5px; color: #1e3a8a; background: #eff6ff; border: 1px solid #bfdbfe;
  border-radius: 10px; padding: 12px 14px; line-height: 1.7; margin-bottom: 12px; }
body.is-teacher .fx-wrong { font-size: 13.5px; color: #b91c1c; background: #fef2f2; border: 1px solid #fecaca;
  border-radius: 10px; padding: 11px 14px; line-height: 1.7; }
body.is-teacher .fx-wrong.ok { color: #047857; background: #ecfdf5; border-color: #a7f3d0; }
body.is-teacher .fx-nav { display: flex; align-items: center; justify-content: center; margin-top: 18px; }
body.is-teacher .fx-nav-btn { border: 1px solid #e2e8f0; background: #f8fafc; color: #2d3748; font-size: 14px;
  font-weight: 700; padding: 9px 22px; border-radius: 999px; cursor: pointer; }
body.is-teacher .fx-nav-btn:hover:not(:disabled) { background: #eff6ff; border-color: #93c5fd; color: #2563eb; }
body.is-teacher .fx-nav-btn:disabled { opacity: .4; cursor: not-allowed; }
body.is-teacher .fx-nav-info { font-size: 13px; color: #94a3b8; margin: 0 16px; }

/* 冠军大奖杯：金色光晕 + 旋转放射光芒 + 浮动奖杯 + 闪烁星星 */
.honor-trophy {
  position: relative; flex: none;
  width: calc(var(--vwpx, 1vw) * 7.4);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: calc(var(--vhpx, 1vh) * .5);
}
.honor-trophy::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  width: calc(var(--vwpx, 1vw) * 8.6); height: calc(var(--vwpx, 1vw) * 8.6);
  margin: calc(var(--vwpx, 1vw) * -4.3) 0 0 calc(var(--vwpx, 1vw) * -4.3);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(250, 204, 21, .34) 0%, rgba(250, 204, 21, .1) 46%, rgba(250, 204, 21, 0) 68%);
  animation: honorGlow 2.8s ease-in-out infinite;
}
.ht-rays {
  position: absolute; top: 50%; left: 50%;
  width: calc(var(--vwpx, 1vw) * 7.8); height: calc(var(--vwpx, 1vw) * 7.8);
  margin: calc(var(--vwpx, 1vw) * -3.9) 0 0 calc(var(--vwpx, 1vw) * -3.9);
  border-radius: 50%;
  background: repeating-conic-gradient(rgba(253, 224, 71, .5) 0deg 6deg, rgba(253, 224, 71, 0) 6deg 22.5deg);
  animation: honorSpin 26s linear infinite;
}
.ht-emoji {
  position: relative; z-index: 2; line-height: 1;
  font-size: calc(var(--vwpx, 1vw) * 3.9);
  filter: drop-shadow(0 0 20px rgba(250, 204, 21, .8)) drop-shadow(0 10px 14px rgba(0, 0, 0, .5));
  animation: honorTrophyFloat 3s ease-in-out infinite;
}
.ht-spark { position: absolute; z-index: 3; line-height: 1; animation: honorSpark 2.4s ease-in-out infinite; }
.ht-s1 { top: -8%; left: 2%; font-size: calc(var(--vwpx, 1vw) * 1.15); }
.ht-s2 { top: 6%; right: -4%; font-size: calc(var(--vwpx, 1vw) * 1.55); animation-delay: .6s; }
.ht-s3 { bottom: 2%; right: 12%; font-size: calc(var(--vwpx, 1vw) * .95); animation-delay: 1.2s; }
@keyframes honorSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes honorGlow { 0%, 100% { opacity: .7; transform: scale(.92); } 50% { opacity: 1; transform: scale(1.08); } }
@keyframes honorTrophyFloat {
  0%, 100% { transform: translateY(0) rotate(-4deg); }
  50% { transform: translateY(calc(var(--vhpx, 1vh) * -.8)) rotate(4deg); }
}
@keyframes honorSpark {
  0%, 100% { transform: scale(.6) rotate(-12deg); opacity: .5; }
  50% { transform: scale(1.2) rotate(12deg); opacity: 1; }
}

/* 冠军头像旋转金环（中心由头像自身遮盖，旧内核退回纯金 border 环） */
.honor-pad-ava-wrap { position: relative; flex: none; display: flex; }
.honor-pad-ava { position: relative; z-index: 1; }
.honor-ava-ring {
  position: absolute; top: 50%; left: 50%;
  width: 124%; height: 124%; margin: -62% 0 0 -62%;
  border-radius: 50%;
  border: calc(var(--vwpx, 1vw) * .16) solid rgba(250, 204, 21, .8);
  background: conic-gradient(from 0deg, #fef08a, #f59e0b 20%, rgba(253, 224, 71, .1) 32%, #fde047 48%, #fbbf24 66%, rgba(245, 158, 11, .12) 80%, #fef08a 100%);
  animation: honorSpin 5s linear infinite;
  filter: drop-shadow(0 0 10px rgba(250, 204, 21, .55));
}

/* 冠军红金徽章 */
.honor-champ-badge {
  flex: none;
  margin-top: calc(var(--vhpx, 1vh) * .55);
  padding: calc(var(--vhpx, 1vh) * .32) calc(var(--vwpx, 1vw) * 1.15);
  border-radius: 999px;
  background: linear-gradient(135deg, #f97316 0%, #ef4444 45%, #dc2626 100%);
  border: calc(var(--vwpx, 1vw) * .13) solid #fde047;
  color: #fff; font-weight: 900; letter-spacing: calc(var(--vwpx, 1vw) * .18);
  font-size: calc(var(--vwpx, 1vw) * .98);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
  box-shadow: 0 5px 14px rgba(220, 38, 38, .4), inset 0 0 0 1px rgba(255, 255, 255, .22);
}

/* 底座立体名次数字（data-rank 缺失时自动不渲染） */
.honor-pad::before {
  content: attr(data-rank);
  position: absolute; left: 50%; bottom: calc(var(--vhpx, 1vh) * 2.4);
  transform: translateX(-50%);
  font-size: calc(var(--vwpx, 1vw) * 2.3); font-weight: 900; font-style: italic;
  color: #cbd5e1;
  text-shadow: 0 2px 0 rgba(15, 23, 42, .45), 0 0 14px rgba(226, 232, 240, .4);
  pointer-events: none;
}
.honor-pad.p2::before { bottom: calc(var(--vhpx, 1vh) * 2.2); }
.honor-pad.p3::before { bottom: calc(var(--vhpx, 1vh) * 3.2); color: #fdba74; text-shadow: 0 2px 0 rgba(124, 45, 10, .5), 0 0 14px rgba(251, 146, 60, .5); }
.honor-pad.p1::before {
  bottom: calc(var(--vhpx, 1vh) * 3.4);
  font-size: calc(var(--vwpx, 1vw) * 3.2); color: #fde047;
  text-shadow: 0 2px 0 rgba(120, 53, 15, .6), 0 0 18px rgba(250, 204, 21, .65);
}

/* 冠军柱底座提亮 + 顶部金色高光（略缩 1vh 给大奖杯腾位） */
.honor-pad.p1::after {
  height: calc(var(--vhpx, 1vh) * 9.5);
  background: linear-gradient(180deg, #fef9c3 0%, #fde047 12%, rgba(250, 204, 21, .6) 38%, rgba(250, 204, 21, .07) 100%);
  box-shadow: inset 0 calc(var(--vwpx, 1vw) * .26) 0 rgba(255, 255, 255, .85), inset 0 0 46px rgba(250, 204, 21, .18), 0 0 34px rgba(250, 204, 21, .3);
}

/* 下半部面板：微缩 1vh + 顶部金色高光线 */
.honor-bottom { height: calc(var(--vhpx, 1vh) * 34); }
.honor-panel { position: relative; }
.honor-panel::before {
  content: ''; position: absolute; top: 0; left: 10%; right: 10%; height: 2px;
  background: linear-gradient(90deg, rgba(253, 224, 71, 0), rgba(253, 224, 71, .85), rgba(253, 224, 71, 0));
}

/* ============================================================
   【教师端·行为管理】v158 字号整体提升（仅作用于 beh 页与弹窗）
   层级：页标题34 > 表头18 > 卡数34/区块标题18 > 正文16 > 辅助14.5
   ============================================================ */
body.is-teacher .beh-view .view-title { font-size: 34px !important; line-height: 1.25; }
body.is-teacher .beh-view .view-subtitle { font-size: 16.5px !important; margin-top: 6px !important; }

/* 子页签 */
.beh-tabs { gap: 14px; margin: 8px 0 20px; }
.beh-tab { font-size: 16.5px; font-weight: 900; padding: 12px 30px; letter-spacing: 2px; }
.beh-log-filter { gap: 10px; margin-bottom: 16px; }
.beh-log-filter .beh-tab { padding: 9px 20px; font-size: 15px; }
.beh-log-hint { font-size: 14px; }

/* 搜索框（v158 字号适配） */
.beh-search-wrap { flex: 0 1 360px; min-width: 250px; }
.beh-search { height: 47px; font-size: 16px; }
.beh-search::placeholder { font-size: 14.5px; }
.beh-search-ico { font-size: 16px; left: 15px; }
.beh-search-clear { width: 22px; height: 22px; font-size: 12.5px; }

/* 批量删除栏（v158 字号适配） */
.beh-batch-bar { gap: 10px; padding: 12px 16px; border-radius: 14px; }
.beh-batch-chip { font-size: 14.5px; padding: 8px 17px; }
.beh-batch-info { font-size: 15px; }
.beh-batch-info b { font-size: 17px; }
.beh-batch-ckb { width: 20px; height: 20px; }
.beh-batch-tip { font-size: 13.5px; }

/* 违纪档案（v158 字号适配） */
.beh-arch-summary { gap: 12px; margin-bottom: 16px; }
.bas-item { font-size: 15px; padding: 9px 18px; }
.bas-item b { font-size: 17px; }
.beh-arch-grid { gap: 16px; }
.beh-arch-card { padding: 16px 18px; }
.bac-name { font-size: 18px; }
.bac-sub { font-size: 14px; }
.bac-count b { font-size: 28px; }
.bac-count span { font-size: 12.5px; }
.beh-arch-chip { font-size: 14px; padding: 4px 12px; }
.bac-score { font-size: 15px; }
.bac-score b.neg { font-size: 17px; }
.bm-group-title { font-size: 14.5px; }
.beh-club-th { font-size: 15px; }
.beh-club-th-num { font-size: 15.5px; }

/* 统计卡 */
.beh-stat-row { gap: 18px; margin-bottom: 18px; }
.beh-stat-card { padding: 20px 24px; gap: 18px; border-radius: 18px; }
.beh-stat-card .bsc-ico { width: 64px; height: 64px; font-size: 34px; border-radius: 16px; }
.beh-stat-card .bsc-num { font-size: 36px; line-height: 1.1; }
.beh-stat-card .bsc-label { font-size: 15px; margin-top: 4px; font-weight: 700; }

/* 待关注条 */
.beh-alert-strip { padding: 13px 18px; gap: 10px; border-radius: 14px; }
.beh-alert-tit { font-size: 16px; }
.beh-alert-chip { font-size: 14.5px; padding: 7px 13px; gap: 7px; }
.beh-chip-btn { width: 30px; height: 30px; font-size: 15px; }

/* 积分榜表格（覆盖：更大字号） */
.beh-table { font-size: 18px; }
.beh-table thead th {
  font-size: 32px !important; letter-spacing: 2px; padding: 20px 10px;
}
.beh-table tbody td { padding: 14px 12px; font-size: 17px; }
.beh-table .c-rank { width: 96px; }
.beh-table .c-ops { width: 286px; }
.beh-medal { font-size: 27px; }
.beh-rank-no { width: 33px; height: 33px; font-size: 15.5px; }
.beh-ava { width: 40px; height: 40px; font-size: 17px; }
.beh-stu { gap: 10px; }
.beh-stu-name { font-size: 19px; }
.beh-stu-no { font-size: 13.5px; }
.beh-badge { font-size: 13px; padding: 3px 11px; }
.beh-score { font-size: 22px; }
.beh-cnt { font-size: 17px; }
.beh-log-time { font-size: 16px; }
.beh-empty { font-size: 15.5px !important; padding: 32px 10px !important; }
/* 违纪档案空状态（在 .beh-empty 之后声明以确保覆盖 padding/对齐） */
.beh-arch-empty { padding: 26px 30px !important; }
.bae-title { font-size: 22px; }
.bae-sub { font-size: 16px; }
/* 个人档案弹窗（v158 字号适配） */
.bam-body { padding: 20px 24px; gap: 15px; }
.bam-name { font-size: 21px; }
.bam-sub { font-size: 14px; }
.bam-num b { font-size: 30px; }
.bam-sec-title { font-size: 17px; }
.baml-reason { font-size: 16px; }
.baml-time { font-size: 13.5px; }
.baml-delta { font-size: 17px; }
.bamtk-note { font-size: 15px; }
.bamtk-meta { font-size: 13px; }
.bam-talk-type { font-size: 15px; }
.bam-talk-note { font-size: 15px; }
.bam-comment { font-size: 16px; }
/* 观察中名单（v158 字号适配） */
.bwr-name { font-size: 16.5px; }
.bwr-cnt { font-size: 15px; }

/* 操作按钮 */
.beh-mini-btn { font-size: 14.5px; padding: 9px 17px; margin: 0 2px; }

/* 小组管理 */
.beh-group-grid { gap: 16px; margin-bottom: 18px; }
.beh-group-card { padding: 17px; border-radius: 16px; }
.bgc-head { margin-bottom: 11px; gap: 10px; }
.bgc-name { font-size: 18px; }
.bgc-leader { font-size: 14px; padding: 3px 12px; }
.bgc-members { gap: 8px; margin-bottom: 12px; min-height: 30px; }
.bgc-member { font-size: 14.5px; padding: 4px 13px; }
.bgc-foot { padding-top: 12px; }
.bgc-score { font-size: 14.5px; }
.beh-assign-title { font-size: 18px; padding: 17px 18px 12px; }
.beh-grp-select { font-size: 15px; padding: 8px 12px; }
.beh-leader-btn { font-size: 14px; padding: 8px 17px; }

/* 记分设置 */
.beh-set-head { font-size: 18.5px; padding: 6px 8px 14px; }
.beh-set-row { margin-bottom: 10px; }
.beh-club-select { font-size: 16px; padding: 11px 16px; }
.bm-group-title { font-size: 15.5px; }
.beh-set-ico, .beh-set-label, .beh-set-delta { font-size: 15.5px; padding: 9px 12px; }
.beh-set-ico { width: 62px; }
.beh-set-delta { width: 88px; }
.beh-set-del { font-size: 14px; padding: 9px 14px; }

/* 记分弹窗 */
.beh-modal { width: 720px; }
.bm-head { padding: 18px 24px; }
.bm-title { font-size: 20.5px; letter-spacing: 2px; }
.bm-close { width: 34px; height: 34px; font-size: 15px; }
.bm-targets { padding: 18px 24px 0; }
.bm-target-name { font-size: 25px; }
.bm-target-list { font-size: 14px; margin-top: 6px; }
.bm-switch { padding: 16px 24px 6px; }
.bm-switch button { width: 152px; font-size: 16.5px; padding: 10px 0; }
.bm-items { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; padding: 16px 24px; }
.bm-item { padding: 14px 16px; border-radius: 16px; }
.bm-item .bmi-ico { font-size: 27px; }
.bm-item .bmi-label { font-size: 15.5px; }
.bm-item .bmi-delta { font-size: 20px; }
.bm-foot { padding: 6px 24px 22px; }
.bm-custom, .bm-cancel { font-size: 15px; padding: 12px 20px; }

/* 个人明细弹窗 */
.beh-detail-modal { width: 600px; }
.bm-detail-list { padding: 16px 24px 22px; }
.bm-detail-row { font-size: 15.5px; padding: 11px 14px; margin-bottom: 8px; }
.bmd-time { font-size: 13.5px; width: 128px; }
.bmd-delta { font-size: 18px; }

/* ---- 快速分组弹窗 v159 ---- */
.beh-assign-title { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.beh-quick-btn {
  border: none; cursor: pointer; flex: none;
  background: linear-gradient(135deg, #6366f1, #8b5cf6); color: #fff;
  font-size: 15px; font-weight: 900; letter-spacing: 1px;
  border-radius: 999px; padding: 9px 22px;
  box-shadow: 0 4px 14px rgba(99, 102, 241, .38); transition: all .12s;
}
.beh-quick-btn:hover { transform: translateY(-1px); filter: brightness(1.07); }
.beh-quick-modal { width: 780px; }
.bq-body { padding: 18px 24px 6px; }
.bq-modes { display: flex; gap: 10px; margin-bottom: 16px; }
.bq-modes button {
  flex: 1; border: 2px solid #e2e8f0; background: #fff; color: #64748b;
  border-radius: 12px; padding: 11px 0; font-size: 15px; font-weight: 900;
  cursor: pointer; transition: all .13s;
}
.bq-modes button:hover { border-color: #a5b4fc; color: #4f46e5; }
.bq-modes button.on {
  background: linear-gradient(135deg, #6366f1, #8b5cf6); border-color: transparent; color: #fff;
  box-shadow: 0 4px 14px rgba(99, 102, 241, .35);
}
.bq-textarea {
  width: 100%; height: 168px; resize: vertical;
  border: 2px solid #e2e8f0; border-radius: 14px; padding: 13px 15px;
  font-size: 15.5px; line-height: 1.9; color: #334155;
  font-family: inherit; box-sizing: border-box;
}
.bq-textarea:focus { border-color: #818cf8; outline: none; }
.bq-tip { font-size: 13.5px; color: #94a3b8; line-height: 1.7; margin-top: 8px; }
.bq-tip a { color: #6366f1; font-weight: 800; text-decoration: none; }
.bq-count { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; padding: 6px 0 2px; }
.bq-count-lab { font-size: 16px; font-weight: 900; color: #334155; margin-right: 4px; }
.bq-count-btn {
  width: 42px; height: 42px; border-radius: 12px; cursor: pointer;
  border: 2px solid #e2e8f0; background: #fff; color: #475569;
  font-size: 16.5px; font-weight: 900; transition: all .1s;
}
.bq-count-btn:hover:not(:disabled) { border-color: #818cf8; color: #4f46e5; }
.bq-count-btn.on { background: linear-gradient(135deg, #6366f1, #7c3aed); border-color: transparent; color: #fff; box-shadow: 0 3px 10px rgba(99, 102, 241, .35); }
.bq-count-btn:disabled { opacity: .35; cursor: not-allowed; }
.bq-redo {
  border: 2px solid #fcd34d; background: #eff6ff; color: #1d4ed8;
  border-radius: 12px; padding: 8px 16px; font-size: 14px; font-weight: 900; cursor: pointer;
}
.bq-redo.on {
  border-color: #6366f1; background: linear-gradient(135deg, #6366f1, #7c3aed); color: #fff;
  box-shadow: 0 3px 10px rgba(99, 102, 241, .35);
}
.bq-count .bq-tip { width: 100%; margin-top: 10px; }
.bq-preview {
  margin-top: 14px; border: 1.5px solid #e2e8f0; border-radius: 14px; overflow: hidden;
  background: #f8fafc;
}
.bq-pv-head {
  background: linear-gradient(90deg, #4f46e5, #7c3aed); color: #fff;
  font-size: 14.5px; font-weight: 900; letter-spacing: 1.5px;
  padding: 10px 16px;
}
.bq-pv-list { max-height: 250px; overflow: auto; padding: 10px 14px; }
.bq-pv-group {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 9px 10px; border-radius: 10px; background: #fff;
  border: 1px solid #eef2f7; margin-bottom: 7px;
}
.bq-pv-name {
  flex: none; min-width: 54px; text-align: center; font-size: 14.5px; font-weight: 900;
  color: #fff; background: linear-gradient(135deg, #6366f1, #8b5cf6);
  border-radius: 8px; padding: 4px 0;
}
.bq-pv-cnt { flex: none; font-size: 13px; font-weight: 800; color: #6366f1; background: #eef2ff; border-radius: 999px; padding: 4px 11px; margin-top: 1px; }
.bq-pv-members { flex: 1; line-height: 2; }
.bq-pv-m {
  display: inline-block; font-size: 14px; color: #334155; font-weight: 700;
  background: #f1f5f9; border-radius: 999px; padding: 2px 12px; margin: 0 5px 4px 0;
}
.bq-pv-m.bad { color: #fff; background: #ef4444; text-decoration: line-through; text-decoration-color: rgba(255,255,255,.7); }
.bq-pv-warn {
  font-size: 13.5px; color: #b91c1c; background: #fef2f2;
  border: 1px solid #fecaca; border-radius: 10px; padding: 9px 12px; line-height: 1.7;
}
.bq-pv-info {
  font-size: 13.5px; color: #92400e; background: #fffbeb;
  border: 1px solid #fde68a; border-radius: 10px; padding: 9px 12px; line-height: 1.7; margin-top: 7px;
}
.bq-foot { justify-content: space-between; align-items: center; }
.bq-apply {
  border: none; cursor: pointer;
  background: linear-gradient(135deg, #10b981, #059669); color: #fff;
  font-size: 16px; font-weight: 900; letter-spacing: 1px;
  border-radius: 12px; padding: 12px 30px;
  box-shadow: 0 4px 14px rgba(5, 150, 105, .35);
}
.bq-apply:hover { filter: brightness(1.08); }

/* 预览头部微调提示 */
.bq-pv-hint { float: right; font-size: 12.5px; font-weight: 700; letter-spacing: 0; opacity: .9; }
/* 学生 chip：机号彩色圆圈 + 姓名 + 可微调态 */
.bq-pv-m {
  display: inline-flex; align-items: center;
  padding: 2px 11px 2px 4px;
}
.bq-pv-m.bad { padding: 2px 12px; }
.bq-pv-no {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 50%; margin-right: 6px;
  color: #fff; font-size: 11px; font-weight: 900; line-height: 1;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .3), inset 0 -1px 2px rgba(0, 0, 0, .15);
  text-shadow: 0 1px 1px rgba(0, 0, 0, .25);
}
.bq-pv-move { margin-left: 5px; font-size: 12px; color: #a5b4fc; font-weight: 900; }
.bq-pv-m.movable { cursor: pointer; transition: all .12s; }
.bq-pv-m.movable:hover {
  background: #e0e7ff; color: #4338ca;
  box-shadow: 0 2px 7px rgba(99, 102, 241, .32);
}
.bq-pv-m.movable:hover .bq-pv-move { color: #4f46e5; }
/* 未分组虚限行 */
.bq-pv-group.miss { border: 1.5px dashed #cbd5e1; background: #f8fafc; }
.bq-pv-name.miss { background: linear-gradient(135deg, #94a3b8, #64748b); }
.bq-pv-m.miss-m { background: #e2e8f0; color: #475569; }
/* 手动微调目标组菜单（fixed 四向兜底 + inset，兼容旧内核） */
.bq-menu-mask {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; inset: 0;
  z-index: 9900; background: transparent;
}
.bq-menu {
  position: fixed; z-index: 9901;
  min-width: 168px; max-width: 220px; max-height: 56vh; overflow: auto;
  background: #fff; border: 1px solid #e2e8f0; border-radius: 13px; padding: 6px;
  box-shadow: 0 14px 40px rgba(15, 23, 42, .28);
}
.bqm-tit { font-size: 12.5px; font-weight: 800; color: #64748b; padding: 5px 10px 7px; letter-spacing: 1px; }
.bqm-opt {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; border: none; background: transparent; cursor: pointer;
  font-size: 14.5px; font-weight: 800; color: #334155;
  padding: 9px 11px; border-radius: 9px; font-family: inherit;
}
.bqm-opt:hover { background: #eef2ff; color: #4f46e5; }
.bqm-opt.cur, .bqm-opt:disabled { color: #94a3b8; cursor: default; background: transparent; }
.bqm-cnt { font-size: 12px; font-weight: 700; color: #818cf8; background: #eef2ff; border-radius: 999px; padding: 2px 9px; }
.bqm-opt:disabled .bqm-cnt { color: #94a3b8; background: #f1f5f9; }
.bqm-opt.out { color: #dc2626; border-top: 1px solid #f1f5f9; border-radius: 0 0 8px 8px; margin-top: 3px; }
.bqm-opt.out:hover { background: #fef2f2; color: #b91c1c; }

/* ===== 表头字号最终保障（最高优先级，压过 @media(pointer:coarse) 里 body.is-teacher table th 的 15px !important）===== */
body.is-teacher table.beh-table thead th {
  font-size: 32px !important; font-weight: 900 !important; letter-spacing: 2px !important;
  padding: 20px 10px !important; color: #4338ca !important; text-align: center !important;
  background: linear-gradient(180deg, #f7fafe, #eef3fb) !important;
  border-bottom: 2px solid #bfdbfe !important;
  box-shadow: inset 0 -3px 0 #2563eb !important;
}
body.is-teacher table.beh-table thead th:nth-child(2) { text-align: left !important; padding-left: 78px !important; } /* 姓名表头与姓名文字同垂直线 */
body.is-teacher table.beh-table tbody td { font-size: 17px !important; padding: 14px 12px !important; }
body.is-teacher table.beh-table tbody td:nth-child(2) { padding-left: 28px !important; } /* 头像起点28，+40头像+10间距=姓名文字78，与表头对齐 */
body.is-teacher table.stu-table th { font-size: 26px !important; padding: 18px 16px !important; }
body.is-teacher table.stu-table th.stu-col-name { text-align: left !important; padding-left: 68px !important; } /* 16内边距+42头像+10间距=68 */
body.is-teacher table.stu-table td.stu-col-name { padding-left: 16px !important; }

/* ===== 小组管理·分组设置表：表头与下方内容同轴对齐（普通班3列 / 社团班4列两用）=====
   ①「学生」列：表头 👤 图标占位与下方头像同位（12px 起、宽 40），「学生」二字与姓名同起点 62px 纵向对齐
   ② 第2列（社团班=「班级」/ 普通班=「所在小组」）撤销全局第2列78px姓名偏移，居中同轴
   ③ 第3/4列表头居中；第2列内容撤销28px左偏移
   ④ 列宽均分（2026-09-30）：社团班4列各25%、普通班3列各1/3——学生/班级列不再偏宽，
      借 th:first-child:nth-last-child(N) 按实际列数匹配，inline 固定宽已从 HTML 移除 */
body.is-teacher .beh-assign-card table.beh-table thead th:nth-child(1) { text-align: left !important; padding-left: 12px !important; }
body.is-teacher .beh-assign-card .beh-th-ava-ico { display: inline-block; width: 40px; text-align: center; margin-right: 10px; }
body.is-teacher .beh-assign-card table.beh-table thead th:nth-child(2) { text-align: center !important; padding-left: 10px !important; }
body.is-teacher .beh-assign-card table.beh-table thead th:nth-child(3) { text-align: center !important; padding-left: 10px !important; }
body.is-teacher .beh-assign-card table.beh-table thead th:nth-child(4) { text-align: center !important; padding-left: 10px !important; }
body.is-teacher .beh-assign-card table.beh-table tbody td:nth-child(2) { padding-left: 12px !important; }
/* 4列表（社团班）：全部列宽 25% */
body.is-teacher .beh-assign-card table.beh-table thead th:first-child:nth-last-child(4),
body.is-teacher .beh-assign-card table.beh-table thead th:first-child:nth-last-child(4) ~ th { width: 25% !important; }
/* 3列表（普通班）：全部列宽 1/3 */
body.is-teacher .beh-assign-card table.beh-table thead th:first-child:nth-last-child(3),
body.is-teacher .beh-assign-card table.beh-table thead th:first-child:nth-last-child(3) ~ th { width: 33.333% !important; }



/* ============ 授课模式（全屏课件 + 底部工具栏） ============ */
.teach-mode {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: #0a0a0a;
  z-index: 9999;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.teach-mode-iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  z-index: 1;
}
.teach-mode-loading {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  text-align: center;
  font-size: 18px;
  z-index: 1;
}
.tml-spinner {
  width: 40px; height: 40px;
  border: 3px solid rgba(255,255,255,0.2);
  border-top-color: #3b82f6;
  border-radius: 50%;
  margin: 0 auto 16px;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* 顶部状态栏 */
.teach-mode-topbar {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 48px;
  background: linear-gradient(to bottom, rgba(0,0,0,0.65), rgba(0,0,0,0));
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  color: #fff;
  z-index: 10;
  pointer-events: none;
}
.teach-mode-topbar > * { pointer-events: auto; }
.tmt-left, .tmt-right {
  display: flex;
  align-items: center;
  gap: 16px;
}
.tmt-class { font-weight: 600; font-size: 15px; }
.tmt-lesson { font-size: 14px; opacity: 0.85; }
.tmt-online { font-size: 14px; }
.tmt-leave { font-size: 14px; color: #fbbf24; }
.tmt-exit {
  background: rgba(239,68,68,0.9);
  color: #fff;
  border: none;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 13px;
  cursor: pointer;
  transition: background 0.2s;
}
.tmt-exit:hover { background: rgba(239,68,68,1); }

/* 底部工具栏 */
.teach-mode-toolbar {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 80px;
  background: linear-gradient(to top, rgba(0,0,0,0.8), rgba(0,0,0,0.4), rgba(0,0,0,0));
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 0 30px 16px;
  z-index: 10;
}
.tmtb-left, .tmtb-right {
  display: flex;
  align-items: center;
  min-width: 120px;
}
.tmtb-clock {
  color: #fff;
  font-size: 22px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 1px;
  text-shadow: 0 2px 8px rgba(0,0,0,0.5);
}
.tmtb-center {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  padding: 8px 12px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.15);
}
.tmtb-tool {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 72px;
  padding: 8px 6px;
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.2s;
  color: #fff;
}
.tmtb-tool:hover {
  background: rgba(255,255,255,0.15);
  transform: translateY(-2px);
}
.tmtb-tool.active {
  background: rgba(59,130,246,0.4);
}
.tmtb-ico {
  font-size: 22px;
  margin-bottom: 2px;
}
.tmtb-label {
  font-size: 12px;
  opacity: 0.9;
}
.tmtb-badge {
  position: absolute;
  top: 2px;
  right: 4px;
  background: #ef4444;
  color: #fff;
  font-size: 10px;
  padding: 1px 5px;
  border-radius: 8px;
  font-weight: 600;
  min-width: 18px;
  text-align: center;
}
.tmtb-badge.yellow {
  background: #f59e0b;
}

/* —— 备课空间 · 概览 v2 卡片版：字号放大 + 一页收纳（2026-09-28 v226）—— */
body.is-teacher .prep-toolbar { padding: 11px 20px 9px !important; }
body.is-teacher .vol-chip { font-size: 15.5px !important; padding: 8px 18px !important; }
body.is-teacher .plan-doc-btn { font-size: 15.5px !important; padding: 8px 18px !important; }
body.is-teacher .semester-pill { font-size: 14.5px !important; padding: 7px 16px !important; }
body.is-teacher .prep-main { padding: 16px 22px 22px !important; }
body.is-teacher .ov-focus { padding: 14px 26px 13px !important; margin-bottom: 10px !important; }
body.is-teacher .ov-focus-kicker { font-size: 15px !important; margin-bottom: 4px !important; }
body.is-teacher .ov-focus-title { font-size: 28px !important; margin: 0 0 8px !important; }
body.is-teacher .ov-focus-meta { font-size: 14.5px !important; margin-bottom: 10px !important; }
body.is-teacher .ovf-btn { font-size: 15px !important; padding: 8px 20px !important; }
body.is-teacher .ov-unit { padding: 10px 16px 11px !important; margin-bottom: 10px !important; }
body.is-teacher .ov-unit-name { font-size: 21px !important; }
body.is-teacher .ov-lcard { padding: 9px 12px 9px 17px !important; }
body.is-teacher .ov-lcard-name { font-size: 15.5px !important; }
body.is-teacher .ov-lcard-no { font-size: 12.5px !important; }
body.is-teacher .ov-lcard-st { font-size: 12px !important; }

/* 红绿灯 */
.tmtb-traffic {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-end;
}
.tmt-light {
  width: 40px;
  height: 18px;
  border-radius: 9px;
  font-size: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 600;
  opacity: 0.4;
  transition: all 0.3s;
}
.tmt-light.on { opacity: 1; box-shadow: 0 0 12px currentColor; }
.tmt-light.red { background: #ef4444; color: #ef4444; color: #fff; }
.tmt-light.yellow { background: #f59e0b; color: #fff; }
.tmt-light.green { background: #22c55e; color: #fff; }
.tmt-light.red.on { background: #ef4444; }
.tmt-light.yellow.on { background: #f59e0b; }
.tmt-light.green.on { background: #22c55e; }

/* 授课模式内弹窗 */
.teach-modal-overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
  backdrop-filter: blur(4px);
}
.teach-modal {
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
  border: 1px solid rgba(255,255,255,0.1);
}

/* ===== 课后报告 · 题目正确率分析（v200，2026-09-24）===== */
.rpt-qcard {
  background: #fff;
  border-radius: 14px;
  padding: 18px 20px 20px;
  margin-top: 14px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
}
.rpt-qhead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.rpt-qhead h3 { margin: 0; font-size: 18px; color: #0f172a; }
.rpt-qtip { font-size: 13px; color: #64748b; }
.rpt-qtable { margin-top: 4px; }
body.is-teacher .rpt-qtable td.rpt-qtitle {
  max-width: 300px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 错误率 ≥50% 红色行 / 30%~50% 橙色行（td 级背景，压过行 hover） */
body.is-teacher .rpt-qtable tr.rpt-qrow-hot td { background: #fef2f2 !important; }
body.is-teacher .rpt-qtable tr.rpt-qrow-mid td { background: #eff6ff !important; }
.rpt-errnum { font-weight: 800; }
.rpt-errnum.err-hot { color: #dc2626; }
.rpt-errnum.err-mid { color: #d97706; }
/* 正确率 <60% 进度条变红 */
body.is-teacher .rpt-qtable .rpt-ratebar i.qbar-low { background: linear-gradient(90deg, #f87171, #ef4444); }
/* 讲评建议徽章 */
.rpt-qflag {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}
.rpt-qflag.hot { background: #fee2e2; color: #b91c1c; }
.rpt-qflag.mid { background: #dbeafe; color: #1d4ed8; }
.rpt-qflag.ok { background: #dcfce7; color: #15803d; }
.rpt-qnone { color: #94a3b8; font-size: 14px; }

/* ===== 学生端 · 课终学习报告弹窗（自动评分+学习建议，2026-09-24）=====
   兼容360极速/兼容双模式：flex 间距一律 margin（不用 gap）、实色不使用 color-mix、
   fixed 遮罩沿用 .final-modal 的 top/right/bottom/left 四向兜底 */
.lr-card { background:#fff; border-radius:22px; padding:22px 26px 20px; width:484px; max-width:94vw;
  box-shadow:0 24px 70px rgba(0,0,0,.4); animation:reward-pop .45s cubic-bezier(.25,1.5,.3,1); box-sizing:border-box; }
.lr-head { display:flex; align-items:center; }
.lr-bot { font-size:42px; line-height:1; margin-right:12px; }
.lr-headtext { flex:1; min-width:0; text-align:left; }
.lr-kicker { font-size:12.5px; color:#94a3b8; font-weight:700; letter-spacing:.5px; }
.lr-lesson { font-size:19px; font-weight:800; color:#1f2937; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lr-grade { flex:none; margin-left:10px; padding:5px 15px; border-radius:999px; font-size:16px; font-weight:900; border:1.5px solid; }
.lr-grade.g-ex { color:#b45309; background:#fef6d9; border-color:#f4d35e; }
.lr-grade.g-good { color:#1d6fd1; background:#eaf3fe; border-color:#9cc4f4; }
.lr-grade.g-ok { color:#1a8a4a; background:#e8f8ef; border-color:#93dfb2; }
.lr-grade.g-warn { color:#d35400; background:#fff0e6; border-color:#f8b879; }
.lr-scorerow { display:flex; align-items:center; margin-top:16px; }
.lr-score { flex:none; width:128px; text-align:center; background:#fff7ed; border:1.5px solid #fed7aa;
  border-radius:16px; padding:10px 6px 8px; }
.lr-num { font-size:42px; font-weight:900; color:#f97316; line-height:1; }
.lr-full { font-size:15px; color:#c2703a; font-weight:700; }
.lr-stars { margin-top:5px; font-size:16px; letter-spacing:3px; }
.lr-stars .on { color:#ffb800; }
.lr-stars .off { color:#e5e7eb; }
.lr-stats { flex:1; display:flex; margin-left:12px; }
.lr-stat { flex:1; background:#f3f4f6; border-radius:12px; padding:9px 4px; text-align:center; margin-left:8px; }
.lr-stat:first-child { margin-left:0; }
.lr-stat b { display:block; font-size:19px; font-weight:900; color:#1f2937; line-height:1.2; }
.lr-stat span { display:block; font-size:11.5px; color:#6b7280; margin-top:2px; }
.lr-tips { margin-top:12px; background:#fffaf3; border:1.5px solid #fed7aa; border-left:4px solid #f97316;
  border-radius:10px; padding:9px 13px; text-align:left; }
.lr-tip { font-size:13.5px; color:#7c3a0e; line-height:1.55; }
.lr-tip + .lr-tip { margin-top:4px; }
.lr-weak { margin-top:10px; text-align:left; line-height:2; }
.lr-weak-label { font-size:12.5px; font-weight:800; color:#64748b; }
.lr-chip { display:inline-block; max-width:172px; vertical-align:middle; background:#eef4ff; color:#2563eb;
  border:1px solid #c7dcff; border-radius:999px; padding:1px 10px; font-size:12px; font-weight:600;
  margin:0 0 4px 6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lr-chip-more { background:#f1f5f9; color:#64748b; border-color:#e2e8f0; }
.lr-btns { display:flex; justify-content:flex-end; margin-top:14px; }
.lr-btns button { margin-left:10px; padding:10px 22px; border-radius:11px; font-size:14.5px; font-weight:700; cursor:pointer; font-family:inherit; }
.lr-btns .btn-primary { background:#f97316; color:#fff; border:1.5px solid #f97316; }
.lr-btns .btn-primary:hover { background:#ea580c; }
.lr-btns .btn-ghost { background:#fff; color:#6b7280; border:1.5px solid #d1d5db; }
.lr-btns .btn-ghost:hover { color:#374151; border-color:#9ca3af; background:#f9fafb; }
.lr-btns .lr-btn-redo { color:#1d6fd1; border-color:#9cc4f4; background:#f5f9ff; }
.lr-btns .lr-btn-redo:hover { background:#eaf3fe; }

/* ===== 教师端 · 课中「本课评分」实时分布条（2026-09-24，口径同课后报告）===== */
.live-score-bar { background:#fff; border-radius:14px; padding:13px 20px; margin:0 0 14px;
  box-shadow:0 2px 10px rgba(15,23,42,.06); display:flex; align-items:center; }
.lsb-head { display:flex; align-items:baseline; flex:none; }
.lsb-title { font-size:16px; font-weight:900; color:#0f172a; }
.lsb-avg { margin-left:18px; font-size:13px; color:#64748b; }
.lsb-avg b { font-size:26px; font-weight:900; color:#2563eb; margin:0 3px; }
.lsb-avg i { font-style:normal; font-size:12px; color:#94a3b8; }
.lsb-fin { margin-left:16px; font-size:13.5px; color:#64748b; }
.lsb-levels { margin-left:auto; display:flex; }
.lsb-lv { font-size:14px; font-weight:800; padding:5px 14px; border-radius:999px; margin-left:8px; white-space:nowrap; }
.lsb-lv:first-child { margin-left:0; }
.lsb-lv em { font-style:normal; font-weight:900; margin-left:3px; }
.lsb-lv.ex { background:#fef6d9; color:#b45309; }
.lsb-lv.good { background:#eaf3fe; color:#1d6fd1; }
.lsb-lv.ok { background:#e8f8ef; color:#1a8a4a; }
.lsb-lv.warn { background:#fff0e6; color:#d35400; }
.lsb-lv.none { background:#f1f5f9; color:#94a3b8; }

/* ===========================================================
 * 教师端 · 深色指挥舱换肤（2026-09-27）
 * 侧栏深蓝黑 + 蓝青主色，与原版式「白色侧栏 + 橙色点缀」明确区隔
 * 仅作用于 body.is-teacher，学生端不受影响
 * =========================================================== */
body.is-teacher .sidebar { background: #0f1b2d; border-right-color: rgba(255,255,255,.06); }
body.is-teacher .sidebar .logo { color: #eaf1ff; }
body.is-teacher .sidebar .logo small { color: #8fa3c4; }
body.is-teacher .sidebar .nav-group { color: #7d8fb3; }
body.is-teacher .sidebar .nav-group::before { background: linear-gradient(180deg, #22d3ee, #2563eb); }
body.is-teacher .sidebar .nav-item { color: #c7d3e8; }
body.is-teacher .sidebar .nav-item:hover { background: rgba(255,255,255,.07); color: #ffffff; }
body.is-teacher .sidebar .nav-item.active { background: linear-gradient(135deg, #2563eb, #22d3ee); color: #ffffff; box-shadow: 0 6px 18px rgba(34,211,238,.28); }
body.is-teacher .sidebar .nav-item.active:hover { background: linear-gradient(135deg, #2563eb, #22d3ee); color: #ffffff; }
body.is-teacher .sidebar .nav-item .ni-ico { background: rgba(255,255,255,.10); }
body.is-teacher .sidebar .nav-item:hover .ni-ico { background: rgba(255,255,255,.16); }
body.is-teacher .sidebar .nav-item.active .ni-ico { background: rgba(255,255,255,.28); }
body.is-teacher .sidebar .user-pill { background: rgba(255,255,255,.10); color: #dbeafe; }
body.is-teacher .sidebar-logout .tb { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.22); color: #dbe4f5; }
body.is-teacher .sidebar-logout .tb:hover { background: rgba(255,255,255,.16); }
body.is-teacher .sidebar::-webkit-scrollbar { width: 8px; }
body.is-teacher .sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.18); border-radius: 999px; }
body.is-teacher .sidebar::-webkit-scrollbar-track { background: transparent; }

/* ============================================================
   授课模式 v2 · 授课工具箱 · 点名v2 · 倒计时v2 · 光荣榜覆盖层（2026-09-28）
   兼容 Chromium 78（360极速模式）：不用 flex gap / inset 简写
   ============================================================ */

/* 记分弹窗需盖住授课模式（.teach-mode z-index:9999） */
body.is-teacher .beh-overlay { z-index: 12000; }

/* —— 授课模式：顶栏 —— */
.teach-mode .tm-topbar {
  position: relative;
  height: 48px;
  background: linear-gradient(90deg, #b91c1c, #7f1d1d 45%, #1f2937);
  display: flex;
  align-items: center;
  padding: 0 16px 0 0;
  color: #fff;
  flex-shrink: 0;
}
.tm-live-badge {
  background: #ef4444;
  color: #fff;
  font-weight: 900;
  font-size: 13px;
  letter-spacing: 2px;
  padding: 4px 12px;
  border-radius: 0 0 10px 10px;
  margin-right: 14px;
  -webkit-animation: tmLivePulse 1.6s ease-in-out infinite;
  animation: tmLivePulse 1.6s ease-in-out infinite;
}
@-webkit-keyframes tmLivePulse { 0%,100% { opacity: 1; } 50% { opacity: .55; } }
@keyframes tmLivePulse { 0%,100% { opacity: 1; } 50% { opacity: .55; } }
.tm-lesson-name { font-size: 15px; font-weight: 700; margin-right: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 30vw; }
.tm-clock { font-size: 16px; font-variant-numeric: tabular-nums; letter-spacing: 1px; opacity: .95; margin-right: 16px; }
.tm-online-count { font-size: 13px; background: rgba(255,255,255,.14); padding: 4px 12px; border-radius: 999px; margin-right: auto; }
.tm-exit-btn { background: rgba(255,255,255,.16); color: #fff; border: none; height: 32px; padding: 0 16px; border-radius: 8px; font-size: 13px; cursor: pointer; }
.tm-exit-btn:hover { background: #ef4444; }

/* —— 授课模式：课件区 + 画笔层 —— */
.teach-mode .tm-main { position: relative; flex: 1; overflow: hidden; background: #0a0a0a; }
.teach-mode .tm-frame { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; z-index: 1; }
.tm-draw-canvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 5; cursor: crosshair; }

/* 画笔设置条 */
.tm-penbar {
  position: absolute;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  background: rgba(17,24,39,.92);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 14px;
  display: flex;
  align-items: center;
  padding: 8px 14px;
  z-index: 20;
  box-shadow: 0 8px 28px rgba(0,0,0,.4);
}
.tm-penbar-lab { color: #fff; font-size: 13px; font-weight: 700; margin-right: 14px; }
.tm-pen-colors { display: flex; align-items: center; margin-right: 14px; }
.tm-pen-cbtn { width: 22px; height: 22px; border-radius: 50%; border: 2px solid rgba(255,255,255,.35); cursor: pointer; margin-left: 6px; padding: 0; }
.tm-pen-cbtn.cur { border-color: #22d3ee; box-shadow: 0 0 0 3px rgba(34,211,238,.35); }
.tm-pen-sizes { display: flex; align-items: center; margin-right: 14px; }
.tm-pen-sbtn { background: rgba(255,255,255,.12); color: #fff; border: none; height: 26px; padding: 0 10px; border-radius: 7px; font-size: 12px; cursor: pointer; margin-left: 6px; }
.tm-pen-sbtn.cur { background: #2563eb; }
.tm-pen-tool { background: rgba(255,255,255,.12); color: #fff; border: none; height: 26px; padding: 0 12px; border-radius: 7px; font-size: 12px; cursor: pointer; margin-left: 6px; }
.tm-pen-tool.cur { background: #d97706; }
.tm-pen-tool.off { background: #dc2626; }

/* —— 授课模式：底部工具箱（彩色醒目版，可收起） —— */
.tm-toolbar {
  position: relative;
  height: 86px;
  background: linear-gradient(to top, rgba(10,14,26,.98), rgba(10,14,26,.88));
  border-top: 1px solid rgba(255,255,255,.12);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 16px;
  flex-shrink: 0;
  z-index: 10;
  transition: height .25s;
}
.tm-toolbar.mini { height: 38px; }
.tmtb-sep { width: 1px; height: 42px; background: rgba(255,255,255,.18); margin: 0 6px; flex-shrink: 0; }
/* 希沃风格彩色工具块：大图标+粗标签，一眼可辨 */
.tm-toolbar .tmtb-tool {
  width: 82px; height: 68px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: 0 3px 10px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.28);
  color: #fff;
  flex-shrink: 0;
}
.tm-toolbar .tmtb-ico { font-size: 27px; margin-bottom: 3px; text-shadow: 0 2px 4px rgba(0,0,0,.35); }
.tm-toolbar .tmtb-txt { font-size: 13px; color: #fff; font-weight: 700; opacity: 1; text-shadow: 0 1px 2px rgba(0,0,0,.4); }
.tm-toolbar .tmtb-c1 { background: linear-gradient(145deg,#5b9cf8,#2563eb); }
.tm-toolbar .tmtb-c2 { background: linear-gradient(145deg,#fbbf24,#d97706); }
.tm-toolbar .tmtb-c3 { background: linear-gradient(145deg,#3ddc97,#059669); }
.tm-toolbar .tmtb-c4 { background: linear-gradient(145deg,#a78bfa,#7c3aed); }
.tm-toolbar .tmtb-c5 { background: linear-gradient(145deg,#f472b6,#db2777); }
.tm-toolbar .tmtb-c6 { background: linear-gradient(145deg,#38d3e4,#0891b2); }
.tm-toolbar .tmtb-c7 { background: linear-gradient(145deg,#fbbf24,#ea580c); }
.tm-toolbar .tmtb-c8 { background: linear-gradient(145deg,#f87171,#dc2626); }
.tm-toolbar .tmtb-tool:hover { transform: translateY(-3px); filter: brightness(1.18); }
.tm-toolbar .tmtb-tool.on { box-shadow: 0 0 0 3px #fff, 0 0 20px rgba(255,255,255,.6); transform: translateY(-3px); }
/* 收起/展开按钮（2026-09-29 收起优化：白色高对比块紧贴工具组，一眼可见；不用 flex gap 保证 360 极速 Chromium78 兼容） */
.tmtb-fold {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 72px; height: 68px;
  background: #fff; color: #0f1f3a;
  border: 1px solid rgba(255,255,255,.85); border-radius: 14px;
  box-shadow: 0 3px 10px rgba(0,0,0,.38);
  cursor: pointer; white-space: nowrap; flex-shrink: 0;
  transition: transform .15s, background .15s;
}
.tmtb-fold:hover { background: #dbe9ff; color: #0f1f3a; transform: translateY(-3px); }
.tmtb-fold-ico { font-size: 26px; line-height: 1; font-weight: 900; text-shadow: 0 1px 0 #fff; }
.tmtb-fold-txt { font-size: 13px; font-weight: 800; margin-top: 4px; }
.tmtb-expand { background: rgba(255,255,255,.14); color: #fff; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; height: 30px; padding: 0 18px; font-size: 13px; font-weight: 700; cursor: pointer; }
.tmtb-expand:hover { background: rgba(255,255,255,.26); }

/* —— 授课模式：浮动面板（记分/小组） —— */
.tm-panel {
  position: absolute;
  right: 18px;
  bottom: 92px;
  width: 380px;
  max-width: calc(100vw - 36px);
  max-height: 62vh;
  background: rgba(17,24,39,.97);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 16px;
  box-shadow: 0 20px 48px rgba(0,0,0,.5);
  z-index: 30;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.tbp-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px;
  color: #fff; font-size: 14px; font-weight: 700;
  background: rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.tbp-close { background: rgba(255,255,255,.14); color: #fff; border: none; width: 26px; height: 26px; border-radius: 50%; font-size: 12px; cursor: pointer; }
.tbp-scroll { overflow: auto; padding: 10px 14px; }
.tbs-row {
  display: flex; align-items: center;
  padding: 8px 6px;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.tbs-row:last-child { border-bottom: none; }
.tbs-seat { color: #93c5fd; font-size: 12px; min-width: 38px; }
.tbs-name { color: #f9fafb; font-size: 14px; font-weight: 600; margin-right: 10px; -webkit-box-flex: 0; flex: 0 1 auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; } /* v4.3 根因修复：去掉 flex:1，姓名自然宽度紧贴分数，超长收缩截断 */
.tbs-score { font-size: 14px; font-weight: 800; color: #d1d5db; min-width: 40px; text-align: center; margin-right: 8px; font-variant-numeric: tabular-nums; }
.tbs-score.pos { color: #34d399; }
.tbs-score.neg { color: #f87171; }
.tbs-acts { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; margin-left: auto; } /* v4.3：按钮组推到行尾，姓名+分数紧凑靠左 */
.tbs-btn { border: none; height: 28px; padding: 0 10px; border-radius: 7px; font-size: 12px; font-weight: 700; cursor: pointer; margin-left: 6px; }
.tbs-btn.plus { background: rgba(52,211,153,.18); color: #34d399; border: 1px solid rgba(52,211,153,.4); }
.tbs-btn.plus:hover { background: #34d399; color: #06281c; }
.tbs-btn.minus { background: rgba(248,113,113,.16); color: #f87171; border: 1px solid rgba(248,113,113,.4); }
.tbs-btn.minus:hover { background: #f87171; color: #2b0808; }
.tbs-btn.more { background: rgba(147,197,253,.16); color: #93c5fd; border: 1px solid rgba(147,197,253,.4); }
.tbs-btn.more:hover { background: #93c5fd; color: #0b1c33; }
.tm-empty { color: #9ca3af; font-size: 13px; text-align: center; padding: 26px 10px; line-height: 1.7; }

/* 小组卡 */
.tbg-card {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
}
.tbg-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.tbg-name { color: #fff; font-size: 14px; font-weight: 800; }
.tbg-score { font-size: 14px; font-weight: 800; color: #d1d5db; font-variant-numeric: tabular-nums; }
.tbg-score.pos { color: #34d399; }
.tbg-score.neg { color: #f87171; }
.tbg-members { display: flex; flex-wrap: wrap; margin-bottom: 8px; }
.tbg-member { background: rgba(147,197,253,.12); color: #bfdbfe; font-size: 12px; padding: 3px 10px; border-radius: 999px; margin-right: 6px; margin-bottom: 4px; }
.tbg-acts { display: flex; align-items: center; }

/* —— 授课模式：答题实况面板（互动实时完成情况，2026-09-28） —— */
.tm-toolbar .tmtb-tool { position: relative; }
.tm-toolbar .tmtb-c11 { background: linear-gradient(145deg,#22d3ee,#0e7490); }
.tmtb-badge {
  position: absolute; top: -7px; right: -7px;
  min-width: 20px; height: 20px; padding: 0 5px;
  background: #ef4444; color: #fff; border: 2px solid #0b1220;
  border-radius: 999px; font-size: 12px; font-weight: 800;
  display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;
  box-shadow: 0 2px 6px rgba(239,68,68,.55);
}
/* —— 答题实况·全屏投影大窗（2026-09-29 改版：白卡+投影级大字，课堂后排也能看清） —— */
.ib-overlay {
  position: fixed;
  top: 0; right: 0; bottom: 0; left: 0;
  background: rgba(6, 10, 20, .66);
  z-index: 60;
  display: -webkit-box; display: flex;
  -webkit-box-align: start; align-items: flex-start;
  -webkit-box-pack: start; justify-content: flex-start;
  padding: 0;
}
/* 2026-10-06 四次定稿：彻底弃用 vw/vh（360 浏览器两次会话间 vw 渲染当量从 19.2px
   翻转到 34.0px，vw 定位必然漂移），改用固定 px 锚定教师标注红框——与 tm-panel-score
   同方案（"固定px无 fitScreen vh 坑"，09-30 上线至今位置稳定）。
   按当日截图 2532×1413 实测标定：px 渲染系数 ×1.261（顶栏 48px→60.5、面板头图标
   46px→58 双重标定），红框外缘 x226..2050 / y126..1130（线中心 229/2047/129/1127）。
   面板 left190/top106/宽1418/高777 → 物理落位 约(240,134)-(2029,1114)，四边均在
   红框内（右/底各留 ~19/14px 余量，防系数 ±0.6% 漂移超线）。小屏经 max 限制自动
   收缩防溢出。 */
.ib-box {
  margin-left: 190px;
  margin-top: 106px;
  width: 1418px;
  height: 777px;
  max-width: calc(100% - 24px);
  max-height: calc(100% - 120px);
  background: #ffffff;
  border-radius: 20px;
  border: 1px solid #e5e9f0;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .5);
  display: -webkit-box; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column;
  overflow: hidden;
  -webkit-animation: ibPop .22s ease-out; animation: ibPop .22s ease-out;
}
@-webkit-keyframes ibPop { 0% { -webkit-transform: scale(.96); opacity: 0; } 100% { -webkit-transform: scale(1); opacity: 1; } }
@keyframes ibPop { 0% { transform: scale(.96); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
/* 顶栏 */
.ib-top {
  -webkit-box-flex: 0; flex: none;
  display: -webkit-box; display: flex;
  -webkit-box-align: center; align-items: center;
  -webkit-box-pack: justify; justify-content: space-between;
  padding: 10px 22px;
  background: linear-gradient(100deg, #0e7490, #0891b2 60%, #06b6d4);
  color: #fff;
}
.ib-top-l { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; min-width: 0; }
.ib-top-ico {
  width: 46px; height: 46px; border-radius: 13px;
  background: rgba(255, 255, 255, .18);
  font-size: 25px; line-height: 46px; text-align: center;
  margin-right: 14px; -webkit-box-flex: 0; flex: none;
}
.ib-top-title { font-size: 26px; font-weight: 900; letter-spacing: 1px; white-space: nowrap; }
.ib-top-sub { font-size: 18px; font-weight: 600; opacity: .92; margin-left: 8px; }
.ib-top-r { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-flex: 0; flex: none; }
.ib-live-tag {
  font-size: 15px; font-weight: 700;
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 999px; padding: 7px 16px;
  white-space: nowrap;
}
.ib-live-tag.on { background: rgba(34, 197, 94, .28); border-color: rgba(134, 239, 172, .75); }
.ib-top-target {
  font-size: 15px; font-weight: 700; white-space: nowrap;
  background: rgba(251, 191, 36, .22); border: 1px solid rgba(252, 211, 77, .7);
  border-radius: 999px; padding: 7px 14px; margin-left: 10px;
}
.ib-x {
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255, 255, 255, .18); color: #fff;
  border: 1px solid rgba(255, 255, 255, .35);
  font-size: 22px; line-height: 1; cursor: pointer;
  margin-left: 14px; -webkit-box-flex: 0; flex: none;
}
.ib-x:hover { background: rgba(255, 255, 255, .32); }
/* 主体 */
.ib-body {
  -webkit-box-flex: 1; flex: 1 1 auto;
  min-height: 0;
  display: -webkit-box; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column;
  padding: 12px 16px 14px;
  overflow: hidden;
}
/* 总览区 */
.ib-hero {
  -webkit-box-flex: 0; flex: none;
  display: -webkit-box; display: flex;
  -webkit-box-align: center; align-items: center;
  margin-bottom: 10px;
}
.ib-hero-num {
  -webkit-box-flex: 0; flex: none;
  min-width: 150px;
  text-align: center;
  border-right: 2px solid #e8edf4;
  padding-right: 16px; margin-right: 16px;
}
.ib-hn-line { white-space: nowrap; }
.ib-hn-line b { font-size: 48px; font-weight: 900; color: #16a34a; line-height: 1; }
.ib-hn-line i { font-style: normal; color: #94a3b8; font-size: 22px; margin: 0 3px 0 6px; }
.ib-hn-line em { font-style: normal; color: #334155; font-size: 28px; font-weight: 900; }
.ib-hn-lab { display: block; color: #475569; font-size: 15px; font-weight: 800; margin-top: 2px; }
.ib-hero-main { -webkit-box-flex: 1; flex: 1 1 auto; min-width: 0; display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-pack: center; justify-content: center; }
.ib-prog { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; }
.ib-prog-track {
  -webkit-box-flex: 1; flex: 1 1 auto;
  height: 14px; border-radius: 999px; background: #e5e9f0;
  margin-right: 10px; overflow: hidden;
}
.ib-prog-bar { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #22c55e, #4ade80); -webkit-transition: width .4s; transition: width .4s; }
.ib-prog-pct { font-size: 18px; font-weight: 900; color: #15803d; min-width: 54px; text-align: right; -webkit-box-flex: 0; flex: none; font-variant-numeric: tabular-nums; }
.ib-cards { display: -webkit-box; display: flex; margin-top: 8px; }
.ib-sc {
  -webkit-box-flex: 1; flex: 1 1 0;
  display: -webkit-box; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column;
  -webkit-box-align: center; align-items: center;
  border-radius: 10px; padding: 6px 6px;
  border: 1px solid transparent;
}
.ib-sc + .ib-sc { margin-left: 8px; }
.ib-sc-ico { font-size: 16px; line-height: 1; }
.ib-sc b { font-size: 24px; font-weight: 900; line-height: 1.15; font-variant-numeric: tabular-nums; }
.ib-sc-lab { font-size: 13px; font-weight: 700; }
.ib-sc.done { background: #dcfce7; border-color: #86efac; }
.ib-sc.done b, .ib-sc.done .ib-sc-lab { color: #15803d; }
.ib-sc.doing { background: #fef3c7; border-color: #fcd34d; }
.ib-sc.doing b, .ib-sc.doing .ib-sc-lab { color: #b45309; }
.ib-sc.todo { background: #f1f5f9; border-color: #cbd5e1; }
.ib-sc.todo b, .ib-sc.todo .ib-sc-lab { color: #475569; }
.ib-sc.online { background: #dbeafe; border-color: #93c5fd; }
.ib-sc.online b, .ib-sc.online .ib-sc-lab { color: #1d4ed8; }
/* 选项分布 */
.ib-opts {
  -webkit-box-flex: 0; flex: none;
  background: #f8fafc; border: 1px solid #e5e9f0;
  border-radius: 12px; padding: 8px 14px 10px;
  margin-bottom: 10px;
}
.ib-sec-title {
  color: #1e293b; font-size: 15px; font-weight: 800;
  display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center;
}
.ib-sec-note { margin-left: auto; font-weight: 600; font-size: 13px; color: #64748b; }
.ib-opt-grid { margin-top: 4px; }
.ib-opt { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; height: 26px; }
.ib-opt + .ib-opt { margin-top: 4px; }
.ib-opt-letter {
  width: 24px; height: 24px; border-radius: 7px;
  background: #e8edf4; color: #334155;
  font-size: 14px; font-weight: 900;
  display: -webkit-box; display: flex;
  -webkit-box-align: center; align-items: center;
  -webkit-box-pack: center; justify-content: center;
  -webkit-box-flex: 0; flex: none;
}
.ib-opt-letter.right { background: #16a34a; color: #fff; }
.ib-opt-track {
  -webkit-box-flex: 1; flex: 1 1 auto;
  height: 24px; border-radius: 999px; background: #e8edf4;
  margin: 0 16px; overflow: hidden;
}
.ib-opt-fill { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #60a5fa, #3b82f6); -webkit-transition: width .4s; transition: width .4s; }
.ib-opt.right .ib-opt-fill { background: linear-gradient(90deg, #22c55e, #4ade80); }
.ib-opt-cnt { min-width: 62px; text-align: right; font-size: 20px; font-weight: 900; color: #1e293b; font-variant-numeric: tabular-nums; -webkit-box-flex: 0; flex: none; }
.ib-opt-cnt small { font-size: 12px; font-weight: 700; color: #64748b; margin-left: 2px; }
/* quizset 汇总 */
.ib-qset {
  -webkit-box-flex: 0; flex: none;
  background: #eff6ff; border: 1px solid #bfdbfe; color: #1e40af;
  border-radius: 10px; padding: 7px 14px;
  font-size: 15px; font-weight: 700;
  margin-bottom: 10px;
}
.ib-qset b { font-size: 17px; color: #1d4ed8; }
/* 名单三栏 */
.ib-lists {
  -webkit-box-flex: 1; flex: 1 1 auto;
  min-height: 0;
  display: -webkit-box; display: flex;
  -webkit-box-align: stretch; align-items: stretch;
}
.ib-list {
  -webkit-box-flex: 1; flex: 1 1 0;
  min-width: 0;
  display: -webkit-box; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column;
  background: #f8fafc; border: 1px solid #e5e9f0;
  border-radius: 12px; padding: 8px 10px 10px;
  overflow: hidden;
}
/* 未作答/未全对通常只有个位数，固定窄栏即可；全对是大头，弹性吃掉剩余宽度：
   44 人班级下面板宽 89.8vw 时全对栏约 1100px+，卡片 5 列×9 行全部显示，无列表滚动条
   2026-09-29 栏宽 260→310：保证栏头标题+副注一行放下不换行 */
.ib-lists .ib-list:nth-child(1), .ib-lists .ib-list:nth-child(2) {
  -webkit-box-flex: 0; flex: 0 0 310px;
}
.ib-lists .ib-list:nth-child(3) {
  -webkit-box-flex: 1; flex: 1 1 0;
}
.ib-list + .ib-list { margin-left: 10px; }
.ib-list-head {
  -webkit-box-flex: 0; flex: none;
  font-size: 15px; font-weight: 900;
  padding-bottom: 6px; margin-bottom: 7px;
  border-bottom: 2px dashed #dbe2ec;
  display: -webkit-box; display: flex; -webkit-box-align: baseline; align-items: baseline;
  white-space: nowrap;   /* 栏头一行显示不换行（2026-09-29 课堂反馈） */
}
.ib-list-head b { font-size: 16px; margin: 0 3px 0 6px; }
.ib-list-head-note { margin-left: auto; font-size: 11px; font-weight: 600; color: #94a3b8; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.ib-list-head.todo { color: #64748b; }
.ib-list-head.doing { color: #b45309; }
.ib-list-head.done { color: #15803d; }
.ib-grid {
  -webkit-box-flex: 1; flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  grid-gap: 10px; gap: 10px;
  align-content: start;
}
.ib-card {
  display: -webkit-box; display: flex;
  -webkit-box-align: center; align-items: center;
  -webkit-box-lines: multiple; flex-wrap: wrap;   /* 2026-10-06 文字作答小字行需要换行 */
  align-content: center;
  min-height: 54px; height: auto;
  border-radius: 12px;
  padding: 2px 9px;
  background: #fff;
  border: 1px solid #e2e8f0;
  -webkit-box-sizing: border-box; box-sizing: border-box;
}
/* 2026-10-06 答题实况卡片文字作答行：诊断/对话收获（360兼容模式退化为块级换行同样生效） */
.ib-card .ib-text { display: block; width: 100%; flex-basis: 100%; max-width: 100%; font-size: 11px; font-style: normal; line-height: 1.35; color: #475569; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; margin-top: 1px; }
.ib-card.todo { background: #f4f6f9; border-color: #d7dee8; }
.ib-card.doing { background: #fffbeb; border-color: #fcd34d; }
.ib-card.done { background: #f0fdf4; border-color: #86efac; }
.ib-dot { width: 9px; height: 9px; border-radius: 50%; background: #cbd5e1; margin-right: 7px; -webkit-box-flex: 0; flex: none; }
.ib-dot.on { background: #22c55e; box-shadow: 0 0 6px rgba(34, 197, 94, .8); }
.ib-seat {
  font-style: normal; font-size: 13px; font-weight: 800;
  background: #dbeafe; color: #1d4ed8;
  border-radius: 6px; padding: 2px 7px;
  margin-right: 8px; white-space: nowrap; -webkit-box-flex: 0; flex: none;
}
.ib-sname {
  font-size: 18px; font-weight: 800; color: #1e293b;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  -webkit-box-flex: 1; flex: 1 1 auto; min-width: 0;
}
.ib-badge { font-size: 12px; font-weight: 900; border-radius: 5px; padding: 2px 5px; margin-left: 4px; white-space: nowrap; -webkit-box-flex: 0; flex: none; }
.ib-badge.ok { background: #16a34a; color: #fff; }
.ib-badge.wrong { background: #dc2626; color: #fff; }
.ib-badge.score { background: #fef3c7; color: #b45309; }
/* 2026-10-06 答题实况·HTML互动课件逐题反馈 */
.ib-qstats { margin-top: 14px; }
.ib-qs-list { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; gap: 8px; margin-top: 10px; }
.ib-qs-row { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; }
.ib-qs-no { font-size: 16px; font-weight: 900; color: #334155; -webkit-box-flex: 0; flex: none; width: 64px; }
.ib-qs-q { font-size: 15px; font-weight: 600; color: #475569; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -webkit-box-flex: 0; flex: 0 1 340px; min-width: 0; }
.ib-qs-row .ib-opt-track { height: 18px; margin: 0 14px; }
.ib-opt-fill.qs { background: linear-gradient(90deg, #22c55e, #4ade80); }
.ib-opt-fill.qs.low { background: linear-gradient(90deg, #f87171, #ef4444); }
.ib-qs-rate { font-size: 17px; font-weight: 900; color: #16a34a; width: 58px; text-align: right; font-variant-numeric: tabular-nums; -webkit-box-flex: 0; flex: none; }
.ib-qs-rate.low { color: #dc2626; }
.ib-qs-cnt { font-size: 15px; font-weight: 800; -webkit-box-flex: 0; flex: none; width: 52px; text-align: right; font-variant-numeric: tabular-nums; }
.ib-qs-cnt.ok { color: #16a34a; }
.ib-qs-cnt.no { color: #dc2626; }
.ib-qs-cnt.avg { width: 96px; color: #2563eb; }
/* —— 2026-10-08 全班逐题综合统计升级：汇总条 + 对/错双段柱状图 + 错误率徽章 + 排序切换
   （360浏览器兼容：只用 flex/rgba/线性渐变，无 color-mix / inset / gap-in-flex 依赖） —— */
.ib-qsort { margin-left: 10px; display: -webkit-box; display: flex; -webkit-box-flex: 0; flex: none; }
.ib-qsort button {
  border: 1.5px solid #cbd5e1; background: #fff; color: #64748b;
  font-size: 13px; font-weight: 800; padding: 3px 12px; border-radius: 999px; cursor: pointer;
}
.ib-qsort button + button { margin-left: 6px; }
.ib-qsort button.on { border-color: #2563eb; background: #2563eb; color: #fff; }
.ib-qsum { display: -webkit-box; display: flex; -webkit-box-align: stretch; align-items: stretch; margin-top: 10px; }
.ib-qsum-cell {
  -webkit-box-flex: 1; flex: 1 1 0; display: -webkit-box; display: flex; -webkit-box-align: baseline; align-items: baseline;
  background: #f8fafc; border: 1.5px solid #e2e8f0; border-radius: 12px; padding: 8px 14px; min-width: 0;
}
.ib-qsum-cell + .ib-qsum-cell { margin-left: 10px; }
.ib-qsum-cell i { font-style: normal; font-size: 14px; font-weight: 700; color: #64748b; white-space: nowrap; }
.ib-qsum-cell b { font-size: 21px; font-weight: 900; color: #16a34a; margin-left: 8px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ib-qsum-cell em { font-style: normal; font-size: 13px; font-weight: 800; color: #dc2626; background: #fee2e2; border-radius: 999px; padding: 2px 10px; margin-left: 8px; white-space: nowrap; }
.ib-qsum-cell.ok b { color: #16a34a; }
.ib-qsum-cell.hot { background: #fef2f2; border-color: #fecaca; }
.ib-qsum-cell.hot b { color: #dc2626; }
.ib-qsum-cell.sub { -webkit-box-flex: 0; flex: 0 0 auto; }
.ib-qsum-cell.sub b { color: #2563eb; }
.ib-qs-row.hot .ib-qs-no { color: #dc2626; }
.ib-qs-bar {
  -webkit-box-flex: 1; flex: 1 1 0; min-width: 0; height: 22px; margin: 0 14px;
  background: #e2e8f0; border-radius: 999px; overflow: hidden;
  display: -webkit-box; display: flex;
}
.ib-qs-seg {
  display: block; height: 100%; min-width: 0; overflow: hidden; white-space: nowrap; text-align: center;
  font-size: 12.5px; font-weight: 900; line-height: 22px; color: #fff;
  -webkit-transition: width .4s; transition: width .4s; font-variant-numeric: tabular-nums;
}
.ib-qs-seg.ok { background: linear-gradient(90deg, #22c55e, #4ade80); }
.ib-qs-seg.bad { background: linear-gradient(90deg, #ef4444, #f87171); }
.ib-qs-err {
  font-size: 15px; font-weight: 900; color: #16a34a; width: 112px; text-align: right;
  -webkit-box-flex: 0; flex: none; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.ib-qs-err.mid { color: #d97706; }
.ib-qs-err.hot { color: #dc2626; }
/* —— 2026-10-06 作品分享墙（输入答案题 write）：答案全文直接上墙可见，点击卡片放大投影 —— */
.ib-wall { margin-top: 14px; -webkit-box-flex: 1; flex: 1 1 auto; min-height: 0; display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; }
.ib-wall-grid { -webkit-box-flex: 1; flex: 1 1 auto; min-height: 0; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); grid-gap: 12px; gap: 12px; align-content: start; padding: 2px; }
.ib-wall-card {
  display: block; width: 100%; height: auto; text-align: left;
  background: #fff; border: 1.5px solid #e2e8f0; border-radius: 14px;
  padding: 10px 14px 12px; cursor: pointer; font: inherit; -webkit-box-sizing: border-box; box-sizing: border-box;
  -webkit-transition: border-color .15s, box-shadow .15s; transition: border-color .15s, box-shadow .15s;
}
.ib-wall-card:hover { border-color: #3b82f6; box-shadow: 0 6px 18px rgba(59, 130, 246, .18); }
.ib-wall-card:active { background: #f0f7ff; }
.ib-wall-head { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; margin-bottom: 6px; }
.ib-wall-name { font-size: 18px; font-weight: 900; color: #1e293b; }
/* 答案全文：保留换行，最多4行超出省略（全文点卡片放大看） */
.ib-wall-txt {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; -webkit-box-flex: 1; flex: 1 1 auto;
  overflow: hidden; font-size: 16px; line-height: 1.6; color: #334155;
  white-space: pre-wrap; word-break: break-all; text-align: left;
}
.ib-wall-todo {
  -webkit-box-flex: 0; flex: none; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center;
  -webkit-box-lines: multiple; flex-wrap: wrap; gap: 8px; margin-top: 10px; padding: 8px 12px;
  background: #f4f6f9; border: 1px dashed #cbd5e1; border-radius: 10px;
}
.ib-wall-todo-lab { font-size: 15px; font-weight: 900; color: #64748b; margin-right: 4px; }
.ib-wall-chip { display: -webkit-inline-box; display: inline-flex; -webkit-box-align: center; align-items: center; font-size: 15px; font-weight: 700; color: #475569; background: #fff; border: 1px solid #dbe2ec; border-radius: 8px; padding: 3px 10px; }
/* —— 2026-10-06 作品放大投影：展示分享环节大字展示单个学生答案（←→/翻页笔连翻，Esc 关闭） —— */
.ib-zoom {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 60;
  background: rgba(6, 10, 20, .66);
  display: -webkit-box; display: flex;
  -webkit-box-align: center; align-items: center;
  -webkit-box-pack: center; justify-content: center;
  -webkit-animation: ibPop .18s ease-out; animation: ibPop .18s ease-out;
}
.ib-zoom-box {
  width: 1100px; max-width: calc(100% - 48px); max-height: calc(100% - 90px);
  background: #fff; border-radius: 20px; border: 1px solid #e5e9f0;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .5);
  display: -webkit-box; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column;
  overflow: hidden;
}
.ib-zoom-top {
  -webkit-box-flex: 0; flex: none; display: -webkit-box; display: flex;
  -webkit-box-align: center; align-items: center;
  padding: 14px 24px; background: linear-gradient(100deg, #0e7490, #0891b2 60%, #06b6d4); color: #fff;
}
.ib-zoom-name { font-size: 26px; font-weight: 900; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; min-width: 0; }
.ib-zoom-name .ib-seat { background: rgba(255, 255, 255, .22); color: #fff; }
.ib-zoom-sub { font-size: 18px; font-weight: 600; opacity: .92; margin-left: 4px; }
.ib-zoom-cnt { margin-left: auto; font-size: 18px; font-weight: 800; opacity: .95; white-space: nowrap; }
.ib-zoom-x {
  -webkit-box-flex: 0; flex: none; margin-left: 18px; width: 40px; height: 40px; border-radius: 11px;
  background: rgba(255, 255, 255, .16); color: #fff; font-size: 20px; font-weight: 900;
  border: none; cursor: pointer; line-height: 40px; text-align: center; padding: 0;
}
.ib-zoom-x:hover { background: rgba(255, 255, 255, .3); }
/* 投影级大字：32px 左对齐，保留学生输入的换行 */
.ib-zoom-txt {
  -webkit-box-flex: 1; flex: 1 1 auto; min-height: 0; overflow-y: auto;
  font-size: 32px; line-height: 1.8; color: #0f172a; text-align: left;
  white-space: pre-wrap; word-break: break-all; padding: 30px 44px;
}
.ib-zoom-nav {
  -webkit-box-flex: 0; flex: none; display: -webkit-box; display: flex;
  -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;
  gap: 18px; padding: 14px 24px; border-top: 1px solid #e8edf4; background: #f8fafc;
}
.ib-zoom-navbtn {
  font-size: 20px; font-weight: 900; color: #0e7490; background: #fff;
  border: 2px solid #67e8f9; border-radius: 12px; padding: 10px 26px; cursor: pointer;
}
.ib-zoom-navbtn:hover { background: #ecfeff; }
.ib-zoom-navbtn.go { color: #fff; background: #0891b2; border-color: #0891b2; }
.ib-zoom-navbtn.go:hover { background: #0e7490; }
.ib-zoom-nav-tip { font-size: 14px; font-weight: 600; color: #94a3b8; }
/* 2026-10-06 用户反馈：重试次数改为卡片小字行直接展示（ib-text），原隐藏角标 .ib-retry 已随模板删除 */
.ib-grid-empty { grid-column: 1 / -1; color: #94a3b8; font-size: 16px; font-weight: 600; text-align: center; padding: 20px 6px; }
/* 空数据 */
.ib-body-empty { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; }
.ib-empty-ico { font-size: 84px; line-height: 1; opacity: .5; }
.ib-empty-txt { color: #334155; font-size: 30px; font-weight: 900; margin-top: 18px; }
.ib-empty-sub { color: #94a3b8; font-size: 18px; margin-top: 10px; }
/* 窄屏兜底：三栏改纵向堆叠（机房 1920 宽下不触发，仅为窗口缩小时保底） */
@media (max-width: 1100px) {
  .ib-hero { -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-align: stretch; align-items: stretch; }
  .ib-hero-num { min-width: 0; border-right: none; border-bottom: 2px solid #e8edf4; padding: 0 0 14px; margin: 0 0 14px; }
  .ib-lists { -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; overflow-y: auto; }
  .ib-list + .ib-list { margin-left: 0; margin-top: 12px; }
  /* 纵向堆叠时还原宽屏的"窄栏固定宽"，改为按内容自适应高 */
  .ib-lists .ib-list:nth-child(1), .ib-lists .ib-list:nth-child(2) { -webkit-box-flex: 0; flex: 0 0 auto; }
  .ib-grid { overflow-y: visible; min-height: 0; max-height: 240px; }
}
/* 2026-10-06：原 @media(min-width:2001px) 安全档已删除——ib-box 已改为固定 px
   锚定红框（见上方 .ib-box 注释），不再依赖 vw，大视口无需分档 */

/* —— 学生记分面板 · 大屏版 v4（2026-09-30：居中大卡 + 座号彩色圆圈徽章，按机号一眼定位学生） ——
 * 四列纵向连续（1-13 列1 / 14-26 列2 / 27-39 列3 / 40-52 列4），column-rule 分隔线辅助按列定位；
 * v4.8 整体装入用户绿框（截图标注映射：绿框=学生端白色幻灯片卡 .player-stage，CSS 左145/顶110/右1843/底1070）：
 *   面板 top110/left146/宽1696/高上限956，右缘1842≤1843、底缘1066≤1070，四边全部落在绿框内；
 *   行距三档 rp-a/rp-b/rp-c 按人数动态适配（见下），40人内行距87 最清爽、52人满班零滚动；
 *   v4.7 及之前为红框锚定（top98/左98/宽1520/高833），v4.8 起移入绿框（白卡）并整体放大。 */
.tm-panel-score {
  top: 110px; bottom: auto;                 /* v4.8：顶边对齐绿框（白卡）顶 110 */
  height: auto; max-height: 956px;         /* v4.8：高度随人数自适应，上限 956（110+956=1066 ≤ 绿框底 1070） */
  left: 146px; right: auto; width: 1696px; max-width: 100%;  /* v4.8：精确装入绿框（左146/宽1696，右缘1842≤1843） */
  margin: 0;                                /* 取消 v4.5 课件区居中：改为绿框绝对锚定 */
  -webkit-transform: none; transform: none;
  border-radius: 18px;                      /* 固定px无 fitScreen vh 坑（v2/v4.1 同源教训） */
}
.tbp-head-lg { padding: 10px 22px; font-size: 22px; }
.tbp-title-lg { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; }
.tbs-count {
  font-style: normal; font-size: 16px; font-weight: 700; color: #93c5fd;
  background: rgba(147,197,253,.14); border: 1px solid rgba(147,197,253,.3);
  border-radius: 999px; padding: 3px 14px; margin-left: 14px;
}
.tbs-head-acts { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; }
.tbs-sort {
  background: rgba(255,255,255,.12); color: #f9fafb; border: 1px solid rgba(255,255,255,.28);
  height: 40px; padding: 0 18px; border-radius: 999px; font-size: 16px; font-weight: 700;
  cursor: pointer; margin-right: 12px;
}
.tbs-sort:hover { background: rgba(255,255,255,.22); }
.tbs-sort.on { background: #f59e0b; border-color: #f59e0b; color: #3b2503; }
.tbp-close-lg { width: 36px; height: 36px; font-size: 16px; }
.tbp-scroll-grid {
  padding: 10px 14px;
  column-count: 4; column-gap: 28px;   /* multi-column：号段纵向连续，1-13→列1，14-26→列2…；v4.4 列距 28px 分组更清爽 */
  column-rule: 1px solid rgba(255,255,255,.08); /* 列间细分隔线，帮助按列定位 */
}
.tbp-scroll-grid .tm-empty { -webkit-column-span: all; column-span: all; }
.tbs-row-lg {
  padding: 4px 7px; border-radius: 12px; border-bottom: 1px solid rgba(255,255,255,.06);  /* v4.7 左右10→7：列宽352装下4字姓名 */
  -webkit-transition: background .25s; transition: background .25s;
  break-inside: avoid; page-break-inside: avoid; -webkit-column-break-inside: avoid; /* 行不跨列劈裂 */
}
.tbs-row-lg:hover { background: rgba(255,255,255,.07); }
/* v4.8 行距三档（绿框内最大化行间距，按人数自动换档）：
   可用行区 = 956 − 头部61 − 列表padding20 − 边框2 = 873px
   rp-a ≤40人(≤10行)：行距87（48+19×2+1），10×87=870≤873 ✓ 40人内最大行距，投屏最清爽
   rp-b 41-52人(11-13行)：行距67（48+9×2+1），13×67=871≤873 ✓ 满班52人零滚动
   rp-c 53+人：默认行距57（48+4×2+1），14×57=798 ✓ 大班兜底 */
.tbp-scroll-grid.rp-a .tbs-row-lg { padding: 19px 7px; }
.tbp-scroll-grid.rp-b .tbs-row-lg { padding: 9px 7px; }
/* 座号：彩色圆圈徽章（蓝色渐变 + 白色大数字，按机号一眼定位） */
.tbs-row-lg .tbs-seat {
  width: 48px; height: 48px; border-radius: 50%;
  background: #2563eb;
  background: linear-gradient(135deg, #38bdf8 0%, #2563eb 100%);
  border: 2px solid rgba(255,255,255,.38);
  -webkit-box-shadow: 0 2px 10px rgba(37,99,235,.5); box-shadow: 0 2px 10px rgba(37,99,235,.5);
  color: #fff; font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums;
  display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;
  margin-right: 10px; flex-shrink: 0;
}
.tbs-row-lg .tbs-name { font-size: 23px; margin-right: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; -webkit-box-flex: 0; flex: 0 1 auto; } /* 覆盖基类 flex:1：自然宽度紧贴分数，超长可收缩截断；v4.4 右边距 8→4px 更紧凑 */
.tbs-row-lg .tbs-score { font-size: 27px; min-width: 0; text-align: left; } /* v4.4：去 min-width+居中（一位数居中两侧留白显宽），数字紧跟姓名 */
.tbs-row-lg .tbs-btn { height: 42px; min-width: 43px; padding: 0 8px; font-size: 17px; border-radius: 10px; margin-left: 4px; }  /* v4.7：44/5→43/4 微压，列宽352内4字姓名不截断 */
.tbs-row-lg .tbs-acts { margin-left: auto; } /* 按钮组推到行尾：姓名+分数紧凑靠左，四列按钮纵向对齐 */
/* 排行榜名次徽章（按分数排序时显示，缩小与座号大圈分层）：前三名金/银/铜 */
.tbs-rank {
  width: 30px; height: 30px; border-radius: 50%;
  background: rgba(255,255,255,.1); color: #e5e7eb;
  font-size: 14px; font-weight: 800; font-variant-numeric: tabular-nums;
  display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;
  margin-right: 8px; flex-shrink: 0;
}
.tbs-rank.r1 { background: #f59e0b; color: #3b2503; }
.tbs-rank.r2 { background: #cbd5e1; color: #1e293b; }
.tbs-rank.r3 { background: #d97706; color: #3b2503; }
/* 记分即时反馈：加分=绿、扣分=红，2.5 秒后淡出（投屏全班可见） */
.tbs-row-lg.hp { background: rgba(52,211,153,.22); -webkit-box-shadow: inset 0 0 0 1px rgba(52,211,153,.6); box-shadow: inset 0 0 0 1px rgba(52,211,153,.6); }
.tbs-row-lg.hm { background: rgba(248,113,113,.22); -webkit-box-shadow: inset 0 0 0 1px rgba(248,113,113,.6); box-shadow: inset 0 0 0 1px rgba(248,113,113,.6); }
/* 矮屏兜底（≤820px 高；fitScreen 正常时不触发，窗口缩放瞬间/特殊比例兜底）：压圈与字号保零滚动 */
@media (max-height: 820px) {
  .tm-panel-score { top: 90px; max-height: 652px; }  /* v4.7 矮屏兜底：高度=820-90-78余量=652 ≥ 矮屏预算614（行高41×13+头部+padding），零滚动 */
  .tbp-head-lg { padding: 8px 20px; font-size: 20px; }
  .tbs-sort { height: 36px; font-size: 15px; }
  .tbp-scroll-grid { padding: 6px 16px; column-gap: 24px; }
  .tbs-row-lg { padding: 2px 8px; }
  .tbp-scroll-grid.rp-a .tbs-row-lg, .tbp-scroll-grid.rp-b .tbs-row-lg { padding: 2px 8px; }  /* v4.8：矮屏统一压回紧凑行距（同特异性源码靠后覆盖 rp 档） */
  .tbs-row-lg .tbs-seat { width: 38px; height: 38px; font-size: 17px; border-width: 2px; margin-right: 8px; }
  .tbs-row-lg .tbs-name { font-size: 21px; }
  .tbs-row-lg .tbs-score { font-size: 23px; min-width: 0; }
  .tbs-row-lg .tbs-btn { height: 34px; min-width: 42px; padding: 0 7px; font-size: 14px; border-radius: 8px; margin-left: 5px; }
  .tbs-rank { width: 26px; height: 26px; font-size: 12px; margin-right: 6px; }
}

/* —— 随机抽选 v4（2026-09-29 班级优化大师风：白卡 + 主绿 #1abc9c + 超大字 + 徽章点评） —— */
.pk2-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, .45);
  z-index: 11000;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.pk2-box {
  width: 880px;
  max-width: 96vw;
  max-height: 94vh;
  overflow: auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .35);
}
.pk2-head { display: flex; align-items: center; justify-content: space-between; padding: 20px 28px; border-bottom: 1px solid #f0f0f0; }
.pk2-title { color: #222; font-size: 30px; font-weight: 900; letter-spacing: 2px; }
.pk2-close { background: none; border: none; color: #999; font-size: 30px; line-height: 1; padding: 2px 8px; cursor: pointer; }
.pk2-close:hover { color: #333; }
.pk2-body { padding: 36px 40px 14px; min-height: 330px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
/* 状态1：选择人数 */
.pk2-setup { text-align: center; }
.pk2-setup-lab { color: #888; font-size: 26px; margin-bottom: 24px; }
.pk2-setup-row { display: flex; align-items: center; justify-content: center; }
.pk2-cnt-btn { width: 76px; height: 76px; border-radius: 50%; border: 2px solid #dcdcdc; background: #fff; color: #666; font-size: 44px; font-weight: 400; line-height: 1; cursor: pointer; }
.pk2-cnt-btn:hover { border-color: #1abc9c; color: #1abc9c; }
.pk2-cnt-num { color: #222; font-size: 110px; font-weight: 900; min-width: 200px; text-align: center; line-height: 1.05; font-variant-numeric: tabular-nums; }
.pk2-repeat { display: inline-flex; align-items: center; margin-top: 24px; color: #999; font-size: 17px; cursor: pointer; }
.pk2-repeat input { margin-right: 8px; width: 18px; height: 18px; cursor: pointer; }
/* 状态2：滚动中 */
.pk2-rolling { text-align: center; }
.pk2-roll-name {
  color: #222;
  font-size: 96px;
  font-weight: 900;
  letter-spacing: 8px;
}
.pk2-roll-tip { margin-top: 20px; color: #aaa; font-size: 18px; letter-spacing: 4px; }
/* 状态3：抽选结果 */
.pk2-results { display: flex; flex-wrap: wrap; justify-content: center; }
.pk2-card {
  position: relative;
  width: 250px;
  background: #fafafa;
  border: 1px solid #f0f0f0;
  border-radius: 16px;
  padding: 26px 14px 22px;
  margin: 10px;
  text-align: center;
  -webkit-animation: pk2Pop .35s ease-out;
  animation: pk2Pop .35s ease-out;
}
@-webkit-keyframes pk2Pop { 0% { -webkit-transform: scale(.6); opacity: 0; } 100% { -webkit-transform: scale(1); opacity: 1; } }
@keyframes pk2Pop { 0% { transform: scale(.6); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
.pk2-mascot { width: 130px; height: 130px; margin: 0 auto 16px; border-radius: 50%; background: radial-gradient(circle at 32% 28%, #ffe9b8, #ffc069); font-size: 74px; line-height: 130px; }
.pk2-card-name { color: #333; font-size: 44px; font-weight: 900; letter-spacing: 2px; }
.pk2-card-seat { color: #1abc9c; margin-right: 8px; }
.pk2-repick { position: absolute; top: 10px; right: 10px; width: 42px; height: 42px; border-radius: 50%; border: 1px solid #e5e7eb; background: #fff; color: #999; font-size: 22px; cursor: pointer; }
.pk2-repick:hover { border-color: #1abc9c; color: #1abc9c; }
/* 底部按钮 */
.pk2-acts { display: flex; align-items: center; justify-content: center; padding: 20px 40px 30px; }
.pk2-btn-green {
  background: #1abc9c;
  color: #fff;
  border: none;
  height: 72px;
  padding: 0 64px;
  border-radius: 8px;
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 4px;
  cursor: pointer;
  margin: 0 14px;
}
.pk2-btn-green:hover { background: #17a689; }
.pk2-btn-wide { padding: 0 130px; }
.pk2-btn-ghost {
  background: #fff;
  color: #555;
  border: 2px solid #dcdcdc;
  height: 72px;
  padding: 0 64px;
  border-radius: 8px;
  font-size: 30px;
  letter-spacing: 4px;
  cursor: pointer;
  margin: 0 14px;
}
.pk2-btn-ghost:hover { border-color: #1abc9c; color: #1abc9c; }
.pk2-log { padding: 0 40px 24px; display: flex; flex-wrap: wrap; align-items: center; }
.pk2-log-lab { color: #999; font-size: 17px; margin-right: 8px; }
.pk2-log-name { background: #f3f4f6; color: #555; font-size: 16px; padding: 4px 14px; border-radius: 999px; margin: 0 8px 6px 0; }
/* 发送点评弹窗（图3/图4） */
.pkp-box { width: 1020px; }
.pkp-bar { display: flex; align-items: center; justify-content: space-between; padding: 20px 34px 4px; }
.pkp-to { color: #666; font-size: 20px; }
.pkp-to b { color: #1abc9c; font-weight: 900; }
.pkp-tabs { display: flex; }
.pkp-tab { border: 1px solid #e0e0e0; background: #fff; color: #555; font-size: 22px; padding: 12px 46px; cursor: pointer; }
.pkp-tab:first-child { border-radius: 8px 0 0 8px; }
.pkp-tab:last-child { border-radius: 0 8px 8px 0; border-left: none; }
.pkp-tab.on { background: #1abc9c; border-color: #1abc9c; color: #fff; font-weight: 700; }
.pkp-grid { display: flex; flex-wrap: wrap; padding: 14px 26px 4px; }
.pkp-badge { position: relative; width: 16.66%; background: none; border: none; cursor: pointer; padding: 16px 4px 20px; text-align: center; }
.pkp-ico { display: block; width: 104px; height: 104px; margin: 0 auto 10px; border-radius: 50%; font-size: 54px; line-height: 104px; box-shadow: 0 6px 14px rgba(0, 0, 0, .14); }
.pkp-badge:hover .pkp-ico { transform: scale(1.08); }
.pkp-lab { color: #444; font-size: 20px; font-weight: 700; }
.pkp-bubble { position: absolute; top: 8px; right: calc(50% - 64px); min-width: 34px; height: 34px; line-height: 34px; border-radius: 17px; background: #1abc9c; color: #fff; font-size: 18px; font-weight: 900; padding: 0 9px; z-index: 2; }
.pkp-bubble.neg { background: #f0524d; }
.pkp-tip { padding: 10px 34px 24px; color: #aaa; font-size: 16px; text-align: center; }
/* —— 随机抽选 · 加分/扣分大提示（2026-09-29 仿图1/图2：+1 绿卡彩带庆祝 / −1 红卡提醒） —— */
.pkt-wrap { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 11500; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.pkt-card {
  position: relative;
  min-width: 560px;
  max-width: 82vw;
  padding: 44px 96px;
  border-radius: 24px;
  background: #1abc9c;
  box-shadow: 0 26px 80px rgba(26, 188, 156, .55);
  text-align: center;
  overflow: hidden;
  -webkit-animation: pktIn .32s cubic-bezier(.2, 1.4, .4, 1);
  animation: pktIn .32s cubic-bezier(.2, 1.4, .4, 1);
}
.pkt-wrap.neg .pkt-card { background: #f0524d; box-shadow: 0 26px 80px rgba(240, 82, 77, .55); }
@-webkit-keyframes pktIn { 0% { -webkit-transform: scale(.5); opacity: 0; } 100% { -webkit-transform: scale(1); opacity: 1; } }
@keyframes pktIn { 0% { transform: scale(.5); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
.pkt-delta { color: #fff; font-size: 132px; font-weight: 900; line-height: 1.02; text-shadow: 0 6px 18px rgba(0, 0, 0, .22); }
.pkt-label { color: #fff; font-size: 40px; font-weight: 900; letter-spacing: 4px; margin-top: 8px; }
.pkt-names { color: rgba(255, 255, 255, .88); font-size: 26px; margin-top: 16px; }
/* 彩带（仅加分庆祝）：14 条色带循环飘落 */
.pkt-confetti i { position: absolute; top: -20px; width: 13px; height: 22px; border-radius: 3px; opacity: .92; -webkit-animation: pktFall 1.7s linear infinite; animation: pktFall 1.7s linear infinite; }
.pkt-confetti i:nth-child(1) { left: 5%;  background: #ffd54f; -webkit-animation-delay: 0s;    animation-delay: 0s; }
.pkt-confetti i:nth-child(2) { left: 12%; background: #ff8a9e; -webkit-animation-delay: .45s;  animation-delay: .45s; }
.pkt-confetti i:nth-child(3) { left: 19%; background: #74b9ff; -webkit-animation-delay: .9s;   animation-delay: .9s; }
.pkt-confetti i:nth-child(4) { left: 26%; background: #7ee8a2; -webkit-animation-delay: .2s;   animation-delay: .2s; }
.pkt-confetti i:nth-child(5) { left: 33%; background: #ffd54f; -webkit-animation-delay: .65s;  animation-delay: .65s; }
.pkt-confetti i:nth-child(6) { left: 40%; background: #ff8a9e; -webkit-animation-delay: .1s;   animation-delay: .1s; }
.pkt-confetti i:nth-child(7) { left: 47%; background: #74b9ff; -webkit-animation-delay: .55s;  animation-delay: .55s; }
.pkt-confetti i:nth-child(8) { left: 54%; background: #7ee8a2; -webkit-animation-delay: .35s;  animation-delay: .35s; }
.pkt-confetti i:nth-child(9) { left: 61%; background: #ffd54f; -webkit-animation-delay: .8s;   animation-delay: .8s; }
.pkt-confetti i:nth-child(10) { left: 68%; background: #ff8a9e; -webkit-animation-delay: .25s; animation-delay: .25s; }
.pkt-confetti i:nth-child(11) { left: 75%; background: #74b9ff; -webkit-animation-delay: .7s;  animation-delay: .7s; }
.pkt-confetti i:nth-child(12) { left: 82%; background: #7ee8a2; -webkit-animation-delay: .05s; animation-delay: .05s; }
.pkt-confetti i:nth-child(13) { left: 89%; background: #ffd54f; -webkit-animation-delay: .5s;  animation-delay: .5s; }
.pkt-confetti i:nth-child(14) { left: 95%; background: #ff8a9e; -webkit-animation-delay: .3s;  animation-delay: .3s; }
@-webkit-keyframes pktFall { 0% { -webkit-transform: translateY(-30px) rotate(0deg); } 100% { -webkit-transform: translateY(430px) rotate(320deg); } }
@keyframes pktFall { 0% { transform: translateY(-30px) rotate(0deg); } 100% { transform: translateY(430px) rotate(320deg); } }

/* —— 课堂计时 v3（仿参考样式：白卡 + 胶囊切换 + 大数字 + 虚线分隔 + 2×4 预设网格 + 大开始键 + 全屏投影） —— */
.tm2-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(8, 12, 24, .72);
  z-index: 11000;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.tm2-box {
  width: 820px;
  max-width: 94vw;
  max-height: 92vh;
  overflow-y: auto;
  background: #ffffff;
  border: 1px solid #e8ecf3;
  border-radius: 28px;
  padding: 22px 34px 30px;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .5);
  position: relative;
}
/* 模式主色：倒计时=暖橙（参考图1）/ 正计时=蓝色（参考图2） */
.tm2-box.mode-down { --tacc: #f97316; --tacc-deep: #ea580c; --tacc-soft: #fdba74; --tacc-fog: #fff7ed; --tacc-ring: rgba(249, 115, 22, .3); }
.tm2-box.mode-up { --tacc: #3b82f6; --tacc-deep: #2563eb; --tacc-soft: #93c5fd; --tacc-fog: #eff6ff; --tacc-ring: rgba(59, 130, 246, .3); }
.tm2-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2px; }
.tm2-seg { display: flex; background: #eef1f6; border-radius: 999px; padding: 5px; }
.tm2-seg-btn {
  background: transparent;
  color: #6b7280;
  border: none;
  height: 46px;
  padding: 0 30px;
  border-radius: 999px;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 1px;
  cursor: pointer;
}
.tm2-seg-btn.on { background: var(--tacc); color: #fff; box-shadow: 0 6px 18px var(--tacc-ring); }
.tm2-close { background: #eef1f6; color: #4b5563; border: none; width: 42px; height: 42px; border-radius: 14px; font-size: 16px; cursor: pointer; }
.tm2-close:hover { background: #fee2e2; color: #ef4444; }
.tm2-status { min-height: 40px; display: flex; align-items: center; justify-content: center; }
.tm2-status-chip { font-size: 15px; font-weight: 800; padding: 5px 18px; border-radius: 999px; letter-spacing: 1px; }
.tm2-status-chip.run { background: var(--tacc-fog); color: var(--tacc-deep); border: 1px solid var(--tacc-soft); }
.tm2-dot-run { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--tacc); margin-right: 8px; -webkit-animation: tm2Pulse 1s ease-in-out infinite; animation: tm2Pulse 1s ease-in-out infinite; }
.tm2-status-chip.end { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }
@-webkit-keyframes tm2Pulse { 50% { opacity: .25; } }
@keyframes tm2Pulse { 50% { opacity: .25; } }
.tm2-disp { display: flex; align-items: center; justify-content: center; padding: 4px 0 2px; }
.tm2-unit { display: flex; flex-direction: column; align-items: center; }
.tm2-num-row { display: flex; align-items: center; justify-content: center; }
.tm2-num {
  color: #1f2937;
  font-size: 150px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  letter-spacing: 3px;
}
.tm2-disp.editing .tm2-num { font-size: 96px; }
.tm2-adj {
  background: var(--tacc-fog);
  color: var(--tacc-deep);
  border: 1px solid var(--tacc-soft);
  width: 46px; height: 46px;
  border-radius: 13px;
  font-size: 20px;
  font-weight: 900;
  cursor: pointer;
  line-height: 1;
  margin: 0 10px;
}
.tm2-adj:hover { background: var(--tacc-soft); }
.tm2-adj[disabled] { opacity: .35; cursor: default; }
.tm2-unit-lab { color: #9ca3af; font-size: 15px; font-weight: 800; margin-top: 8px; letter-spacing: 3px; }
.tm2-colon { display: flex; flex-direction: column; justify-content: center; margin: 0 20px; }
.tm2-colon i { width: 16px; height: 16px; border-radius: 50%; background: #1f2937; }
.tm2-colon i + i { margin-top: 24px; }
.tm2-disp.editing .tm2-colon { margin-bottom: 29px; }
.tm2-disp.urgent .tm2-num { color: #ef4444; -webkit-animation: tm2Blink .5s step-end infinite; animation: tm2Blink .5s step-end infinite; }
.tm2-disp.urgent .tm2-colon i { background: #ef4444; }
@-webkit-keyframes tm2Blink { 50% { opacity: .25; } }
@keyframes tm2Blink { 50% { opacity: .25; } }
.tm2-div { display: flex; align-items: center; margin: 12px 0 18px; }
.tm2-div-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--tacc-soft); }
.tm2-div-line { flex: 1; border-top: 2px dashed var(--tacc-soft); margin: 0 8px; }
.tm2-presets { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 14px; }
.tm2-preset {
  background: #ffffff;
  color: var(--tacc-deep);
  border: 2px solid var(--tacc-soft);
  height: 54px;
  border-radius: 15px;
  font-size: 18px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 3px 0 var(--tacc-soft);
}
.tm2-preset:hover { background: var(--tacc-fog); }
.tm2-preset.cur { background: var(--tacc); color: #fff; border-color: var(--tacc); box-shadow: 0 3px 0 var(--tacc-deep); }
.tm2-up-hint {
  background: var(--tacc-fog);
  border: 1px dashed var(--tacc-soft);
  color: var(--tacc-deep);
  border-radius: 15px;
  height: 54px;
  display: flex; align-items: center; justify-content: center;
  font-size: 17px; font-weight: 700;
}
.tm2-up-hint b { font-weight: 900; margin: 0 4px; font-variant-numeric: tabular-nums; }
.tm2-acts { display: flex; align-items: center; justify-content: center; margin-top: 24px; }
.tm2-go {
  background: var(--tacc);
  color: #fff;
  border: none;
  height: 66px;
  min-width: 240px;
  padding: 0 40px;
  border-radius: 20px;
  font-size: 23px;
  font-weight: 900;
  letter-spacing: 3px;
  cursor: pointer;
  box-shadow: 0 12px 28px var(--tacc-ring);
  margin: 0 18px;
}
.tm2-go:hover { background: var(--tacc-deep); }
.tm2-sub {
  background: #ffffff;
  color: #4b5563;
  border: 2px solid #e5e7eb;
  height: 54px;
  padding: 0 24px;
  border-radius: 16px;
  font-size: 17px;
  font-weight: 800;
  cursor: pointer;
}
.tm2-sub:hover { border-color: var(--tacc-soft); color: var(--tacc-deep); background: var(--tacc-fog); }
.tm2-sub.on { background: var(--tacc-fog); border-color: var(--tacc); color: var(--tacc-deep); }
/* 全屏投影模式：整屏白底只留巨大数字，顶部模式胶囊 + 右上退出按钮 */
.tm2-box.project {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  width: auto;
  max-width: none;
  max-height: none;
  overflow: hidden;
  border: none;
  border-radius: 0;
  padding: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.tm2-box.project .tm2-top,
.tm2-box.project .tm2-presets,
.tm2-box.project .tm2-acts,
.tm2-box.project .tm2-adj,
.tm2-box.project .tm2-unit-lab,
.tm2-box.project .tm2-up-hint,
.tm2-box.project .tm2-div { display: none; }
.tm2-box.project .tm2-status { min-height: calc(var(--vhpx, 1vh) * 8); }
.tm2-box.project .tm2-status-chip { font-size: calc(var(--vhpx, 1vh) * 3); padding: calc(var(--vhpx, 1vh) * .8) calc(var(--vhpx, 1vh) * 2.4); border-radius: 999px; border-width: 2px; }
.tm2-box.project .tm2-num { font-size: calc(var(--vwpx, 1vw) * 17); letter-spacing: 6px; }
.tm2-box.project .tm2-colon { margin: 0 calc(var(--vwpx, 1vw) * 1.1); }
.tm2-box.project .tm2-colon i { width: calc(var(--vhpx, 1vh) * 2); height: calc(var(--vhpx, 1vh) * 2); }
.tm2-box.project .tm2-colon i + i { margin-top: calc(var(--vhpx, 1vh) * 3.5); }
.tm2-proj-mode {
  position: absolute; top: calc(var(--vhpx, 1vh) * 5); left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background: var(--tacc);
  color: #fff;
  border-radius: 999px;
  padding: calc(var(--vhpx, 1vh) * 1.1) calc(var(--vhpx, 1vh) * 3);
  font-size: calc(var(--vhpx, 1vh) * 3);
  font-weight: 900;
  letter-spacing: 4px;
  box-shadow: 0 10px 30px var(--tacc-ring);
}
.tm2-proj-exit {
  position: absolute; top: calc(var(--vhpx, 1vh) * 4); right: calc(var(--vwpx, 1vw) * 2.5);
  background: #f3f4f6;
  color: #4b5563;
  border: none;
  border-radius: 999px;
  padding: calc(var(--vhpx, 1vh) * 1.2) calc(var(--vwpx, 1vw) * 1.4);
  font-size: calc(var(--vhpx, 1vh) * 2.2);
  font-weight: 800;
  cursor: pointer;
}
.tm2-proj-exit:hover { background: #e5e7eb; color: #111827; }

/* —— 2026-09-29 计时器图标内联 SVG 化（Server 2008R2 无 ⏸⏱⏳⏰⛶ 等新 Unicode 字符字体，emoji 显示为方框）+ 声音控制 —— */
/* 图标按 1em 随所在按钮字号缩放：工具区 17-23px，全屏投影模式自动放大；颜色跟随按钮文字色 */
.tm2-ico {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  margin-right: 0.24em;
  -webkit-flex: none;
  flex: none;
}
/* 右上角组合：声音控制 + 关闭按钮 */
.tm2-top-r { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 10px; }
.tm2-snd { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 10px; }
.tm2-snd-btn {
  background: #eef1f6;
  color: #4b5563;
  border: none;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  cursor: pointer;
  display: -webkit-inline-flex;
  display: inline-flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
}
.tm2-snd-btn svg { width: 21px; height: 21px; }
.tm2-snd-btn:hover { background: var(--tacc-fog); color: var(--tacc-deep); }
.tm2-snd-btn.off { color: #b6bcc7; }
/* 音量滑杆（Chromium 内核自定义样式，360极速浏览器旧内核也能正常渲染） */
.tm2-vol {
  -webkit-appearance: none;
  appearance: none;
  width: 92px;
  height: 6px;
  border-radius: 999px;
  background: #e5e7eb;
  outline: none;
  cursor: pointer;
}
.tm2-vol::-webkit-slider-runnable-track { height: 6px; border-radius: 999px; background: #e5e7eb; }
.tm2-vol::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--tacc);
  border: 3px solid #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
  margin-top: -6px;
}
.tm2-vol:disabled { opacity: .35; cursor: default; }

/* —— 光荣榜覆盖层（应用内 iframe，替代弹窗） —— */
.honor-ov {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: #060a13;
  z-index: 11500;
}
.honor-ov-bar {
  position: relative;
  height: 44px;
  background: linear-gradient(90deg, #1e3a8a, #312e81);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 18px;
}
.honor-ov-tip { color: #dbeafe; font-size: 13px; }
.honor-ov-exit { background: #dc2626; color: #fff; border: none; height: 30px; padding: 0 16px; border-radius: 8px; font-size: 13px; font-weight: 700; cursor: pointer; }
.honor-ov-exit:hover { background: #b91c1c; }
.honor-ov-frame { position: absolute; top: 44px; left: 0; width: 100%; height: calc(100% - 44px); border: 0; background: #060a13; }

/* ===== 备案条显隐（2026-09-28 补齐缺失样式——此前 JS 已埋好钩子但 CSS 一直没写，导致授课时备案条仍显示） ===== */
/* 教师端授课模式：body 加 tm-on（JS 钩子已存在）→ 隐藏本页备案条。备案仍保留在登录页/工作台正常页脚，符合备案展示要求 */
body.tm-on .tc-beian { display: none !important; }
/* 学生端被嵌入教师端授课 iframe（URL embed=1 → JS 加 embed-mode，钩子已存在）→ 隐藏 iframe 内的学生端备案条 */
.embed-mode .tc-beian { display: none !important; }

/* ===== 截图框选遮罩（2026-09-28 修复鼠标无反应根因：此前样式完全缺失，遮罩零尺寸不可见、事件不触发） ===== */
/* 全屏固定遮罩：先写 top/right/bottom/left 四向兜底（Chromium 78 不支持 inset 简写），再写 inset:0 */
.shot-mask {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; inset: 0;
  z-index: 99999;
  background: rgba(8, 15, 12, .28);
  cursor: crosshair; /* 十字光标，框选截图区域 */
  user-select: none; -webkit-user-select: none;
}
/* 框选矩形：橙色描边 + 半透明填充
   v5.7：改为 fixed 定位——360浏览器下遮罩容器 rect 可能≠视口原点，
   absolute 本地坐标会偏移；fixed+视口坐标是实测唯一可靠方式（工具条已验证） */
.shot-box {
  position: fixed;
  border: 2px solid #ffb020;
  background: rgba(255, 176, 32, .14);
  box-shadow: 0 0 0 2px rgba(0, 0, 0, .22), 0 8px 24px rgba(0, 0, 0, .25);
  pointer-events: none;
}
/* 顶部操作提示胶囊 */
.shot-tip {
  position: fixed; top: 18px; left: 50%;
  transform: translateX(-50%);
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
  font-size: 14px; font-weight: 700; color: #fff;
  background: rgba(15, 23, 42, .9);
  border: 1px solid rgba(255, 255, 255, .18);
  padding: 8px 18px; border-radius: 999px;
  pointer-events: none;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .35);
}

/* ===== 截图 v4（2026-09-29）：十字线跟随 + 定格手柄 + 复制/保存工具条（Chromium 78 兼容，无 inset/gap 简写） ===== */
/* 十字线：横竖两条贯穿屏幕，实时跟随鼠标（框选阶段） */
.shot-cross-x {
  position: fixed; left: 0; right: 0; height: 1px;
  background: rgba(255, 72, 96, .8);
  box-shadow: 0 0 0 .5px rgba(255, 255, 255, .55);
  pointer-events: none; z-index: 1;
}
.shot-cross-y {
  position: fixed; top: 0; bottom: 0; width: 1px;
  background: rgba(255, 72, 96, .8);
  box-shadow: 0 0 0 .5px rgba(255, 255, 255, .55);
  pointer-events: none; z-index: 1;
}
/* 框选阶段：选区右下角尺寸气泡 */
.shot-size-tip {
  position: fixed; z-index: 2; pointer-events: none;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
  font-size: 14px; font-weight: 700; color: #fff;
  background: rgba(15, 23, 42, .88);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 6px; padding: 5px 12px; white-space: nowrap;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .3);
}
/* 定格阶段：选框变为可拖动状态（移动位置） */
.shot-box.done {
  pointer-events: auto; cursor: move;
  background: rgba(255, 176, 32, .06);
  border-color: #ff8b00;
}
/* 八向手柄：白底蓝边方块，四角 + 四边中点，拖动调整选区大小 */
.shot-hd {
  position: absolute; width: 14px; height: 14px;
  background: #fff; border: 2px solid #1677ff; border-radius: 3px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .4);
}
.shot-hd.hd-nw { left: -8px; top: -8px; cursor: nwse-resize; }
.shot-hd.hd-n  { left: 50%; top: -8px; margin-left: -7px; cursor: ns-resize; }
.shot-hd.hd-ne { right: -8px; top: -8px; cursor: nesw-resize; }
.shot-hd.hd-e  { right: -8px; top: 50%; margin-top: -7px; cursor: ew-resize; }
.shot-hd.hd-se { right: -8px; bottom: -8px; cursor: nwse-resize; }
.shot-hd.hd-s  { left: 50%; bottom: -8px; margin-left: -7px; cursor: ns-resize; }
.shot-hd.hd-sw { left: -8px; bottom: -8px; cursor: nesw-resize; }
.shot-hd.hd-w  { left: -8px; top: 50%; margin-top: -7px; cursor: ew-resize; }
/* 定格阶段：复制 / 保存 / 取消 工具条 */
.shot-acts {
  position: absolute; z-index: 3;
  display: flex; align-items: center;
  background: rgba(15, 23, 42, .94);
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 12px; padding: 8px 10px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .5);
}
.shot-acts-size {
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
  font-size: 15px; font-weight: 800; color: #ffd166;
  margin-right: 14px; white-space: nowrap;
}
.shot-act {
  display: inline-flex; flex-direction: column; align-items: center;
  border: none; cursor: pointer; border-radius: 9px;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
  padding: 8px 16px; margin-left: 8px; white-space: nowrap;
  transition: transform .12s;
}
.shot-act:active { transform: scale(.95); }
.shot-act .sa-main { font-size: 16px; font-weight: 800; line-height: 1.25; }
.shot-act .sa-sub { font-size: 11px; font-weight: 600; opacity: .82; line-height: 1.3; }
.shot-act.sa-copy { background: #16a34a; color: #fff; }
.shot-act.sa-copy:hover { background: #15803d; }
.shot-act.sa-save { background: #1677ff; color: #fff; }
.shot-act.sa-save:hover { background: #0958d9; }
.shot-act.sa-cancel { background: rgba(255, 255, 255, .14); color: #fff; padding: 8px 12px; font-size: 16px; font-weight: 800; }
.shot-act.sa-cancel:hover { background: rgba(255, 255, 255, .26); }
.shot-act:disabled { opacity: .55; cursor: not-allowed; }
/* 「标注」按钮（紫色，与复制/保存区分） */
.shot-act.sa-annot { background: #8b5cf6; color: #fff; }
.shot-act.sa-annot:hover { background: #7c3aed; }

/* ===== 截图标注模式（2026-10-06） ===== */
.shot-annot {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0, 0, 0, .55);
}
/* 标注舞台：底图 + 透明绘图层叠在一起（定位由内联 style 控制，在原选区位置）
   v5.7：改为 fixed 定位 + 视口坐标（同 .shot-box，规避容器 rect 偏移） */
.shot-annot-stage {
  position: fixed;
  box-shadow: 0 0 0 2px #1677ff, 0 12px 48px rgba(0, 0, 0, .6);
  border-radius: 2px; overflow: hidden;
}
.shot-annot-base {
  position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  display: block; pointer-events: none; user-select: none;
}
.shot-annot-draw {
  position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  cursor: crosshair;
}
/* 文字输入框 */
.shot-annot-text-input {
  position: fixed; z-index: 100001;
  border: 2px dashed rgba(255, 255, 255, .85);
  background: rgba(0, 0, 0, .35);
  color: #fff; outline: none; padding: 2px 6px;
  border-radius: 4px; min-width: 60px;
  font-family: "Microsoft YaHei", sans-serif; font-weight: 700;
  box-shadow: 0 2px 12px rgba(0, 0, 0, .5);
}
/* 标注工具栏：v5.2 定位由 shotAnnotBarStyle() 内联控制（紧贴选区下方） */
.shot-annot-bar {
  position: fixed;
  display: flex; flex-direction: column; gap: 8px;
  background: rgba(17, 24, 39, .96);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 14px; padding: 10px 12px;
  box-shadow: 0 10px 36px rgba(0, 0, 0, .55);
  z-index: 100000;
  font-family: "Microsoft YaHei", sans-serif;
}
.sab-row { display: flex; align-items: center; gap: 3px; flex-wrap: nowrap; }
.sab-row2 { justify-content: center; }
.sab-sep { width: 1px; height: 26px; background: rgba(255, 255, 255, .18); margin: 0 4px; flex-shrink: 0; }
/* 工具按钮（图标）— 放大到图3尺寸 */
.sab-btn {
  width: 40px; height: 40px; border: none; border-radius: 9px;
  background: transparent; color: #e5e7eb; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .12s; flex-shrink: 0;
  position: relative;
}
.sab-btn svg { width: 24px; height: 24px; }
.sab-btn:hover { background: rgba(255, 255, 255, .14); }
.sab-btn.on { background: #2563eb; color: #fff; }
.sab-btn:disabled { opacity: .35; cursor: not-allowed; }
/* 关闭按钮（红色） */
.sab-btn.sab-close-btn { color: #fca5a5; }
.sab-btn.sab-close-btn:hover { background: rgba(239, 68, 68, .3); }
/* 确认按钮（绿色 ✓） */
.sab-btn.sab-ok-btn { color: #86efac; }
.sab-btn.sab-ok-btn:hover { background: rgba(34, 197, 94, .3); }
/* 表情面板 */
.sab-emoji-panel {
  position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%);
  background: rgba(17, 24, 39, .98); border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 12px; padding: 10px; margin-bottom: 8px;
  display: grid; grid-template-columns: repeat(8, 1fr); gap: 5px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .5);
  min-width: 280px;
}
.sab-emoji-item {
  font-size: 26px; cursor: pointer; text-align: center;
  padding: 5px; border-radius: 8px; line-height: 1;
  transition: background .12s;
}
.sab-emoji-item:hover { background: rgba(255, 255, 255, .15); }
/* 颜色面板 */
.sab-colors { display: flex; align-items: center; gap: 7px; padding: 0 4px; }
.sab-color {
  width: 22px; height: 22px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .4);
  cursor: pointer; padding: 0; transition: transform .12s;
}
.sab-color:hover { transform: scale(1.15); }
.sab-color.on { border-color: #fff; box-shadow: 0 0 0 2px #2563eb; transform: scale(1.15); }
/* 线宽面板 */
.sab-widths { display: flex; align-items: center; gap: 8px; padding: 0 4px; }
.sab-width {
  width: 34px; height: 34px; border: none; border-radius: 8px;
  background: transparent; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.sab-width span { border-radius: 50%; background: #e5e7eb; display: block; }
.sab-width:hover { background: rgba(255, 255, 255, .12); }
.sab-width.on { background: rgba(37, 99, 235, .35); }
.sab-width.on span { background: #fff; }

/* —— 前测/后测内嵌题页重排版（2026-09-29：模仿学生端翻转层答题卡；Chromium 78 兼容，无 gap/color-mix/inset 简写）—— */
.fe-root { max-width: 880px; margin: 0 auto; text-align: left; }
/* 题号进度 pill + 知识点小标签（同翻转层 flip-q-no 风格） */
.fe-head { display: flex; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.fe-no { display: inline-block; padding: 7px 20px; border-radius: 999px; white-space: nowrap;
  font-size: 16px; font-weight: 800; color: #1d4ed8;
  background: linear-gradient(135deg, #dbeafe, #e0e7ff); border: 1px solid #bfdbfe;
  box-shadow: 0 2px 6px rgba(59, 130, 246, .18); }
.fe-kp { font-size: 15px; color: #64748b; font-weight: 600; margin-left: 12px; }
/* 大题干卡（同翻转层 flip-q-text 风格） */
.fe-q { font-size: 25px; font-weight: 700; color: #1f2738; line-height: 1.6; margin-bottom: 22px;
  padding: 18px 24px; background: linear-gradient(180deg, #ffffff, #fafbff);
  border-radius: 14px; border-left: 5px solid #3b82f6;
  box-shadow: 0 4px 16px rgba(30, 41, 59, .06), 0 1px 3px rgba(30, 41, 59, .04); }
/* 大选项卡（同翻转层 flip-opt 风格，字母键帽用 ::before） */
.fe-opts { text-align: left; }
.fe-opt { display: flex; align-items: center; width: 100%; box-sizing: border-box; text-align: left;
  padding: 15px 18px; margin: 0 0 12px; border-radius: 14px; border: 2px solid #e2e8f0;
  background: #ffffff; font-size: 19px; color: #334155; line-height: 1.5; cursor: pointer;
  font-family: inherit; transition: border-color .15s, box-shadow .15s, transform .15s; }
.fe-opt::before { content: attr(data-letter); display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; min-width: 38px; border-radius: 10px; margin-right: 14px;
  background: #f1f5f9; border: 1.5px solid #cbd5e1; color: #475569;
  font-size: 18px; font-weight: 800; }
.fe-opt:hover { border-color: #93c5fd; box-shadow: 0 3px 12px rgba(59, 130, 246, .14); transform: translateY(-1px); }
.fe-opt.right { border-color: #22c55e; background: linear-gradient(135deg, #f0fdf4, #dcfce7); color: #15803d; cursor: default; }
.fe-opt.right::before { background: linear-gradient(135deg, #bbf7d0, #86efac); border-color: #4ade80; color: #15803d; }
.fe-opt.wrong { border-color: #f87171; background: linear-gradient(135deg, #fef2f2, #fee2e2); color: #b91c1c; }
.fe-opt.wrong::before { background: linear-gradient(135deg, #fecaca, #fca5a5); border-color: #f87171; color: #b91c1c; }
/* .fe-foot 样式见文末 v4 ⑨（放大版） */

/* —— 内嵌开放题页（2026-10-06 fi-*）：教材"测试"栏目 展示分享/写一写 → 手动输入作答 —— */
.fi-body { font-size: 17px; color: #475569; line-height: 1.65; background: #f0f9ff;
  border: 1px solid #bae6fd; border-radius: 12px; padding: 12px 18px; margin-bottom: 16px; }
.fi-mine { font-size: 18px; color: #0f172a; line-height: 1.7; white-space: pre-wrap;
  background: linear-gradient(135deg, #f0fdf4, #ecfdf5); border: 1.5px solid #86efac;
  border-radius: 12px; padding: 14px 18px; margin-bottom: 14px; }
.fi-anslist { max-height: 340px; overflow-y: auto; text-align: left; margin: 4px 0 8px; }
.fi-ansrow { display: flex; align-items: flex-start; gap: 10px; padding: 8px 10px; border-bottom: 1px dashed #e2e8f0; }
.fi-ansrow.empty { color: #94a3b8; font-size: 15px; justify-content: center; border-bottom: none; }
.fi-ansname { flex: 0 0 auto; font-size: 15px; font-weight: 800; color: #1d4ed8; background: #dbeafe;
  border-radius: 8px; padding: 3px 10px; white-space: nowrap; }
.fi-anstxt { flex: 1 1 auto; font-size: 15px; color: #334155; line-height: 1.6; word-break: break-all; white-space: pre-wrap; }

/* 左右分栏（仅教师视角有学情数据时）：题目居左、学情面板居右，整组水平+垂直居中于课件
   （2026-09-29 投屏版：整组 1120→1260px、面板 380→450px，投屏后全班学生能看清面板文字） */
.fe-split { display: flex; align-items: center; max-width: 1260px; }
.fe-main { flex: 1 1 640px; min-width: 0; }
.fe-side { flex: 0 0 450px; width: 450px; margin-left: 40px; }
/* 窄屏（小窗口/低分辨率）：右栏换行到题目上方，保持可用 */
@media (max-width: 1024px) {
  .fe-split { flex-wrap: wrap; }
  .fe-side { flex: 1 1 100%; width: auto; margin-left: 0; margin-bottom: 18px; }
}
/* —— 修复（2026-09-29）：上面 L9511 slide 列布局规则 .main.player-main .player-stage > div > div:not(.slide-footer)
   优先级 (0,3,1) 高于 .fe-split (0,1,0)，把分栏容器改回 flex-direction:column → 学情面板掉到题目下方（上下排列），
   且 flex-basis 300px 在纵轴变成"高度300px"把面板裁成方块。
   此处用更高优先级强制行方向左右分栏 + 显式宽度兜底（Chromium 78 兼容，无 gap/inset 简写）—— */
.main.player-main .player-stage .wp-root.fe-split {
  display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center;
  width: 100%; max-width: 1260px;
}
.main.player-main .player-stage .wp-root.fe-split > .fe-main { flex: 1 1 640px; min-width: 0; margin-top: 0; }
.main.player-main .player-stage .wp-root.fe-split > .fe-side { flex: 0 0 450px; width: 450px; margin-left: 40px; margin-bottom: 0; }
@media (max-width: 1024px) {
  .main.player-main .player-stage .wp-root.fe-split { flex-wrap: wrap; }
  .main.player-main .player-stage .wp-root.fe-split > .fe-side { flex: 1 1 100%; width: auto; margin-left: 0; margin-bottom: 18px; }
}

/* —— 前测/后测引导页 + 题页读书提示条 + 逐题解锁卡（2026-09-29 v3：还原翻转课堂"先读书再答题"引导；
   复用翻转层同款视觉（flip-phase-badge/flip-intro-*/flip-btn/flip-dots 见 L12171-12235）；
   Chromium 78 兼容：无 gap / 无 inset 简写 / 无 color-mix —— */
/* ① 引导页根容器：渐变底铺满 slide 槽位（L9511 会把它设为 flex column，唯一子卡 .fe-intro-card
      经 L9784/9785 的 auto margin 自动垂直居中） */
.fe-intro-root {
  min-height: 100%; box-sizing: border-box; padding: 22px 26px;
  text-align: center; border-radius: 14px;
  background:
    radial-gradient(circle at 12% 16%, rgba(59,130,246,.12) 0%, rgba(59,130,246,0) 40%),
    radial-gradient(circle at 88% 84%, rgba(168,85,247,.12) 0%, rgba(168,85,247,0) 40%),
    linear-gradient(135deg, #eef2ff 0%, #f0f9ff 52%, #faf5ff 100%);
  border: 1px solid #dbe4ff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}
/* 后测引导页：紫色系变体（与 fpb-post 徽章呼应） */
.fe-intro-root.fe-intro-post {
  background:
    radial-gradient(circle at 12% 16%, rgba(139,92,246,.12) 0%, rgba(139,92,246,0) 40%),
    radial-gradient(circle at 88% 84%, rgba(236,72,153,.10) 0%, rgba(236,72,153,0) 40%),
    linear-gradient(135deg, #faf5ff 0%, #fdf4ff 52%, #f5f3ff 100%);
  border-color: #e9d8ff;
}
.fe-intro-card { display: flex; flex-direction: column; align-items: center; }
.fe-intro-card .flip-phase-badge { margin-bottom: 20px; }
.fe-intro-card .flip-btn-row { margin-top: 4px; }
/* ② 信息胶囊行（课本页码 / 阅读时长 / 题数） */
.fe-book-pills { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin: 0 0 26px; }
.fe-pill {
  display: inline-flex; align-items: center; white-space: nowrap;
  font-size: 17px; font-weight: 800; color: #1e40af;
  padding: 9px 20px; margin: 0 8px 10px; border-radius: 999px;
  background: linear-gradient(180deg, #ffffff, #f0f6ff);
  border: 1px solid #bfd7ff;
  box-shadow: 0 3px 10px rgba(59,130,246,.14);
}
.fe-intro-post .fe-pill { color: #6d28d9; background: linear-gradient(180deg, #ffffff, #f7f2ff); border-color: #ddc9ff; box-shadow: 0 3px 10px rgba(139,92,246,.14); }
/* ③ 题页顶部读书提示条（常驻："先读书：课本第 X 页"；v4 放大为大标题条） */
.fe-book-strip {
  font-size: 24px; font-weight: 800; color: #1e40af; text-align: center;
  padding: 14px 22px; margin-bottom: 18px; border-radius: 14px;
  background: linear-gradient(90deg, #dbeafe 0%, #e0e7ff 55%, #ede9fe 100%);
  border: 1px solid #c7d2fe;
}
/* ④ 逐题解锁锁定卡（学生自学场景：做完上一题才解锁本题） */
.fe-locked {
  text-align: center; padding: 46px 30px 40px; border-radius: 18px;
  background: linear-gradient(180deg, #f8faff, #f2f6ff);
  border: 3px dashed #c7d2fe;
}
.fe-locked-ico { font-size: 64px; line-height: 1; margin-bottom: 18px; }
.fe-locked-title { font-size: 23px; font-weight: 900; color: #3730a3; margin-bottom: 10px; }
.fe-locked-txt { font-size: 16px; color: #64748b; line-height: 1.7; margin-bottom: 22px; }
/* ⑤ 题页根容器升级：整卡浅渐变底（原为无背景白卡）；分栏（教师学情）模式保持透明免双重底 */
.fe-root {
  padding: 24px 28px; border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #f8faff 100%);
  border: 1px solid #e3ecff;
  box-shadow: 0 6px 22px rgba(30,58,138,.06);
}
.wp-root.fe-split { padding: 0; background: none; border: none; box-shadow: none; border-radius: 0; }
/* ⑥ 题头（v4：去进度圆点/知识点标签，仅保留"前测 · 第 X 题 / 共 Y 题"胶囊并放大） */
.fe-head .fe-no { font-size: 20px; padding: 9px 24px; }
/* ⑦ v4 布局：学生视角（无教师学情分栏）内容整体垂直居中于课件——
      去掉 flex-grow 让 L9784/9785 的首/末子元素 auto margin 生效（空间不足时自动归零不裁切） */
.wp-root.fe-root:not(.fe-split) > .fe-main { flex: 0 1 auto; }
/* ⑧ v4 "下一题"按钮行：答对本题后出现，点击跳出下一道题 */
.fe-next-row { text-align: center; margin: 20px 0 4px; }
.fe-next-btn { font-size: 23px; padding: 15px 46px; }
.fe-next-done {
  display: inline-block; font-size: 21px; font-weight: 800; color: #15803d;
  padding: 12px 30px; border-radius: 999px;
  background: linear-gradient(135deg, #f0fdf4, #dcfce7); border: 1px solid #86efac;
}
/* ⑨ 底部说明文案（v4 放大） */
.fe-foot { margin-top: 18px; text-align: center; font-size: 20px; color: #94a3b8; font-weight: 600; }

/* —— 教师端学情面板（2026-09-29 v4 投屏版：450px 加宽 + 字号整体放大一档，
       教师/投屏全班均能看清；Chromium 78 兼容，无 gap）—— */
.tm-live { margin: 0; border-radius: 16px; overflow: hidden; text-align: left;
  background: linear-gradient(160deg, #1e3a8a, #3730a3); color: #fff;
  box-shadow: 0 10px 28px rgba(30, 58, 138, .38); }
.tm-live-bar { display: flex; align-items: center; justify-content: space-between; padding: 16px 22px;
  background: rgba(255, 255, 255, .06); border-bottom: 1px solid rgba(255, 255, 255, .14); }
.tm-live-tag { display: inline-block; padding: 6px 18px; white-space: nowrap;
  background: rgba(255, 255, 255, .18); border: 1px solid rgba(255, 255, 255, .38);
  border-radius: 999px; font-size: 22px; font-weight: 800; }
.tm-live-total { font-size: 18px; font-weight: 700; opacity: .9; white-space: nowrap; }
.tm-live-body { padding: 18px 22px 20px; }
.tm-live-meta { font-size: 19px; font-weight: 600; opacity: .98; line-height: 2; margin-bottom: 16px; }
.tm-live-meta b { font-size: 27px; color: #fde68a; padding: 0 3px; }
.tm-live-meta b.tfl-err { color: #fca5a5; }
.tm-rows { text-align: left; }
.tm-row { display: flex; align-items: center; width: 100%; box-sizing: border-box;
  padding: 13px 14px; margin: 0 0 12px; border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, .28); background: rgba(255, 255, 255, .10);
  cursor: pointer; font-family: inherit; color: #fff; }
.tm-row:hover { background: rgba(255, 255, 255, .20); }
.tm-row.on { border-color: #fff; box-shadow: 0 0 0 2px rgba(255, 255, 255, .30); }
.tm-row.ok { border-color: #4ade80; }
.tm-row.ok .tm-row-key { background: rgba(74, 222, 128, .30); border-color: #4ade80; color: #dcfce7; }
.tm-row.na { border-color: rgba(251, 191, 36, .55); }
.tm-row.na .tm-row-key { background: rgba(251, 191, 36, .25); border-color: #fbbf24; color: #fde68a; }
.tm-row-key { display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; min-width: 38px; border-radius: 9px; margin-right: 14px;
  background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .35);
  font-size: 20px; font-weight: 800; }
.tm-row-track { flex: 1 1 auto; height: 16px; border-radius: 8px; background: rgba(255, 255, 255, .14);
  overflow: hidden; margin-right: 14px; }
.tm-row-fill { display: block; height: 100%; border-radius: 8px;
  background: linear-gradient(90deg, #60a5fa, #a78bfa); transition: width .3s; }
.tm-row-fill.zero { background: transparent; }
.tm-row.ok .tm-row-fill { background: linear-gradient(90deg, #34d399, #86efac); }
.tm-row.na .tm-row-fill { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.tm-row-n { font-size: 19px; font-weight: 800; white-space: nowrap; min-width: 76px; text-align: right; }
.tm-live-names { margin-top: 6px; font-size: 18px; font-weight: 600; line-height: 2; color: #f1f5f9;
  border-top: 1px solid rgba(255, 255, 255, .18); padding-top: 14px; }
.tm-live-names b { color: #fde68a; padding: 0 3px; }
.tm-live-names.na b { color: #fca5a5; }
.tm-names-line { font-weight: 700; }
.tm-live-tip { margin-top: 4px; font-size: 16px; font-weight: 600; opacity: .8; text-align: center; }

/* ===========================================================
 * 低分屏字号保底（html.zoom-fix · r151）
 * 背景：机房学生机多为 1366×768 / 1440×900 低分屏，整页 zoom≈0.71~0.75，
 *       地图卡片小字实际渲染仅 8~10px，中文笔画发糊看不清。
 * 方案：由 学生端.html fitScreen 在 zoom 档位 <0.92 时给 <html> 加 .zoom-fix
 *       并注入 --zoom；这里用 calc(目标px / var(--zoom)) 反向放大布局字号，
 *       保证缩放后"实际渲染像素"≥ 中文可读下限（约 13px）。
 *       min() 限制放大上限，防止极端窄屏撑破卡片；1080p 及以上不生效。
 * 兼容：min/max 内嵌 calc 需 Chromium 79+（360 极速内核 86+ 满足）。
 * =========================================================== */
/* 单元卡片：标题 / 介绍 / 副标题 */
html.zoom-fix .island-name { font-size: min(calc(22px * 1.30), max(22px, calc(17px / var(--zoom, 1)))); }
html.zoom-fix .island-intro { font-size: min(calc(12px * 1.60), max(12px, calc(13px / var(--zoom, 1)))); }
html.zoom-fix .island-sub { font-size: min(calc(12px * 1.60), max(12px, calc(13.5px / var(--zoom, 1)))); }
/* 任务徽章：编号 / 标题 / 状态 */
html.zoom-fix .lesson-tile .lt-num { font-size: min(calc(13px * 1.55), max(13px, calc(13.5px / var(--zoom, 1)))); }
html.zoom-fix .lesson-tile .lt-title { font-size: min(calc(14px * 1.45), max(14px, calc(14.5px / var(--zoom, 1)))); }
html.zoom-fix .lesson-tile .lt-state { font-size: min(calc(12.5px * 1.55), max(12.5px, calc(13.5px / var(--zoom, 1)))); }
/* 顶部状态标签 / 进度文字 */
html.zoom-fix .island-unit-tag { font-size: min(calc(12.5px * 1.55), max(12.5px, calc(13.5px / var(--zoom, 1)))); }
html.zoom-fix .island-state-tag { font-size: min(calc(11.5px * 1.60), max(11.5px, calc(13px / var(--zoom, 1)))); }
html.zoom-fix .unit-progress-text { font-size: min(calc(12px * 1.60), max(12px, calc(12.5px / var(--zoom, 1)))); }
/* 顶栏小字：星星胶囊 / 行为分胶囊（轻度补偿到实际 ≥13px） */
html.zoom-fix .star-chip { font-size: min(calc(13px * 1.45), max(13px, calc(13px / var(--zoom, 1)))); }
html.zoom-fix .pill-beh-me { font-size: min(calc(13.5px * 1.45), max(13.5px, calc(13px / var(--zoom, 1)))); }
/* 欢迎提示弹窗文字 */
html.zoom-fix .greeting-copy { font-size: min(calc(13px * 1.55), max(13px, calc(14px / var(--zoom, 1)))); }
html.zoom-fix .greeting-copy strong { font-size: min(calc(15px * 1.45), max(15px, calc(15.5px / var(--zoom, 1)))); }
/* 补偿后卡片内边距微调，保证文字不贴边 */
html.zoom-fix .lesson-tile { padding: 7px 9px 6px; }
html.zoom-fix .island-main { padding: 13px 14px 13px; }

/* ===================== v259 授课界面图标全量内联 SVG 化（Server 2008R2 教师机系统字体缺 ⏱🖌🟢🗑🧰🧽🖱🖼🗓 等 2014 年后新增字形，emoji 显示为方框/空白；继 tm2-ico 之后覆盖授课工具栏/画笔条/答题实况/各视图，纯矢量不依赖字体） ===================== */
.tmsvg { width: 1em; height: 1em; vertical-align: -0.15em; -webkit-flex: none; flex: none; }
.tmsvg.tx { margin-right: 0.24em; }
/* 授课工具栏大图标：块级居中并随 27px 字号放大 */
.tmtb-ico .tmsvg { display: block; width: 1.15em; height: 1.15em; margin: 0 auto; }
.tmtb-fold-ico .tmsvg { display: block; width: 1.18em; height: 1.18em; margin: 0 auto; }
/* 状态圆点替代 🟢/🟠：纯 CSS 绘制，任何系统字体环境都可见 */
.dot-g, .dot-o { display: inline-block; width: 0.58em; height: 0.58em; border-radius: 50%; margin-right: 0.32em; vertical-align: 0.06em; -webkit-flex: none; flex: none; }
.dot-g { background: #22c55e; box-shadow: 0 0 0.35em rgba(34,197,94,0.85); }
.dot-o { background: #fb923c; box-shadow: 0 0 0.35em rgba(251,146,60,0.85); }

/* ============================================================
   教师端侧栏 · 精美图标升级（2026-09-30）
   emoji → 统一 2px 线性内联 SVG：不依赖系统 emoji 字体（机房教师机
   Server 2008R2 字体缺字形显示空白方框，同 v259 授课界面 SVG 化理由）
   每模块专属色玻璃徽章：淡染渐变底 + 同色描边圈 + 顶部一线高光；
   悬停微亮上浮；选中态变白色玻璃徽章、图标转白
   兼容 Chromium 78（360极速）：不用 color-mix / inset 简写
   ============================================================ */
body.is-teacher .sidebar .nav-item .ni-ico svg { display: block; width: 1.45em; height: 1.45em; }

/* —— 工作台 —— */
body.is-teacher .sidebar .nav-item .ni-ico.ni-sky     { color: #38bdf8; background: linear-gradient(135deg, rgba(56,189,248,.30), rgba(56,189,248,.10)); box-shadow: inset 0 0 0 1px rgba(56,189,248,.32), inset 0 1px 0 rgba(186,230,253,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-cyan    { color: #22d3ee; background: linear-gradient(135deg, rgba(34,211,238,.30), rgba(34,211,238,.10)); box-shadow: inset 0 0 0 1px rgba(34,211,238,.32), inset 0 1px 0 rgba(165,243,252,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-emerald  { color: #34d399; background: linear-gradient(135deg, rgba(52,211,153,.30), rgba(52,211,153,.10)); box-shadow: inset 0 0 0 1px rgba(52,211,153,.32), inset 0 1px 0 rgba(167,243,208,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-violet  { color: #a78bfa; background: linear-gradient(135deg, rgba(167,139,250,.30), rgba(167,139,250,.10)); box-shadow: inset 0 0 0 1px rgba(167,139,250,.32), inset 0 1px 0 rgba(221,214,254,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-amber   { color: #fbbf24; background: linear-gradient(135deg, rgba(251,191,36,.30), rgba(251,191,36,.10)); box-shadow: inset 0 0 0 1px rgba(251,191,36,.32), inset 0 1px 0 rgba(253,230,138,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-pink    { color: #f472b6; background: linear-gradient(135deg, rgba(244,114,182,.30), rgba(244,114,182,.10)); box-shadow: inset 0 0 0 1px rgba(244,114,182,.32), inset 0 1px 0 rgba(251,207,232,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-orange  { color: #fb923c; background: linear-gradient(135deg, rgba(251,146,60,.30), rgba(251,146,60,.10)); box-shadow: inset 0 0 0 1px rgba(251,146,60,.32), inset 0 1px 0 rgba(254,215,170,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-green   { color: #4ade80; background: linear-gradient(135deg, rgba(74,222,128,.30), rgba(74,222,128,.10)); box-shadow: inset 0 0 0 1px rgba(74,222,128,.32), inset 0 1px 0 rgba(187,247,208,.28); }
/* —— 课程 —— */
body.is-teacher .sidebar .nav-item .ni-ico.ni-rose     { color: #fb7185; background: linear-gradient(135deg, rgba(251,113,133,.30), rgba(251,113,133,.10)); box-shadow: inset 0 0 0 1px rgba(251,113,133,.32), inset 0 1px 0 rgba(254,205,211,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-teal    { color: #2dd4bf; background: linear-gradient(135deg, rgba(45,212,191,.30), rgba(45,212,191,.10)); box-shadow: inset 0 0 0 1px rgba(45,212,191,.32), inset 0 1px 0 rgba(153,246,228,.28); }
/* —— 班级 —— */
body.is-teacher .sidebar .nav-item .ni-ico.ni-blue     { color: #60a5fa; background: linear-gradient(135deg, rgba(96,165,250,.30), rgba(96,165,250,.10)); box-shadow: inset 0 0 0 1px rgba(96,165,250,.32), inset 0 1px 0 rgba(191,219,254,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-yellow  { color: #facc15; background: linear-gradient(135deg, rgba(250,204,21,.30), rgba(250,204,21,.10)); box-shadow: inset 0 0 0 1px rgba(250,204,21,.32), inset 0 1px 0 rgba(254,240,138,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-indigo  { color: #818cf8; background: linear-gradient(135deg, rgba(129,140,248,.30), rgba(129,140,248,.10)); box-shadow: inset 0 0 0 1px rgba(129,140,248,.32), inset 0 1px 0 rgba(199,210,254,.28); }
body.is-teacher .sidebar .nav-item .ni-ico.ni-fuchsia { color: #e879f9; background: linear-gradient(135deg, rgba(232,121,249,.30), rgba(232,121,249,.10)); box-shadow: inset 0 0 0 1px rgba(232,121,249,.32), inset 0 1px 0 rgba(245,208,254,.28); }
/* —— 系统 —— */
body.is-teacher .sidebar .nav-item .ni-ico.ni-purple   { color: #c084fc; background: linear-gradient(135deg, rgba(192,132,252,.30), rgba(192,132,252,.10)); box-shadow: inset 0 0 0 1px rgba(192,132,252,.32), inset 0 1px 0 rgba(233,213,255,.28); }

/* —— 交互态（置于专属色规则之后确保覆盖）：悬停微亮上浮；选中变白色玻璃、图标转白 —— */
body.is-teacher .sidebar .nav-item:hover .ni-ico { filter: brightness(1.16) saturate(1.1); transform: translateY(-1px); }
body.is-teacher .sidebar .nav-item.active .ni-ico { color: #ffffff; background: linear-gradient(135deg, rgba(255,255,255,.38), rgba(255,255,255,.16)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.45), inset 0 1px 0 rgba(255,255,255,.30); filter: none; transform: none; }
/* 退出按钮 svg 与文字间距（按钮为 flex 居中，svg 为行内子项） */
.sidebar-logout .tb svg { flex: none; }

/* ===== 屏蔽「豆包修图回传」油猴脚本左下角状态弹窗（用户要求永久隐藏 2026-10-06）===== */
#db-er-pill,
div[style*="left:20px"][style*="bottom:20px"][style*="2147483646"] { display: none !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }