/* ============================================================
   纳海教育 · Sahara 暖色极简设计系统
   Warm Minimalism · Sun-Baked Simplicity
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Manrope:wght@200..800&display=swap');

:root {
  /* ---- Sahara 主色系 ---- */
  --primary: #c2652a;
  --primary-hover: #a8541f;
  --primary-container: #e08850;
  --primary-fixed: #fbe8d8;
  --primary-fixed-dim: #f0a878;
  --on-primary: #ffffff;
  --on-primary-fixed: #401a08;
  --on-primary-fixed-variant: #8a4518;

  /* ---- 暖色背景层 ---- */
  --background: #faf5ee;
  --surface: #faf5ee;
  --surface-bright: #faf5ee;
  --surface-container-lowest: #ffffff;
  --surface-container-low: #f6f0e8;
  --surface-container: #f2ece4;
  --surface-container-high: #ece6dc;
  --surface-container-highest: #e6e0d6;
  --surface-dim: #dcd6cc;
  --surface-variant: #ece6dc;

  /* ---- 文字色 ---- */
  --on-surface: #3a302a;
  --on-surface-variant: #605850;
  --on-background: #3a302a;
  --inverse-surface: #3a302a;
  --inverse-on-surface: #faf5ee;

  /* ---- 辅助色 ---- */
  --secondary: #78706a;
  --secondary-container: #eae2da;
  --on-secondary: #ffffff;
  --on-secondary-container: #605850;
  --tertiary: #8c3c3c;
  --tertiary-container: #d47070;
  --tertiary-fixed: #fce0e0;
  --on-tertiary: #ffffff;

  /* ---- 语义色 ---- */
  --error: #c0392b;
  --error-container: #fce4e0;
  --on-error: #ffffff;
  --on-error-container: #7a1a10;
  --success: #5a7c3e;
  --success-container: #e8f0dc;
  --info: #5b6b8a;
  --info-container: #e0e6f0;

  /* ---- 描边 ---- */
  --outline: #9a9088;
  --outline-variant: #d8d0c8;

  /* ---- 圆角 ---- */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 999px;

  /* ---- 阴影：极柔 ---- */
  --shadow-xs: 0 1px 4px rgba(58, 48, 42, 0.03);
  --shadow-sm: 0 2px 16px rgba(58, 48, 42, 0.04);
  --shadow-md: 0 4px 24px rgba(58, 48, 42, 0.06);
  --shadow-lg: 0 8px 40px rgba(58, 48, 42, 0.08);

  /* ---- 字体 ---- */
  --font-headline: 'EB Garamond', Georgia, 'Songti SC', serif;
  --font-body: 'Manrope', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Noto Sans SC', sans-serif;
  --font-label: 'Manrope', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Noto Sans SC', sans-serif;

  /* ---- 顶栏高度（侧边栏 fixed 定位用） ---- */
  --topbar-h: 62px;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
html, body { overflow-x: hidden; }
html { -webkit-text-size-adjust: 100%; }

/* ==================== 全局 ==================== */
body {
  margin: 0;
  font-family: var(--font-body);
  background: var(--background);
  color: var(--on-surface);
  font-size: 16px;
  line-height: 1.6;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  /* 顶栏 fixed，留出顶栏高度避免内容被遮挡 */
  padding-top: calc(env(safe-area-inset-top) + var(--topbar-h));
}

#app {
  max-width: 760px;
  margin: 0 auto;
  padding: 16px;
}

h1, h2, h3, h4, .font-headline {
  font-family: var(--font-headline);
  letter-spacing: -0.01em;
}

/* ==================== 屏幕切换 ==================== */
.screen { display: none; animation: screenIn .35s ease-out both; }
.screen.active { display: block; }
@keyframes screenIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ==================== 顶部导航栏 ==================== */
.topbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 30;
  display: flex; align-items: center; justify-content: space-between;
  padding: calc(env(safe-area-inset-top) + 14px) 20px 14px;
  background: rgba(250, 245, 238, 0.88);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border-bottom: 1px solid rgba(216, 208, 200, 0.5);
}
.brand {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font-headline);
  font-weight: 700; font-size: 20px;
  color: var(--primary);
  letter-spacing: -0.02em;
}
.brand-logo {
  height: 34px; width: auto;
  border-radius: 8px;
  object-fit: contain;
  box-shadow: 0 1px 4px rgba(0,0,0,0.12);
}
.badges { display: flex; gap: 6px; }
.badge {
  display: inline-flex; align-items: center; gap: 3px;
  background: var(--surface-container-low);
  border: 1px solid rgba(216, 208, 200, 0.4);
  border-radius: var(--radius-full);
  padding: 5px 12px; font-size: 13px; color: var(--on-surface-variant);
  white-space: nowrap; font-weight: 600;
}
.badge b { color: var(--primary); font-weight: 700; }

/* 用户区域 */
.user-area {
  display: flex; align-items: center; gap: 10px;
}
.user-name {
  font-size: 14px; font-weight: 600; color: var(--on-surface);
  white-space: nowrap;
}
.logout-btn {
  border: 1px solid var(--outline-variant);
  background: transparent; color: var(--on-surface-variant);
  border-radius: var(--radius-sm); padding: 5px 14px;
  font-size: 13px; font-weight: 600; cursor: pointer;
  transition: all .2s;
}
.logout-btn:hover { border-color: var(--primary); color: var(--primary); }

/* ==================== 首页 ==================== */

/* --- Hero 区域 --- */
.hero {
  text-align: center;
  padding: 36px 8px 12px;
}
.hero h1 {
  font-size: 32px; font-weight: 700;
  margin: 0 0 10px;
  color: var(--on-surface);
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.hero p {
  color: var(--on-surface-variant);
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
}

/* --- 学段选择器 --- */
.stage-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 28px 0;
}
.stage-card {
  border: 1.5px solid var(--outline-variant);
  cursor: pointer;
  border-radius: var(--radius-lg);
  padding: 22px 8px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  transition: all .2s ease;
  position: relative;
  background: var(--surface-container-lowest);
  box-shadow: var(--shadow-xs);
}
.stage-card:hover {
  border-color: var(--primary-container);
  box-shadow: var(--shadow-sm);
  transform: translateY(-2px);
}
.stage-card:active { transform: scale(.97); }
.stage-card.sel {
  border-color: var(--primary);
  background: var(--primary-fixed);
}
.stage-card .emo { font-size: 36px; line-height: 1; }
.stage-card .t {
  font-family: var(--font-headline);
  font-weight: 700; font-size: 18px;
  color: var(--on-surface);
}

/* --- 模式按钮列表 --- */
.mode-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mode-btn {
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid var(--outline-variant);
  background: var(--surface-container-lowest);
  cursor: pointer;
  border-radius: var(--radius-md);
  padding: 16px 18px;
  text-align: left;
  transition: all .2s ease;
  box-shadow: var(--shadow-xs);
}
.mode-btn:hover {
  border-color: var(--primary-container);
  box-shadow: var(--shadow-sm);
  transform: translateY(-1px);
}
.mode-btn:active { transform: scale(.98); }

.mode-btn .mode-icon {
  flex: 0 0 42px;
  height: 42px;
  border-radius: var(--radius-sm);
  display: grid;
  place-items: center;
  font-size: 22px;
  line-height: 1;
  background: var(--surface-container-low);
}
.mode-btn strong {
  font-family: var(--font-headline);
  font-size: 17px; font-weight: 700;
  color: var(--on-surface);
}
.mode-btn small {
  display: block;
  font-weight: 500;
  font-size: 13px;
  color: var(--on-surface-variant);
  margin-top: 2px;
}

/* --- 题库统计条 --- */
.bank-stat {
  text-align: center;
  color: var(--on-surface-variant);
  font-size: 13px;
  margin: 20px 0 4px;
  padding: 12px 16px;
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-sm);
}
.bank-stat b { color: var(--primary); font-weight: 700; }

/* 首页顶部品牌区 */
.home-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin: 8px 0 24px;
  padding: 16px 16px 8px;
  opacity: 0.96;
}
.home-brand-logo {
  width: 200px;
  max-width: 60vw;
  height: auto;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  object-fit: cover;
}
.home-brand-slogan {
  margin: 18px 0 0;
  font-family: var(--font-headline);
  font-size: 22px;
  font-weight: 600;
  color: var(--primary);
  letter-spacing: 0.18em;
}

/* ==================== 左侧导航侧边栏（宝塔式构图 · fixed 固定） ==================== */
.app-layout {
  width: 100%;
  max-width: 100%;
  margin: 0;
}
/* 侧边栏 fixed 固定：滚动时永远不动，只有右侧内容区滚动 */
.nav-sidebar {
  position: fixed;
  left: 0;
  top: calc(env(safe-area-inset-top) + var(--topbar-h));
  bottom: 0;
  width: 200px;
  overflow-y: auto;
  padding: 8px 0 24px;
  background: var(--surface-container-low);
  border-right: 1px solid var(--outline-variant);
  z-index: 20;
}
.nav-sidebar[hidden] { display: none; }
.nav-sidebar-head {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  color: var(--on-surface-variant);
  letter-spacing: 0.06em;
  padding: 6px 18px 10px;
  text-transform: uppercase;
}
/* 导航分组标签：按「学生中心 / 教学管理」行业惯例分组 */
.nav-group-label {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  color: var(--primary);
  letter-spacing: 0.04em;
  padding: 14px 18px 6px;
  border-top: 1px solid var(--outline-variant);
  margin-top: 6px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.nav-group-label:first-child { border-top: none; margin-top: 0; padding-top: 8px; }

/* 自定义折叠/展开小按钮（完全自绘，非浏览器原生外观） */
.nav-group-toggle {
  border: none;
  background: var(--surface-container-high);
  color: var(--on-surface-variant);
  width: 20px;
  height: 20px;
  border-radius: 6px;
  font-size: 9px;
  line-height: 1;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 20px;
  transition: background .15s ease, color .15s ease, transform .2s ease;
}
.nav-group-toggle:hover { background: var(--primary); color: #fff; }
.nav-group-toggle:active { transform: scale(.88); }

/* 「学生中心」折叠动画（自定义过渡，代替原生 hidden 跳变） */
.nav-group-body {
  overflow: hidden;
  max-height: 640px;
  opacity: 1;
  transition: max-height .28s ease, opacity .22s ease;
}
.nav-group-body.collapsed {
  max-height: 0;
  opacity: 0;
}
.nav-sidebar .mode-list { gap: 0; }
.nav-sidebar .mode-btn {
  position: relative;
  padding: 11px 18px 11px 22px;
  gap: 12px;
  border: none;
  border-left: 3px solid transparent;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  transition: background .15s ease;
}
.nav-sidebar .mode-btn:hover {
  background: var(--surface-container);
  box-shadow: none;
  transform: none;
}
.nav-sidebar .mode-btn.active {
  background: var(--primary-fixed);
  border-left-color: var(--primary);
}
.nav-sidebar .mode-btn.active strong { color: var(--on-primary-fixed); }
.nav-sidebar .mode-btn .mode-icon {
  flex: 0 0 28px;
  height: 28px;
  font-size: 17px;
  background: transparent;
  border-radius: 0;
}
.nav-sidebar .mode-btn strong { font-size: 14px; font-weight: 600; }
/* 宝塔式导航项只显示标题，副标题隐藏保持构图简洁 */
.nav-sidebar .mode-btn small { display: none; }

/* 主内容区：右侧独立，左侧让出侧边栏宽度；大屏上在剩余空间内居中 */
.app-layout > #app {
  /* 侧边栏 200px + 内容 980px = 1180px；超出部分两侧平分，使内容居中于侧边栏右侧空间 */
  margin-left: max(200px, calc(200px + (100vw - 1180px) / 2));
  margin-right: auto;
  max-width: 980px;
  padding: 16px 20px 40px;
  min-width: 0;
}
/* 登录页：未登录时侧边栏隐藏（#navSidebar[hidden]），
   让主内容区回到整屏宽度并居中，登录 card 才能真正水平居中 */
.app-layout:has(#navSidebar[hidden]) > #app {
  margin-left: auto;
  margin-right: auto;
  max-width: 760px;
}

/* 汉堡菜单按钮（默认隐藏，窄屏显示） */
.nav-toggle {
  display: none;
  background: transparent;
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-sm);
  width: 38px; height: 38px;
  font-size: 18px;
  color: var(--primary);
  cursor: pointer;
  line-height: 1;
}
.nav-toggle:active { transform: scale(.94); }
.nav-toggle[hidden] { display: none !important; }

/* 移动端遮罩 */
.nav-backdrop {
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.42);
  z-index: 39;
}
.nav-backdrop[hidden] { display: none; }

/* 窄屏：侧边栏改为抽屉，主内容区不再让出宽度 */
@media (max-width: 899px) {
  .app-layout { max-width: 100%; }
  .nav-toggle { display: inline-flex; align-items: center; justify-content: center; }
  .nav-sidebar {
    top: 0;
    bottom: 0;
    width: 240px;
    z-index: 40;
    transform: translateX(-100%);
    transition: transform .25s ease;
    border-right: 1px solid var(--outline-variant);
    box-shadow: 2px 0 16px rgba(0,0,0,0.15);
    padding-top: calc(env(safe-area-inset-top) + 14px);
  }
  .nav-sidebar.open { transform: translateX(0); }
  .nav-sidebar[hidden] { display: block; transform: translateX(-100%); }
  .app-layout > #app { margin-left: 0; width: 100%; max-width: 100%; padding: 14px; }
}


/* ==================== 通用组件 ==================== */
.screen-title {
  font-size: 28px;
  font-weight: 700;
  margin: 12px 0 20px;
  color: var(--on-surface);
  letter-spacing: -0.02em;
}
.sub {
  font-size: 14px;
  font-weight: 700;
  margin: 24px 0 10px;
  color: var(--on-surface-variant);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.back {
  border: none; background: transparent; color: var(--primary);
  cursor: pointer; font-size: 15px; font-weight: 600;
  padding: 4px 0; display: inline-flex; align-items: center; gap: 2px;
  transition: color .2s;
}
.back:hover { color: var(--primary-hover); }

.big-btn {
  width: 100%; border: none; cursor: pointer; border-radius: var(--radius-sm);
  background: var(--primary); color: var(--on-primary);
  font-size: 16px; font-weight: 600;
  padding: 14px; margin-top: 14px;
  transition: all .2s;
  letter-spacing: 0.01em;
}
.big-btn:hover { background: var(--primary-hover); }
.big-btn:active { transform: translateY(1px); }
.big-btn:disabled { opacity: .4; cursor: not-allowed; }
.big-btn.ghost {
  background: transparent; color: var(--primary);
  border: 1.5px solid var(--primary);
  font-weight: 600;
}
.big-btn.ghost:hover { background: var(--primary-fixed); }

/* ==================== 自由闯关设置 ==================== */
.setup-box { display: flex; flex-direction: column; gap: 22px; }
.setup-group h4 {
  margin: 0 0 10px; font-size: 13px; font-weight: 700;
  color: var(--on-surface-variant); text-transform: uppercase; letter-spacing: 0.06em;
  font-family: var(--font-label);
}
.setup-readonly {
  background: var(--surface-container-high);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 11px 14px; font-size: 15px; font-weight: 600; color: var(--on-surface);
}
.setup-readonly small { font-weight: 400; color: var(--on-surface-variant); font-size: 12px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  border: 1.5px solid var(--outline-variant); background: var(--surface-container-lowest); cursor: pointer;
  border-radius: var(--radius-full); padding: 9px 16px; font-size: 14px; font-weight: 600;
  color: var(--on-surface); transition: all .15s ease;
  user-select: none;
}
.chip.sel {
  background: var(--primary); color: var(--on-primary); border-color: transparent;
  box-shadow: 0 2px 8px rgba(194, 101, 42, 0.2);
}
.chip:active { transform: scale(.95); }
.chip:hover:not(.sel) { border-color: var(--primary-container); }

/* ==================== 答题布局 ==================== */
.quiz-layout { display: block; }
.quiz-main { width: 100%; }
.quiz-side { display: none; }

@media (min-width: 900px) {
  .quiz-layout {
    display: grid;
    grid-template-columns: 1fr 260px;
    gap: 20px;
    align-items: start;
  }
  .quiz-side {
    display: block;
    position: sticky;
    top: 90px;
    background: var(--surface-container-lowest);
    border: 1px solid var(--outline-variant);
    border-radius: var(--radius-lg);
    padding: 20px;
    box-shadow: var(--shadow-sm);
  }
  .quiz-side h4 { margin: 0 0 14px; font-size: 13px; color: var(--on-surface-variant); text-transform: uppercase; letter-spacing: 0.06em; }
  .side-row {
    display: flex; justify-content: space-between; padding: 10px 0;
    border-bottom: 1px solid rgba(216, 208, 200, 0.4); font-size: 15px;
  }
  .side-row b { color: var(--primary); font-weight: 700; }
  .side-tip {
    margin-top: 16px; font-size: 13px; color: var(--on-surface-variant);
    background: var(--primary-fixed); padding: 12px; border-radius: var(--radius-sm);
    line-height: 1.55;
  }
}

/* ==================== 答题卡头部 ==================== */
.quiz-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 0;
  margin-bottom: 16px;
}
.quiz-head .back { margin: 0; }
.progress {
  flex: 1;
  height: 6px;
  background: var(--surface-container-high);
  border-radius: var(--radius-full);
  overflow: hidden;
}
.progress-bar {
  height: 100%;
  width: 0;
  background: var(--primary);
  border-radius: var(--radius-full);
  transition: width .35s cubic-bezier(.25,1,.35,1);
}
.qcount {
  font-weight: 700; font-size: 14px; color: var(--on-surface-variant);
  white-space: nowrap; min-width: 36px; text-align: right;
}

/* --- 题目标签行 --- */
.quiz-meta {
  display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px;
}
.tag {
  font-size: 12px; font-weight: 600; padding: 4px 11px;
  border-radius: var(--radius-full); background: var(--surface-container-low);
  color: var(--on-surface-variant); border: 1px solid var(--outline-variant);
}
.tag.diff {
  background: var(--primary-fixed);
  color: var(--on-primary-fixed-variant);
  border-color: transparent;
}
.tag.type {
  background: var(--secondary-container);
  color: var(--on-secondary-container);
  border-color: transparent;
}

/* ==================== 答题卡片主体 ==================== */
.question-card {
  background: var(--surface-container-lowest);
  border-radius: var(--radius-lg);
  padding: 28px 24px 24px;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--outline-variant);
  position: relative;
}
.question-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 4px;
  background: var(--primary);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  opacity: 0;
  transition: opacity .3s;
}
.question-card.active-q::before { opacity: 1; }

.question-text {
  font-family: var(--font-headline);
  font-size: 21px;
  font-weight: 600;
  line-height: 1.5;
  margin: 0 0 20px;
  color: var(--on-surface);
}

/* --- 选项 --- */
.options { display: flex; flex-direction: column; gap: 10px; }
.option {
  display: flex; align-items: center; gap: 13px; width: 100%;
  border: 1.5px solid var(--outline-variant); background: var(--surface-container-lowest); cursor: pointer;
  border-radius: var(--radius-sm); padding: 14px 16px;
  font-size: 16px; font-weight: 500; text-align: left; color: var(--on-surface);
  min-height: 52px;
  transition: all .2s ease;
  box-shadow: var(--shadow-xs);
}
.option:hover:not(:disabled):not(.correct):not(.wrong) {
  border-color: var(--primary-container);
  box-shadow: var(--shadow-sm);
  background: var(--surface-container-low);
}

.option .lab {
  flex: 0 0 30px; height: 30px; border-radius: var(--radius-sm);
  background: var(--surface-container-low);
  display: grid; place-items: center;
  font-weight: 700; color: var(--primary); font-size: 15px;
  border: 1.5px solid transparent;
  transition: all .2s ease;
}

.option.correct {
  border-color: var(--success); background: var(--success-container);
}
.option.correct .lab {
  background: var(--success); color: #fff;
}

.option.wrong {
  border-color: var(--error); background: var(--error-container);
}
.option.wrong .lab {
  background: var(--error); color: #fff;
}

/* 判断题 */
.option.tf { justify-content: center; font-size: 17px; }
.option.tf .tfopt { flex: 1; text-align: center; }

/* 多选题选中态 */
.option.multi.sel {
  border-color: var(--primary);
  background: var(--primary-fixed);
}
.option.multi.sel .lab {
  background: var(--primary); color: var(--on-primary);
}

/* 填空题 */
.blank-wrap { display: flex; gap: 10px; margin-top: 4px; }
.blank-input {
  flex: 1; border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius-sm); padding: 14px 16px;
  font-size: 16px; font-family: var(--font-body);
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  transition: border-color .2s;
}
.blank-input:focus { outline: none; border-color: var(--primary); }
.blank-input.correct { border-color: var(--success); background: var(--success-container); }
.blank-input.wrong { border-color: var(--error); background: var(--error-container); }
.blank-submit {
  border: none; background: var(--primary); color: var(--on-primary);
  border-radius: var(--radius-sm); padding: 14px 22px; font-size: 15px; font-weight: 600;
  cursor: pointer; transition: background .2s;
}
.blank-submit:hover { background: var(--primary-hover); }
.blank-submit:disabled { opacity: .4; cursor: not-allowed; }

/* 反馈 */
.feedback {
  margin-top: 16px; padding: 14px 16px; border-radius: var(--radius-sm);
  font-size: 15px; font-weight: 600;
}
.feedback.ok {
  background: var(--success-container); color: var(--success);
}
.feedback.no {
  background: var(--error-container); color: var(--error);
}

/* 知识点 */
.knowledge {
  margin-top: 14px; padding: 16px;
  background: var(--surface-container-low);
  border-radius: var(--radius-sm);
  border-left: 3px solid var(--primary);
}
.k-title {
  font-weight: 700; font-size: 14px; color: var(--primary);
  margin-bottom: 6px;
}
.k-body {
  font-size: 14px; color: var(--on-surface-variant); line-height: 1.6;
  white-space: pre-wrap;
}

.next-btn {
  margin-top: 16px; width: 100%; border: none; cursor: pointer;
  border-radius: var(--radius-sm); background: var(--primary); color: var(--on-primary);
  font-size: 16px; font-weight: 600; padding: 14px;
  transition: background .2s;
}
.next-btn:hover { background: var(--primary-hover); }

/* ==================== 成绩页 ==================== */
.score-card {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  text-align: center;
  margin-bottom: 16px;
  box-shadow: var(--shadow-sm);
}
.score-card .big {
  font-family: var(--font-headline);
  font-size: 48px; font-weight: 700; color: var(--primary);
  margin: 8px 0;
}
.score-card .row {
  display: flex; justify-content: space-around;
  margin-top: 20px; padding-top: 20px;
  border-top: 1px solid var(--outline-variant);
}
.score-card .row > div {
  font-size: 13px; color: var(--on-surface-variant);
}
.score-card .row b {
  display: block; font-family: var(--font-headline);
  font-size: 22px; color: var(--on-surface); margin-top: 4px;
}
.rest-hint {
  text-align: center; color: var(--on-surface-variant);
  font-size: 14px; padding: 16px; margin-bottom: 12px;
  background: var(--surface-container-low); border-radius: var(--radius-sm);
}
.score-actions { display: flex; flex-direction: column; gap: 10px; }

/* ==================== 题库总览 ==================== */
.ov-total {
  text-align: center; font-size: 14px; color: var(--on-surface-variant);
  padding: 16px; margin-bottom: 20px;
  background: var(--surface-container-low); border-radius: var(--radius-sm);
}
.ov-total b { color: var(--primary); font-size: 18px; }

.ov-section { margin-bottom: 24px; }
.ov-section-title {
  font-family: var(--font-headline);
  font-size: 22px; font-weight: 700; color: var(--on-surface);
  margin-bottom: 12px; padding-bottom: 8px;
  border-bottom: 1px solid var(--outline-variant);
}
.ov-section-title span {
  font-size: 14px; color: var(--on-surface-variant); font-weight: 400;
  font-family: var(--font-body);
}

.ov-subj-card {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 16px; margin-bottom: 10px;
  box-shadow: var(--shadow-xs);
  transition: box-shadow .2s;
}
.ov-subj-card:hover { box-shadow: var(--shadow-sm); }
.ov-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 10px;
}
.ov-subj-name {
  font-family: var(--font-headline);
  font-weight: 700; font-size: 18px; color: var(--primary);
  cursor: pointer;
}
.ov-subj-name:hover { text-decoration: underline; }
.ov-cat-row { display: flex; gap: 6px; }
.ov-cat-chip {
  font-size: 12px; font-weight: 600; padding: 4px 10px;
  border-radius: var(--radius-full); cursor: pointer;
  transition: opacity .2s;
}
.ov-cat-chip.inside { background: var(--info-container); color: var(--info); }
.ov-cat-chip.outside { background: var(--tertiary-fixed); color: var(--tertiary); }
.ov-cat-chip:hover { opacity: .8; }
.ov-chart { display: flex; align-items: center; gap: 12px; margin: 10px 0; }
.ov-stack {
  flex: 1; height: 10px; border-radius: var(--radius-full);
  overflow: hidden; display: flex; background: var(--surface-container-high);
}
.ov-stack .seg { height: 100%; }
.ov-stack .seg.d1 { background: var(--success); }
.ov-stack .seg.d2 { background: var(--primary); }
.ov-stack .seg.d3 { background: var(--error); }
.ov-total { font-size: 13px; color: var(--on-surface-variant); cursor: pointer; white-space: nowrap; }
.ov-total:hover { color: var(--primary); }
.ov-legend { display: flex; gap: 14px; }
.ov-legend .lg {
  font-size: 12px; color: var(--on-surface-variant);
  display: flex; align-items: center; gap: 4px; cursor: pointer;
}
.ov-legend .lg i {
  width: 10px; height: 10px; border-radius: 3px; display: inline-block;
}
.ov-legend .lg.d1 i { background: var(--success); }
.ov-legend .lg.d2 i { background: var(--primary); }
.ov-legend .lg.d3 i { background: var(--error); }
.ov-legend .lg:hover { color: var(--primary); }
.ov-note {
  font-size: 13px; color: var(--on-surface-variant); line-height: 1.6;
  margin-top: 16px; padding: 16px;
  background: var(--surface-container-low); border-radius: var(--radius-sm);
}
.data-source {
  margin-top: 24px; padding: 20px;
  background: var(--surface-container-low); border-radius: var(--radius-md);
}
.data-source h4 { margin: 0 0 10px; font-size: 16px; }
.data-source ul { margin: 0; padding-left: 20px; }
.data-source li { font-size: 13px; color: var(--on-surface-variant); margin-bottom: 6px; line-height: 1.6; }
.data-source a { color: var(--primary); }
.ds-tip {
  font-size: 13px; color: var(--on-surface-variant);
  margin-top: 12px; font-style: italic;
}

/* ==================== 错题本 ==================== */
.wrong-stat {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding: 14px 16px; margin-bottom: 14px;
  background: var(--surface-container-low); border-radius: var(--radius-sm);
}
.ws-total { font-size: 14px; color: var(--on-surface-variant); margin-right: 6px; }
.ws-total b { color: var(--primary); font-size: 18px; font-family: var(--font-headline); }
.ws-chip {
  font-size: 12px; font-weight: 600; padding: 4px 10px;
  border-radius: var(--radius-full); background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant); color: var(--on-surface-variant);
}
.ws-chip b { color: var(--primary); }

.wrong-chips { margin-bottom: 14px; }

.wrong-list { display: flex; flex-direction: column; gap: 12px; }
.wrong-item {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 18px;
  box-shadow: var(--shadow-xs);
}
.wrong-item-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 12px; margin-bottom: 8px;
}
.wq {
  font-size: 15px; font-weight: 600; color: var(--on-surface);
  line-height: 1.5; flex: 1;
}
.wdel {
  flex: 0 0 auto; border: none; background: transparent;
  color: var(--error); cursor: pointer; font-size: 16px;
  padding: 2px 6px; border-radius: var(--radius-sm);
  transition: background .2s;
}
.wdel:hover { background: var(--error-container); }
.wmeta {
  font-size: 13px; color: var(--on-surface-variant); margin-bottom: 6px;
}
.wk {
  font-size: 13px; color: var(--on-surface-variant);
  padding: 10px 12px; background: var(--surface-container-low);
  border-radius: var(--radius-sm); line-height: 1.5;
}

/* 错题标签区域 */
.wrong-item-tags {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px;
  align-items: center;
}
.wtag {
  font-size: 12px; font-weight: 600; padding: 3px 10px;
  border-radius: var(--radius-full); color: #fff;
}
.wtag-add {
  font-size: 12px; font-weight: 600; padding: 3px 10px;
  border-radius: var(--radius-full); border: 1px dashed var(--outline);
  background: transparent; color: var(--on-surface-variant);
  cursor: pointer; transition: all .2s;
}
.wtag-add:hover { border-color: var(--primary); color: var(--primary); }

/* 标签管理区 */
.tag-manager {
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 16px; margin-bottom: 16px;
}
.tag-manager h4 {
  margin: 0 0 10px; font-size: 14px; font-weight: 700;
  color: var(--on-surface-variant); text-transform: uppercase; letter-spacing: 0.05em;
  font-family: var(--font-label);
}
.tag-list { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.tag-item {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 12px; border-radius: var(--radius-full);
  font-size: 13px; font-weight: 600; color: #fff;
}
.tag-item-del {
  border: none; background: rgba(255,255,255,.3); color: #fff;
  border-radius: 50%; width: 18px; height: 18px;
  cursor: pointer; font-size: 12px; line-height: 1;
  display: grid; place-items: center;
}
.tag-add-form { display: flex; gap: 8px; align-items: center; }
.tag-add-form input {
  flex: 1; border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius-sm); padding: 8px 12px;
  font-size: 14px; font-family: var(--font-body);
  background: var(--surface-container-lowest);
}
.tag-add-form input:focus { outline: none; border-color: var(--primary); }
.tag-color-pick { display: flex; gap: 6px; }
.tag-color-dot {
  width: 24px; height: 24px; border-radius: 50%;
  cursor: pointer; border: 2px solid transparent;
  transition: border-color .2s;
}
.tag-color-dot.sel { border-color: var(--on-surface); }

.wrong-actions { margin-top: 16px; }
.wrong-tools { display: flex; gap: 10px; margin-top: 10px; }
.tool-btn {
  flex: 1; border: 1.5px solid var(--outline-variant);
  background: var(--surface-container-lowest); color: var(--on-surface-variant);
  border-radius: var(--radius-sm); padding: 12px; font-size: 14px; font-weight: 600;
  cursor: pointer; transition: all .2s;
}
.tool-btn:hover { border-color: var(--primary); color: var(--primary); }
.tool-btn.danger:hover { border-color: var(--error); color: var(--error); }

/* ==================== 我的 ==================== */
.profile-stats {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;
  margin-bottom: 8px;
}
.pstat {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md); padding: 18px;
  text-align: center; box-shadow: var(--shadow-xs);
}
.pstat span {
  display: block; font-size: 13px; color: var(--on-surface-variant);
  margin-bottom: 6px; font-weight: 600;
}
.pstat b {
  font-family: var(--font-headline);
  font-size: 28px; font-weight: 700; color: var(--primary);
}

.settings-box {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.set-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 16px 18px;
  border-bottom: 1px solid var(--outline-variant);
}
.set-row:last-child { border-bottom: none; }
.set-name { font-size: 15px; font-weight: 600; color: var(--on-surface); }
.set-desc { font-size: 13px; color: var(--on-surface-variant); display: block; margin-top: 2px; }

.switch { position: relative; display: inline-block; width: 44px; height: 26px; }
.switch input { opacity: 0; width: 0; height: 0; }
.slider {
  position: absolute; cursor: pointer; inset: 0;
  background: var(--outline-variant); border-radius: var(--radius-full);
  transition: .3s;
}
.slider::before {
  position: absolute; content: ''; height: 20px; width: 20px;
  left: 3px; bottom: 3px; background: #fff;
  border-radius: 50%; transition: .3s;
  box-shadow: var(--shadow-xs);
}
.switch input:checked + .slider { background: var(--primary); }
.switch input:checked + .slider::before { transform: translateX(18px); }

.seg { display: flex; border: 1px solid var(--outline-variant); border-radius: var(--radius-sm); overflow: hidden; }
.seg button {
  border: none; background: var(--surface-container-lowest);
  padding: 8px 14px; font-size: 13px; font-weight: 600;
  color: var(--on-surface-variant); cursor: pointer;
  border-right: 1px solid var(--outline-variant);
  transition: all .2s;
}
.seg button:last-child { border-right: none; }
.seg button.on { background: var(--primary); color: var(--on-primary); }

.calendar {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px;
  margin-bottom: 16px;
}
.cal-cell {
  aspect-ratio: 1; border-radius: var(--radius-sm);
  background: var(--surface-container-low);
  display: grid; place-items: center;
  font-size: 11px; font-weight: 600; color: var(--on-surface-variant);
}
.cal-cell.has { background: var(--primary-fixed); color: var(--on-primary-fixed-variant); }
.cal-cell.has2 { background: var(--primary-container); color: var(--on-primary-fixed); }
.cal-cell.today { outline: 2px solid var(--primary); }

/* ==================== 自定义模态框（替代原生 prompt/confirm/alert）===================== */
.xnh-modal-overlay {
  position: fixed; inset: 0;
  background: rgba(58, 48, 42, 0.42);
  z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  animation: xnhFadeIn .18s ease-out;
}
.xnh-modal-overlay[hidden] { display: none; }
@keyframes xnhFadeIn { from { opacity: 0; } to { opacity: 1; } }
.xnh-modal-card {
  width: 100%;
  max-width: 440px;
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
  padding: 24px 24px 18px;
  display: flex; flex-direction: column;
  animation: xnhPop .22s ease-out;
}
@keyframes xnhPop { from { transform: scale(.94); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.xnh-modal-head {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 10px;
}
.xnh-modal-icon {
  flex: 0 0 38px; height: 38px;
  display: grid; place-items: center;
  font-size: 22px; line-height: 1;
  background: var(--primary-fixed);
  color: var(--on-primary-fixed-variant);
  border-radius: var(--radius-sm);
}
.xnh-modal-title {
  font-family: var(--font-headline);
  font-size: 19px; font-weight: 700;
  color: var(--on-surface);
  margin: 0;
  letter-spacing: -0.01em;
  flex: 1; min-width: 0;
}
.xnh-modal-body {
  font-size: 15px; line-height: 1.6;
  color: var(--on-surface-variant);
  margin: 4px 0 14px;
  word-break: break-word;
  white-space: pre-wrap;
}
.xnh-modal-input-wrap { margin: 0 0 16px; }
.xnh-modal-input {
  width: 100%;
  border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  font-size: 15px;
  font-family: var(--font-body);
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  transition: border-color .2s;
  resize: vertical;
}
.xnh-modal-textarea { min-height: 80px; line-height: 1.5; }
.xnh-modal-input:focus { outline: none; border-color: var(--primary); }
.xnh-modal-foot {
  display: flex; justify-content: flex-end; gap: 8px;
  margin-top: 6px;
}
.xnh-modal-btn {
  border: 1.5px solid transparent;
  border-radius: var(--radius-sm);
  padding: 10px 20px;
  font-size: 14px; font-weight: 600;
  cursor: pointer;
  font-family: var(--font-body);
  transition: all .15s;
  min-width: 84px;
}
.xnh-modal-btn:active { transform: scale(.97); }
.xnh-modal-btn.ghost {
  background: transparent;
  border-color: var(--outline-variant);
  color: var(--on-surface-variant);
}
.xnh-modal-btn.ghost:hover { border-color: var(--primary); color: var(--primary); }
.xnh-modal-btn.primary {
  background: var(--primary);
  border-color: var(--primary);
  color: var(--on-primary);
}
.xnh-modal-btn.primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
.xnh-modal-btn.danger {
  background: var(--error);
  border-color: var(--error);
  color: var(--on-error);
}
.xnh-modal-btn.danger:hover { background: #a33024; border-color: #a33024; }

/* ==================== 模态框内自定义表单字段（modalForm 用）==================== */
.xnh-field { margin-bottom: 12px; }
.xnh-field-label {
  display: block;
  font-size: 13px; color: var(--on-surface-variant);
  margin-bottom: 6px; font-weight: 500;
}
.xnh-field-input {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  font-size: 14px;
  font-family: var(--font-body);
  box-sizing: border-box;
}
.xnh-field-input:focus { outline: none; border-color: var(--primary); }
textarea.xnh-field-input,
.xnh-field-input.xnh-textarea { min-height: 90px; resize: vertical; line-height: 1.5; font-family: var(--font-mono); }
select.xnh-field-input { cursor: pointer; }

/* 底部批量操作条（用户管理 / 商店管理） */
.admin-batch-bar {
  margin: 18px 0 6px 0;
  padding: 14px 16px;
  background: var(--surface-container-lowest);
  border: 1px dashed var(--outline-variant);
  border-radius: var(--radius-md);
  text-align: center;
}
.admin-batch-bar .big-btn { width: auto; display: inline-flex; }


/* 无障碍：仅供屏幕阅读器读到的文本 */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* 登录页：独占一屏、垂直水平居中（满屏减去顶栏高度） */
.screen[data-screen="login"] {
  display: none;
  min-height: calc(100vh - var(--topbar-h) - env(safe-area-inset-top));
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}
.screen[data-screen="login"].active { display: flex; }
.screen[data-screen="login"] .login-card {
  margin: 0 auto;
  width: 100%;
}
.login-card {
  max-width: 400px; margin: 60px auto;
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-xl);
  padding: 40px 32px;
  box-shadow: var(--shadow-md);
  text-align: center;
  position: relative;
  overflow: hidden;
}
.login-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0;
  height: 5px; background: var(--primary);
}
.login-emo { font-size: 40px; margin-bottom: 12px; text-align: center; }
.login-title {
  font-family: var(--font-headline);
  font-size: 26px; font-weight: 700; color: var(--on-surface);
  margin: 0 0 6px; text-align: center;
}
.login-hint {
  color: var(--on-surface-variant); font-size: 14px; margin: 0 0 24px; text-align: center;
}
.login-form {
  display: flex; flex-direction: column; gap: 12px;
  text-align: left;
  align-items: stretch;
}
.login-input {
  width: 100%; border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius-sm); padding: 13px 16px;
  font-size: 15px; font-family: var(--font-body);
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  transition: border-color .2s;
  text-align: left;
}
.login-input:focus { outline: none; border-color: var(--primary); }
.login-input::placeholder { color: var(--outline); }
select.login-input { cursor: pointer; }
.login-tip {
  margin-top: 14px; font-size: 14px; color: var(--error);
  min-height: 20px; text-align: center;
}

/* ==================== 管理员页面 ==================== */
.admin-add-box {
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 20px; margin-bottom: 8px;
}
.admin-form {
  display: flex; flex-direction: column; gap: 10px;
}
.admin-user-list { display: flex; flex-direction: column; gap: 10px; }
.admin-user-item {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; padding: 16px 18px;
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-xs);
}
.au-info { flex: 1; min-width: 0; }
.au-name {
  font-size: 16px; font-weight: 700; color: var(--on-surface);
  font-family: var(--font-headline);
}
.au-role {
  font-size: 12px; font-weight: 600; padding: 2px 8px;
  border-radius: var(--radius-full); margin-left: 6px;
}
.au-role.admin { background: var(--primary); color: var(--on-primary); }
.au-role.teacher { background: var(--tertiary); color: var(--on-tertiary); }
.au-role.student { background: var(--secondary-container); color: var(--on-secondary-container); }
.au-me {
  font-size: 12px; font-weight: 600; padding: 2px 8px;
  border-radius: var(--radius-full); background: var(--info-container); color: var(--info);
  margin-left: 6px;
}
.au-meta { font-size: 13px; color: var(--on-surface-variant); margin-top: 4px; }
.au-actions { display: flex; gap: 6px; flex-shrink: 0; }
.au-btn {
  border: 1px solid var(--outline-variant);
  background: var(--surface-container-lowest); color: var(--on-surface-variant);
  border-radius: var(--radius-sm); padding: 8px 12px; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: all .2s; white-space: nowrap;
}
.au-btn:hover { border-color: var(--primary); color: var(--primary); }
.au-btn.danger:hover { border-color: var(--error); color: var(--error); }
.au-btn:disabled { opacity: .4; cursor: not-allowed; }

/* --- 礼物管理（管理员） --- */
.admin-divider { margin-top: 32px; padding-top: 16px; border-top: 1.5px dashed var(--outline-variant); }
.admin-gift-list { display: flex; flex-direction: column; gap: 10px; }
.gift-item {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 18px;
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-xs);
}
.gi-emoji {
  flex: 0 0 50px; height: 50px; font-size: 30px; line-height: 1;
  display: grid; place-items: center;
  background: var(--primary-fixed); border-radius: var(--radius-md);
}
.gi-info { flex: 1; min-width: 0; }
.gi-name {
  font-size: 16px; font-weight: 700; color: var(--on-surface);
  font-family: var(--font-headline);
}
.gi-disabled {
  font-size: 12px; font-weight: 600; padding: 2px 8px;
  border-radius: var(--radius-full); background: var(--surface-container);
  color: var(--on-surface-variant); margin-left: 6px;
}
.gi-meta { font-size: 13px; color: var(--on-surface-variant); margin-top: 4px; }
.gi-actions { display: flex; gap: 6px; flex-shrink: 0; flex-wrap: wrap; }

/* --- 兑换记录（管理员） --- */
.admin-redemption-list { display: flex; flex-direction: column; gap: 10px; }
.redemption-item {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; padding: 14px 18px;
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-xs);
}
.ri-info { flex: 1; min-width: 0; }
.ri-name {
  font-size: 15px; font-weight: 700; color: var(--on-surface);
  font-family: var(--font-headline);
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.ri-status {
  font-size: 12px; font-weight: 600; padding: 2px 8px;
  border-radius: var(--radius-full);
}
.ri-status.pending { background: var(--info-container); color: var(--info); }
.ri-status.fulfilled { background: var(--success-container); color: var(--success); }
.ri-status.cancelled { background: var(--surface-container-high); color: var(--on-surface-variant); }
.ri-meta { font-size: 13px; color: var(--on-surface-variant); margin-top: 4px; }
.ri-note { font-size: 12px; color: var(--error); margin-top: 4px; }
.ri-actions { display: flex; gap: 6px; flex-shrink: 0; }

/* ==================== 礼物兑换（学生） ==================== */
.gifts-points-box {
  background: var(--primary-fixed);
  color: var(--on-primary-fixed-variant);
  border-radius: var(--radius-md);
  padding: 14px 18px;
  font-size: 16px; font-weight: 600;
  text-align: center;
  border: 1px solid var(--primary-container);
}
.gifts-points-box b { font-size: 22px; color: var(--primary); font-weight: 800; }

.gift-shop-list { display: flex; flex-direction: column; gap: 10px; }
.gift-shop-item {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 18px;
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-xs);
  transition: all .2s;
}
.gift-shop-item:hover:not(.disabled) {
  border-color: var(--primary-container);
  box-shadow: var(--shadow-sm);
}
.gift-shop-item.disabled { opacity: .55; }
.gsi-emoji {
  flex: 0 0 54px; height: 54px; font-size: 34px; line-height: 1;
  display: grid; place-items: center;
  background: var(--primary-fixed); border-radius: var(--radius-md);
}
.gsi-info { flex: 1; min-width: 0; }
.gsi-name {
  font-size: 16px; font-weight: 700; color: var(--on-surface);
  font-family: var(--font-headline);
}
.gsi-desc { font-size: 13px; color: var(--on-surface-variant); margin-top: 2px; }
.gsi-meta { font-size: 13px; color: var(--primary); font-weight: 600; margin-top: 4px; }
.gsi-btn {
  flex: 0 0 auto;
  width: auto;
  margin: 0;
  padding: 10px 22px;
  font-size: 14px;
  font-weight: 700;
}

/* --- 我的兑换记录（学生） --- */
.my-redeem-list { display: flex; flex-direction: column; gap: 8px; }
.my-redeem-item {
  padding: 12px 16px;
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-xs);
}
.mr-name {
  font-size: 15px; font-weight: 700; color: var(--on-surface);
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.mr-status {
  font-size: 11px; font-weight: 600; padding: 2px 8px;
  border-radius: var(--radius-full);
}
.mr-status.pending { background: var(--info-container); color: var(--info); }
.mr-status.fulfilled { background: var(--success-container); color: var(--success); }
.mr-status.cancelled { background: var(--surface-container-high); color: var(--on-surface-variant); }
.mr-meta { font-size: 12px; color: var(--on-surface-variant); margin-top: 4px; }
.mr-note { font-size: 12px; color: var(--error); margin-top: 2px; }

/* ==================== 老师页面 ==================== */
.teacher-add-box {
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 20px; margin-bottom: 8px;
}
.teacher-student-list { display: flex; flex-direction: column; gap: 10px; }
.teacher-student-item {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; padding: 16px 18px;
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-xs);
}
.ts-info { flex: 1; min-width: 0; }
.ts-name {
  font-size: 16px; font-weight: 700; color: var(--on-surface);
  font-family: var(--font-headline);
}
.ts-meta { font-size: 13px; color: var(--on-surface-variant); margin-top: 4px; }
.ts-grade {
  display: inline-block; font-size: 12px; font-weight: 600;
  padding: 2px 8px; border-radius: var(--radius-full);
  background: var(--primary-container); color: var(--on-primary-container);
  vertical-align: middle; margin-left: 6px;
}
.ts-grade.none { background: var(--surface-container-high); color: var(--on-surface-variant); font-weight: 500; }
.ts-stats { display: flex; gap: 12px; margin-top: 8px; }
.ts-stat {
  font-size: 12px; color: var(--on-surface-variant);
}
.ts-stat b { color: var(--primary); font-weight: 700; }
.ts-actions { display: flex; gap: 6px; flex-shrink: 0; flex-direction: column; }

/* ==================== 学习记录页 ==================== */
/* 面包屑 */
.rec-breadcrumb {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin: 8px 0 16px; padding: 10px 14px;
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  font-size: 14px;
}
.rec-bc-item {
  background: none; border: none; padding: 4px 8px;
  border-radius: var(--radius-sm); cursor: pointer;
  color: var(--primary); font-weight: 600;
  font-size: 14px;
}
.rec-bc-item:hover { background: var(--primary-container); color: var(--on-primary-container); }
.rec-bc-sep { color: var(--on-surface-variant); opacity: .6; }
.rec-bc-cur { color: var(--on-surface); font-weight: 600; }
.records-pane { animation: recPaneIn .25s ease-out; }
@keyframes recPaneIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

/* 日期筛选 */
.rec-date-filter {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 12px 16px; margin-bottom: 14px;
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  font-size: 14px;
}
.rec-date-filter label { color: var(--on-surface); font-weight: 600; }
.rec-date-filter input[type="date"] {
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-sm);
  padding: 6px 10px; font-size: 14px;
  font-family: var(--font-body);
  background: var(--surface-container-lowest);
  color: var(--on-surface);
}
.rec-date-filter input[type="date"]:focus { outline: none; border-color: var(--primary); }
.rec-date-filter > span { color: var(--on-surface-variant); }
.rec-btn-mini {
  border: 1px solid var(--outline-variant);
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  padding: 6px 14px; border-radius: var(--radius-sm);
  font-size: 14px; cursor: pointer; font-weight: 600;
  transition: all .15s;
}
.rec-btn-mini:hover { border-color: var(--primary); }
.rec-btn-mini.primary { background: var(--primary); color: var(--on-primary); border-color: var(--primary); }
.rec-btn-mini.primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
.rec-btn-mini.ghost { background: transparent; color: var(--on-surface-variant); }

/* ==================== 通用分页器（Ant Design / Element UI 风格） ==================== */
.pg-pager {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
  gap: 12px; padding: 12px 16px; margin: 12px 0 18px;
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  font-size: 14px;
  color: var(--on-surface);
}
.pg-total { color: var(--on-surface-variant); font-size: 13px; }
.pg-total b { color: var(--primary); font-weight: 700; }
.pg-pages { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.pg-btn {
  border: 1px solid var(--outline-variant);
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  padding: 5px 11px; min-width: 34px; height: 32px;
  border-radius: var(--radius-sm);
  font-size: 13px; font-weight: 600; cursor: pointer;
  transition: all .15s;
  font-family: var(--font-body);
  line-height: 1;
}
.pg-btn:hover:not(:disabled):not(.active) {
  border-color: var(--primary);
  color: var(--primary);
}
.pg-btn:disabled { opacity: .4; cursor: not-allowed; }
.pg-btn.active {
  background: var(--primary);
  color: var(--on-primary);
  border-color: var(--primary);
}
.pg-first, .pg-last, .pg-prev, .pg-next { padding: 5px 9px; }
.pg-ellipsis { color: var(--on-surface-variant); padding: 0 4px; user-select: none; }
.pg-jump { display: flex; align-items: center; gap: 6px; color: var(--on-surface-variant); font-size: 13px; }
.pg-jump-input {
  width: 56px; height: 32px; text-align: center;
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-sm);
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  font-size: 13px;
  font-family: var(--font-body);
  padding: 0 4px;
}
.pg-jump-input:focus { outline: none; border-color: var(--primary); }
.pg-go { padding: 5px 11px; background: var(--primary); color: var(--on-primary); border-color: var(--primary); }
.pg-go:hover:not(:disabled) { background: var(--primary-hover); border-color: var(--primary-hover); }

.records-header {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 20px; margin-bottom: 16px;
  box-shadow: var(--shadow-xs);
}
.records-header h3 {
  margin: 0 0 6px; font-family: var(--font-headline);
  font-size: 20px; color: var(--on-surface);
}
.records-stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
  margin-top: 14px;
}
.records-stat {
  text-align: center; padding: 14px;
  background: var(--surface-container-low);
  border-radius: var(--radius-sm);
}
.records-stat span {
  display: block; font-size: 12px; color: var(--on-surface-variant);
  font-weight: 600; margin-bottom: 4px;
}
.records-stat b {
  font-family: var(--font-headline);
  font-size: 24px; color: var(--primary); font-weight: 700;
}

.records-section {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 18px; margin-bottom: 14px;
  box-shadow: var(--shadow-xs);
}
.records-section h4 {
  margin: 0 0 12px; font-size: 15px; font-weight: 700;
  color: var(--on-surface); font-family: var(--font-headline);
}
.records-list { display: flex; flex-direction: column; gap: 8px; }
.record-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 14px; font-size: 14px;
  background: var(--surface-container-low);
  border-radius: var(--radius-sm);
}
.record-item .r-time { color: var(--on-surface-variant); font-size: 13px; }
.record-item .r-status { font-weight: 600; }
.record-item .r-status.ok { color: var(--success); }
.record-item .r-status.no { color: var(--error); }
.record-item .r-status.pending { color: var(--info); }

/* 学生选择器 */
.student-selector {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px;
}
.student-selector .chip { font-size: 13px; }

.empty {
  text-align: center; padding: 40px 20px;
  color: var(--on-surface-variant); font-size: 15px;
}

/* ==================== 休息卡 ==================== */
.rest-overlay {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(58, 48, 42, 0.5);
  backdrop-filter: blur(8px);
  display: grid; place-items: center;
  padding: 20px;
}
.rest-card {
  background: var(--surface-container-lowest);
  border-radius: var(--radius-xl);
  padding: 36px 28px; max-width: 400px; width: 100%;
  text-align: center;
  box-shadow: var(--shadow-lg);
}
.rest-emo { font-size: 48px; margin-bottom: 12px; }
.rest-card h2 {
  font-family: var(--font-headline);
  font-size: 26px; margin: 0 0 8px; color: var(--on-surface);
}
.rest-tip { color: var(--on-surface-variant); font-size: 14px; margin: 0 0 20px; }
.rest-steps {
  display: flex; flex-direction: column; gap: 10px;
  text-align: left; margin-bottom: 20px;
}
.rest-step {
  padding: 12px 14px; background: var(--surface-container-low);
  border-radius: var(--radius-sm);
}
.rest-step b { display: block; font-size: 14px; color: var(--primary); margin-bottom: 2px; }
.rest-step span { font-size: 13px; color: var(--on-surface-variant); }
.timer {
  font-family: var(--font-headline);
  font-size: 56px; font-weight: 700; color: var(--primary);
  margin: 10px 0;
}

/* ==================== Toast ==================== */
.toast {
  position: fixed; bottom: 30px; left: 50%; transform: translateX(-50%);
  background: var(--inverse-surface); color: var(--inverse-on-surface);
  padding: 12px 24px; border-radius: var(--radius-full);
  font-size: 14px; font-weight: 600; z-index: 200;
  box-shadow: var(--shadow-lg);
  animation: toastIn .3s ease-out;
}
@keyframes toastIn {
  from { opacity: 0; transform: translate(-50%, 20px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}

/* ==================== 动画 ==================== */
@keyframes popIn {
  0% { transform: scale(.95); opacity: .5; }
  100% { transform: scale(1); opacity: 1; }
}

/* ==================== 题目导入页 ==================== */
.import-desc {
  font-size: 14px; color: var(--on-surface-variant);
  line-height: 1.6; margin: 0 0 20px;
  padding: 14px 16px; background: var(--info-container);
  border-radius: var(--radius-md); border: 1px solid rgba(91, 107, 138, 0.15);
}
.import-format-box {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 18px; margin-bottom: 20px;
  box-shadow: var(--shadow-xs);
}
.import-format-box h4 {
  margin: 0 0 10px; font-size: 14px; font-weight: 700;
  color: var(--on-surface-variant); font-family: var(--font-label);
}
.import-format-code {
  background: #2d2520; color: #e8dcc8;
  border-radius: var(--radius-sm); padding: 16px;
  font-size: 12.5px; font-family: 'Cascadia Code', 'Consolas', 'Monaco', monospace;
  line-height: 1.6; overflow-x: auto; white-space: pre;
  margin: 0; max-height: 360px; overflow-y: auto;
}
.import-tabs {
  display: flex; gap: 0; margin-bottom: 16px;
  border-bottom: 2px solid var(--outline-variant);
}
.import-tab {
  border: none; background: transparent; cursor: pointer;
  padding: 12px 20px; font-size: 14px; font-weight: 600;
  color: var(--on-surface-variant); transition: all .2s;
  border-bottom: 2px solid transparent; margin-bottom: -2px;
  font-family: var(--font-body);
}
.import-tab:hover { color: var(--primary); }
.import-tab.sel { color: var(--primary); border-bottom-color: var(--primary); }
.import-panel { animation: screenIn .25s ease-out; }
.import-textarea {
  width: 100%; border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius-sm); padding: 14px 16px;
  font-size: 14px; font-family: 'Cascadia Code', 'Consolas', 'Monaco', monospace;
  background: var(--surface-container-lowest); color: var(--on-surface);
  resize: vertical; min-height: 180px; transition: border-color .2s;
  line-height: 1.6;
}
.import-textarea:focus { outline: none; border-color: var(--primary); }
.import-textarea::placeholder { color: var(--outline); font-family: var(--font-body); }
.file-drop-zone {
  border: 2px dashed var(--outline); border-radius: var(--radius-md);
  padding: 40px 20px; text-align: center; cursor: pointer;
  transition: all .2s; background: var(--surface-container-low);
}
.file-drop-zone:hover, .file-drop-zone.dragover {
  border-color: var(--primary); background: var(--primary-fixed);
}
.file-drop-icon { font-size: 40px; margin-bottom: 10px; }
.file-drop-zone p { color: var(--on-surface-variant); font-size: 14px; margin: 0; }
.file-info {
  margin-top: 12px; padding: 10px 14px;
  background: var(--surface-container-low); border-radius: var(--radius-sm);
  font-size: 13px; color: var(--on-surface-variant);
}
.file-info .fi-name { font-weight: 600; color: var(--on-surface); }
.file-info .fi-err { color: var(--error); }

/* 单题录入表单 */
.template-form { display: flex; flex-direction: column; gap: 10px; }
.tf-row { display: flex; flex-wrap: wrap; gap: 8px; }
.tf-field { flex: 1; min-width: 120px; }
.tf-opt { margin-bottom: 0; }
.tf-question { min-height: 80px; }
.tf-explain { min-height: 50px; }
.tf-queue {
  display: flex; flex-direction: column; gap: 8px; margin-top: 16px;
}
.tf-queue-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 14px; background: var(--surface-container-low);
  border-radius: var(--radius-sm); border: 1px solid var(--outline-variant);
  font-size: 13px; gap: 8px;
}
.tf-qi-type {
  font-weight: 600; padding: 2px 8px; border-radius: var(--radius-full);
  font-size: 12px; background: var(--secondary-container); color: var(--on-secondary-container);
  white-space: nowrap;
}
.tf-qi-text {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; color: var(--on-surface);
}
.tf-qi-del {
  border: none; background: transparent; cursor: pointer;
  color: var(--error); font-size: 18px; padding: 2px 6px;
  flex-shrink: 0;
}
.import-result { margin-top: 16px; }
.import-success {
  padding: 16px; background: var(--success-container);
  border-radius: var(--radius-md); border: 1px solid rgba(90, 124, 62, 0.2);
}
.is-count { font-size: 16px; font-weight: 700; color: var(--success); margin-bottom: 8px; }
.is-detail {
  font-size: 13px; color: var(--on-surface-variant); line-height: 1.6;
}
.is-detail .is-err { color: var(--error); }
.import-fail {
  padding: 16px; background: var(--error-container);
  border-radius: var(--radius-md); border: 1px solid rgba(192, 57, 43, 0.2);
  font-size: 14px; color: var(--on-error-container); font-weight: 600;
}

/* ==================== AI 出题页 ==================== */
.ai-gen-box {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 20px; margin-bottom: 20px;
  box-shadow: var(--shadow-xs);
}
.ai-gen-box .setup-group { margin-bottom: 18px; }
.ai-gen-box .setup-group:last-of-type { margin-bottom: 0; }

/* 生成进度 */
.ai-progress {
  padding: 24px; background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant); border-radius: var(--radius-md);
  margin-bottom: 16px; text-align: center;
}
.ai-progress-inner {
  display: flex; flex-direction: column; align-items: center; gap: 14px;
}
.ai-spinner {
  width: 36px; height: 36px; border-radius: 50%;
  border: 3px solid var(--primary-fixed);
  border-top-color: var(--primary);
  animation: aiSpin .8s linear infinite;
}
@keyframes aiSpin { to { transform: rotate(360deg); } }
.ai-progress-text { font-size: 14px; color: var(--on-surface-variant); font-weight: 600; }

/* 全屏加载遮罩（AI 错题变体生成等） */
.ai-loading-mask {
  position: fixed; inset: 0; z-index: 200;
  display: flex; align-items: center; justify-content: center;
  background: rgba(20, 16, 12, 0.35); backdrop-filter: blur(2px);
}
.ai-loading-box {
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  padding: 28px 36px; background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant); border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
}
.ai-loading-text { font-size: 14px; color: var(--on-surface-variant); font-weight: 600; text-align: center; }

/* AI 生成结果 */
.ai-result { margin-top: 16px; }
.ai-qlist { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.ai-q-item {
  padding: 12px 14px; background: var(--surface-container-low);
  border: 1px solid var(--outline-variant); border-radius: var(--radius-sm);
  cursor: pointer; transition: border-color .15s;
}
.ai-q-item:hover { border-color: var(--primary-container); }
.ai-q-head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px;
}
.ai-q-head .aq-subj { font-size: 12px; color: var(--on-surface-variant); }
.ai-q-toggle {
  margin-left: auto; font-size: 12px; color: var(--primary);
  font-weight: 600; user-select: none;
}
.ai-q-text { font-size: 14px; color: var(--on-surface); line-height: 1.5; }
.ai-q-detail {
  margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--outline-variant);
  font-size: 13px; color: var(--on-surface-variant); line-height: 1.6;
}
.ai-q-opts { display: flex; flex-direction: column; gap: 4px; margin-bottom: 6px; }
.ai-q-kn, .ai-q-ex { margin-bottom: 4px; }

/* 布置作业页 - AI 出题按钮 */
.assign-step-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px;
}
.assign-step-head .sub { margin-bottom: 0; }
.ai-assign-trigger {
  border: 1.5px solid var(--primary); background: var(--primary-fixed);
  color: var(--on-primary-fixed-variant);
  border-radius: var(--radius-full); padding: 8px 16px;
  font-size: 13px; font-weight: 700; cursor: pointer;
  font-family: var(--font-body); transition: all .15s; white-space: nowrap;
}
.ai-assign-trigger:hover { background: var(--primary); color: var(--on-primary); }
.ai-assign-trigger:active { transform: scale(.95); }

/* AI 出题模态面板 */
.ai-assign-overlay {
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(45, 37, 32, 0.55);
  display: flex; align-items: center; justify-content: center;
  padding: 16px; animation: screenIn .2s ease-out;
}
.ai-assign-panel {
  background: var(--surface); border-radius: var(--radius-lg);
  width: 100%; max-width: 560px; max-height: 90vh; overflow-y: auto;
  box-shadow: 0 8px 32px rgba(0,0,0,0.2);
  animation: popIn .2s ease-out;
}
.ai-assign-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px; border-bottom: 1px solid var(--outline-variant);
  position: sticky; top: 0; background: var(--surface); z-index: 1;
}
.ai-assign-head h3 { margin: 0; font-size: 17px; font-weight: 700; color: var(--on-surface); }
.ai-assign-close {
  border: none; background: transparent; cursor: pointer;
  font-size: 20px; color: var(--on-surface-variant);
  padding: 4px 8px; border-radius: var(--radius-sm); transition: all .15s;
}
.ai-assign-close:hover { background: var(--surface-container-high); color: var(--on-surface); }
.ai-assign-body { padding: 20px; }
.ai-assign-body .setup-group { margin-bottom: 16px; }
.ai-assign-body .big-btn { margin-top: 8px; }
.ai-assign-progress { padding: 0 20px 16px; }
.ai-assign-result { padding: 0 20px 20px; }

/* ==================== 应用题（答题中） ==================== */
.essay-wrap { display: flex; flex-direction: column; gap: 12px; }
.essay-input {
  width: 100%; border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius-sm); padding: 14px 16px;
  font-size: 15px; font-family: var(--font-body); line-height: 1.7;
  background: var(--surface-container-lowest); color: var(--on-surface);
  resize: vertical; min-height: 140px; transition: border-color .2s;
}
.essay-input:focus { outline: none; border-color: var(--primary); }
.essay-input:disabled { background: var(--surface-container-low); opacity: .8; }
.essay-input::placeholder { color: var(--outline); }
.essay-meta {
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 8px;
}
.essay-hint { font-size: 13px; color: var(--info); font-weight: 600; }
.essay-max {
  font-size: 13px; font-weight: 700; color: var(--primary);
  background: var(--primary-fixed); padding: 3px 10px;
  border-radius: var(--radius-full);
}
.essay-submit {
  align-self: flex-start; border: none; cursor: pointer;
  background: var(--primary); color: var(--on-primary);
  border-radius: var(--radius-sm); padding: 12px 28px;
  font-size: 15px; font-weight: 600; transition: all .2s;
}
.essay-submit:hover { background: var(--primary-hover); }
.essay-submit:disabled { opacity: .5; cursor: not-allowed; }
.essay-grade-result {
  background: var(--surface-container-low); border-radius: var(--radius-md);
  padding: 16px; margin-top: 8px; border: 1px solid var(--outline-variant);
}
.egr-score { font-size: 16px; font-weight: 700; margin-bottom: 8px; }
.egr-score.ok { color: var(--success); }
.egr-score.no { color: var(--error); }
.egr-reason {
  font-size: 13px; color: var(--on-surface-variant);
  line-height: 1.6; margin-bottom: 8px;
}
.egr-note {
  font-size: 12px; color: var(--info);
  padding-top: 8px; border-top: 1px solid var(--outline-variant);
}

/* ==================== 我的应用题成绩 ==================== */
.essay-result-card {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 18px; margin-bottom: 12px;
  box-shadow: var(--shadow-xs);
}
.er-head { margin-bottom: 10px; }
.er-status {
  font-size: 12px; font-weight: 700; padding: 4px 12px;
  border-radius: var(--radius-full); display: inline-block;
}
.er-status.reviewed { background: var(--success-container); color: var(--success); }
.er-status.auto { background: var(--info-container); color: var(--info); }
.er-status.pending { background: var(--surface-container-high); color: var(--on-surface-variant); }
.er-question {
  font-family: var(--font-headline); font-size: 16px; font-weight: 600;
  color: var(--on-surface); line-height: 1.5; margin-bottom: 6px;
}
.er-meta { font-size: 12px; color: var(--on-surface-variant); margin-bottom: 10px; }
.er-answer {
  font-size: 14px; color: var(--on-surface); line-height: 1.6;
  background: var(--surface-container-low); padding: 10px 14px;
  border-radius: var(--radius-sm); margin-bottom: 8px;
  white-space: pre-wrap; word-break: break-word;
}
.er-reason {
  font-size: 13px; color: var(--on-surface-variant);
  line-height: 1.6; margin-bottom: 8px;
  padding: 8px 12px; background: var(--info-container);
  border-radius: var(--radius-sm);
}
.er-score { font-size: 15px; font-weight: 600; margin-bottom: 4px; }
.er-score.final { color: var(--success); }
.er-score.final b { font-size: 20px; }
.er-score.auto { color: var(--info); }
.er-score.pending { color: var(--on-surface-variant); }
.er-auto { font-size: 13px; color: var(--on-surface-variant); margin-bottom: 4px; }
.er-teacher { font-size: 13px; color: var(--tertiary); margin-bottom: 4px; }
.er-feedback {
  font-size: 13px; color: var(--on-surface); line-height: 1.6;
  padding: 8px 12px; background: var(--success-container);
  border-radius: var(--radius-sm); margin-top: 4px;
}

/* ==================== 老师批改应用题 ==================== */
.essay-review-card {
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 18px; margin-bottom: 12px;
  box-shadow: var(--shadow-xs);
}
.erv-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.erv-student {
  font-family: var(--font-headline); font-size: 16px; font-weight: 700;
  color: var(--on-surface);
}
.erv-question {
  font-size: 15px; color: var(--on-surface); line-height: 1.5;
  margin-bottom: 6px; font-weight: 600;
}
.erv-meta { font-size: 12px; color: var(--on-surface-variant); margin-bottom: 10px; }
.erv-answer {
  font-size: 14px; color: var(--on-surface); line-height: 1.6;
  background: var(--surface-container-low); padding: 12px 14px;
  border-radius: var(--radius-sm); margin-bottom: 10px;
  white-space: pre-wrap; word-break: break-word;
}
.erv-auto { font-size: 14px; font-weight: 600; margin-bottom: 6px; color: var(--info); }
.erv-auto b { font-size: 16px; }
.erv-reason {
  font-size: 13px; color: var(--on-surface-variant); line-height: 1.6;
  margin-bottom: 10px; padding: 8px 12px;
  background: var(--info-container); border-radius: var(--radius-sm);
}
.erv-form { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; }
.erv-form label { font-size: 14px; font-weight: 600; color: var(--on-surface); }
.erv-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.erv-actions .big-btn { margin-top: 0; width: auto; }
.erv-score-input { max-width: 200px; }
.erv-final { font-size: 16px; font-weight: 700; color: var(--success); margin-bottom: 6px; }
.erv-final b { font-size: 20px; }
.erv-feedback {
  font-size: 13px; color: var(--on-surface); line-height: 1.6;
  padding: 8px 12px; background: var(--success-container);
  border-radius: var(--radius-sm); margin-bottom: 6px;
}
.erv-reviewed-time { font-size: 12px; color: var(--on-surface-variant); }

/* ==================== 老师布置作业 ==================== */
.assign-step { margin-bottom: 24px; }
.assign-step .sub { margin-bottom: 12px; }

/* 布置作业二级菜单 */
.assign-student-head {
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant); border-radius: 12px;
  padding: 12px 16px; margin-bottom: 18px;
}
.assign-student-head-name { font-size: 17px; font-weight: 800; color: var(--on-surface); }
.assign-student-head-meta { font-size: 13px; color: var(--on-surface-variant); margin-top: 3px; }

.assign-student-list { display: flex; flex-direction: column; gap: 10px; }
.assign-student-card {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px; background: var(--surface-container-lowest);
  border: 2px solid var(--outline-variant); border-radius: var(--radius-md);
  cursor: pointer; transition: all 0.2s;
}
.assign-student-card:hover { border-color: var(--primary-container); background: var(--primary-fixed); }
.assign-student-card.sel {
  border-color: var(--primary); background: var(--primary-fixed);
  box-shadow: var(--shadow-sm);
}
.as-avatar {
  flex: 0 0 42px; width: 42px; height: 42px;
  display: flex; align-items: center; justify-content: center;
  background: var(--primary); color: var(--on-primary);
  border-radius: var(--radius-full); font-size: 18px; font-weight: 700;
  font-family: var(--font-headline);
}
.as-info { flex: 1; }
.as-name { font-size: 16px; font-weight: 700; color: var(--on-surface); margin-bottom: 2px; }
.as-meta { font-size: 13px; color: var(--on-surface-variant); }
.as-arrow { font-size: 24px; color: var(--on-surface-variant); }

.assign-filters { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 16px; }
.assign-filter-group { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.af-label { font-size: 13px; font-weight: 600; color: var(--on-surface-variant); white-space: nowrap; }

.assign-search-box {
  display: flex; align-items: center; gap: 12px; margin-bottom: 14px;
}
.assign-search-box .login-input { flex: 1; }
.assign-count {
  font-size: 14px; font-weight: 600; color: var(--primary);
  white-space: nowrap; padding: 6px 14px;
  background: var(--primary-fixed); border-radius: var(--radius-full);
}

.assign-question-list {
  display: flex; flex-direction: column; gap: 8px;
  max-height: 520px; overflow-y: auto; margin-bottom: 16px;
  padding: 4px;
}
.assign-q-item {
  display: flex; gap: 12px; padding: 14px;
  background: var(--surface-container-lowest);
  border: 1.5px solid var(--outline-variant); border-radius: var(--radius-md);
  cursor: pointer; transition: all 0.15s;
}
.assign-q-item:hover { border-color: var(--primary-container); }
.assign-q-item.sel { border-color: var(--primary); background: var(--primary-fixed); }

.aq-checkbox { position: relative; flex: 0 0 22px; width: 22px; height: 22px; margin-top: 2px; }
.aq-checkbox input { position: absolute; opacity: 0; width: 100%; height: 100%; cursor: pointer; margin: 0; }
.aq-checkmark {
  display: block; width: 22px; height: 22px;
  border: 2px solid var(--outline); border-radius: 6px;
  transition: all 0.15s;
}
.aq-checkbox input:checked ~ .aq-checkmark {
  background: var(--primary); border-color: var(--primary);
}
.aq-checkbox input:checked ~ .aq-checkmark::after {
  content: '✓'; display: flex; align-items: center; justify-content: center;
  width: 100%; height: 100%; color: var(--on-primary); font-size: 15px; font-weight: 700;
}

.aq-body { flex: 1; min-width: 0; }
.aq-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.aq-type {
  font-size: 11px; font-weight: 700; color: var(--on-primary);
  background: var(--primary); padding: 2px 8px; border-radius: var(--radius-full);
}
.aq-diff { font-size: 12px; color: var(--tertiary); }
.aq-text { font-size: 14px; color: var(--on-surface); line-height: 1.5; margin-bottom: 4px; }
.aq-opts { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12px; color: var(--on-surface-variant); }
.aq-opts span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 200px; }

.assign-hw-item {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 14px; background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant); border-radius: var(--radius-md); margin-bottom: 8px;
}
.ahw-body { flex: 1; min-width: 0; }
.ahw-meta { font-size: 12px; color: var(--on-surface-variant); margin-bottom: 4px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ahw-text { font-size: 14px; color: var(--on-surface); line-height: 1.5; margin-bottom: 4px; }
.ahw-answer { font-size: 13px; color: var(--on-surface-variant); margin-bottom: 4px; }
.ahw-reason { font-size: 12px; color: var(--info); margin-bottom: 4px; }
.ahw-time { font-size: 11px; color: var(--on-surface-variant); }

.hw-summary {
  font-size: 14px; font-weight: 600; color: var(--on-surface);
  padding: 10px 14px; background: var(--info-container); border-radius: var(--radius-sm);
  margin-bottom: 12px;
}

/* ==================== 学生作业页 ==================== */
.hw-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 20px;
}
.hw-stat-item {
  text-align: center; padding: 14px 8px;
  background: var(--surface-container-lowest); border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
}
.hw-stat-item b { display: block; font-size: 24px; font-weight: 800; color: var(--primary); font-family: var(--font-headline); }
.hw-stat-item span { font-size: 12px; color: var(--on-surface-variant); }

.hw-card {
  background: var(--surface-container-lowest); border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius-lg); padding: 18px 20px; margin-bottom: 14px;
}
.hw-card.completed { border-color: var(--outline-variant); opacity: 0.92; }

.hw-head { margin-bottom: 12px; }
.hw-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12px; color: var(--on-surface-variant); margin-bottom: 4px; }
.hw-teacher { font-size: 12px; color: var(--on-surface-variant); }
.hw-question { font-size: 16px; color: var(--on-surface); line-height: 1.6; margin-bottom: 14px; font-weight: 500; }

.hw-score-line { font-size: 15px; color: var(--on-surface); margin-bottom: 12px; }
.hw-score-line b { font-size: 20px; color: var(--primary); font-family: var(--font-headline); }

.hw-badge { font-size: 11px; font-weight: 700; padding: 2px 10px; border-radius: var(--radius-full); }
.hw-badge.correct { background: var(--success-container); color: var(--success); }
.hw-badge.wrong { background: var(--error-container); color: var(--error); }
.hw-badge.pending { background: var(--primary-fixed); color: var(--on-primary-fixed-variant); }
.hw-badge.reviewed { background: var(--info-container); color: var(--info); }

.hw-options { display: flex; flex-direction: column; gap: 8px; }
.hw-opt {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px;
  background: var(--surface-container-low); border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius-sm); cursor: pointer; transition: all 0.15s;
}
.hw-opt:hover { border-color: var(--primary-container); background: var(--primary-fixed); }
.hw-opt input { accent-color: var(--primary); width: 18px; height: 18px; }
.hw-opt input:checked ~ .hw-opt-text { font-weight: 600; }
.hw-opt-letter {
  flex: 0 0 26px; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center;
  background: var(--surface-container-high); border-radius: var(--radius-full);
  font-size: 13px; font-weight: 700; color: var(--on-surface);
}
.hw-opt input:checked ~ .hw-opt-letter { background: var(--primary); color: var(--on-primary); }
.hw-opt-text { flex: 1; font-size: 14px; color: var(--on-surface); line-height: 1.4; }
.hw-blank-input { margin-bottom: 4px; }
.hw-essay-input { margin-bottom: 4px; }
.hw-submit-btn { margin-top: 6px; align-self: flex-start; }

.hw-result { display: flex; flex-direction: column; gap: 8px; }
.hw-your-answer {
  font-size: 14px; color: var(--on-surface); line-height: 1.5;
  padding: 10px 14px; background: var(--surface-container-low);
  border-radius: var(--radius-sm); border-left: 3px solid var(--primary);
}
.hw-feedback {
  font-size: 13px; color: var(--on-surface); line-height: 1.6;
  padding: 8px 12px; background: var(--info-container); border-radius: var(--radius-sm);
}
.hw-knowledge {
  font-size: 13px; color: var(--on-surface); line-height: 1.6;
  padding: 8px 12px; background: var(--success-container); border-radius: var(--radius-sm);
}
.hw-explain {
  font-size: 13px; color: var(--on-surface-variant); line-height: 1.6;
  padding: 8px 12px; background: var(--surface-container-low); border-radius: var(--radius-sm);
}

/* ==================== 响应式 · 手机 (<480px) ==================== */
@media (max-width: 480px) {
  .hero h1 { font-size: 24px; }
  .hero p { font-size: 14px; }
  .stage-cards { gap: 8px; }
  .stage-card { padding: 16px 6px 12px; }
  .stage-card .emo { font-size: 30px; }
  .stage-card .t { font-size: 15px; }
  .question-text { font-size: 17px; }
  .question-card { padding: 20px 16px 18px; }
  .topbar { padding: calc(env(safe-area-inset-top) + 10px) 14px 10px; }
  .brand { font-size: 17px; }
  .badges { gap: 4px; }
  .badge { padding: 4px 8px; font-size: 11px; }
  .user-name { display: none; }
  .logout-btn { padding: 5px 10px; font-size: 12px; }
  .profile-stats { grid-template-columns: 1fr 1fr; }
  .pstat { padding: 14px; }
  .pstat b { font-size: 24px; }
  .records-stats { grid-template-columns: 1fr; }
  .admin-user-item, .teacher-student-item { flex-direction: column; align-items: flex-start; }
  .au-actions, .ts-actions { width: 100%; flex-direction: row; flex-wrap: wrap; }
  .au-btn { flex: 1; text-align: center; min-width: 70px; }
  .mode-btn { padding: 14px; gap: 10px; }
  .mode-btn .mode-icon { flex: 0 0 38px; height: 38px; font-size: 20px; }
  .mode-btn strong { font-size: 16px; }
  .mode-btn small { font-size: 12px; }
  .screen-title { font-size: 24px; margin: 8px 0 16px; }
  .login-card { padding: 30px 20px; }
  .login-title { font-size: 22px; }
  .tf-row { flex-direction: column; }
  .tf-field { min-width: 100%; }
  .import-tab { padding: 10px 14px; font-size: 13px; }
  .import-format-code { font-size: 11px; padding: 12px; }
  .essay-input { min-height: 120px; font-size: 14px; }
  .erv-score-input { max-width: 100%; }
  .rest-card { padding: 28px 20px; }
  .timer { font-size: 44px; }
  .rest-step { padding: 10px 12px; }
  .calendar { gap: 3px; }
  .cal-cell { font-size: 10px; }
  .bank-stat { font-size: 12px; padding: 10px 12px; }
  .score-actions { flex-direction: column; gap: 8px; }
  .wrong-chips .chip { font-size: 12px; padding: 7px 12px; }
  .tag-add-form { flex-wrap: wrap; }
  .tag-add-form input { min-width: 0; flex: 1 1 60%; }
  .ts-stats { flex-wrap: wrap; gap: 8px; }
  .hw-stats { grid-template-columns: repeat(2, 1fr); }
  .hw-stat-item b { font-size: 20px; }
  .hw-card { padding: 14px 16px; }
  .hw-question { font-size: 15px; }
  .assign-filters { gap: 10px; }
  .assign-filter-group { width: 100%; }
  .assign-search-box { flex-direction: column; align-items: stretch; }
  .assign-count { text-align: center; }
  .assign-question-list { max-height: 400px; }
  .aq-opts span { max-width: 140px; }
  .assign-hw-item { flex-direction: column; }
}

/* ==================== 响应式 · 大手机/小平板 (481-768px) ==================== */
@media (min-width: 481px) and (max-width: 768px) {
  .hero h1 { font-size: 28px; }
  .question-text { font-size: 19px; }
  .question-card { padding: 24px 20px; }
  .mode-btn .mode-icon { flex: 0 0 40px; height: 40px; font-size: 21px; }
  .tf-row { flex-wrap: wrap; }
  .tf-field { min-width: 140px; }
  .topbar { padding: calc(env(safe-area-inset-top) + 12px) 18px 12px; }
  .profile-stats { grid-template-columns: repeat(2, 1fr); }
  .records-stats { grid-template-columns: repeat(3, 1fr); }
  .admin-user-item, .teacher-student-item { flex-direction: row; flex-wrap: wrap; }
  .au-actions, .ts-actions { flex-wrap: wrap; }
  .hw-stats { grid-template-columns: repeat(4, 1fr); }
  .assign-filters { gap: 12px; }
}

/* ==================== 响应式 · 平板 (769-1024px) ==================== */
@media (min-width: 769px) and (max-width: 1024px) {
  #app { max-width: 900px; padding: 20px; }
  .hero h1 { font-size: 30px; }
  .stage-cards { gap: 16px; }
  .stage-card { padding: 26px 12px 20px; }
  .stage-card .emo { font-size: 40px; }
  .question-text { font-size: 20px; }
  .question-card { padding: 28px 26px; }
  .quiz-layout {
    display: grid;
    grid-template-columns: 1fr 240px;
    gap: 18px;
    align-items: start;
  }
  .quiz-side { display: block; position: sticky; top: 90px; }
  .profile-stats { grid-template-columns: repeat(4, 1fr); }
  .records-stats { grid-template-columns: repeat(3, 1fr); }
  .tf-row { flex-wrap: nowrap; }
  .import-format-code { font-size: 13px; }
}

/* ==================== 响应式 · 桌面 (>1024px) ==================== */
@media (min-width: 1025px) {
  #app { max-width: 960px; padding: 24px; }
  .hero { padding: 48px 8px 16px; }
  .hero h1 { font-size: 34px; }
  .hero p { font-size: 16px; }
  .stage-cards { gap: 18px; }
  .stage-card { padding: 30px 14px 22px; }
  .stage-card .emo { font-size: 42px; }
  .stage-card .t { font-size: 19px; }
  .mode-btn { padding: 18px 20px; }
  .mode-btn .mode-icon { flex: 0 0 46px; height: 46px; font-size: 24px; }
  .mode-btn strong { font-size: 18px; }
  .mode-btn small { font-size: 14px; }
  .question-text { font-size: 22px; }
  .question-card { padding: 32px 28px 28px; }
  .quiz-layout {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 24px;
    align-items: start;
  }
  .quiz-side { display: block; position: sticky; top: 90px; }
  .profile-stats { grid-template-columns: repeat(4, 1fr); }
  .records-stats { grid-template-columns: repeat(3, 1fr); }
  .login-card { max-width: 440px; padding: 48px 40px; }
  .login-title { font-size: 28px; }
  .import-format-code { font-size: 13px; max-height: 420px; }
}

/* ==================== 响应式 · 横屏手机 ==================== */
@media (max-height: 500px) and (orientation: landscape) {
  .hero { padding: 16px 8px 8px; }
  .hero h1 { font-size: 22px; margin-bottom: 6px; }
  .hero p { font-size: 13px; }
  .stage-cards { margin: 16px 0; }
  .stage-card { padding: 12px 6px 10px; }
  .mode-btn { padding: 10px 14px; }
  .mode-btn .mode-icon { flex: 0 0 34px; height: 34px; font-size: 18px; }
  .login-card { margin: 20px auto; padding: 24px 28px; }
  .login-emo { font-size: 32px; margin-bottom: 8px; }
  .login-title { font-size: 22px; }
  .rest-card { padding: 20px 24px; max-width: 360px; }
  .rest-emo { font-size: 36px; margin-bottom: 8px; }
  .timer { font-size: 40px; margin: 6px 0; }
}

/* ==================== 响应式 · 高分屏缩放 ==================== */
@media (min-width: 1400px) {
  #app { max-width: 1100px; }
  body { font-size: 17px; }
}

/* ==================== 年级选择弹窗（学生首次登录） ==================== */
.grade-picker-overlay {
  position: fixed; inset: 0; z-index: 1100;
  background: rgba(45, 37, 32, 0.6);
  backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  padding: 16px; animation: screenIn .2s ease-out;
}
.grade-picker-card {
  background: var(--surface); border-radius: var(--radius-lg);
  width: 100%; max-width: 440px; padding: 28px 24px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.25);
  animation: popIn .2s ease-out; text-align: center;
}
.grade-picker-emo { font-size: 44px; margin-bottom: 8px; }
.grade-picker-card h2 {
  font-family: var(--font-headline); font-size: 22px;
  margin: 0 0 6px; color: var(--on-surface);
}
.grade-picker-hint { color: var(--on-surface-variant); font-size: 13px; margin: 0 0 18px; }
.grade-picker-card .setup-group { margin-bottom: 16px; text-align: left; }
.grade-picker-card .setup-group h4 { font-size: 13px; margin: 0 0 8px; color: var(--on-surface-variant); }
.grade-picker-card .big-btn { margin-top: 6px; }
.grade-picker-card .big-btn:disabled { opacity: 0.5; cursor: not-allowed; }


/* ==================== 试卷生成 + 打印 ==================== */
.paper-layout {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.paper-side {
  background: var(--surface);
  border: 1px solid var(--outline);
  border-radius: var(--radius-lg);
  padding: 16px;
}
.paper-cta { margin-top: 12px; }
.paper-cta .big-btn { width: 100%; }
.paper-main {
  background: var(--surface);
  border: 1px solid var(--outline);
  border-radius: var(--radius-lg);
  padding: 16px;
  min-height: 480px;
}
.paper-sheet {
  background: #fff;
  color: #222;
  font-family: "SimSun", "Songti SC", "Source Han Serif", serif;
  padding: 28px 32px 80px 32px;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  position: relative;
  min-height: 600px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
  line-height: 1.7;
}
.ps-head { text-align: center; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 2px solid #222; }
.ps-title { font-size: 22px; font-weight: 700; letter-spacing: 2px; color: #111; }
.ps-subtitle { font-size: 13px; color: #555; margin-top: 6px; }
.ps-info {
  display: flex; flex-wrap: wrap; gap: 12px 24px;
  font-size: 13px; color: #333;
  margin: 12px 0 18px;
  padding-bottom: 10px; border-bottom: 1px dashed #999;
}
.ps-section { margin-top: 18px; }
.ps-section-title {
  font-size: 15px; font-weight: 700; margin: 0 0 8px;
  color: #111;
  border-left: 4px solid #222; padding-left: 8px;
}
.ps-item { display: flex; gap: 10px; margin: 8px 0; page-break-inside: avoid; }
.ps-qno { font-weight: 700; min-width: 26px; }
.ps-qbody { flex: 1; }
.ps-qtext { font-size: 14px; color: #111; }
.ps-knowledge { color: #888; font-size: 12px; margin-left: 4px; }
.ps-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 16px; margin-top: 4px; font-size: 13px; color: #333; }
.ps-opt { line-height: 1.6; }
.ps-lab { display: inline-block; min-width: 22px; font-weight: 700; }
.ps-blank-line { font-size: 13px; color: #333; margin-top: 4px; letter-spacing: 1px; }
.ps-essay-area { margin-top: 6px; }
.ps-essay-line { border-bottom: 1px solid #888; height: 26px; }
/* 理科应用题：答题区为空白区域（便于画图/演算），不画横线 */
.ps-essay-area-space { border: 1px dashed #ccc; background: #fdfdfd; padding: 6px; border-radius: 4px; }
.ps-essay-space { min-height: 120px; }
.ps-special-answer-space { min-height: 120px; border: 1px dashed #ccc; background: #fdfdfd; border-radius: 4px; }

/* ==================== 特殊题（独立大题节）样式 ==================== */
.ps-section-special { margin-top: 28px; padding-top: 14px; border-top: 2px dashed var(--outline-variant); }
.ps-section-title-special {
  background: linear-gradient(135deg, #c2652a 0%, #e08850 100%);
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 700;
  padding: 10px 18px !important;
  border-radius: 8px;
  border-left: 6px solid #a8541f !important;
  letter-spacing: 1px;
  margin: 0 0 14px 0 !important;
  page-break-after: avoid;
}
.ps-item-special { margin: 10px 0 18px 0; padding: 8px 12px; background: #faf6f0; border-radius: 6px; page-break-inside: avoid; }
.ps-special-context {
  background: #f5ede0;
  border-left: 4px solid #c2652a;
  padding: 10px 14px;
  margin: 8px 0 10px 0;
  font-size: 13px;
  line-height: 1.8;
  color: #3a302a;
  white-space: pre-wrap;
  border-radius: 4px;
}
.ps-special-answer-area { display: flex; gap: 8px; margin-top: 8px; }
.ps-special-answer-label { font-size: 13px; color: #c2652a; font-weight: 700; padding-top: 2px; }
.ps-special-answer-lines { flex: 1; }
.ps-special-answer-line { border-bottom: 1px solid #888; height: 32px; }

/* 特殊题分类选择器（卷子生成设置） */
.paper-specials-tip { font-size: 12px; color: var(--on-surface-variant); line-height: 1.7; margin: 0 0 10px 0; padding: 8px 12px; background: #faf6f0; border-left: 3px solid #c2652a; border-radius: 4px; }
.paper-specials-ctrl { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding: 8px 12px; background: var(--surface-container-low); border-radius: 6px; flex-wrap: wrap; }
.paper-specials-ctrl label { font-size: 13px; color: var(--on-surface-variant); font-weight: 500; }
.paper-specials-empty { font-size: 12px; color: var(--on-surface-variant); padding: 8px 0; opacity: .7; }
.paper-specials .chip { font-size: 13px; }
.ps-watermark {
  position: absolute;
  left: 18px;
  bottom: 14px;
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: #555;
  user-select: none;
}
.ps-watermark-logo { height: 28px; width: auto; border-radius: 4px; }
.ps-watermark-text {
  letter-spacing: 1px;
  font-weight: 600;
  color: #b00020;
}
/* 每页页眉 Logo（打印时每页重复） */
.ps-page-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding-bottom: 8px;
  margin-bottom: 10px;
  border-bottom: 1px solid #ddd;
}
.ps-page-head-logo { height: 26px; width: auto; border-radius: 4px; }
.ps-page-head-name {
  font-size: 13px;
  font-weight: 700;
  color: #555;
  letter-spacing: 2px;
}
/* 答案卷样式 */
.paper-sheet.answer-sheet { margin-top: 20px; }
.ps-answer-row {
  display: flex;
  gap: 8px;
  margin-top: 4px;
  font-size: 13px;
  line-height: 1.6;
}
.ps-answer-label {
  flex: 0 0 auto;
  font-weight: 700;
  color: #111;
}
.ps-answer-text {
  font-weight: 700;
  color: #b00020;
}
.ps-answer-explain { color: #444; }
.ps-explain-row { color: #444; }
.ps-actions { display: flex; gap: 12px; justify-content: flex-end; margin-top: 16px; flex-wrap: wrap; }

/* ==================== 打印样式 ==================== */
@media print {
  body { background: #fff !important; }
  .topbar, .sidebar, .top-actions, .back, .screen-title, .hint,
  .paper-side, .ps-actions, .no-print, #restOverlay, .grade-picker-overlay { display: none !important; }
  .screen { display: none !important; }
  .screen.active { display: block !important; padding: 0; margin: 0; }
  .paper-main { background: #fff !important; border: none !important; padding: 0 !important; min-height: 0 !important; }
  /* 打印模式：只打试卷 / 只打答案卷 / 全打 */
  body.print-paper .paper-sheet.answer-sheet { display: none !important; }
  body.print-answer .paper-sheet.question-sheet { display: none !important; }
  .paper-sheet {
    box-shadow: none !important; border: none !important;
    padding: 4mm 10mm 20mm 10mm !important;
    min-height: 0 !important;
    margin: 0 !important;
    page-break-after: always;
  }
  .paper-sheet.answer-sheet { margin-top: 0 !important; }
  .ps-head { border-bottom: 2px solid #000; }
  .ps-title { font-size: 20pt; color: #000; }
  .ps-subtitle { font-size: 10pt; color: #333; }
  .ps-item { page-break-inside: avoid; }
  .ps-section-title { color: #000; border-left-color: #000; }
  /* 每页重复页眉 Logo + 页脚水印 */
  .ps-page-head {
    position: fixed;
    top: 1mm;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
    background: #fff;
    z-index: 20;
  }
  .ps-page-head-logo { height: 6mm; }
  .ps-page-head-name { font-size: 9pt; color: #333; }
  .ps-watermark-logo { height: 5mm; }
  .ps-watermark {
    position: fixed;
    bottom: 3mm;
    left: 8mm;
    background: #fff;
  }
  @page { size: A4; margin: 16mm 8mm 14mm 8mm; }
}


/* ==================== 用户管理搜索 + 试卷题型分配 ==================== */
.admin-search-row {
  display: flex; gap: 10px; margin: 0 0 14px 0;
}
.admin-search-input { flex: 1; }
.admin-role-filter { width: 140px; flex: 0 0 140px; }
.paper-alloc-info {
  font-size: 13px; color: var(--on-surface-variant);
  line-height: 1.8; padding: 8px 10px;
  background: rgba(245, 158, 11, 0.08); border-radius: 8px;
  margin-bottom: 10px;
}
.paper-alloc-info b { color: var(--primary); font-weight: 700; }
.paper-count-input { width: 100px; flex: 0 0 100px; }
.paper-alloc-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 10px; margin-bottom: 8px;
}
.paper-alloc-cell { display: flex; flex-direction: column; gap: 4px; }
.paper-alloc-cell label { font-size: 12px; color: var(--on-surface-variant); }
.paper-alloc-input { padding: 6px 8px; }
.paper-alloc-total {
  font-size: 13px; color: var(--primary); font-weight: 600;
  padding: 6px 0 0 0;
}

/* ==================== 线上考试（学生端 + 考试管理） ==================== */
/* 考试卡片 */
.exam-card {
  background: var(--surface);
  border: 1px solid var(--outline-variant);
  border-radius: 14px;
  padding: 16px 18px;
  margin-bottom: 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.exam-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.exam-card-title { font-size: 17px; font-weight: 700; color: var(--on-surface); }
.exam-card-meta { font-size: 13px; color: var(--on-surface-variant); margin-top: 6px; line-height: 1.6; }
.exam-card-stats { font-size: 13px; color: var(--on-surface-variant); margin-top: 6px; }
.exam-card-stats b { color: var(--primary); }
.exam-card-foot {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  margin-top: 12px; flex-wrap: wrap;
}
.exam-card-teacher { font-size: 12px; color: var(--on-surface-variant); }
.exam-card-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* 管理端 Tab */
.exam-admin-tabs { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.exam-tab-btn {
  border: 1px solid var(--outline-variant);
  background: var(--surface);
  color: var(--on-surface-variant);
  border-radius: 10px;
  padding: 9px 18px;
  font-size: 14px; font-weight: 600;
  cursor: pointer;
}
.exam-tab-btn.primary { background: var(--primary); color: #fff; border-color: var(--primary); }

.exam-create-box {
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant);
  border-radius: 14px;
  padding: 16px;
  margin-bottom: 16px;
}
.exam-create-fields { display: flex; gap: 20px; flex-wrap: wrap; align-items: flex-end; }
.exam-create-fields .setup-group { flex: 1; min-width: 220px; }
.exam-create-fields .setup-group h4 { font-size: 13px; color: var(--on-surface-variant); margin: 0 0 6px; }
.exam-create-fields .login-input { width: 100%; }
/* 考试创建页的卷子生成区与「生成试卷」页完全一致 */
#examCreatePane .paper-layout { margin-bottom: 20px; }

/* 学生选择 */
.exam-student-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.exam-student-count { font-size: 13px; color: var(--primary); font-weight: 600; margin-left: auto; }
.exam-student-list {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 8px; margin-bottom: 14px;
}
.exam-student-card {
  display: flex; align-items: center; gap: 10px;
  border: 1px solid var(--outline-variant); border-radius: 10px;
  padding: 10px 12px; cursor: pointer; background: var(--surface);
  transition: all .12s ease;
}
.exam-student-card:hover { border-color: var(--primary); }
.exam-student-card.sel { border-color: var(--primary); background: var(--primary-fixed); }
.exam-student-avatar {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--primary); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; flex: 0 0 34px;
}
.exam-student-info { flex: 1; min-width: 0; }
.exam-student-name { font-size: 14px; font-weight: 600; color: var(--on-surface); }
.exam-student-meta { font-size: 12px; color: var(--on-surface-variant); }
.exam-student-check {
  width: 22px; height: 22px; border-radius: 50%;
  border: 2px solid var(--outline);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 700; font-size: 13px; flex: 0 0 22px;
}
.exam-student-card.sel .exam-student-check { background: var(--primary); border-color: var(--primary); }

/* 考试作答界面 */
.exam-take-head {
  display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
  background: linear-gradient(135deg, var(--primary) 0%, #e08850 100%);
  color: #fff; border-radius: 14px; padding: 14px 18px;
  position: sticky; top: 12px; z-index: 15;
  box-shadow: 0 4px 14px rgba(194, 101, 42, 0.25);
}
.exam-take-title { font-size: 17px; font-weight: 700; }
.exam-take-timer {
  font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums;
  background: rgba(255,255,255,0.18); border-radius: 10px; padding: 6px 14px;
  min-width: 130px; text-align: center;
}
.exam-take-meta { font-size: 13px; color: var(--on-surface-variant); margin: 10px 0 4px; }
.exam-question-list { margin-top: 10px; }
.exam-q-card {
  background: var(--surface);
  border: 1px solid var(--outline-variant);
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 12px;
}
.exam-q-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
.exam-q-no { font-weight: 800; color: var(--primary); }
.exam-q-type {
  font-size: 11px; color: var(--on-surface-variant);
  border: 1px solid var(--outline-variant); border-radius: 6px; padding: 1px 7px;
}
.exam-special-badge {
  font-size: 11px; color: #fff; background: linear-gradient(135deg, #c2652a, #e08850);
  border-radius: 6px; padding: 2px 8px;
}
.exam-q-score { margin-left: auto; font-size: 12px; color: var(--on-surface-variant); font-weight: 600; }
.exam-q-context {
  background: var(--surface-container-low);
  border-left: 3px solid var(--primary);
  border-radius: 6px; padding: 8px 12px;
  font-size: 13px; color: var(--on-surface); margin: 6px 0;
  white-space: pre-wrap;
}
.exam-q-text { font-size: 15px; color: var(--on-surface); line-height: 1.7; }
.exam-qopts { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.exam-qopt {
  display: flex; align-items: center; gap: 8px;
  border: 1px solid var(--outline-variant); border-radius: 10px;
  padding: 8px 12px; cursor: pointer; background: var(--surface);
  transition: all .12s ease;
}
.exam-qopt:hover { border-color: var(--primary); }
.exam-qopt:has(input:checked) { border-color: var(--primary); background: var(--primary-fixed); }
.exam-qopt-letter {
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--surface-container-high); color: var(--on-surface);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; flex: 0 0 24px;
}
.exam-qopt-text { font-size: 14px; color: var(--on-surface); }
.exam-qblank { margin-top: 10px; }
.exam-qblank .login-input { width: 100%; }
.exam-qessay { margin-top: 10px; }
.exam-qessay textarea { width: 100%; min-height: 90px; }
.exam-take-actions { text-align: center; padding: 6px 0 26px; }

/* 考试结果 */
.exam-result-box {
  background: linear-gradient(135deg, var(--primary), #e08850);
  color: #fff; border-radius: 16px; padding: 22px; text-align: center; margin-bottom: 14px;
}
.exam-result-score { font-size: 42px; font-weight: 800; line-height: 1.1; }
.exam-result-score small { font-size: 16px; font-weight: 600; opacity: .85; }
.exam-result-meta { font-size: 13px; margin-top: 6px; opacity: .92; }
.exam-result-box .tool-btn {
  margin-top: 12px; background: rgba(255,255,255,0.18); color: #fff; border-color: rgba(255,255,255,0.4);
}
.exam-result-box .tool-btn:hover { background: rgba(255,255,255,0.28); }
.exam-fb-card {
  background: var(--surface); border: 1px solid var(--outline-variant);
  border-radius: 12px; padding: 13px 15px; margin-bottom: 10px;
}
.exam-fb-head { font-size: 14px; font-weight: 700; color: var(--on-surface); margin-bottom: 6px; }
.exam-fb-row { font-size: 13px; color: var(--on-surface); margin-top: 5px; line-height: 1.6; }
.exam-fb-row b { color: var(--on-surface-variant); font-weight: 600; }
.exam-fb-reason {
  font-size: 13px; color: var(--on-surface); background: rgba(245, 158, 11, 0.08);
  border-radius: 8px; padding: 6px 10px; margin-top: 8px; line-height: 1.6;
}
.exam-fb-explain { font-size: 13px; color: var(--on-surface-variant); margin-top: 6px; line-height: 1.6; }

/* 考试结果（管理端） */
.exam-result-title { font-size: 19px; font-weight: 700; color: var(--on-surface); }
.exam-result-stats { font-size: 13px; color: var(--on-surface-variant); margin: 8px 0 12px; }
.exam-result-stats b { color: var(--primary); }
.exam-result-student-list { display: flex; flex-direction: column; gap: 8px; }
.exam-result-student {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  border: 1px solid var(--outline-variant); border-radius: 12px;
  padding: 12px 14px; cursor: pointer; background: var(--surface);
  transition: all .12s ease;
}
.exam-result-student:hover { border-color: var(--primary); }
.exam-result-student.done { border-left: 4px solid #2e9e5b; }
.exam-result-s-info { flex: 1; min-width: 0; }
.exam-result-status { font-size: 13px; color: var(--on-surface); margin-top: 3px; }
.exam-result-time { font-size: 12px; color: var(--on-surface-variant); }
.exam-result-s-arrow { font-size: 20px; color: var(--on-surface-variant); }

/* 学生作答详情弹层 */
.exam-detail-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.45);
  display: flex; align-items: center; justify-content: center;
  z-index: 1000; padding: 20px;
}
.exam-detail-card {
  background: var(--surface); border-radius: 16px;
  width: min(720px, 100%); max-height: 88vh; overflow-y: auto;
  padding: 20px;
}
.exam-detail-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }

/* ==================== 安卓客户端下载页 ==================== */
.download-hero {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; padding: 32px 16px 24px;
}
.download-app-icon {
  width: 120px; height: 120px; border-radius: 24px;
  object-fit: cover; box-shadow: var(--shadow-md);
  margin-bottom: 16px;
}
.download-app-name {
  font-family: var(--font-headline); font-size: 22px; font-weight: 700;
  margin: 0 0 8px; color: var(--on-surface);
}
.download-app-desc {
  font-size: 14px; color: var(--on-surface-variant); margin: 0 0 24px;
  max-width: 420px; line-height: 1.6;
}
.download-btn {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--primary); color: var(--on-primary);
  padding: 14px 32px; border-radius: var(--radius-sm);
  font-size: 17px; font-weight: 600; text-decoration: none;
  transition: all .2s; box-shadow: var(--shadow-sm);
}
.download-btn:hover { background: var(--primary-hover); transform: translateY(-1px); }
.download-btn:active { transform: translateY(0); }
.download-btn-icon { font-size: 20px; }
.download-url-hint {
  margin: 16px 0 0; font-size: 12px; color: var(--on-surface-variant);
  word-break: break-all; max-width: 500px;
}
.download-url-hint code {
  background: var(--surface-container); padding: 2px 6px;
  border-radius: 4px; font-size: 11px;
}

.download-features {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px; margin: 24px 0;
}
.download-feature-item {
  display: flex; gap: 12px; align-items: flex-start;
  background: var(--surface-container); border-radius: var(--radius-sm);
  padding: 16px;
}
.download-feature-icon { font-size: 28px; flex-shrink: 0; }
.download-feature-item strong {
  display: block; font-size: 15px; font-weight: 700;
  color: var(--on-surface); margin-bottom: 4px;
}
.download-feature-item p {
  margin: 0; font-size: 13px; color: var(--on-surface-variant);
  line-height: 1.5;
}

.download-notice {
  background: var(--surface-container); border-radius: var(--radius-sm);
  padding: 18px 20px; margin: 20px 0;
}
.download-notice h4 { margin: 0 0 10px; font-size: 15px; font-weight: 700; }
.download-notice ol { margin: 0; padding-left: 20px; }
.download-notice li { font-size: 14px; color: var(--on-surface-variant); line-height: 2; }

.download-admin-box {
  background: var(--surface-container); border-radius: var(--radius-sm);
  padding: 18px 20px; margin-top: 20px;
}
.download-admin-box .admin-form { display: flex; gap: 10px; flex-wrap: wrap; }
.download-admin-box .admin-form .login-input { flex: 1; min-width: 200px; }
.download-admin-box .big-btn { width: auto; margin-top: 0; }
.exam-detail-head h3 { font-size: 17px; color: var(--on-surface); margin: 0; }
.exam-detail-score {
  font-size: 14px; color: var(--on-surface);
  background: var(--primary-fixed); border-radius: 10px;
  padding: 10px 14px; margin-bottom: 12px;
}
.exam-detail-score b { color: var(--primary); }

/* AI 学情分析块 */
.exam-analysis {
  background: linear-gradient(135deg, #fff9f2, #fdf1e6);
  border: 1px solid rgba(194, 101, 42, 0.35);
  border-radius: 14px;
  padding: 16px 18px;
  margin: 12px 0;
}
.exam-analysis-loading {
  display: flex; align-items: center; gap: 10px;
  color: var(--on-surface-variant); font-size: 13px;
}
.exam-analysis-title {
  font-size: 16px; font-weight: 800; color: var(--primary);
  margin-bottom: 4px;
}
.exam-analysis-meta { font-size: 12px; color: var(--on-surface-variant); margin-bottom: 8px; }
.exam-analysis-summary {
  font-size: 14px; color: var(--on-surface); line-height: 1.8;
  background: rgba(255,255,255,0.7); border-radius: 10px;
  padding: 10px 14px; margin-bottom: 10px;
}
.exam-analysis-group { margin-bottom: 8px; }
.exam-analysis-group-title { font-size: 13px; font-weight: 700; margin-bottom: 4px; }
.exam-analysis-group.good .exam-analysis-group-title { color: #2e7d45; }
.exam-analysis-group.bad .exam-analysis-group-title { color: #c0392b; }
.exam-analysis-group.suggest .exam-analysis-group-title { color: var(--primary-hover); }
.exam-analysis-group ul { margin: 0; padding-left: 20px; }
.exam-analysis-group li { font-size: 13px; color: var(--on-surface); line-height: 1.7; }

/* ==================== 学生个人档案 ==================== */
.archive-header {
  display: flex; align-items: center; gap: 14px;
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant); border-radius: 14px;
  padding: 16px 18px; margin-bottom: 14px;
}
.archive-avatar {
  width: 52px; height: 52px; border-radius: 50%;
  background: linear-gradient(135deg, var(--primary), var(--primary-container));
  color: #fff; font-size: 22px; font-weight: 800;
  display: flex; align-items: center; justify-content: center; flex: 0 0 52px;
}
.archive-name { font-size: 19px; font-weight: 800; color: var(--on-surface); }
.archive-meta { font-size: 13px; color: var(--on-surface-variant); margin-top: 3px; }
.archive-stats {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 10px; margin-bottom: 16px;
}
.archive-stat {
  background: var(--surface); border: 1px solid var(--outline-variant);
  border-radius: 12px; padding: 12px; text-align: center;
}
.archive-stat b { display: block; font-size: 22px; font-weight: 800; color: var(--primary); }
.archive-stat span { font-size: 12px; color: var(--on-surface-variant); }
.archive-section-head {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  margin-bottom: 10px; flex-wrap: wrap;
}
.archive-analysis-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 6px; }
.archive-analysis-card {
  background: var(--surface); border: 1px solid var(--outline-variant);
  border-radius: 12px; padding: 13px 15px;
}
.archive-analysis-head { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; align-items: baseline; }
.archive-analysis-title { font-size: 14px; font-weight: 700; color: var(--on-surface); }
.archive-analysis-meta { font-size: 12px; color: var(--on-surface-variant); }
.archive-analysis-summary {
  font-size: 13px; color: var(--on-surface); line-height: 1.8;
  background: var(--surface-container-low); border-radius: 8px;
  padding: 8px 12px; margin: 8px 0;
}
.archive-analysis-group { margin-top: 6px; }
.archive-analysis-group ul { margin: 4px 0 0; padding-left: 20px; }
.archive-analysis-group li { font-size: 13px; color: var(--on-surface); line-height: 1.7; }
.aag-title { font-size: 12px; font-weight: 700; }
.archive-analysis-group.good .aag-title { color: #2e7d45; }
.archive-analysis-group.bad .aag-title { color: #c0392b; }
.archive-analysis-group.suggest .aag-title { color: var(--primary-hover); }
.archive-exam-list { display: flex; flex-direction: column; gap: 8px; }
.archive-exam-item {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  border: 1px solid var(--outline-variant); border-radius: 12px;
  padding: 11px 14px; background: var(--surface);
}
.archive-exam-title { font-size: 14px; font-weight: 600; color: var(--on-surface); }
.archive-exam-meta { font-size: 12px; color: var(--on-surface-variant); margin-top: 3px; }
.archive-exam-score { font-size: 15px; font-weight: 800; color: var(--primary); flex: 0 0 auto; }
.archive-exam-status { font-size: 13px; color: var(--on-surface-variant); flex: 0 0 auto; }

/* ==================== 自绘滚动条（替换原生 UI） ==================== */
/* Firefox：细滚动条 + 暖色 */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(194, 101, 42, 0.55) rgba(0, 0, 0, 0.05);
}
/* WebKit / Chromium / Edge */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.05);
  border-radius: 10px;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(194, 101, 42, 0.55), rgba(224, 136, 80, 0.55));
  border-radius: 10px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(194, 101, 42, 0.85), rgba(224, 136, 80, 0.85));
  border: 2px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:active {
  background: linear-gradient(180deg, #a8541f, #d0783c);
  border: 2px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-corner { background: transparent; }

/* 左栏导航：更窄更克制的滚动条 */
.nav-sidebar::-webkit-scrollbar { width: 6px; }
.nav-sidebar::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(194, 101, 42, 0.45), rgba(224, 136, 80, 0.45));
  border: 1px solid transparent;
  background-clip: padding-box;
}
.nav-sidebar::-webkit-scrollbar-track { background: transparent; }

/* 内嵌小滚动区域（题目预览 / 卡片列表等）：更薄 */
.exam-detail-card::-webkit-scrollbar,
.wrong-list::-webkit-scrollbar,
.admin-user-list::-webkit-scrollbar,
.quiz-side::-webkit-scrollbar { width: 6px; height: 6px; }

/* ==================== 安卓客户端下载页 ==================== */
.download-hero {
  display: flex; flex-direction: column; align-items: center;
  padding: 28px 20px; margin-bottom: 20px;
  background: var(--surface); border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  text-align: center;
}
.download-app-icon {
  width: 120px; height: 120px; border-radius: 24px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.12);
  margin-bottom: 16px;
}
.download-app-name {
  margin: 0 0 6px; font-family: var(--font-headline);
  font-size: 22px; font-weight: 700; color: var(--on-surface);
}
.download-app-desc {
  margin: 0 0 20px; color: var(--on-surface-variant); font-size: 14px;
}
.download-btn {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--primary); color: var(--on-primary);
  padding: 14px 36px; border-radius: var(--radius-sm);
  text-decoration: none; font-weight: 700; font-size: 16px;
  transition: all .2s; box-shadow: var(--shadow-sm);
}
.download-btn:hover { background: var(--primary-hover); transform: translateY(-1px); box-shadow: var(--shadow-md); }
.download-btn:active { transform: scale(.98); }
.download-btn-icon { font-size: 20px; }
.download-url-hint {
  margin: 16px 0 0; color: var(--on-surface-variant); font-size: 12px;
  word-break: break-all; max-width: 100%;
}
.download-url-hint code {
  background: var(--surface-container); padding: 2px 6px; border-radius: 4px;
  font-size: 11px;
}
.download-features {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px; margin-bottom: 20px;
}
.download-feature-item {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 16px; background: var(--surface);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
}
.download-feature-icon { font-size: 28px; flex-shrink: 0; }
.download-feature-item strong {
  display: block; font-family: var(--font-headline);
  font-size: 15px; margin-bottom: 4px; color: var(--on-surface);
}
.download-feature-item p { margin: 0; color: var(--on-surface-variant); font-size: 13px; }
.download-notice {
  padding: 18px 20px; background: var(--primary-fixed);
  border-radius: var(--radius-md); margin-bottom: 20px;
}
.download-notice h4 { margin: 0 0 12px; font-family: var(--font-headline); color: var(--on-primary-fixed); }
.download-notice ol { margin: 0; padding-left: 20px; color: var(--on-primary-fixed); font-size: 14px; line-height: 1.8; }
.download-admin-box {
  padding: 18px 20px; background: var(--surface);
  border: 2px dashed var(--primary); border-radius: var(--radius-md);
}
.download-admin-box .admin-form { flex-direction: row; align-items: stretch; gap: 10px; }
.download-admin-box .admin-form .big-btn { margin-top: 0; width: auto; white-space: nowrap; }

/* ==================== 图片结题（拍照解题） ==================== */
.img-solve-layout {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(0, 1.4fr);
  gap: 16px;
  align-items: start;
}
.img-solve-side {
  background: var(--surface);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 14px;
  display: flex; flex-direction: column; gap: 12px;
}
.img-solve-uploader {
  position: relative;
  border: 2px dashed var(--outline-variant);
  border-radius: var(--radius-md);
  background: var(--surface-container-low);
  min-height: 180px;
  cursor: pointer;
  transition: all .2s;
  overflow: hidden;
}
.img-solve-uploader:hover { border-color: var(--primary); background: var(--primary-fixed); }
.img-solve-uploader.drag { border-color: var(--primary); background: var(--primary-fixed); transform: scale(1.01); }
.img-solve-uploader-inner {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 28px 16px; text-align: center; color: var(--on-surface-variant);
}
.img-solve-uploader-icon { font-size: 44px; margin-bottom: 8px; }
.img-solve-uploader-tip { font-size: 15px; font-weight: 700; color: var(--on-surface); margin-bottom: 4px; }
.img-solve-uploader-sub { font-size: 12px; color: var(--on-surface-variant); }
.img-solve-preview {
  position: relative; display: flex; align-items: center; justify-content: center;
  background: var(--surface-container-low);
  padding: 10px;
}
.img-solve-preview img {
  max-width: 100%; max-height: 360px;
  border-radius: 8px; box-shadow: var(--shadow-sm); display: block;
}
.img-solve-remove {
  position: absolute; top: 14px; right: 14px;
  width: 28px; height: 28px; border-radius: 50%;
  background: rgba(0,0,0,.55); color: #fff; border: none;
  font-size: 14px; cursor: pointer; line-height: 28px;
  display: flex; align-items: center; justify-content: center;
}
.img-solve-remove:hover { background: rgba(0,0,0,.8); }
.img-solve-prompt-box { display: flex; flex-direction: column; gap: 6px; }
.img-solve-label { font-size: 13px; font-weight: 700; color: var(--on-surface); }
.img-solve-prompt {
  width: 100%; resize: vertical; min-height: 70px;
  padding: 10px 12px; font-size: 14px; line-height: 1.5;
  border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius-sm);
  background: var(--surface-container-lowest);
  color: var(--on-surface); font-family: var(--font-body);
  box-sizing: border-box;
}
.img-solve-prompt:focus { outline: none; border-color: var(--primary); }
.img-solve-prompt-count {
  font-size: 12px; color: var(--on-surface-variant); align-self: flex-end;
}
.img-solve-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.img-solve-actions .big-btn { flex: 1; min-width: 140px; margin-top: 0; padding: 12px 16px; }
.img-solve-actions .big-btn.ghost { flex: 0 0 auto; }

.img-solve-history { margin-top: 4px; }
.img-solve-history h4 { font-size: 14px; margin: 0 0 8px; color: var(--on-surface); }
.img-solve-history-list { display: flex; flex-direction: column; gap: 8px; max-height: 280px; overflow-y: auto; }
.img-solve-history-item {
  display: flex; gap: 10px; align-items: center;
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-sm);
  padding: 8px 10px; cursor: pointer;
  transition: all .15s;
}
.img-solve-history-item:hover { background: var(--surface-container-high); border-color: var(--primary); }
.img-solve-history-thumb {
  width: 44px; height: 44px; flex: 0 0 44px;
  border-radius: 6px; overflow: hidden;
  background: var(--surface-container);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
}
.img-solve-history-thumb img { width: 100%; height: 100%; object-fit: cover; }
.img-solve-history-info { flex: 1; min-width: 0; }
.img-solve-history-time { font-size: 11px; color: var(--on-surface-variant); }
.img-solve-history-preview {
  font-size: 12px; color: var(--on-surface);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  margin-top: 2px;
}
.img-solve-history-del {
  background: none; border: none; color: var(--on-surface-variant);
  cursor: pointer; font-size: 14px; padding: 4px 6px; border-radius: 4px;
}
.img-solve-history-del:hover { background: rgba(0,0,0,.08); color: var(--on-surface); }

/* 右侧解答区 */
.img-solve-main {
  background: var(--surface);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 16px;
  min-height: 320px;
}
.img-solve-result-empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  height: 100%; min-height: 280px; color: var(--on-surface-variant);
}
.img-solve-empty-emoji { font-size: 64px; margin-bottom: 12px; opacity: .6; }
.img-solve-empty-text { font-size: 14px; max-width: 360px; text-align: center; line-height: 1.7; }
.img-solve-loading {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 280px; gap: 14px;
  color: var(--on-surface-variant);
}
.img-solve-loading-text { font-size: 14px; text-align: center; line-height: 1.7; }
.img-solve-loading-text small { font-size: 12px; opacity: .8; }

.img-solve-result-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px;
}
.img-solve-result-head h3 { margin: 0; font-size: 17px; color: var(--on-surface); }
.img-solve-copy {
  background: var(--surface-container);
  border: 1px solid var(--outline-variant);
  color: var(--on-surface);
  padding: 6px 12px; border-radius: var(--radius-sm);
  cursor: pointer; font-size: 13px;
  transition: all .15s;
}
.img-solve-copy:hover { background: var(--primary-fixed); border-color: var(--primary); }
.img-solve-result-body {
  background: var(--surface-container-low);
  border-radius: var(--radius-sm);
  padding: 16px 18px;
  font-size: 14px; line-height: 1.85;
  color: var(--on-surface);
  max-height: 60vh; overflow-y: auto;
  white-space: pre-wrap; word-break: break-word;
}
.img-solve-result-body .md-p { margin: 0 0 12px; }
.img-solve-result-body .md-h3 { font-size: 17px; margin: 16px 0 8px; color: var(--primary); font-weight: 800; }
.img-solve-result-body .md-h4 { font-size: 15px; margin: 14px 0 6px; color: var(--on-surface); font-weight: 700; }
.img-solve-result-body .md-h5 { font-size: 14px; margin: 12px 0 4px; color: var(--on-surface-variant); font-weight: 700; }
.img-solve-result-body .md-ul, .img-solve-result-body .md-ol { margin: 8px 0 12px; padding-left: 24px; }
.img-solve-result-body .md-ul li, .img-solve-result-body .md-ol li { margin-bottom: 4px; }
.img-solve-result-body .md-quote {
  border-left: 3px solid var(--primary);
  background: var(--primary-fixed);
  margin: 10px 0; padding: 8px 12px;
  color: var(--on-surface-variant); border-radius: 0 6px 6px 0;
}
.img-solve-result-body .md-code {
  background: var(--surface-container-high);
  padding: 2px 6px; border-radius: 4px;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 13px;
  color: var(--primary-hover);
}
.img-solve-result-body .md-pre {
  background: #2b2620; color: #f4ecd8;
  padding: 12px 14px; border-radius: 8px;
  overflow-x: auto; margin: 10px 0;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 13px; line-height: 1.6;
}
.img-solve-result-body .md-pre code { background: transparent; padding: 0; color: inherit; }
.img-solve-result-body .md-math {
  font-family: 'Times New Roman', Cambria, serif;
  font-style: italic; color: var(--primary-hover);
  background: var(--surface-container-low);
  padding: 2px 6px; border-radius: 4px;
  white-space: nowrap;
}

.img-solve-error {
  background: rgba(194, 101, 42, .1);
  border: 1px solid var(--primary);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  color: var(--primary-hover);
  font-size: 14px; line-height: 1.6;
}

@media (max-width: 899px) {
  .img-solve-layout { grid-template-columns: 1fr; }
  .img-solve-actions .big-btn { width: 100%; }
  .img-solve-actions .big-btn.ghost { width: auto; flex: 1; }
}

/* ==================== 课件库 ==================== */
.screen-title-row {
  display: flex; align-items: center; gap: 12px;
  flex-wrap: wrap; margin-bottom: 8px;
}
.screen-title-row .screen-title { margin: 0; }

.cw-cats { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.cw-cat-chip {
  background: var(--surface-container-low);
  border: 1.5px solid var(--outline-variant);
  color: var(--on-surface);
  padding: 8px 14px; border-radius: 999px;
  font-size: 14px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  transition: all .15s;
}
.cw-cat-chip:hover { border-color: var(--primary); background: var(--primary-fixed); }
.cw-cat-chip.sel {
  background: var(--primary);
  color: var(--on-primary);
  border-color: var(--primary);
}
.cw-cat-count {
  display: inline-block; min-width: 22px; text-align: center;
  background: rgba(0,0,0,.08); border-radius: 999px;
  padding: 1px 6px; font-size: 12px; font-weight: 700;
}
.cw-cat-chip.sel .cw-cat-count { background: rgba(255,255,255,.25); color: #fff; }

.cw-filter-row { margin-bottom: 14px; }
.cw-filter-row .login-input { width: 100%; }

.cw-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.cw-card {
  display: flex; align-items: stretch; gap: 12px;
  background: var(--surface-container-lowest);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  padding: 14px;
  cursor: pointer;
  transition: all .15s;
}
.cw-card:hover {
  border-color: var(--primary);
  background: var(--primary-fixed);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.cw-card-icon {
  width: 48px; height: 48px; flex: 0 0 48px;
  border-radius: 10px;
  background: var(--surface-container-high);
  display: flex; align-items: center; justify-content: center;
  font-size: 26px;
}
.cw-card-body { flex: 1; min-width: 0; }
.cw-card-title {
  font-size: 15px; font-weight: 700; color: var(--on-surface);
  margin-bottom: 6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cw-card-meta { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-bottom: 6px; }
.cw-tag {
  font-size: 11px; padding: 2px 8px; border-radius: 4px;
  background: var(--surface-container);
  color: var(--on-surface-variant);
}
.cw-tag.cat    { background: var(--primary-container); color: var(--on-primary-container); }
.cw-tag.track  { background: rgba(91,107,138,.15); color: #3a4a6b; }
.cw-tag.level  { background: rgba(90,124,62,.15); color: #3c5a26; }
.cw-tag.order  { background: rgba(0,0,0,.08); color: var(--on-surface); font-weight: 700; }
.cw-tag.author { background: rgba(140,60,60,.15); color: #6b2c2c; }
.cw-tag.views  { background: transparent; color: var(--on-surface-variant); }
.cw-tag.time   { background: transparent; color: var(--on-surface-variant); }
.cw-card-views { font-size: 11px; color: var(--on-surface-variant); }
.cw-card-summary {
  font-size: 12.5px; color: var(--on-surface-variant);
  line-height: 1.55;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.cw-card-arrow {
  align-self: center; font-size: 22px; color: var(--on-surface-variant);
}

/* 详情 */
.cw-detail-meta { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.cw-detail-body {
  background: var(--surface-container-low);
  border-radius: var(--radius-md);
  padding: 22px 26px;
  font-size: 15px; line-height: 1.85;
  white-space: pre-wrap; word-break: break-word;
}
.cw-detail-tools { display: flex; gap: 8px; flex-wrap: wrap; }
.big-btn.danger { color: #b3402c; border-color: rgba(179,64,44,.4); }
.big-btn.danger:hover { background: rgba(179,64,44,.1); }

/* 编辑器 */
.cw-edit-form { display: flex; flex-direction: column; gap: 12px; }
.cw-edit-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.cw-edit-field { display: flex; flex-direction: column; gap: 6px; }
.cw-edit-field label { font-size: 13px; font-weight: 700; color: var(--on-surface); }
.cw-edit-field .login-input { width: 100%; }
.cw-edit-field textarea.login-input { resize: vertical; min-height: 60px; font-family: var(--font-body); line-height: 1.5; }
#cwEditContent {
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 13.5px; min-height: 360px; line-height: 1.6;
}
.cw-edit-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 4px; }
.cw-edit-actions .big-btn { width: auto; flex: 1; min-width: 140px; }
@media (max-width: 899px) {
  .cw-edit-row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .cw-edit-row { grid-template-columns: 1fr; }
}

/* ==================== 课件幻灯片播放（全屏覆盖） ==================== */
body.cw-player-open { overflow: hidden; }
.cw-player {
  position: fixed; inset: 0; z-index: 9999;
  background: linear-gradient(135deg, #1a1410 0%, #2b2620 100%);
  color: #f4ecd8;
  display: flex; flex-direction: column;
  font-family: var(--font-body);
}
.cw-player-bar {
  display: flex; align-items: center; gap: 14px;
  padding: 10px 18px;
  background: rgba(0,0,0,.35);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.cw-player-title {
  font-size: 14px; font-weight: 700;
  flex: 1; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cw-player-count { font-size: 13px; color: rgba(255,255,255,.6); }
.cw-player-tools { display: flex; gap: 6px; }
.cw-player-tool {
  background: rgba(255,255,255,.1); border: none; color: #f4ecd8;
  width: 36px; height: 36px; border-radius: 8px;
  font-size: 18px; cursor: pointer; line-height: 36px;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.cw-player-tool:hover { background: rgba(255,255,255,.2); }

.cw-player-stage {
  flex: 1; overflow-y: auto;
  display: flex; align-items: center; justify-content: center;
  padding: 40px 60px;
}
.cw-slide-inner {
  max-width: 1000px; width: 100%;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  padding: 40px 48px;
  box-shadow: 0 10px 40px rgba(0,0,0,.4);
}
.cw-slide-title {
  font-family: var(--font-headline);
  font-size: 38px; font-weight: 800;
  color: #fff;
  margin: 0 0 22px;
  border-left: 6px solid var(--primary);
  padding-left: 16px;
  line-height: 1.3;
}
.cw-slide-body { color: rgba(244,236,216,.95); }
.cw-slide-body .md-p { margin: 0 0 14px; font-size: 18px; line-height: 1.85; }
.cw-slide-body .md-h3 { font-size: 24px; color: #fff; margin: 18px 0 10px; font-weight: 800; }
.cw-slide-body .md-h4 { font-size: 20px; color: #ffd9a8; margin: 14px 0 8px; font-weight: 700; }
.cw-slide-body .md-h5 { font-size: 17px; color: #ffce9b; margin: 10px 0 6px; font-weight: 700; }
.cw-slide-body .md-ul, .cw-slide-body .md-ol { font-size: 17px; line-height: 1.85; margin: 8px 0 14px; padding-left: 28px; }
.cw-slide-body .md-ul li, .cw-slide-body .md-ol li { margin-bottom: 6px; }
.cw-slide-body .md-quote {
  border-left: 4px solid var(--primary);
  background: rgba(255,255,255,.06);
  margin: 12px 0; padding: 10px 14px; border-radius: 0 8px 8px 0;
  color: rgba(244,236,216,.85); font-size: 16px;
}
.cw-slide-body .md-code {
  background: rgba(255,255,255,.1);
  padding: 2px 8px; border-radius: 4px;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 16px;
  color: #ffd9a8;
}
.cw-slide-body .md-pre {
  background: #15110d; color: #f4ecd8;
  padding: 16px 20px; border-radius: 10px;
  overflow-x: auto; margin: 14px 0;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 16px; line-height: 1.7;
  border: 1px solid rgba(255,255,255,.1);
}
.cw-slide-body .md-pre code { background: transparent; padding: 0; color: inherit; }
.cw-slide-body .md-math {
  font-family: 'Times New Roman', Cambria, serif;
  font-style: italic; color: #ffd9a8;
  background: rgba(255,255,255,.06);
  padding: 2px 8px; border-radius: 4px;
  white-space: nowrap; font-size: 17px;
}
.cw-slide-body strong { color: #fff; }

.cw-player-nav {
  display: flex; gap: 6px; justify-content: center;
  padding: 12px;
  background: rgba(0,0,0,.25);
  flex-wrap: wrap;
}
.cw-player-dot {
  width: 12px; height: 12px; border-radius: 50%;
  background: rgba(255,255,255,.18);
  border: none; cursor: pointer;
  transition: all .15s;
}
.cw-player-dot:hover { background: rgba(255,255,255,.4); transform: scale(1.2); }
.cw-player-dot.active {
  background: var(--primary);
  width: 28px; border-radius: 6px;
}

@media (max-width: 768px) {
  .cw-player-stage { padding: 16px; }
  .cw-slide-inner { padding: 20px; }
  .cw-slide-title { font-size: 26px; }
  .cw-slide-body .md-p { font-size: 15px; }
  .cw-slide-body .md-h3 { font-size: 20px; }
  .cw-slide-body .md-h4 { font-size: 17px; }
  .cw-slide-body .md-pre { font-size: 13px; }
}

/* ==================== 通用 Markdown 样式（供 .markdown-body 复用） ==================== */
.markdown-body { white-space: pre-wrap; word-break: break-word; }
.markdown-body .md-p { margin: 0 0 12px; }
.markdown-body .md-h3 { font-size: 17px; margin: 16px 0 8px; color: var(--primary); font-weight: 800; }
.markdown-body .md-h4 { font-size: 15px; margin: 14px 0 6px; color: var(--on-surface); font-weight: 700; }
.markdown-body .md-h5 { font-size: 14px; margin: 12px 0 4px; color: var(--on-surface-variant); font-weight: 700; }
.markdown-body .md-ul, .markdown-body .md-ol { margin: 8px 0 12px; padding-left: 24px; }
.markdown-body .md-ul li, .markdown-body .md-ol li { margin-bottom: 4px; }
.markdown-body .md-quote {
  border-left: 3px solid var(--primary);
  background: var(--primary-fixed);
  margin: 10px 0; padding: 8px 12px;
  color: var(--on-surface-variant); border-radius: 0 6px 6px 0;
}
.markdown-body .md-code {
  background: var(--surface-container-high);
  padding: 2px 6px; border-radius: 4px;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 13px;
  color: var(--primary-hover);
}
.markdown-body .md-pre {
  background: #2b2620; color: #f4ecd8;
  padding: 12px 14px; border-radius: 8px;
  overflow-x: auto; margin: 10px 0;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 13px; line-height: 1.6;
}
.markdown-body .md-pre code { background: transparent; padding: 0; color: inherit; }
.markdown-body .md-math {
  font-family: 'Times New Roman', Cambria, serif;
  font-style: italic; color: var(--primary-hover);
  background: var(--surface-container-low);
  padding: 2px 6px; border-radius: 4px;
  white-space: nowrap;
}