/* ===========================================================
 * 七年级信息科技教学评测平台 — 样式
 * 默认：学生端 浅色明亮大气风
 * 教师端：加 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-pink:   linear-gradient(135deg, #ff7a45 0%, #ff5e8a 100%);
  --title-orange: linear-gradient(95deg, #ff7a45 0%, #ff9a6b 60%, #ffb487 100%);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: "PingFang SC", "Microsoft YaHei", 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); }

.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; }

/* 胶囊导航 */
.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: #FFE7D6;
  border-color: #FF8A5C;
  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: #FFB594; }
.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); color: var(--text-secondary);
}
.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; }
}
@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: var(--surface);
  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 切换）
 * 复刻苏科版教师端：#f0f4ff 页面底 + 白色面板 + 橙色点缀
 * =========================================================== */
body.is-teacher {
  background: #f0f4ff;
  color: #2d3748;
}
body.is-teacher .bg-deco, body.is-teacher .cloud-layer { display: none; }
body.is-teacher {
  --bg-page: #f0f4ff;
  --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, #ff8a5c, #ff6b35); 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: #ff6b35; 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, #ff8a5c, #ff6b35); 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, #ff8a5c, #ff6b35); color: #ffffff; font-weight: 700; box-shadow: 0 4px 14px rgba(255,107,53,.38); }
body.is-teacher .nav-item.active:hover { background: linear-gradient(135deg, #ff8a5c, #ff6b35); 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: #fff1ea; font-size: 13px; line-height: 1; flex-shrink: 0; transition: .12s; }
body.is-teacher .nav-item:hover .ni-ico { background: #ffe2d3; }
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; }
/* 顶部栏（借鉴苏科版教师端：左面包屑 + 右模块标签/在线状态/学生视角） */
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: #ff6b35; }
body.is-teacher .main-topbar .tab-btn.active { background: #ffffff; color: #ff6b35; 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: #ff6b35; }
@keyframes t-conn-blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
body.is-teacher .topbar .tb { background: #ffffff; border: 1px solid #ff6b35; border-radius: 999px; padding: 7px 16px; color: #ff6b35; font-size: 13px; font-weight: 600; cursor: pointer; }
body.is-teacher .topbar .tb.active { background: #ff6b35; color: #ffffff; }
body.is-teacher .topbar .tb:hover { background: #fff3ed; }
/* 侧边栏底部退出按钮与菜单字号保持一致 */
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", 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: #ff8f5e; }
body.is-teacher .dash-view .select-wrap select:focus { border-color: #ff6b35; box-shadow: 0 0 0 3px #fff3ed; 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: #f0f4ff; 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 #ff6b35; }
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-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: #ff6b35; 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; }
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-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: #ff6b35; border-color: #ff6b35; 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; }
@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(4, 1fr); gap: 16px; margin-bottom: 16px; }
@media (max-width: 1200px) { body.is-teacher .live-view .live-stats-row { grid-template-columns: repeat(2, 1fr); } }
body.is-teacher .live-view .live-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 20px 14px; }
@media (max-width: 1500px) { body.is-teacher .live-view .live-grid { grid-template-columns: repeat(5, 1fr); } }
@media (max-width: 1100px) { body.is-teacher .live-view .live-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 760px) { body.is-teacher .live-view .live-grid { grid-template-columns: repeat(2, 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 #ff6b35 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; 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; 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: #fff0e6; color: #ea580c; }
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; }
/* 学生卡右上角"正在上课"绿色脉冲角标 */
body.is-teacher .live-view .sc-online-pin { position: absolute; top: 9px; right: 9px; color: #22c55e; font-size: 14px; line-height: 1; animation: seat-pulse 1.6s ease-in-out infinite; text-shadow: 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; }
body.is-teacher .live-view .sc-behavior { display: flex; gap: 6px; }
body.is-teacher .live-view .behavior-btn { flex: 1; 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 .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, #ff8a4c, #ff714d); 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(180px, 1fr)); gap: 8px; }
body.is-teacher .live-view .stu-status-row { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 10px; 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: #fff5f5; border-color: #fed7d7; }
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-dot { font-size: 12px; line-height: 1; }
body.is-teacher .live-view .stu-status-row .stu-dot.online { color: #10b981; }
body.is-teacher .live-view .stu-status-row .stu-dot.offline { color: #ef4444; }
body.is-teacher .live-view .stu-status-row .stu-seat { font-size: 12px; color: #6b7280; min-width: 36px; }
body.is-teacher .live-view .stu-status-row .stu-name { font-weight: 600; color: #1f2937; flex: 1; }
body.is-teacher .live-view .stu-status-row .stu-state { font-size: 12px; color: #6b7280; }
body.is-teacher .live-view .stu-status-row.missing .stu-state { color: #b91c1c; font-weight: 700; }
body.is-teacher .live-view .stu-status-row.online .stu-state { color: #047857; }
body.is-teacher .live-view .stu-status-row .stu-ago { font-size: 11px; color: #9ca3af; }
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: #fff3ed; color: #ff6b35; 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: #fff3ed; }
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: #fff3e0; border-color: #ffb74d; color: #e65100; }
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, #ff6b35, #ff9b74); }
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, #ff6b35, #ff9b74); }
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: #f0f4ff; 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: #ff8f5e; }
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: #ff6b35; border-color: #ff6b35; 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; }

/* —— 课后报告 · 报告详情卡（1:1 复刻苏科版） —— */
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, #ff8f5e, #ff6b35); color: #fff; font-size: 26px; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 16px rgba(255,107,53,.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: #ff6b35; }
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: #ff8f5e; color: #ff6b35; }
body.is-teacher .rpt-btn-csv:disabled { opacity: .55; cursor: not-allowed; }
body.is-teacher .rpt-btn-print { border: none; background: #ff6b35; 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(255,107,53,.3); }
body.is-teacher .rpt-btn-print:hover { background: #ef5a22; }
/* 学生表现表（复用 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: 17px !important; font-weight: 800; color: #31405e; background: linear-gradient(180deg, #f7fafe, #eef3fb); padding: 14px 16px; text-align: left; letter-spacing: .5px; border-bottom: 2px solid #ffd9c4; white-space: nowrap; box-shadow: inset 0 -3px 0 #ff6b35; }
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: right; font-variant-numeric: tabular-nums; }
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-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, #ff8f5e, #ff6b35); color: #fff; font-size: 22px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 3px 8px rgba(255,107,53,.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; 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: #ff6b35; }
body.is-teacher .rpt-banner { margin-top: 16px; background: #fff7f2; border: 1px solid #ffe0d1; 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; }
/* 历史会话：当前查看的会话行高亮 */
body.is-teacher .report-table tr.hist-active td { background: #fff7f2; }
/* 打印：仅输出报告详情卡 */
@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: #ff6b35; 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.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); }
/* 地图顶栏：教师模式徽章 */
.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-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: var(--text-muted); }

/* 册色映射：与 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; }

/* ===== 教师端课堂控制条（复刻苏科版 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, #ff6b35, #ff8f5e);
  color: #fff;
  box-shadow: 0 4px 20px rgba(255,107,53,.25);
}
.teacher-class-btn.start:hover { background: linear-gradient(135deg, #f96a3d, #ff9b74); }
.teacher-class-btn.end {
  background: #e74c3c;
  color: #fff;
}
.teacher-class-btn.end:hover { background: #c0392b; }
.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: #ff6b35; box-shadow: 0 0 0 3px rgba(255,107,53,.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: #d35400; }
body.is-teacher .dd-book.open .dd-tw { color: #ff6b35; }
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: #fff6ef; color: #2d3748; }
body.is-teacher .dd-lesson.cur { background: #fff0e6; color: #d35400; 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: #ff9a62; }
body.is-teacher .dd-check { flex: none; font-size: 11px; font-weight: 700; color: #ff6b35; 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; }
/* 阅读材料小图 */
.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%, #ff8a52 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: #d35400;
  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; }
.unit-progress-text { font-size: 11.5px; color: var(--text-muted); margin-top: 4px; font-weight: 600; }
/* 岛屿底座（椭圆阴影） */
.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), #ff9068);
  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;
}

.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 {
  /* 锁定态也保留淡淡单元色，避免四个版块全白；用更厚的白罩+降饱和表示未解锁 */
  background: linear-gradient(180deg, rgba(255,255,255,0.90), rgba(255,255,255,0.95)), var(--u-color);
  opacity: 0.9;
  filter: saturate(0.55);
}
.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: #1e8449;
  border-color: rgba(39,174,96,0.35);
}
.tag-locked {
  background: #f1f3f8;
  color: #8993a8;
  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;
}
/* 当前学习单元：标题染单元色，一眼锁定 */
.unit-island.current .island-name {
  color: color-mix(in srgb, var(--u-color) 78%, #14213d);
}
.island-intro {
  font-size: 12px;
  color: #2c3a52;
  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;
  --tile-color: #5a688a;
  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);
}

/* 状态：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;
  box-shadow: 0 3px 8px rgba(30,50,90,0.18);
}
/* ready 状态文字用深色，避免金色/绿色单元色在浅底上看不清 */
.lesson-tile.ready .lt-state {
  color: #3d4a66;
}
.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;
}
/* 当前任务：白字压在实色渐变上，加投影保证可读性 */
.lesson-tile.current .lt-title { color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,0.45), 0 0 1px rgba(0,0,0,0.3); }
.lesson-tile.current .lt-state { color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,0.4), 0 0 1px rgba(0,0,0,0.25); }
.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;
  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 已完成 */
.lesson-tile.done {
  --tile-bg: rgba(39,174,96,0.12);
  --tile-bd: rgba(39,174,96,0.4);
  --tile-color: #1e8449;
}
.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 锁定 */
.lesson-tile.locked {
  --tile-bg: #eef2f9;
  --tile-bd: #dde3ee;
  --tile-color: #5a6888;
  cursor: not-allowed;
  opacity: 0.85;
}
.lesson-tile.locked::before { background: #dde3ee; }
.lesson-tile.locked .lt-title { color: #5a6888; }

/* 单元进度 */
.unit-progress { width: 100%; margin-top: 2px; 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(255,107,53,.10), transparent 60%),
    radial-gradient(720px 480px at 8% 88%, rgba(78,205,196,.08), transparent 55%),
    #f0f4ff;
}
.t-grid {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background-image:
    linear-gradient(rgba(255,107,53,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,107,53,.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(255,107,53,.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 1fr; 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;
}
.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: #ff6b35; }

/* 右侧登录卡 */
.t-login-card {
  position: relative;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 24px;
  padding: 46px 44px 40px;
  box-shadow: 0 24px 60px rgba(15,23,42,.15), inset 0 1px 0 rgba(255,255,255,.8);
  overflow: hidden;
}
.t-login-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,107,53,.5), rgba(79,140,255,.5), transparent);
}
.t-lc-tag {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,107,53,.08); border: 1px solid rgba(255,107,53,.30);
  color: #ff6b35; font-size: 14px; font-weight: 700;
  padding: 6px 14px; border-radius: 999px;
  margin-bottom: 20px; letter-spacing: .5px;
}
.t-lc-title { color: #2d3748; font-size: 34px; font-weight: 800; margin-bottom: 8px; letter-spacing: 1px; }
.t-lc-sub { color: #5a6b7f; font-size: 17px; margin-bottom: 32px; }
.t-lc-field { margin-bottom: 22px; }
.t-lc-field label { display: block; color: #5a6b7f; font-size: 15px; font-weight: 600; margin-bottom: 10px; letter-spacing: .3px; }
.t-lc-field input {
  width: 100%; padding: 16px 20px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px; color: #2d3748; font-size: 18px;
  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: 52px; }
.pwd-eye {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  width: 42px; height: 42px; border-radius: 9px;
  border: 0; background: transparent; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 19px; 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: #b45309;
  background: #fff7ed; border: 1px solid #fed7aa;
  border-radius: 8px;
  display: inline-flex; align-items: center; gap: 5px;
}
.caps-tip span { font-size: 13px; }

.t-lc-btn {
  width: 100%; padding: 18px 24px;
  background: linear-gradient(95deg, #4f8cff 0%, #46c8e0 100%);
  color: #fff; font-size: 19px; font-weight: 800;
  border-radius: 12px; border: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin-top: 10px; 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: 22px; padding: 12px 14px;
  background: rgba(255,107,53,.05); border: 1px dashed rgba(255,107,53,.30);
  border-radius: 10px; color: #b45309; font-size: 13px;
  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; } }

.t-lc-foot { text-align: center; margin-top: 22px; color: #a0aec0; font-size: 14px; }

/* 响应式：窄屏上下排 */
@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: 36px 28px 30px; }
}
/* 中等屏：标题缩回一档，防止换行 */
@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; }
}

/* ===========================================================
 * 教师端 · 复刻苏科版 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: #f0f4ff; color: #2d3748; }
body.is-teacher .btn-primary { background: linear-gradient(135deg, #ff6b35, #ff8f5e); 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: #ff6b35; 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: #ff6b35; background: #fff; border-color: #ffe4d4; box-shadow: 0 1px 3px rgba(255,107,53,.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, #ff8a4a 0%, #ff6b35 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: #fafbfd; padding: 12px 14px; font-size: 12px; font-weight: 600; color: #5a6b7f; text-align: left; border-bottom: 1px solid #edf2f7; }
body.is-teacher .tc-table td { padding: 12px 14px; border-bottom: 1px solid #f3f4f6; color: #2d3748; text-align: left; }
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）
   结构：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 各软件内页）
 * =========================================================== */
.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(255,107,53,.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: #ff6b35; }

/* 自由练习表格列宽 */
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: #fff3eb; color: #ff6b35; 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: #ff6b35; 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: #ffb38a; color: #fff;
  box-shadow: 0 1px 2px rgba(255,107,53,.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: #fef3c7; color: #b45309; }

/* 完成率进度条（计算机基础 / 软件操作） */
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: #ffb38a; color: #fff;
  box-shadow: 0 1px 2px rgba(255,107,53,.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: #ff6b35; }

/* ===========================================================
 * 试卷测验（.pa-root）—— 复刻苏科版 09-教师端-试卷测验.png
 * =========================================================== */
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,#ff7a45,#ff6b35); padding: 15px 16px; font-size: 14px; font-weight: 800; color: #fff; text-align: center; border-bottom: 1px solid #ff6b35; 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: #fff8f4; }

/* 列宽控制 */
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: #fff3e8; color: #d35400; border: 1px solid #ffc7a0; }
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: #ff6b35; color: #ff6b35; background: #fff8f4; }
body.is-teacher .pa-btn-primary-outline { border-color: #ff6b35; color: #ff6b35; background: #fff; }
body.is-teacher .pa-btn-primary-outline:hover { background: #fff3e8; }

/* 空状态 */
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 #ff6b35; }

/* 成绩网格 */
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: #ff6b35; box-shadow: 0 0 0 3px rgba(255,107,53,.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: #ff6b35; box-shadow: 0 0 0 3px rgba(255,107,53,.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: #ff6b35; box-shadow: 0 0 0 3px rgba(255,107,53,.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: #ff6b35; }
body.is-teacher .pm-q-tools { display: flex; gap: 14px; }
body.is-teacher .pm-tool { border: none; background: none; color: #ff6b35; font-size: 13px; font-weight: 600; cursor: pointer; padding: 0; font-family: inherit; }
body.is-teacher .pm-tool:hover { color: #e55a27; }
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: #ff6b35; box-shadow: 0 0 0 3px rgba(255,107,53,.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: #ff6b35; box-shadow: 0 0 0 3px rgba(255,107,53,.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: #ff6b35; }
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: #ff6b35; color: #ff6b35; background: #fff8f4; }
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: #ff6b35; }
body.is-teacher .pm-mode-tab.active { color: #ff6b35; border-bottom-color: #ff6b35; }
/* AI 生成面板 */
body.is-teacher .pm-ai-panel { background: linear-gradient(135deg, #fff8f4 0%, #fef6ff 100%); border: 1px solid #ffe4d6; 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: #ff6b35; box-shadow: 0 0 0 3px rgba(255,107,53,.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: #ff6b35; }
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: #ff6b35; }
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: #ffd9c4; 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: #ffd9c4; 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: #f0f4ff; color: #2d3748; border-color: #c8d6f5; }
body.is-teacher .wk-btn-primary { background: linear-gradient(135deg, #ff6b35, #ff8f5e); color: #fff; box-shadow: 0 4px 20px rgba(255,107,53,.25); }
body.is-teacher .wk-btn-primary:hover { box-shadow: 0 6px 24px rgba(255,107,53,.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: #ff8f5e; }
body.is-teacher .wk-card-thumb { aspect-ratio: 4/3; display: flex; align-items: center; justify-content: center; position: relative; background: linear-gradient(135deg, #f0f4ff 0%, #fff5f0 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: #ff6b35; 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-*）—— 1:1 复刻苏科版学期报告页
 * =========================================================== */
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, #ff6b35, #ff8f5e); 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(255,107,53,.25); transition: .12s; }
body.is-teacher .sem-btn-export:hover { box-shadow: 0 6px 24px rgba(255,107,53,.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: 14px; margin-bottom: 14px; font-weight: 700; color: #2d3748; }
body.is-teacher .tw-grid { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 24px; }
body.is-teacher .tw-item label { font-size: 12px; color: #5a6b7f; margin-bottom: 6px; font-weight: 600; 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: 72px; font-size: 15px; text-align: center; padding: 8px 10px; font-weight: 700; color: #2d3748; font-family: inherit; background: #fff; transition: .12s; }
body.is-teacher .tw-input input:hover:not(:disabled) { border-color: #ff8f5e; }
body.is-teacher .tw-input input:focus:not(:disabled) { border-color: #ff6b35; box-shadow: 0 0 0 3px #fff3ed; outline: none; }
body.is-teacher .tw-input input:disabled { background: #f5f7fa; color: #2d3748; cursor: default; }
body.is-teacher .tw-input span { font-size: 13px; color: #5a6b7f; font-weight: 500; }
body.is-teacher .tw-sum { border-radius: 999px; font-size: 12.5px; background: #e8f8ef; color: #27ae60; padding: 6px 14px; font-weight: 700; }
body.is-teacher .tw-sum.bad { background: #fdecec; color: #e74c3c; }
body.is-teacher .tw-edit-text { margin-left: auto; border: none; background: none; padding: 6px 12px; font-size: 13px; font-weight: 600; color: #a0aec0; cursor: pointer; font-family: inherit; transition: .12s; border-radius: 8px; }
body.is-teacher .tw-edit-text:hover { background: #f0f4ff; color: #ff6b35; }
body.is-teacher .tw-edit-text.active { color: #ff6b35; }
body.is-teacher .tw-hint { font-size: 12px; color: #a0aec0; 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: #ff8f5e; box-shadow: 0 2px 10px rgba(255,107,53,.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: #ff6b35; box-shadow: 0 0 0 2px rgba(255,107,53,.18); background: #fff7f2; }
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: #ff6b35; }
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, #ff8f5e, #ff6b35); transition: width .3s; }
body.is-teacher .rep-total { display: flex; justify-content: space-between; align-items: center; background: #fff7f2; border: 1px solid #ffe0d1; 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: #ff6b35; 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 #ff6b35; color: #ff6b35; 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: #f0f4ff; color: #5a6b7f; border-radius: 999px; padding: 7px 16px; font-size: 13px; font-weight: 600; cursor: pointer; }
body.is-teacher .vol-chip.active { background: #ff6b35; border-color: #ff6b35; color: #fff; box-shadow: 0 4px 20px rgba(255,107,53,.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: #f0f4ff; 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 .week-rail { display: flex; flex-direction: column; flex-shrink: 0; width: 296px; background: #fff; border-right: 1px solid #e2e8f0; }
body.is-teacher .rail-head { display: flex; justify-content: space-between; align-items: baseline; padding: 14px 16px 10px; border-bottom: 1px solid #edf2f7; }
body.is-teacher .rail-head b { font-size: 14px; color: #2d3748; }
body.is-teacher .rail-head span { font-size: 11px; color: #a0aec0; }
body.is-teacher .week-list { flex: 1; padding: 8px; overflow-y: auto; }
body.is-teacher .week-row { display: flex; align-items: center; gap: 10px; width: 100%; margin-bottom: 2px; padding: 8px 10px; border-radius: 16px; border: 1px solid transparent; cursor: pointer; background: transparent; font-family: inherit; text-align: left; transition: background .15s, border-color .15s; }
body.is-teacher .week-row:hover { background: #f7f9fc; }
body.is-teacher .week-row.selected, body.is-teacher .week-row.selected:hover { background: #fff3ed; border-color: #ff6b35; }
body.is-teacher .week-row.special { background: #fffbe6; }
body.is-teacher .week-row.special:hover { background: #fff4cf; }
body.is-teacher .week-row.special.selected, body.is-teacher .week-row.special.selected:hover { border-color: #f0c94a; }
body.is-teacher .wk-no { min-width: 34px; padding: 3px 6px; font-size: 10.5px; font-weight: 800; border-radius: 6px; background: #f0f4ff; color: #5a6b7f; text-align: center; }
body.is-teacher .wk-title { display: block; font-size: 12.5px; font-weight: 600; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #2d3748; flex: 1; }
body.is-teacher .wk-side { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
body.is-teacher .wk-hours { font-size: 10.5px; color: #5a6b7f; }
body.is-teacher .wk-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; background: #e2e8f0; }
body.is-teacher .wk-dot.on { background: #27ae60; box-shadow: 0 0 0 3px #e8f8ef; }
body.is-teacher .rail-legend { display: flex; gap: 14px; padding: 10px 16px; font-size: 11px; border-top: 1px solid #edf2f7; color: #5a6b7f; }
body.is-teacher .rail-legend .dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 5px; vertical-align: middle; }
body.is-teacher .prep-main { background: #f0f4ff; flex: 1; min-width: 0; padding: 20px 22px 40px; overflow-y: auto; }
body.is-teacher .ov-hero { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
body.is-teacher .ov-title h2 { font-size: 21px; color: #2d3748; margin: 0; }
body.is-teacher .ov-title p { font-size: 12.5px; color: #5a6b7f; margin: 4px 0 0; }
body.is-teacher .ov-stats { display: flex; gap: 10px; flex-wrap: wrap; }
body.is-teacher .ov-stat { border: 1px solid #e2e8f0; border-radius: 24px; text-align: center; box-shadow: 0 2px 8px rgba(0,0,0,.06); background: #fff; padding: 10px 16px; }
body.is-teacher .ov-stat b { display: block; color: #ff6b35; font-size: 20px; }
body.is-teacher .ov-stat span { font-size: 11px; color: #5a6b7f; }
body.is-teacher .ov-progress { margin-bottom: 18px; }
body.is-teacher .ovp-track { background: #e5e7eb; border-radius: 999px; height: 8px; overflow: hidden; }
body.is-teacher .ovp-fill { background: linear-gradient(90deg, #ff6b35, #22c55e); border-radius: 999px; height: 100%; transition: width .5s; }
body.is-teacher .ovp-text { display: block; font-size: 11.5px; color: #5a6b7f; margin-top: 6px; }
body.is-teacher .ov-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 14px; margin-bottom: 18px; }
body.is-teacher .ov-card { border: 1px solid #e2e8f0; border-radius: 24px; box-shadow: 0 2px 8px rgba(0,0,0,.06); background: #fff; padding: 16px 18px; }
body.is-teacher .ov-card h3 { font-size: 15px; color: #2d3748; margin: 0 0 10px; }
body.is-teacher .unit-row { display: flex; align-items: flex-start; gap: 10px; padding: 8px 0; border-bottom: 1px dashed #edf2f7; }
body.is-teacher .unit-no { color: #ff6b35; background: #fff3ed; border-radius: 6px; padding: 3px 8px; font-size: 11px; font-weight: 700; }
body.is-teacher .unit-name { width: 108px; font-size: 13px; font-weight: 600; color: #2d3748; }
body.is-teacher .unit-lessons { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; }
body.is-teacher .lesson-chip { border: 1px solid #e2e8f0; background: #f0f4ff; color: #5a6b7f; border-radius: 999px; padding: 3px 10px; font-size: 11.5px; }
body.is-teacher .lesson-chip.ready { background: #e8f8ef; color: #1e8449; border-color: #a7f3d0; font-weight: 600; }
body.is-teacher .dev-list { margin: 0; padding-left: 18px; }
body.is-teacher .dev-list li { font-size: 12.5px; color: #5a6b7f; padding-left: 4px; position: relative; line-height: 1.65; }
body.is-teacher .ov-hint { background: #fff3ed; border: 1px dashed #ff6b35; color: #ff6b35; border-radius: 16px; display: flex; gap: 8px; padding: 11px 16px; font-size: 12.5px; align-items: center; }

/* lesson-chip clickable */
body.is-teacher .lesson-chip.clickable { cursor: pointer; transition: .15s transform, .15s box-shadow; }
body.is-teacher .lesson-chip.clickable:hover { transform: translateY(-1px); box-shadow: 0 2px 6px rgba(255,107,53,.2); }

/* ===========================================================
 * 备课中心 · 详情视图（五 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: #ff6b35; }
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-spacer { color: #cbd5e1; }
body.is-teacher .pd-meta-btns { margin-left: auto; display: inline-flex; gap: 10px; }
body.is-teacher .pd-book-btn { background: transparent; border: 1.5px solid rgba(255,107,53,.45); color: #ff6b35; font-weight: 700; font-size: 13px; padding: 8px 16px; border-radius: 999px; cursor: pointer; font-family: inherit; transition: .15s; }
body.is-teacher .pd-book-btn:hover { background: #fff3ed; }
body.is-teacher .pd-ware-preview { margin-left: 0; background: #fff; border: 1.5px solid #ff6b35; color: #ff6b35; font-weight: 700; font-size: 13px; padding: 8px 18px; border-radius: 999px; cursor: pointer; transition: .15s; }
body.is-teacher .pd-ware-preview:hover { background: #fff3ed; }
/* 上课课件按钮：从备课中心一键开启课堂并打开播放器（青绿渐变，最醒目） */
body.is-teacher .pd-ware-live { background: linear-gradient(135deg, #10b981, #059669); color: #fff; border: 1.5px solid transparent; font-weight: 800; font-size: 13px; padding: 8px 18px; border-radius: 999px; cursor: pointer; box-shadow: 0 4px 14px rgba(16,185,129,.32); transition: .15s; white-space: nowrap; }
body.is-teacher .pd-ware-live:hover { box-shadow: 0 6px 20px rgba(16,185,129,.45); transform: translateY(-1px); }
/* 课件编辑按钮（橙底白字实心）与"已编辑课件"徽章 */
body.is-teacher .pd-ware-edit { background: linear-gradient(135deg, #ff8a5b, #ff6b35); color: #fff; border: 1.5px solid transparent; font-weight: 700; font-size: 13px; padding: 8px 18px; border-radius: 999px; cursor: pointer; box-shadow: 0 4px 14px rgba(255,107,53,.3); transition: .15s; white-space: nowrap; }
body.is-teacher .pd-ware-edit:hover { box-shadow: 0 6px 18px rgba(255,107,53,.4); transform: translateY(-1px); }
body.is-teacher .pd-ware-edited { display: inline-flex; align-items: center; background: #fff3ed; border: 1px solid #ffb38a; color: #d9480f; 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, #ff8a5b, #ff6b35); color: #fff; border-color: transparent; box-shadow: 0 4px 14px rgba(255,107,53,.3); }
body.is-teacher .pd-act-edit:hover { box-shadow: 0 6px 18px rgba(255,107,53,.4); transform: translateY(-1px); }

/* —— 教学目标卡 —— */
body.is-teacher .pd-goals { background: #fff; border: 1px solid #e2e8f0; border-radius: 24px; padding: 18px 22px; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
body.is-teacher .pd-goals-title { font-size: 14px; font-weight: 700; color: #2d3748; margin-bottom: 14px; }
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: #fef3c7; color: #b45309; }
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: #ff6b35; background: #fff3ed; }
body.is-teacher .pd-tab.active { background: linear-gradient(135deg, #ff8a5b, #ff6b35); color: #fff; box-shadow: 0 4px 14px rgba(255,107,53,.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-sub { font-size: 12.5px; color: #5a6b7f; flex: 1; min-width: 200px; }
body.is-teacher .pd-toolbar-btns { display: flex; gap: 8px; }
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, #ff8a5b, #ff6b35); color: #fff; border-color: transparent; box-shadow: 0 4px 14px rgba(255,107,53,.3); }
body.is-teacher .pd-act-main:hover { box-shadow: 0 6px 18px rgba(255,107,53,.4); transform: translateY(-1px); }
body.is-teacher .pd-act-preview { background: #fff; color: #ff6b35; border-color: #ff6b35; }
body.is-teacher .pd-act-preview:hover { background: #fff3ed; }
body.is-teacher .pd-act-ghost { background: #fff; color: #5a6b7f; border-color: #e2e8f0; }
body.is-teacher .pd-act-ghost:hover { border-color: #ff6b35; color: #ff6b35; }

/* —— 通用内容卡 —— */
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: #ff6b35; 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: #b45309; background: #fef3c7; 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: #fff3ed; border-left-color: #ff6b35; }
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, #fff3ed, #fff9f5); padding: 10px 14px; border-radius: 12px; margin-bottom: 10px; }
body.is-teacher .pd-script-badge { background: #ff6b35; 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: #ff6b35; 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 #ff6b35; }

/* —— 课件列表 —— */
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: #ff6b35; box-shadow: 0 2px 8px rgba(255,107,53,.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: #fef3c7; color: #b45309; }
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(255,107,53,.15); border-color: #ff6b35; }
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: #fef3c7; color: #b45309; }
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: #ff6b35; color: #fff; box-shadow: 0 2px 8px rgba(255,107,53,.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: #ff6b35; color: #fff; border-color: #ff6b35; }
body.is-teacher .plan-tb-btn.primary:hover { background: #e55a2b; }
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 #ff6b35; 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: #ff6b35; 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: #fff7ed; }
body.is-teacher .plan-schedule-table .cw1 { width: 60px; text-align: center; font-weight: 600; color: #ff6b35; }
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: #f0f4ff; color: #2d3748; }
body.is-teacher .sched-tab-btn.active { background: #ff6b35; color: #ffffff; box-shadow: 0 3px 10px rgba(255,107,53,.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: #ff6b35;
  font-size: 13px; font-weight: 600; cursor: pointer;
  transition: .15s;
}
body.is-teacher .sched-doc-bar .sched-dl:hover {
  background: #fff3e0; border-color: #ffb38a; box-shadow: 0 2px 8px rgba(255,107,53,.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, #ff8a5c 0%, #ff6b35 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: #fff3e0; color: #e64a19;
  font-weight: 800; font-size: 14px;
  text-align: center; vertical-align: middle;
  border: 2px solid #ff6b35;
  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, #ff6b35 0%, #f4511e 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(255,107,53,.3);
}
body.is-teacher .btn-sched-save:hover { transform: translateY(-1px); box-shadow: 0 4px 10px rgba(255,107,53,.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 #ff6b35;
}
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;
}

/* ===========================================================
 * 教师端 · 课后报告（复刻苏科版 2026-08-31）
 * =========================================================== */

/* —— 空状态 —— */
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: #f0f4ff; 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: #ff6b35; 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: #ff6b35; color: #ffffff; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: .15s; font-family: inherit; box-shadow: 0 2px 6px rgba(255,107,53,.2);
}
body.is-teacher .report-modal .tb-primary:hover { background: #f05a28; }

/* 打印样式 */
@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, #ff8a5b, #ff6b35); border: none; cursor: pointer; font-family: inherit; box-shadow: 0 4px 12px rgba(255,107,53,.3); transition: .15s; }
body.is-teacher .pd-act-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(255,107,53,.4); }

/* —— 资源库（四分区 + 弹层） —— */
body.is-teacher .pd-reslib { display: flex; flex-direction: column; gap: 22px; }
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: #fff3ed; color: #ff6b35; 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: #ff6b35; box-shadow: 0 4px 14px rgba(255,107,53,.12); transform: translateY(-2px); }
body.is-teacher .pd-doc-icon { flex: none; width: 44px; height: 44px; border-radius: 10px; background: linear-gradient(135deg, #fff3ed, #ffe3d5); 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: #ff6b35; background: #fff3ed; padding: 5px 12px; border-radius: 999px; text-decoration: none; }
body.is-teacher .pd-doc-card:hover .pd-doc-open { background: #ff6b35; 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: #ff6b35; }
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: #ff6b35; 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: #ff6b35; box-shadow: 0 4px 14px rgba(255,107,53,.12); }
body.is-teacher .pd-res-aicon { flex: none; width: 46px; height: 46px; border-radius: 10px; background: linear-gradient(135deg, #fff3ed, #ffe3d5); 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: #ff6b35; 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: #ff6b35; 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: #e85a28; }
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, #ff8a5b, #ff6b35); 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: #ff6b35; 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: #ff6b35; 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: #ff6b35; 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: #ff6b35; 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: #ff6b35; 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: #7c2d12; background: linear-gradient(135deg, #fff7ed, #ffebd0); border: 1.5px solid #fed7aa; }
body.is-teacher .stu-stat.all .ss-ico { background: linear-gradient(135deg, #ff8f5e, #ff6b35); color: #fff; }
body.is-teacher .stu-stat.active { outline: 2px solid #ff6b35; outline-offset: 2px; box-shadow: 0 4px 16px rgba(255,107,53,.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: #ff8f5e; }
body.is-teacher .stu-search:focus { border-color: #ff6b35; box-shadow: 0 0 0 4px #fff3ed; }
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: #ff6b35; color: #fff; }
/* 【查找】主按钮 */
body.is-teacher .stu-btn.stu-btn-search { font-size: 13px; font-weight: 700; padding: 6px 14px; background: linear-gradient(135deg, #ff8f5e, #ff6b35); box-shadow: 0 3px 12px rgba(255,107,53,.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(255,107,53,.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 #fed7aa; 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: #fff3ed; }
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: #ff6b35; color: #fff; box-shadow: 0 4px 16px rgba(255,107,53,.3); }
body.is-teacher .stu-btn-primary:hover { background: #e85a28; 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: #ff6b35; color: #ff6b35; }
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: 20px; font-weight: 800; color: #fff; background: #2563eb; padding: 17px 16px; text-align: center; white-space: nowrap; border-bottom: none; letter-spacing: .8px; }
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: #f0f4ff; }

/* 列宽（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; }
/* 备注显示：支持多行自动换行，最多展示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: #ff6b35; }
/* 备注编辑：多行文本域，宽度撑满备注列，随内容自动增高 */
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 #ff6b35; border-radius: 8px; outline: none; box-shadow: 0 0 0 3px rgba(255,107,53,.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: center; 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: #ff6b35; color: #ff6b35; }
body.is-teacher .stu-op-out { background: #fff; color: #ff6b35; border: 1px solid #fed7aa; }
body.is-teacher .stu-op-out:hover { background: #fff7ed; border-color: #ff6b35; color: #ea580c; }
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: #fff7ed; border: 1px solid #fed7aa; border-radius: 8px; font-size: 13px; color: #9a3412; }
body.is-teacher .stu-modal-cls-hint b { color: #c2410c; }
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: #ff6b35; }

/* 弹窗：他班转入 */
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: #f0f4ff; }
body.is-teacher .import-stu-item input[type="radio"] { accent-color: #ff6b35; }
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: #ff6b35; }
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: #f0f4ff; }
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: #ff6b35; 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: #ff6b35; box-shadow: 0 0 0 3px rgba(255,107,53,.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; }

/* ===== 短信验证码登录相关样式 ===== */
/* Mock 模式提示横幅 */
.sms-mock-banner {
  margin-bottom: 14px; padding: 10px 12px;
  background: #fff7ed; border: 1px solid #fed7aa;
  border-radius: 10px;
  font-size: 12px; color: #b45309;
  display: flex; flex-direction: column; gap: 3px;
}
.sms-mock-banner strong { font-size: 13px; }

/* 登录方式 Tab 切换 */
.login-tabs {
  display: flex; gap: 6px;
  margin-bottom: 18px; padding: 4px;
  background: #f1f5f9; border-radius: 11px;
}
.login-tabs button {
  flex: 1; padding: 10px 14px;
  border: 0; background: transparent;
  border-radius: 9px;
  font-size: 13.5px; font-weight: 600;
  color: #64748b; cursor: pointer;
  font-family: inherit;
  transition: .15s;
}
.login-tabs button:hover { color: #4f8cff; }
.login-tabs button.active {
  background: #ffffff; color: #4f8cff;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}

/* 验证码输入框 + 发送按钮组合 */
.sms-code-wrap { position: relative; }
.sms-code-wrap input { padding-right: 122px; }
.sms-send-btn {
  position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
  padding: 8px 12px;
  border: 0; border-radius: 9px;
  background: #4f8cff; color: #fff;
  font-size: 12.5px; font-weight: 600;
  font-family: inherit; cursor: pointer;
  transition: .15s;
  white-space: nowrap;
}
.sms-send-btn:hover:not(:disabled) { background: #3b7ae8; }
.sms-send-btn:active:not(:disabled) { transform: translateY(-50%) scale(.97); }
.sms-send-btn:disabled {
  background: #cbd5e1; color: #fff;
  cursor: not-allowed;
}

/* Mock 模式下显示的开发用验证码提示 */
.sms-mock-code {
  margin-top: 8px; padding: 7px 10px;
  background: #ecfdf5; border: 1px dashed #6ee7b7;
  border-radius: 8px;
  font-size: 12px; color: #047857;
}
.sms-mock-code strong {
  font-size: 15px; letter-spacing: 1px; color: #065f46;
}

/* 登录卡底部"忘记密码"入口 */
.t-lc-foot {
  margin-top: 12px; text-align: center;
}
.t-lc-foot a {
  font-size: 12.5px; color: #94a3b8;
  text-decoration: none;
  transition: .15s;
}
.t-lc-foot a:hover { color: #4f8cff; }

/* 教师账号卡片中的手机号单元格 */
.tacc-phone-cell {
  font-family: 'Consolas', 'Monaco', monospace;
  font-size: 13px; letter-spacing: .5px;
  color: #475569;
}
.tacc-phone-empty {
  font-size: 12px; color: #cbd5e1; font-style: italic;
}

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

/* —— 深色顶栏 —— */
.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;
}

/* 进度条（深色底栏内） */
.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: #b45309; background: #fef3c7; 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: #fef3c7; color: #b45309; 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: #fef3c7; color: #b45309; 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: #ff6b35; color: #fff; box-shadow: 0 2px 8px rgba(255,107,53,.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: #ff6b35; background: #fff3ed; }
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: #ff6b35; background: #fff3ed; }
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: #ff6b35; border-left: 4px solid #ff6b35; background: #fff7f3; 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: #b45309; 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: #b45309; font-weight: 700; }
body.is-teacher .pd-chip-code { color: #1d4ed8; background: #dbeafe; }
body.is-teacher .pd-chip-media { color: #b45309; background: #fef3c7; }
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: #ff6b35; background: #fff3ed; 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: #ff6b35; box-shadow: 0 4px 14px rgba(255,107,53,.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: #fff7f3; border-color: #ffd6c2; }
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: #e04e1a; }
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: #fff7f3; color: #e04e1a; 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: #ff6b35; background: #fff3ed; 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: #ff6b35; background: #fff7ed; border: 1px dashed #ffc9a3; 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: #b45309; background: #fef3c7; 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: #fff7ed; border: 1px dashed #ffc9a3; border-radius: 10px; padding: 8px 12px; margin: 8px 0; }
body.is-teacher .pd-sb-trans-tag { font-size: 11px; font-weight: 700; color: #c2410c; background: #ffedd5; 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: #ff6b35; 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 #ff6b35; background: #fff7ed; box-shadow: 0 0 0 4px rgba(255,107,53,.18); animation: seatHitPulse 1.2s ease-in-out infinite; }
body.is-teacher .seat-admin .seat.hit .seat-name { color: #ff6b35; }
@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: #ff8f5e; }
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(255,107,53,.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: #c2410c; background: #fff7ed; border-color: #fed7aa; }
/* 默认（未锁定且未编辑）态使用次要灰 */
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-grid { grid-template-columns: 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; }
}

/* ===========================================================
 * 打字练习专区 · 键盘小达人训练营（复刻苏科版 #/typing）
 * 作用域：.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; }
.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); }

/* —— 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 { 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, #fb923c, #f97316); 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; }
}

/* ============================================================
   基础训练 · 电脑小当家养成记（复刻苏科版 #/basics）
   ============================================================ */
.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 { height: clamp(200px, calc(var(--vhpx, 1vh) * 30), 320px); }
/* 选班：自适应列网格（班多时密排、班少时卡片自动加宽，不显空旷） */
.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: #5a6b7f; }

/* 窄屏：跟随 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; }

/* —— 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; } }

/* —— 底栏数字页码（苏科版：一行平铺不滚动；🎮=互动页，橙=当前，✓=完成） —— */
.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: 1000px; }
.main.player-main .sl-bb-pillrow { display: flex; align-items: center; gap: 12px; width: 100%; justify-content: center; min-width: 0; }
.main.player-main .sl-pills { display: flex; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; padding: 0; overflow: visible;
  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 0; 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; }
.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.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:#f97316;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:#ea580c}
.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: #ff6b35; box-shadow: 0 0 0 3px rgba(255,107,53,.12); }
body.is-teacher .um-tip {
  margin: 12px 0 4px; padding: 10px 14px; border-radius: 10px;
  background: #fff7ed; border: 1px solid #fed7aa;
  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 .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: 15px !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-stat b { font-size: 24px !important; }
body.is-teacher .ov-stat span { font-size: 14px !important; }
body.is-teacher .ov-card h3 { font-size: 18px !important; }
body.is-teacher .unit-name { font-size: 16px !important; }
body.is-teacher .lesson-chip { font-size: 15px !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: #ffb08a; }
body.is-teacher .pub-all-btn.on {
  background: #fff7ed; border-color: #ff6b35; color: #c2410c;
}
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: #ff6b35; }
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: #ffb08a; }
body.is-teacher .pub-cls-chip.on {
  background: #ff6b35; border-color: #ff6b35; color: #fff;
  box-shadow: 0 2px 8px rgba(255,107,53,.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: #ff6b35; 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: #fffbeb; 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: #92400e; flex-shrink: 0; }
body.is-teacher .hw-graded-by { margin-left: auto; font-size: 12px; color: #b45309; 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: #ea580c; border-color: #ea580c; 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 #fde68a; background: #fff; color: #92400e;
  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: #fef3c7; border-color: #f59e0b; }
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: #ff6b35; }
body.is-teacher .hw-type-tab.active { background: #ff6b35; border-color: #ff6b35; color: #fff; box-shadow: 0 3px 10px rgba(255,107,53,.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: #ff6b35; }
.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, #ff8a3d, #ff5a1f);
  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: #ff6b35; }

/* ============================================================
   【教师端】行为管理模块（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-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, #fb923c, #ea580c); }
.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: #fff7ed; border: 1.5px solid #fdba74; border-radius: 12px;
  padding: 10px 14px; margin-bottom: 14px;
}
.beh-alert-tit { font-weight: 900; color: #c2410c; }
.beh-alert-chip {
  display: inline-flex; align-items: center; gap: 6px; background: #fff;
  border: 1px solid #fed7aa; border-radius: 999px; padding: 5px 10px;
  font-size: 13px; color: #7c2d12;
}
.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: 14px; }
.beh-table thead th {
  position: relative;
  background: linear-gradient(90deg, #4f46e5 0%, #7c3aed 48%, #c026d3 100%);
  color: #fff; font-weight: 900; font-size: 14.5px; letter-spacing: 2.5px;
  padding: 14px 10px 16px; text-align: center; border: none;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .28);
}
.beh-table thead th::after {
  content: ''; position: absolute; left: 50%; transform: translateX(-50%);
  bottom: 6px; width: 30px; height: 3.5px; border-radius: 3px;
  background: rgba(255, 255, 255, .9);
}
.beh-table thead th:nth-child(1)::after { background: #fbbf24; }
.beh-table thead th:nth-child(2)::after { background: #22d3ee; }
.beh-table thead th:nth-child(3)::after { background: #4ade80; }
.beh-table thead th:nth-child(4)::after { background: #a3e635; }
.beh-table thead th:nth-child(5)::after { background: #fb923c; }
.beh-table thead th:nth-child(6)::after { background: #38bdf8; }
.beh-table thead th:nth-child(7)::after { background: #f472b6; }
.beh-table tbody td { padding: 10px; text-align: center; border-bottom: 1px solid #f1f5f9; color: #334155; }
.beh-table tbody tr:hover { background: #f8faff; }
.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: #94a3b8; padding: 26px 10px !important; }

/* 学生单元格：机号彩色圆圈 + 姓名 + 徽章 */
.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: #fef3c7; color: #b45309; 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: 700; color: #64748b; }
.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: #64748b; font-size: 13px; }

/* 操作小按钮 */
.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: #7c2d12; 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: #fef3c7; color: #b45309; 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: #854d0e; 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: #fffbeb; color: #b45309; 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: #78350f;
  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: 1fr 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-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, #f97316, #c2410c); }
.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, #f97316, #ea580c); 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: #fb923c; background: #fff7ed; 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; }
.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: #fff7ed; }
.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; }

/* 冠军大奖杯：金色光晕 + 旋转放射光芒 + 浮动奖杯 + 闪烁星星 */
.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; }

/* 统计卡 */
.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: 16px; }
.beh-table thead th {
  font-size: 18px; letter-spacing: 3.5px; padding: 17px 10px 20px;
}
.beh-table thead th::after { width: 38px; height: 4px; bottom: 8px; }
.beh-table tbody td { padding: 13px 12px; font-size: 16px; }
.beh-table .c-rank { width: 84px; }
.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: 37px; height: 37px; font-size: 16.5px; }
.beh-stu { gap: 10px; }
.beh-stu-name { font-size: 17px; }
.beh-stu-no { font-size: 13.5px; }
.beh-badge { font-size: 13px; padding: 3px 11px; }
.beh-score { font-size: 21px; }
.beh-cnt { font-size: 15.5px; }
.beh-log-time { font-size: 14.5px; }
.beh-empty { font-size: 15.5px !important; padding: 32px 10px !important; }

/* 操作按钮 */
.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-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: #fffbeb; color: #b45309;
  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; }