:root {
  --bg: #f5f7fb;
  --panel: #ffffff;
  --ink: #1f2733;
  --muted: #6b7785;
  --brand: #2f6df6;
  --brand-soft: #e8f0ff;
  --user: #eef3ff;   /* 用户气泡原始浅蓝；深色模式下覆盖为半透明蓝 */
  --bot: #f1f4f9;
  /* 对话区背景（近白，比 --panel 的纯白略暗，让白色卡片浮起来）。
     全宽视图（真题库等）若要与对话区同底，请统一引用本变量，不要各写各的字面值。 */
  --chat-bg: #fcfcfc;
  --border: #e3e8ef;
  /* 滚动条：默认隐藏，悬停显示；浅色模式下用半透明灰 */
  --scrollbar: rgba(100,100,100,.32);
  --scrollbar-hover: rgba(100,100,100,.55);
  /* 居中内容列宽度（须与 .chat-inner / .composer-wrap 的 max-width、水平 padding 同步） */
  --content-max: 860px;
  --content-pad-x: 18px;
  --content-total: calc(var(--content-max) + 2 * var(--content-pad-x));
  /* 滚动条槽宽：.chat-scroll 用 ::-webkit-scrollbar 设 10px，.composer-zone 用同值 padding-right 手动预留，
     使对话区与输入框的居中参考系统一（都是 W - --scrollbar-w），开/关左栏都精准对齐 */
  --scrollbar-w: 10px;
}
/* 由 JS 实测的对话区滚动条宽，用于让底部输入框与其对齐；未测出时为 0 */
html[data-theme="dark"] {
  --bg: #1a1d24;
  --panel: #252830;
  /* 深色下对话区直接沿用 --bg（与 .chat 的既有覆盖保持一致） */
  --chat-bg: var(--bg);
  --ink: #e8ecf2;
  --muted: #9aa3b2;
  --brand-soft: rgba(47,109,246,.18);
  --bot: #2d323d;
  --border: #3a404d;
  --user: rgba(47,109,246,.30);
  /* 深色模式下滚动条用更暗的半透明浅色，避免刺眼 */
  --scrollbar: rgba(255,255,255,.16);
  --scrollbar-hover: rgba(255,255,255,.28);
}

img { max-width: 100%; height: auto; }   /* 兜底：所有图片都不撑破容器 */
body { margin: 0; font-family: -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  background: var(--bg); color: var(--ink); }
.app { display: flex; width: 100%; height: 100vh; }
/* 登录门禁：未登录时主界面默认隐藏，避免刷新瞬间「先画主界面再盖登录浮层」的闪烁（FOUC）。
   关键：auth-hidden 只切换 visibility 而不切换 display，.app 始终是 display:flex。
   这样运行时登录成功是 visibility:hidden→visible，不会触发 flex 的 none→flex 重排
   （部分 WebView 会在那一帧算错 .chat 宽度，导致对话区被压窄、通道按钮竖排）。
   刷新与运行时路径表现一致，根除登录后偶发布局错乱。
   初始 .app 带 auth-hidden 类，由 early-boot 脚本（首屏绘制前）或运行时 showLogin/hideLogin 同步维护。 */
.app.auth-hidden { visibility: hidden; pointer-events: none; }

/* 启动占位：覆盖首屏脚本加载期间的白屏，任何人打开都先看到品牌加载页 */
.splash {
  position: fixed; inset: 0; z-index: 99999;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 16px; background: var(--bg); color: var(--ink);
  transition: opacity .3s ease, visibility .3s ease;
}
.splash--hide { opacity: 0; visibility: hidden; }
.splash-brand { font-size: 26px; font-weight: 700; letter-spacing: 3px; color: var(--brand); }
.splash-loading { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 14px; }
.splash-spinner {
  width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid var(--border); border-top-color: var(--brand);
  animation: splash-spin .8s linear infinite;
}
@keyframes splash-spin { to { transform: rotate(360deg); } }

.side { width: 280px; flex-shrink: 0; background: #f9f9f9; border-right: 1px solid var(--border);
  padding: 6px 18px 18px; display: flex; flex-direction: column; gap: 14px; overflow-y: auto; }
html[data-theme="dark"] .side { background: var(--bg); }
.side-top { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; overflow: hidden; }
.side-bottom { display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
/* 移动端侧栏关闭按钮：桌面端隐藏 */
.side-close { display: none; }
/* 滚动条 overlay 风格（类 WorkBuddy）：默认全隐藏，鼠标进入哪个区域才淡出那一条。
   .tree 在 .side 内；.drawer .d-body 是右侧弹出层。用 :not(:has()) 排除子区悬停，保证同一时刻仅一条可见。
   scrollbar-gutter: stable 预留固定槽位，显隐切换不引起布局抖动。 */
.side, .tree, .drawer .d-body {
  scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: transparent transparent;
}
.side::-webkit-scrollbar, .tree::-webkit-scrollbar, .drawer .d-body::-webkit-scrollbar { width: 10px; }
.side::-webkit-scrollbar-track, .tree::-webkit-scrollbar-track, .drawer .d-body::-webkit-scrollbar-track { background: transparent; }
.side::-webkit-scrollbar-thumb, .tree::-webkit-scrollbar-thumb, .drawer .d-body::-webkit-scrollbar-thumb { background: transparent; border-radius: 6px; transition: background .18s; }
/* 子区域（教材目录 / 抽屉内容）：悬停时显示自身滚动条 */
.tree:hover, .drawer .d-body:hover { scrollbar-color: var(--scrollbar) transparent; }
.tree:hover::-webkit-scrollbar-thumb, .drawer .d-body:hover::-webkit-scrollbar-thumb { background: var(--scrollbar); }
.tree:hover::-webkit-scrollbar-thumb:hover, .drawer .d-body:hover::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-hover); border: 2px solid transparent; background-clip: padding-box; }
/* 侧边栏整体：仅当鼠标在 side 空白处（不在目录）时显示 */
.side:hover:not(:has(.tree:hover)) { scrollbar-color: var(--scrollbar) transparent; }
.side:hover:not(:has(.tree:hover))::-webkit-scrollbar-thumb { background: var(--scrollbar); }
.side:hover:not(:has(.tree:hover))::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-hover); border: 2px solid transparent; background-clip: padding-box; }
.side-logo { display: block; width: auto; max-width: 150px; flex-shrink: 0; height: auto; object-fit: contain; }
.side-header { display: flex; align-items: center; justify-content: flex-start; flex-shrink: 0; margin-bottom: 6px; }
.side-brand-text { margin-left: 8px; font-size: 15px; font-weight: 700; color: var(--text); letter-spacing: 2px; white-space: nowrap; }
.side label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--muted); }
.side select, .side button { font: inherit; padding: 8px 10px; border: 1px solid var(--border);
  border-radius: 8px; background: #fff; color: var(--ink); }
html[data-theme="dark"] .side select,
html[data-theme="dark"] .side button { background: var(--panel); }
.side .hint { font-size: 12px; color: var(--muted); line-height: 1.5; margin: 0; }
#reviewBtn, #gkBankBtn { background: var(--brand-soft); color: var(--brand); border-color: transparent;
  cursor: pointer; font-weight: 700; }
html[data-theme="dark"] #reviewBtn,
html[data-theme="dark"] #profileBtn,
html[data-theme="dark"] #gkBankBtn { color: #fff; }
#chapterTree { flex-shrink: 0; height: 400px; overflow-y: auto; }
.review { font-size: 13px; }
.review .item { background: var(--bot); border-radius: 8px; padding: 8px 10px; margin-bottom: 6px; position: relative; }
.review .item b { color: var(--brand); }
.review .item.due { background: var(--brand-soft); border: 1px solid var(--brand); padding-right: 70px; }
.review .item.due b { color: var(--brand); }
.review .due-badge { position: absolute; top: 6px; right: 8px; background: var(--brand); color: #fff;
  font-size: 10px; line-height: 1; padding: 3px 7px; border-radius: 999px; font-weight: 700; letter-spacing: .5px; }
.foot { margin-top: auto; font-size: 11px; color: var(--muted); }

/* 触发器按钮：左对齐文字 + 右侧 ▶ 箭头，提示点击后内容向右弹出 */
#reviewBtn, #profileBtn, #mistakeBtn, #gkBankBtn {
  position: relative;
  text-align: left;
  padding-right: 26px;
}
#reviewBtn::after, #profileBtn::after, #mistakeBtn::after, #gkBankBtn::after {
  content: "▶";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 9px;
  opacity: .7;
}

.review { font-size: 13px; }
.profile { font-size: 13px; }

/* ---------- 右侧弹出抽屉（学情画像 / 复习计划） ---------- */
/* 默认四重隐藏：visibility:hidden + opacity:0 + 偏移屏幕 + 不响应事件，
   即使 CSS 偶发未加载/transform 失效，也不会冒出空白抽屉盖住侧边栏。 */
.drawer-mask { position: fixed; left: 280px; top: 0; right: 0; bottom: 0;
  background: rgba(15,23,42,.28); opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .22s ease, visibility .22s ease; z-index: 50; }
.drawer-mask.show { opacity: 1; visibility: visible; pointer-events: auto; }
.drawer { position: fixed; left: 280px; top: 0; bottom: 0;
  width: min(420px, 92vw); background: var(--panel); border-right: 1px solid var(--border);
  box-shadow: 4px 0 24px rgba(15,23,42,.12); display: flex; flex-direction: column;
  transform: translateX(-110%); visibility: hidden; opacity: 0; pointer-events: none;
  transition: transform .24s ease, opacity .24s ease, visibility .24s ease; z-index: 60; }
.drawer.show { transform: translateX(0); visibility: visible; opacity: 1; pointer-events: auto; }
.drawer .d-head { display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.drawer .d-title { font-size: 15px; font-weight: 700; color: var(--ink); }
/* 学情/复习抽屉内的「按册查看」切换器：与聊天区册切换对齐，但互不干扰 */
.drawer .d-book-switch { flex: 1 1 auto; display: flex; justify-content: center; min-width: 0; margin: 0 8px; }
.drawer-book-sel { max-width: 100%; font-size: 12.5px; font-weight: 700; color: var(--ink);
  background: var(--bot); border: 1px solid var(--border); border-radius: 8px;
  padding: 4px 22px 4px 8px; cursor: pointer; -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M2 3.5L5 6.5L8 3.5' fill='none' stroke='%23888' stroke-width='1.4'/></svg>");
  background-repeat: no-repeat; background-position: right 7px center; }
.drawer-book-sel:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.drawer .d-close { border: none; background: transparent; cursor: pointer; font-size: 16px;
  line-height: 1; color: var(--muted); padding: 4px 8px; border-radius: 8px; }
.drawer .d-close:hover { background: var(--brand-soft); color: var(--brand); }
.drawer .d-body { flex: 1 1 auto; overflow-y: auto; overflow-x: hidden; min-height: 0; padding: 16px; }

/* ---------- 我的学情画像（错题本 + 到期回炉 + 学习曲线） ---------- */
#profileBtn, #gkBankBtn { background: var(--brand-soft); color: var(--brand); border-color: transparent;
  cursor: pointer; font-weight: 700; }
.profile .empty { color: var(--muted); font-size: 12px; padding: 4px 2px; }
.profile .pf-head { display: flex; gap: 8px; margin-bottom: 8px; }
.profile .stat { flex: 1; background: var(--bot); border-radius: 8px; padding: 7px 8px; text-align: center; }
.profile .stat .n { font-size: 18px; font-weight: 700; color: var(--brand); line-height: 1.1; }
.profile .stat .l { font-size: 11px; color: var(--muted); margin-top: 2px; }
.profile .pf-title { font-size: 12px; color: var(--muted); font-weight: 600; margin: 10px 0 5px; }
.profile .pf-title .badge { background: #ffe6e6; color: #c0392b; border-radius: 10px;
  padding: 0 7px; font-size: 11px; margin-left: 5px; }
.profile .card { background: var(--bot); border-radius: 8px; padding: 8px 10px; margin-bottom: 6px;
  word-break: break-word; overflow-wrap: break-word; min-width: 0; }
.profile .card .top { display: flex; justify-content: space-between; align-items: center; gap: 6px; min-width: 0; }
.profile .card .name { flex: 1 1 auto; min-width: 0; font-weight: 600; color: var(--ink); font-size: 12.5px; word-break: break-word; overflow-wrap: break-word; }
.profile .lv { font-size: 11px; padding: 1px 7px; border-radius: 10px; white-space: nowrap; }
.profile .lv.low { background: #ffe6e6; color: #c0392b; }
.profile .lv.mid { background: #fff3d6; color: #a9791b; }
.profile .lv.high { background: #e2f6e9; color: #1f7a40; }
.profile .wp { margin-top: 5px; display: flex; flex-wrap: wrap; gap: 4px;
  word-break: break-word; overflow-wrap: break-word; min-width: 0; }
.profile .wp .tag { background: #fff; border: 1px solid var(--border); color: #c0392b;
  border-radius: 6px; padding: 1px 6px; font-size: 11px; max-width: 100%;
  word-break: break-word; overflow-wrap: break-word; }
.profile .wp .tag.empty { background: var(--bot); color: var(--muted); border-style: dashed; }
.profile .note { margin-top: 4px; font-size: 11px; color: var(--muted); line-height: 1.5; }
.profile .note.empty { color: #b0b6c0; font-style: italic; }
.profile .card .meta { font-size: 11px; color: var(--muted); margin-top: 3px; }
.profile .card.sim-rec { border-left: 3px solid var(--brand); }
.profile .card.sim-rec .lv { background: #e7efff; color: #2f6df6; }
.profile .retest { margin-top: 6px; width: 100%; background: var(--brand); color: #fff;
  border: none; border-radius: 7px; padding: 5px 0; font-size: 12px; font-weight: 600; cursor: pointer; }
.profile .retest:hover { filter: brightness(1.05); }
.profile .curve { display: flex; align-items: flex-end; gap: 3px; height: 40px;
  background: var(--bot); border-radius: 8px; padding: 6px 8px; }
.profile .curve .bar { flex: 1; min-width: 3px; background: var(--brand); border-radius: 2px 2px 0 0; opacity: .85; }

/* ---------- 成长地图（激励系统 P1#8） ---------- */
.profile .growth-map { background: var(--bot); border-radius: 8px; padding: 8px; margin-bottom: 4px; }
.profile .map-legend { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 7px; }
.profile .map-legend .lg { font-size: 10px; padding: 1px 6px; border-radius: 8px; color: #334; }
.profile .map-row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.profile .map-ch { flex: 0 0 38px; font-size: 11px; color: var(--muted); text-align: right; }
.profile .map-cells { display: flex; flex-wrap: wrap; gap: 4px; }
.profile .cell { width: 26px; height: 22px; border-radius: 5px; display: flex; align-items: center;
  justify-content: center; font-size: 10.5px; color: #334; cursor: default; border: 1px solid rgba(0,0,0,.06); }
.profile .cell.lv0 { background: #e9edf2; color: #8a93a0; }
.profile .cell.lv1 { background: #ffd9d6; color: #b23b32; }
.profile .cell.lv2 { background: #ffe2b8; color: #9a6a12; }
.profile .cell.lv3 { background: #f4e98a; color: #7a6a13; }
.profile .cell.lv4 { background: #bfe9c8; color: #1f7a40; }
.profile .cell.lv5 { background: #7fd6a0; color: #0f5132; }
.profile .map-legend .lg.lv0 { background: #e9edf2; }
.profile .map-legend .lg.lv1 { background: #ffd9d6; }
.profile .map-legend .lg.lv2 { background: #ffe2b8; }
.profile .map-legend .lg.lv3 { background: #f4e98a; }
.profile .map-legend .lg.lv4 { background: #bfe9c8; }
.profile .map-legend .lg.lv5 { background: #7fd6a0; }
/* 覆盖摘要 */
.profile .map-summary { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 8px; }
.profile .map-summary .ms { font-size: 10.5px; padding: 1px 7px; border-radius: 8px; color: #445; background: #eef1f5; }
.profile .map-summary .ms.mastered { background: #bfe9c8; color: #1f7a40; }
.profile .map-summary .ms.learning { background: #ffe2b8; color: #9a6a12; }
.profile .map-summary .ms.untouched { background: #e9edf2; color: #8a93a0; }
.profile .map-summary .ms.total { background: transparent; color: var(--muted); }
/* 悬停高亮 */
.profile .cell { transition: transform .08s ease, box-shadow .08s ease; }
.profile .cell:hover { transform: scale(1.12); box-shadow: 0 2px 6px rgba(0,0,0,.18); position: relative; z-index: 2; }

/* ---------- 进步反馈卡片（激励系统 P1#8） ---------- */
.profile .progress, .progress { margin-top: 5px; background: linear-gradient(135deg,#eafaf0,#eaf2ff);
  border: 1px solid #cfe9d8; border-radius: 9px; padding: 7px 9px; }
.profile .progress .p-item { font-size: 12px; color: #1f6b3f; line-height: 1.55; }
.profile .progress .p-item + .p-item { margin-top: 2px; }

/* 「错误是礼物」卡片（激励系统 P1#8 阶段B） */
.gift { margin-top: 6px; background: linear-gradient(135deg,#fff6e6,#fef0f4);
  border: 1px solid #f3d9a6; border-radius: 9px; padding: 8px 10px; }
.gift .g-item { font-size: 12px; color: #8a5a12; line-height: 1.6; }
.gift .g-item + .g-item { margin-top: 4px; }
/* 学情抽屉里「待澄清前概念」卡片与礼物标签 */
.profile .card.miscon { border-color: #f3d9a6; background: #fffaf0; }
.profile .card.miscon .note { color: #8a5a12; }
.profile .tag.gift-tag { background: #fbe6c8; color: #8a5a12; border: 1px solid #f0cf9a; }
.profile .card.precon { border-color: #cfc7f0; background: #fbfaff; }
.profile .card.precon .note { color: #3c3489; }

/* ---------- 阶段一① 前概念探针（概念转变·进节前主动探测） ---------- */
.probe-card { margin: 10px 0; padding: 12px 14px; background: #fbfaff;
  border: 1px solid #d9d2f3; border-radius: 12px; }
.probe-head { font-weight: 500; color: #3c3489; font-size: 14px; }
.probe-sub { color: #6b6585; font-size: 12px; margin: 4px 0 10px; line-height: 1.6; }
.probe-q { margin: 10px 0; }
.probe-qt { font-size: 13px; color: #2c2c2a; line-height: 1.65; margin-bottom: 6px; }
.probe-ta { width: 100%; min-height: 64px; box-sizing: border-box; resize: vertical;
  border: 1px solid #d9d2f3; border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 13px;
  background: #fff; color: #2c2c2a; }
.probe-ta:focus { outline: none; border-color: #7f77dd; }
.probe-existing { margin: 8px 0 4px; font-size: 12px; color: #6b6585; }
.tag.precon-tag { background: #e9e3fb; color: #3c3489; border: 1px solid #cfc7f0; margin-left: 4px; }
.precon-fb { background: linear-gradient(135deg,#fff6e6,#fef0f4); border-color: #f3d9a6; margin-top: 10px; }
.precon-fb-head { font-weight: 500; color: #8a5a12; font-size: 13px; margin-bottom: 4px; }
.probe-go { margin-top: 10px; background: var(--brand); color: #fff; border: none; }
.probe-go:hover { filter: brightness(1.05); }
.probe-evaluating { color: #6b6585; font-size: 13px; margin: 8px 0; }

/* ---------- 迁移挑战卡（阶段一②：新情境迁移 + 自我解释引导） ---------- */
.transfer-card { margin: 10px 0; padding: 12px 14px; background: #f3fbf8;
  border: 1px solid #bfe6d8; border-radius: 12px; }
.transfer-head { font-weight: 500; color: #1f7a5a; font-size: 14px; }
.transfer-sub { color: #5c7a70; font-size: 12px; margin: 4px 0 10px; line-height: 1.6; }
.transfer-q { margin: 12px 0; }
.transfer-qt { font-size: 13px; color: #2c2c2a; line-height: 1.65; margin-bottom: 6px; }
.transfer-ta { width: 100%; min-height: 60px; box-sizing: border-box; resize: vertical;
  border: 1px solid #bfe6d8; border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 13px;
  background: #fff; color: #2c2c2a; }
.transfer-ta:focus { outline: none; border-color: #2bb38a; }
.transfer-self-label { font-size: 12px; color: #1f7a5a; margin: 8px 0 4px; font-weight: 500; }
.transfer-self { min-height: 48px; background: #fbfdff; }
.transfer-existing { margin: 8px 0 4px; font-size: 12px; color: #5c7a70; }
.tag.transfer-tag { background: #d8f1e8; color: #1f7a5a; border: 1px solid #bfe6d8; margin-left: 4px; }
.transfer-fb { background: linear-gradient(135deg,#eafaf3,#eef6ff); border-color: #bfe6d8; margin-top: 10px; }
.transfer-fb-head { font-weight: 500; color: #1f7a5a; font-size: 13px; margin-bottom: 4px; }
.transfer-fb-q { font-size: 12px; color: #2c2c2a; margin-bottom: 6px; line-height: 1.55; }
.transfer-fb-row { font-size: 12px; color: #2c2c2a; line-height: 1.6; margin: 3px 0; display: flex; gap: 6px; align-items: baseline; }
.transfer-fb-row .tf-label { flex: 0 0 52px; color: #5c7a70; }
.transfer-fb-nudge { font-size: 12px; color: #1f7a5a; margin-top: 6px; line-height: 1.6; }
.tag.tf-ok { background: #dcf5e6; color: #1f7a4a; border: 1px solid #b6e6c8; }
.tag.tf-partial { background: #fff3d6; color: #8a6412; border: 1px solid #f0dca6; }
.tag.tf-bad { background: #fde3e3; color: #a83a3a; border: 1px solid #f3c4c4; }
.transfer-go { margin-top: 10px; background: #1f7a5a; color: #fff; border: none; }
.transfer-go:hover { filter: brightness(1.05); }
.transfer-evaluating { color: #5c7a70; font-size: 13px; margin: 8px 0; }
.card.transfer { border-left: 3px solid #2bb38a; }

/* ---------- 里程碑成就庆祝卡（阶段B·非游戏化） ---------- */
/* 对话中的即时庆祝：把你"做到的事"被看见、被肯定；不做排名、不做稀缺 */
.milestone { margin-top: 6px; background: linear-gradient(135deg,#fff6da,#fdeaf1);
  border: 1px solid #f0d59a; border-radius: 9px; padding: 8px 10px; }
.milestone .ms-item { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: #7a5a16; line-height: 1.5; }
.milestone .ms-item + .ms-item { margin-top: 4px; }
.milestone .ms-ico { font-size: 15px; line-height: 1; }
.milestone .ms-txt b { color: #5e3f08; }
/* 学情抽屉顶部的「成长里程碑」纪念条 */
.profile .ms-strip { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 4px; }
.profile .ms-chip { display: inline-flex; align-items: center; gap: 5px;
  background: linear-gradient(135deg,#fff6da,#fdeaf1); border: 1px solid #f0d59a;
  color: #7a5a16; border-radius: 14px; padding: 3px 9px; font-size: 11.5px; line-height: 1.4; }
.profile .ms-chip .ms-ico { font-size: 13px; line-height: 1; }
.profile .ms-chip .ms-name { font-weight: 600; }
.profile .ms-chip.locked { background: #f3f4f6; border: 1px dashed #cfd3d8; color: #9aa0a8; }
.profile .ms-chip.locked .ms-name { font-weight: 500; }

/* 成长型复盘（阶段B·成长型复盘）：一段"从模糊到清晰"的成长小结卡片 */
.profile .review-box { margin: 2px 0 4px; background: linear-gradient(135deg,#f3f8ff,#f6f0ff);
  border: 1px solid #dfe6f5; border-radius: 11px; padding: 10px 12px; }
.profile .review-box.loading { opacity: .6; }
.profile .review-text { font-size: 12.5px; line-height: 1.7; color: #34415e; white-space: normal; }
.profile .review-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.profile .rv-chip { background: #eaf6ee; border: 1px solid #cfe9d8; color: #1f6b3f;
  border-radius: 12px; padding: 2px 8px; font-size: 11px; font-weight: 600; }
.profile .review-actions { display: flex; gap: 6px; margin-top: 9px; }
.profile .rv-btn { flex: 1; cursor: pointer; font-size: 12px; color: #3b4a66;
  background: #fff; border: 1px solid #cfd8ea; border-radius: 8px; padding: 5px 0;
  transition: background .12s, border-color .12s; }
.profile .rv-btn:hover { background: #eef3fc; border-color: #a9bce0; }
.profile .rv-btn.active { background: #4f7ad6; border-color: #4f7ad6; color: #fff; }
.profile .review-meta { margin-top: 6px; font-size: 11px; color: #98a2b8; }

/* ---------- 智能回炉（P1#9：错题本与智能回炉） ---------- */
/* 一键智能回炉：醒目主按钮，强调"现在就回炉最值得想透的点" */
.profile .retest-all { display: block; width: 100%; margin: 2px 0 8px;
  background: linear-gradient(135deg,#2f6df6,#5b8def); color: #fff; border: none;
  border-radius: 9px; padding: 9px 0; font-size: 13px; font-weight: 700; cursor: pointer;
  box-shadow: 0 3px 10px rgba(47,109,246,.22); }
.profile .retest-all:hover { filter: brightness(1.05); }
.profile .retest-all:active { transform: translateY(1px); }
/* 回炉队列卡片（复用 .card 基础，加左侧强调条区分） */
.profile .card.rg { border-left: 3px solid var(--brand); }
.profile .card.rg .wp { margin-top: 5px; }
/* 回炉理由 chip：按 kind 着色（礼物=暖金 / 到期=红 / 薄弱=琥珀 / 偏浅=蓝），非羞辱、成长型 */
.profile .rg-reasons { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.profile .rg-reason { font-size: 11px; padding: 1px 7px; border-radius: 8px;
  white-space: normal; word-break: break-word; overflow-wrap: break-word; max-width: 100%; }
.profile .rg-reason.miscon { background: #fbe6c8; color: #8a5a12; border: 1px solid #f0cf9a; }
.profile .rg-reason.due { background: #ffe6e6; color: #c0392b; border: 1px solid #f3c4c4; }
.profile .rg-reason.weak { background: #fff3d6; color: #a9791b; border: 1px solid #ecd9a6; }
.profile .rg-reason.low { background: #e8f0ff; color: #2f6df6; border: 1px solid #cfe0ff; }

.chat { flex: 1 1 auto; min-width: 0; width: 100%; display: flex; flex-direction: column; background: var(--chat-bg); }   /* 对话区背景 */
html[data-theme="dark"] .chat { background: var(--chat-bg); }
.chat-header { display: flex; align-items: center; padding: 10px 16px; border-bottom: 1px solid var(--border); background: var(--chat-bg); }
html[data-theme="dark"] .chat-header { background: var(--chat-bg); }
/* 高考真题库与对话区同底：三个全宽视图共用 .mistake-view 外壳（背景 --panel 纯白），
   真题库单独覆盖成 --chat-bg，错题本/本章真题保持原样不动。 */
#gkBankView { background: var(--chat-bg); }
.chat-header .side-toggle { width: 36px; height: 36px; padding: 0; border: none; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s, color .15s; }
.chat-header .side-toggle:hover { background: var(--brand-soft); color: var(--brand); }
.chat-header .side-toggle svg { width: 20px; height: 20px; }
.chat-header .side-toggle .icon-expand { display: none; }
.side-collapsed .chat-header .side-toggle .icon-collapse { display: none; }
.side-collapsed .chat-header .side-toggle .icon-expand { display: block; }
.chat-header .side-toggle .icon-menu { display: none; }
.chat-title { flex: 1; min-width: 0; font-size: 15px; font-weight: 700; color: var(--ink); margin-left: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.main-back { display: none; align-items: center; gap: 4px; font-size: 13px; padding: 5px 10px; border-radius: 8px; background: transparent; border: 1px solid var(--border); color: var(--muted); cursor: pointer; margin-right: 4px; }
.main-back:hover { color: var(--ink); border-color: var(--muted); }
.main-count { display: none; font-size: 13px; color: var(--muted); white-space: nowrap; }
.chat-header.in-view .side-toggle { display: none !important; }
.chat-header.in-view .main-back { display: inline-flex; }
.chat-header.in-view .main-count { display: inline-flex; }
.chat-header.in-view #mistakeBack { display: none; }
/* S3 总复习模式开关 */
.review-mode-btn { margin-left: auto; font-size: 13px; font-weight: 600; padding: 6px 12px; border-radius: 999px; background: transparent; border: 1px solid var(--border); color: var(--muted); cursor: pointer; transition: background .15s, color .15s, border-color .15s; white-space: nowrap; }
.review-mode-btn:hover { color: var(--brand); border-color: var(--brand); }
.review-mode-btn.active { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: 0 2px 8px color-mix(in srgb, var(--brand) 30%, transparent); }
.review-mode-banner { margin: 8px 14px 0; padding: 8px 14px; border-radius: 10px; font-size: 13px; font-weight: 500; color: var(--brand); background: color-mix(in srgb, var(--brand) 8%, transparent); border: 1px solid color-mix(in srgb, var(--brand) 25%, transparent); }
.review-mode-banner[hidden] { display: none; }
/* 全宽视图（错题本/本章真题/真题库）下，chat-header 已承担标题+返回+计数，.mv-head 重复，隐藏 */
.chat.mistake-mode .mv-head { display: none; }
.side-collapsed .side { width: 0; padding: 0; border-right: none; overflow: hidden; opacity: 0; transition: width .25s ease, opacity .2s ease, padding .25s ease; }
.chat-scroll { flex: 1 1 auto; overflow-y: scroll; overflow-x: hidden; min-height: 0; width: 100%;   /* 整宽滚动容器：滚动条贴整个右侧面板最右缘，类 WorkBuddy；滚动区截止于输入框顶部；overflow-x:hidden 杜绝插图导致的水平滚动条；
   overflow-y:scroll + scrollbar-gutter:stable 双重保险：常驻预留滚动条槽位，内容框宽度恒定、插入仿真等大块时居中列不再横向位移；旧 WebView 不认 scrollbar-gutter 时 scroll 兜底 */
  scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: transparent transparent;   /* overlay：默认隐藏，hover 才显示；stable 防宽度抖动 */
  overflow-anchor: none; position: relative; }   /* 关闭浏览器滚动锚定，避免和流式钉底的 scrollTop 程序化设置冲突导致整页上下抖动；relative 给绝对定位的「回到最底」按钮提供锚点 */
.chat-scroll::-webkit-scrollbar { width: var(--scrollbar-w); }
.chat-scroll::-webkit-scrollbar-track { background: transparent; }
.chat-scroll::-webkit-scrollbar-thumb { background: transparent; border-radius: 6px;
  border: 2px solid transparent; background-clip: padding-box; transition: background .18s; }
/* 右侧对话区：鼠标进入才淡出滚动条 */
.chat-scroll:hover { scrollbar-color: var(--scrollbar) transparent; }
.chat-scroll:hover::-webkit-scrollbar-thumb { background: var(--scrollbar); }
.chat-scroll:hover::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-hover); border: 2px solid transparent; background-clip: padding-box; }
.chat-inner { max-width: 860px; margin: 0 auto; padding: 22px 18px 6px; }   /* 居中内容列（仅包 messages）。与 .composer-wrap 同宽对齐（详见下方 alignChatColumns 运行时同步） */
/* 「回到最底」悬浮按钮：滚到非底部时显示，点击瞬时/平滑滚到底；学习对话区与总复习对话区共用 chatScroll，自动跟底时（120px 内）自动隐藏。
   位置：滚动容器右下，避开滚动条（scrollbar-gutter:stable 预留 g ≈ 10px）；用 transform 淡入淡出，避免撑开/挤压聊天流；鼠标事件默认不拦截滚动。 */
.scroll-to-bottom-btn {
  position: absolute; left: 50%; bottom: calc(100% + 14px);
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--panel, #fff); color: var(--text, #1f2937);
  border: 1px solid var(--border, #e5e7eb);
  box-shadow: 0 4px 14px rgba(15, 23, 42, .18), 0 1px 3px rgba(15, 23, 42, .08);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; padding: 0; z-index: 20;
  opacity: 0; transform: translateX(-50%) translateY(8px) scale(.92);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease, background .15s, box-shadow .15s;
}
.scroll-to-bottom-btn[hidden] { display: none; }
.scroll-to-bottom-btn.is-visible { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); pointer-events: auto; }
.scroll-to-bottom-btn:hover { background: var(--bg-soft, #f9fafb); box-shadow: 0 6px 18px rgba(15, 23, 42, .22), 0 1px 4px rgba(15, 23, 42, .12); }
.scroll-to-bottom-btn:active { transform: translateX(-50%) translateY(0) scale(.95); }
.scroll-to-bottom-btn:focus-visible { outline: 2px solid var(--brand, #7ED321); outline-offset: 2px; }
.scroll-to-bottom-btn svg { width: 18px; height: 18px; display: block; }
.scroll-to-bottom-btn .stb-badge {
  position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px;
  padding: 0 5px; border-radius: 9px;
  background: var(--brand, #7ED321); color: #fff;
  font-size: 11px; font-weight: 700; line-height: 18px; text-align: center;
  box-shadow: 0 2px 6px rgba(15, 23, 42, .2);
  pointer-events: none;
}
.messages { display: flex; flex-direction: column; gap: 14px; padding: 0; }
/* composer 外层：固定在 .chat 底部、不随滚动；与 messages 同处居中列等宽对齐。
   .chat-scroll 有 scrollbar-gutter:stable 预留右侧滚动条槽宽 g，使 .chat-inner 在 (W-g) 区域内居中；
   .composer-wrap 自身 padding 与 .chat-inner 一致（18px 左右），故让其外缘在 (W-g) 区域内居中即可与 .chat-inner 外缘对齐。
   真正的像素级对齐由 index.html 末尾的 alignChatColumns() 运行时完成：量 .messages 相对 .chat 的左右像素，
   同步给 .composer-wrap / .formula-bar 的 margin 与 width（scrollbar-gutter/::-webkit-scrollbar 实际宽度无法用公式预判）。
   「回到最底」按钮挂在 .composer-wrap 内（position:relative 锚定），绝对定位不进文档流 → 不影响居中、且因在 .chat 非滚动容器内而固定不随对话滚动。 */
.composer-wrap { flex: 0 0 auto; max-width: var(--content-max); width: 100%; min-width: 120px;
  padding: 0 var(--content-pad-x) 14px; overflow: visible; position: relative;
  margin: 0 auto; align-self: center; }
.msg-row { display: flex; gap: 12px; align-items: flex-start; width: 100%; max-width: 100%; min-width: 0; }
.msg-row.user { flex-direction: row-reverse; }
.msg-avatar { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; display: none; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 600; background: var(--brand); color: #fff; user-select: none; }
.msg-row.user .msg-avatar { background: #d6deea; color: #44566e; }
.msg { flex: 0 1 auto; min-width: 0; padding: 12px 14px; border-radius: 14px; line-height: 1.7; word-break: break-word; }
.msg.user { flex: 0 1 auto; max-width: 80%; background: var(--user); color: var(--ink); border-bottom-right-radius: 4px; }   /* 品牌蓝浅色/深色自适应，右侧 */
.msg.bot { flex: 1 1 0; min-width: 0; background: transparent; color: var(--ink); padding-left: 0; padding-right: 0; overflow: hidden; }   /* 占满头像右侧整行；overflow:hidden 防止插图撑出气泡 */
.msg .meta { font-size: 11px; color: var(--muted); margin-top: 6px; }
.msg .retrieved { font-size: 11px; color: var(--muted); margin-top: 6px; border-top: 1px dashed var(--border); padding-top: 4px; }
.msg .assess { font-size: 12px; color: #2b6c3f; margin-top: 8px; background: #eafaf0; border-radius: 8px; padding: 6px 9px; line-height: 1.5; }
.msg .assess .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #2b9c54; margin-right: 5px; vertical-align: middle; }
.msg .assess b { color: #1f7a40; }
.msg .assess .assess-note { color: #4a5a50; margin-top: 3px; font-size: 11px; }

/* 作用域路由（S1）：跨章提问时的来源标注。
   学生看到的是「范围：第2章 …」，但那是 AI 实际引用的章，可能不是当前页 —— 必须显式告知，
   否则他会以为 AI 在拿当前章的内容答非所问。 */
.msg .meta.meta-cross { color: var(--brand); }
.msg .scope-route { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 8px; font-size: 12px; color: var(--muted); }
.msg .scope-route .sr-lead { color: var(--brand); }
.msg .scope-route .sr-jump,
.msg .scope-route .sr-cand {
  font: inherit; font-size: 12px; cursor: pointer;
  background: var(--bg); color: var(--ink);
  border: 1px solid var(--border); border-radius: 999px;
  padding: 2px 10px; line-height: 1.6;
}
.msg .scope-route .sr-jump { border-color: var(--brand); color: var(--brand); }
.msg .scope-route .sr-jump:hover,
.msg .scope-route .sr-cand:hover { background: var(--brand); color: #fff; border-color: var(--brand); }
.msg .scope-route .sr-jump::after { content: " ›"; }

/* S2-4：册级线程按 _ch 分组 —— 章切换分隔条 + 当前 focus 章高亮 */
.ch-divider {
  display: flex; align-items: center; gap: 10px;
  margin: 16px 2px 8px; color: var(--muted); font-size: 12px; font-weight: 600;
  user-select: none;
}
.ch-divider::before, .ch-divider::after {
  content: ""; flex: 1; height: 1px; background: var(--border);
}
.ch-divider-label { white-space: nowrap; }
.ch-divider-current .ch-divider-label { color: var(--brand); }
.ch-divider-current::before, .ch-divider-current::after { background: var(--brand); opacity: .5; }
/* 方案A（build 20260908d）：非当前章历史折叠成分组条，点标题才展开建气泡 */
.ch-group {
  margin: 10px 2px; border: 1px dashed var(--border); border-radius: 8px;
  background: color-mix(in srgb, var(--border) 12%, transparent); overflow: hidden;
}
.ch-group-head {
  display: flex; align-items: center; gap: 8px; padding: 9px 12px;
  cursor: pointer; user-select: none; color: var(--muted); font-size: 12px; font-weight: 600;
}
.ch-group-head:hover { background: color-mix(in srgb, var(--border) 18%, transparent); }
.ch-group-caret { display: inline-block; transition: transform .15s ease; font-size: 10px; }
.ch-group-open .ch-group-caret { transform: rotate(90deg); }
.ch-group-title { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ch-group-count { font-weight: 400; opacity: .75; white-space: nowrap; }
.ch-group-body { display: none; }
.ch-group-open .ch-group-body { display: block; padding: 0 8px 8px; }
/* 两级嵌套：节模式下「本章其它节」容器与子条（build 20260908f） */
.ch-scopes { margin: 10px 2px; }
.ch-scopes-title { font-size: 12px; font-weight: 600; color: var(--muted); padding: 0 4px 6px; user-select: none; }
.ch-group-sub { margin: 6px 0 6px 14px; background: transparent; border-style: dotted; }

/* B 修复：当前作用域虚拟分页顶部触顶 sentinel（空占位，IntersectionObserver 观察点） */
.ch-loadmore-sentinel { height: 1px; }

/* 对话中由 AI 引用 <figure> 展示的教材插图 */
.msg.bot figure.chat-fig { margin: 12px auto; max-width: 92%; }
.msg.bot .chat-figure { display: block; width: auto; max-width: 760px; max-width: min(100%, 760px); height: auto; margin: 0 auto; border: 1px solid var(--border);
  border-radius: 10px; background: #fff; }
html[data-theme="dark"] .msg.bot .chat-figure { background: var(--panel); }
.msg.bot .chat-figcap { font-size: 12px; color: var(--muted); margin-top: 5px; text-align: center; }
.msg.bot .chat-figdesc { font-size: 12px; color: var(--muted); margin-top: 4px;
  line-height: 1.5; background: #f8fafc; border-left: 3px solid var(--accent, #4f8cff);
  padding: 6px 10px; border-radius: 6px; }
html[data-theme="dark"] .msg.bot .chat-figdesc { background: var(--bg); }

/* 插图「图注与解读」折叠块：默认折叠，点击标题展开，与「思考过程」交互一致 */
.msg.bot .fig-explain { font-size: 12px; color: var(--muted); background: #fafbfe;
  border: 1px solid var(--border); border-radius: 8px; margin-top: 6px; padding: 5px 10px; }
html[data-theme="dark"] .msg.bot .fig-explain { background: var(--panel); }
.msg.bot .fig-explain-head { font-weight: 600; color: var(--ink); cursor: pointer;
  user-select: none; display: flex; align-items: center; gap: 4px; }
.msg.bot .fig-explain .chev { transition: transform .15s; }
.msg.bot .fig-explain.collapsed .chev { transform: rotate(-90deg); }
.msg.bot .fig-explain .fig-explain-body { margin-top: 6px; }
.msg.bot .fig-explain.collapsed .fig-explain-body { display: none; }

/* 题目/错题卡中的「图解」折叠块：与消息区同款交互，但默认独立成块 */
.fig-explain { font-size: 12px; color: var(--muted); background: #fafbfe;
  border: 1px solid var(--border); border-radius: 10px; padding: 8px 12px; margin: 10px 0; }
html[data-theme="dark"] .fig-explain { background: var(--panel); }
.fig-explain-head { font-weight: 600; color: var(--ink); cursor: pointer;
  user-select: none; display: flex; align-items: center; gap: 6px; }
.fig-explain .chev { transition: transform .15s; display: inline-block; }
.fig-explain.collapsed .chev { transform: rotate(-90deg); }
.fig-explain .fig-explain-body { margin-top: 6px; }
.fig-explain.collapsed .fig-explain-body { display: none; }

/* 选「节」概览后追加的本节插图图廊 */
.figure-gallery { margin: 12px 0; padding: 12px; background: #f8fafc;
  border: 1px solid #eef2f7; border-radius: 12px; }
html[data-theme="dark"] .figure-gallery { background: var(--panel); border-color: var(--border); }
.fg-title { font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 10px; }
.fg-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px; }
.fg-item { margin: 0; }
.fg-img { width: 100%; height: auto; border: 1px solid var(--border); border-radius: 8px;
  background: var(--panel); cursor: pointer; transition: transform .12s ease; }
.fg-img:hover { transform: scale(1.02); }
.fg-cap { font-size: 11px; color: var(--muted); margin-top: 5px; line-height: 1.4; }
.fg-desc { font-size: 11px; color: #64748b; margin-top: 5px; line-height: 1.5;
  background: #f1f5f9; border-radius: 6px; padding: 6px 8px; }
html[data-theme="dark"] .fg-desc { color: var(--muted); background: var(--bg); }

/* Markdown 渲染后的排版（已交由 marked 解析，故按块级元素排版） */
.msg p { margin: 0 0 8px; }
.msg p:last-child { margin-bottom: 0; }
.msg ul, .msg ol { margin: 6px 0; padding-left: 22px; }
.msg li { margin: 3px 0; }
.msg strong { font-weight: 700; color: inherit; }
.msg em { font-style: italic; }
.msg h1, .msg h2, .msg h3, .msg h4 { margin: 10px 0 6px; line-height: 1.3; }
.msg h1 { font-size: 18px; } .msg h2 { font-size: 16px; } .msg h3, .msg h4 { font-size: 15px; }
.msg code { background: rgba(0,0,0,.06); padding: 1px 5px; border-radius: 5px; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 90%; }
.msg pre { background: rgba(0,0,0,.06); padding: 10px 12px; border-radius: 8px; overflow-x: auto; }
.msg pre code { background: none; padding: 0; }
.msg blockquote { margin: 8px 0; padding: 4px 12px; border-left: 3px solid var(--brand); color: var(--muted); }
.msg table { border-collapse: separate; border-spacing: 0; margin: 8px 0; width: 100%; font-size: 13px;
  border-radius: 8px; overflow: hidden; border: 1px solid var(--border); }
.msg th, .msg td { border-bottom: 1px solid var(--border); border-right: 1px solid var(--border);
  padding: 5px 8px; text-align: left; }
.msg th:last-child, .msg td:last-child { border-right: none; }
.msg tr:last-child td { border-bottom: none; }
.msg th { background: #f3f3f3; font-weight: 600; }
html[data-theme="dark"] .msg th { background: var(--panel); }
.msg hr { border: none; border-top: 1px solid var(--border); margin: 10px 0; }
/* 错题卡题干内若含 GFM 表格（renderContent 已把 |..| 解析为 <table>），复用聊天区表格样式 */
.qw-stem table { border-collapse: separate; border-spacing: 0; margin: 8px 0; width: 100%; font-size: 13px;
  border-radius: 8px; overflow: hidden; border: 1px solid var(--border); }
.qw-stem th, .qw-stem td { border-bottom: 1px solid var(--border); border-right: 1px solid var(--border);
  padding: 5px 8px; text-align: left; }
.qw-stem th:last-child, .qw-stem td:last-child { border-right: none; }
.qw-stem tr:last-child td { border-bottom: none; }
.qw-stem th { background: #f3f3f3; font-weight: 600; }
html[data-theme="dark"] .qw-stem th { background: var(--panel); }

.composer { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 12px 10px; background: var(--panel);
  border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 4px 24px rgba(31,39,51,.06);
  width: 100%; box-sizing: border-box; transition: border-color .15s ease, box-shadow .15s ease; }
.composer:focus-within { border-color: #a5c4f9; }
.composer-hint { text-align: center; font-size: 12px; color: var(--muted); padding-top: 8px; user-select: none; }
.composer textarea, .composer .editor { width: 100%; resize: none; min-height: 104px; min-width: 120px; padding: 6px 8px; border: none; background: transparent;
  border-radius: 10px; font: inherit; outline: none; line-height: 1.6; box-sizing: border-box; word-break: break-word; white-space: pre-wrap; overflow-wrap: break-word; }
/* contenteditable 占位符：空时显示提示文字 */
.composer .editor:empty:before { content: attr(data-placeholder); color: var(--muted); pointer-events: none; }
.composer .editor { cursor: text; }
.composer textarea:focus, .composer .editor:focus { outline: none; box-shadow: none; }
.composer-tools { display: flex; align-items: center; padding: 0 8px; }
.composer-tools .tool-left { display: flex; align-items: center; gap: 4px; position: relative; flex: 1; }
.composer-tools .tool-center { display: flex; align-items: center; justify-content: center; flex: 0 0 auto; padding: 0 8px; }
.composer-tools .tool-right { display: flex; align-items: center; gap: 8px; flex: 1; justify-content: flex-end; }

/* 「+」聚合媒体弹出菜单（上传图片 / 拍照） */
.attach-wrap { position: relative; display: inline-flex; }
.attach-sheet {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px;
  background: var(--panel);
  border: 0.5px solid var(--color-border-secondary);
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .14);
  z-index: 30;
}
/* hidden 属性必须能真正隐藏菜单：显式的 display:flex 会覆盖 UA 的 [hidden]{display:none}，
   必须再用带属性选择器的更高优先级规则把它压回去，否则菜单会默认显示（未点击也出现） */
.attach-sheet[hidden] { display: none; }
/* 菜单项按钮需挣脱 .composer-tools button 的 40px 圆形样式，故用更高特异性的选择器 */
.composer-tools .attach-sheet button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  width: 100%;
  height: auto;
  min-width: auto;
  padding: 9px 12px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--ink);
  font-size: 13px;
  white-space: nowrap;
  flex: 0 0 auto;
}
.composer-tools .attach-sheet button:hover { background: var(--brand-soft); }
.attach-sheet svg { width: 18px; height: 18px; flex: 0 0 auto; }

/* 原上传/拍照按钮作为「+」菜单的纯触发器，必须完全隐藏，不可占用工具栏空间 */
.composer-ghost-btn { display: none !important; }
/* 移动端专用元素：默认隐藏，仅在移动媒体查询内显示 */
.mobile-only { display: none; }
.composer-tools button { flex: 0 0 auto; width: 40px; height: 40px; border: none; border-radius: 50%;
  cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s;
  /* 移动端（尤其三星浏览器）：长按话筒会触发系统原生长按菜单/文字选择气泡/放大镜，
     与「按住说话」冲突。关闭原生长按 callout 与文字选择，避免弹出手机自带功能。 */
  -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.composer-tools button svg { width: 18px; height: 18px; }
.composer-tools button:disabled,
.composer textarea:disabled,
.composer .editor:disabled { opacity: .5; cursor: not-allowed; }
.composer textarea:disabled,
.composer .editor:disabled { background: #f1f3f5; }
/* 发送按钮：蓝色主按钮 */
.composer-tools #send { background: var(--brand); color: #fff; }
.composer-tools #send:hover { background: #1f5be0; }
/* 语音输入按钮：空闲态只显示图标、无圆形背景；hover 浅灰圆形背景；录音态红色 */
.composer-tools #mic { background: transparent; color: var(--ink); touch-action: none; -webkit-tap-highlight-color: transparent; }   /* 移动端按住说话：禁用触摸滚动手势，避免与录音手势冲突；去掉点击高亮 */
.composer-tools #mic:hover { background: var(--brand-soft); color: var(--ink); }
.composer-tools #mic.recording { background: #e03131; color: #fff; animation: mic-pulse 1.1s ease-in-out infinite; }
.composer-tools #mic.cancel { background: #ffe3a3; color: #874d00; }   /* 上滑取消态：琥珀色提示将放弃录音 */
.composer-tools #mic.busy { background: #868e96; color: #fff; cursor: progress; }
/* 上传 / 拍照按钮：与语音按钮同款风格 */
.composer-tools .icon-btn { background: transparent; color: var(--ink); }
.composer-tools .icon-btn:hover { background: var(--brand-soft); color: var(--ink); }
@keyframes mic-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(224,49,49,0.55); }
  70%  { box-shadow: 0 0 0 10px rgba(224,49,49,0); }
  100% { box-shadow: 0 0 0 0 rgba(224,49,49,0); }
}
@media (prefers-reduced-motion: reduce) {
  .composer-tools #mic.recording { animation: none; }
}

/* ---------- 移动端语音浮层（居中显示，避免手指遮挡话筒按钮） ---------- */
.voice-sheet {
  position: fixed; z-index: 1300; left: 50%; top: 50%;
  transform: translate(-50%, calc(-50% + 10px)) scale(.96);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.voice-sheet.show { opacity: 1; visibility: visible; transform: translate(-50%, -50%) scale(1); }
.voice-sheet .vs-wrap {
  display: flex; flex-direction: column; align-items: center; gap: 9px;
  padding: 14px 22px; min-width: 150px;
  background: rgba(33, 37, 41, .92); color: #fff;
  border-radius: 16px; box-shadow: 0 12px 30px rgba(0, 0, 0, .28);
}
.voice-sheet.recording.cancel .vs-wrap { background: rgba(232, 89, 12, .95); }
.voice-sheet .vs-bars { display: flex; align-items: center; gap: 3px; height: 38px; }
.voice-sheet .vs-bars span {
  width: 3px; height: 8px; background: var(--brand, #2f6bff); border-radius: 2px;
  animation: vs-bar 1s ease-in-out infinite;
}
.voice-sheet .vs-bars span:nth-child(odd) { animation-delay: .18s; }
.voice-sheet .vs-bars span:nth-child(3n) { animation-delay: .36s; }
.voice-sheet.live .vs-bars span { animation: none; }
.voice-sheet.recording.cancel .vs-bars span { background: #ffd8a8; }
@keyframes vs-bar { 0%, 100% { height: 8px; } 50% { height: 28px; } }
.voice-sheet .vs-tip { font-size: 13px; opacity: .9; }
.voice-sheet .vs-normal, .voice-sheet .vs-cancel { font-size: 13px; font-weight: 600; }
.voice-sheet .vs-normal, .voice-sheet .vs-cancel { display: none; }
.voice-sheet.recording:not(.cancel) .vs-normal { display: block; }
.voice-sheet.recording.cancel .vs-cancel { display: block; }
.voice-sheet.recording .vs-tip { display: none; }

/* 待发送图片预览条 */
.attach-preview { position: absolute; top: 8px; left: 8px; z-index: 3; display: inline-block; max-width: 100%; }
.attach-preview[hidden] { display: none; }
.attach-chip { display: inline-flex; align-items: center; gap: 6px; line-height: 1;
  padding: 4px 7px 5px 9px; background: #f1f3f5; border: 1px solid #e9ecef;
  border-radius: 999px; font-size: 13px; color: #495057; cursor: default; white-space: nowrap; }
.attach-icon { display: inline-flex; align-items: center; color: #495057; flex: 0 0 auto; }
svg.attach-icon { width: 13px; height: 13px; display: block; }
.attach-preview .attach-name { max-width: 220px; width: auto; min-width: 0; line-height: 1.35;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 0 1 auto; }
.attach-preview #attachRemove { width: 15px; height: 15px; border-radius: 50%; border: none; background: transparent;
  color: #868e96; cursor: pointer; font-size: 10px; line-height: 1; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.attach-preview #attachRemove:hover { background: #e9ecef; color: #c92a2a; }
.attach-hover-preview { position: absolute; bottom: 100%; left: 0; display: none; padding-bottom: 6px; z-index: 20; }
.attach-hover-preview-inner { padding: 6px; background: #fff; border: 1px solid var(--border); border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,.12); }
.attach-preview:hover .attach-hover-preview { display: block; }
.attach-hover-preview img { max-width: 220px; max-height: 220px; border-radius: 6px; display: block; }
.attach-hover-name { font-size: 12px; color: var(--muted); margin-top: 6px; text-align: center; word-break: break-all; max-width: 220px; }
/* 有附件时让 textarea 顶部留出空间，避免文字被标签遮挡 */
.composer textarea.has-attach { padding-top: 44px; }
/* 聊天气泡里的用户上传图片 */
.msg img.user-img { max-width: 240px; max-height: 240px; border-radius: 8px; border: 1px solid var(--border); margin-top: 6px; display: block; }

/* ===== 输入框内联图片 chip（文字与图片混排，可拖拽 / 悬停预览 / 删除）===== */
.inline-chip { display: inline-flex; align-items: center; gap: 4px; vertical-align: text-bottom;
  background: #eef2fb; border: 1px solid #d4e0fa; color: #2f6df6; border-radius: 8px;
  padding: 1px 6px 1px 4px; font-size: 12px; line-height: 1.5; margin: 0 2px;
  cursor: grab; user-select: none; max-width: 220px; }
.inline-chip .chip-ico { width: 13px; height: 13px; flex: 0 0 auto; opacity: .85; }
.inline-chip .chip-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 168px; }
.inline-chip .chip-del { width: 15px; height: 15px; border-radius: 50%; border: none; background: transparent;
  color: #2f6df6; cursor: pointer; font-size: 11px; line-height: 1; display: inline-flex;
  align-items: center; justify-content: center; padding: 0; flex: 0 0 auto; }
.inline-chip .chip-del:hover { background: #d4e0fa; color: #c92a2a; }
.inline-chip:hover { background: #e2ebfc; }
.inline-chip.dragging { opacity: .4; cursor: grabbing; }

/* 悬停预览浮层（鼠标移到 chip 上显示大图，JS 定位）*/
.chip-preview { position: fixed; z-index: 50; background: #fff; border: 1px solid var(--border);
  border-radius: 10px; padding: 8px; box-shadow: 0 8px 28px rgba(31,39,51,.18); max-width: 260px; }
.chip-preview[hidden] { display: none; }
.chip-preview img { max-width: 240px; max-height: 240px; border-radius: 6px; display: block; }
.chip-preview-name { font-size: 12px; color: var(--muted); margin-top: 6px; text-align: center;
  word-break: break-all; max-width: 240px; }

/* 用户消息多图网格 */
.user-img-grid { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }

/* 拍照弹层（getUserMedia 实时预览 + 拍照） */
.camera-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.55); padding: 16px; }
.camera-modal[hidden] { display: none; }
.camera-modal-inner { background: #fff; border-radius: 14px; overflow: hidden; max-width: 480px; width: 100%;
  box-shadow: 0 12px 40px rgba(0,0,0,.3); }
.camera-stage { position: relative; background: #000; aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; }
.camera-stage video { width: 100%; height: 100%; object-fit: contain; background: #000; }
.camera-error { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 12px; font-size: 13px;
  color: #fff; background: rgba(193,57,43,.92); text-align: center; }
/* 拍照弹层加载中遮罩（覆盖首帧前的黑屏，给出"正在打开摄像头"反馈） */
.camera-loading {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 14px; background: #000; color: #fff;
}
.camera-loading[hidden] { display: none; }
.camera-spinner {
  width: 34px; height: 34px; border-radius: 50%;
  border: 3px solid rgba(255, 255, 255, .25); border-top-color: #fff;
  animation: camera-spin .8s linear infinite;
}
.camera-loading-text { font-size: 14px; opacity: .9; }
@keyframes camera-spin { to { transform: rotate(360deg); } }

.camera-actions { display: flex; gap: 10px; padding: 12px; }
.cam-btn { flex: 1; height: 44px; border: none; border-radius: 10px; font: inherit; font-size: 15px; cursor: pointer; }
.cam-cancel { background: #f1f3f5; color: #495057; }
.cam-cancel:hover { background: #e9ecef; }
.cam-shoot { background: var(--brand); color: #fff; }
.cam-shoot:hover { background: #1f5be0; }

/* 练习与应用列表末尾的醒目引导提示语 */
.exercise-prompt {
  margin: 14px 0 6px;
  padding: 10px 14px;
  background: linear-gradient(135deg, #fff8e6 0%, #fff0cc 100%);
  border: 1px solid #ffd166;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(255, 193, 7, 0.12);
  font-size: 14px;
  color: #7c5c00;
  line-height: 1.6;
}
.exercise-prompt::before {
  content: "💡";
  margin-right: 6px;
  font-size: 15px;
}
.exercise-prompt strong {
  color: #8a6d00;
}

.formula-bar { position: relative; max-width: var(--content-max); width: 100%;
  padding: 0 var(--content-pad-x) 6px;
  margin: 0 auto; align-self: center; }
.fb-toggle { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: 12px;
  padding: 4px 11px; border: 1px solid var(--border); border-radius: 999px; background: var(--panel);
  color: var(--muted); cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.fb-toggle:hover { background: var(--brand-soft); color: var(--brand); border-color: var(--border); }
.formula-bar.open .fb-toggle { background: var(--brand-soft); color: var(--brand); border-color: var(--border); }
.fb-toggle .fb-ico { font-weight: 700; font-style: italic; font-family: Georgia, "Times New Roman", serif; }
.fb-toggle .fb-caret { transition: transform .15s; font-size: 10px; }
.formula-bar.open .fb-caret { transform: rotate(180deg); }
.fb-panel { position: absolute; bottom: calc(100% + 8px); left: 18px; right: 18px; background: var(--panel);
  border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; z-index: 60;
  box-shadow: 0 8px 28px rgba(31,39,51,.14); max-height: 56vh; overflow-y: auto; }
.fb-panel[hidden] { display: none; }
.fb-hint { font-size: 11px; color: var(--muted); margin-bottom: 8px; line-height: 1.5; }
.fb-hint code { background: var(--bg); padding: 0 4px; border-radius: 4px; }
.fb-group { margin-bottom: 8px; }
.fb-group:last-child { margin-bottom: 0; }
.fb-group-name { font-size: 11px; color: var(--muted); margin-bottom: 4px; font-weight: 600; }
.fb-syms { display: flex; flex-wrap: wrap; gap: 6px; }
.fb-btn { min-width: 34px; height: 32px; padding: 0 9px; font: inherit; font-size: 15px; line-height: 1;
  border: 1px solid var(--border); border-radius: 8px; background: var(--panel); color: var(--ink); cursor: pointer;
  transition: background .12s, border-color .12s, color .12s; }
.fb-btn:hover { background: var(--brand-soft); border-color: var(--border); color: var(--brand); }
.fb-btn:active { transform: translateY(1px); }
.fb-inline { background: var(--brand); color: #fff; border-color: var(--brand); font-weight: 600; min-width: auto; }
.fb-inline:hover { background: #1f5be0; color: #fff; border-color: #1f5be0; }

/* ---------- 底部「模式选择」组件（WorkBuddy 风格：发送按钮左侧胶囊按钮 + 浮层卡片） ---------- */
/* 触发按钮：覆盖 .composer-tools button 默认的 40x40 圆形通用样式，改为胶囊 */
.composer-tools #modeTrigger {
  width: auto; height: 32px; border-radius: 16px;
  gap: 5px; padding: 0 10px;
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--border);
  font-size: 13px; font-weight: 500; white-space: nowrap;
  transition: background .15s, border-color .15s;
}
.composer-tools #modeTrigger:hover { background: var(--bg); }
.composer-tools #modeTrigger .mode-trigger-icon { font-size: 14px; line-height: 1; }
.composer-tools #modeTrigger .mode-trigger-name { max-width: 8.5em; overflow: hidden; text-overflow: ellipsis; }
.composer-tools #modeTrigger .mode-trigger-caret { width: 14px; height: 14px; opacity: .6; transition: transform .18s ease; }
.composer-tools #modeTrigger[aria-expanded="true"] .mode-trigger-caret { transform: rotate(180deg); }
.composer-tools #modeTrigger[aria-expanded="true"] { background: var(--bg); border-color: var(--border); }

/* 浮层面板：fixed 定位，弹在触发按钮上方；白底卡片 + 阴影 + 圆角 */
.mode-panel {
  position: fixed; z-index: 1200;
  width: 300px; max-width: calc(100vw - 16px);
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--border); border-radius: 14px;
  box-shadow: 0 12px 32px rgba(20, 32, 60, .18);
  padding: 8px; opacity: 0; transform: translateY(6px) scale(.985);
  transform-origin: bottom left; pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
}
.mode-panel.open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.mode-panel-header {
  font-size: 12px; font-weight: 600; color: var(--muted);
  padding: 6px 10px 8px;
}
.mode-options { display: flex; flex-direction: column; gap: 2px; }
.mode-option {
  display: flex; align-items: center; gap: 10px;
  width: 100%; text-align: left; cursor: pointer;
  background: transparent; border: none; border-radius: 10px;
  padding: 9px 10px; font: inherit; color: var(--ink);
  transition: background .12s ease;
}
.mode-option:hover { background: var(--bg); }
.mode-option.selected { background: var(--brand-soft); }
.mode-opt-icon { font-size: 18px; line-height: 1; flex: 0 0 auto; width: 22px; text-align: center; }
.mode-opt-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
.mode-opt-name { font-size: 13.5px; font-weight: 600; }
.mode-opt-desc { font-size: 11.5px; color: var(--muted); line-height: 1.35; }
.mode-opt-check { color: var(--brand); font-weight: 700; font-size: 14px; flex: 0 0 auto; opacity: 0; }
.mode-option.selected .mode-opt-check { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .mode-panel, .composer-tools #modeTrigger .mode-trigger-caret { transition: none; }
}

/* ---------- 侧边栏「模型选择」组件（WorkBuddy 风格：胶囊按钮 + 浮层卡片） ---------- */
.model-trigger {
  width: 100%; min-height: 54px;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px;
  margin-bottom: 12px;
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--border); border-radius: 12px;
  font: inherit; text-align: left; cursor: pointer;
  transition: background .15s, border-color .15s, box-shadow .15s;
}
.model-trigger:hover { background: var(--bg); border-color: var(--border); }
.model-trigger-icon { font-size: 22px; line-height: 1; flex: 0 0 auto; }
.model-trigger-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
.model-trigger-name { font-size: 15px; font-weight: 700; }
.model-trigger-model { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.model-trigger-caret { width: 16px; height: 16px; opacity: .55; flex: 0 0 auto; transition: transform .18s ease; }
.model-trigger[aria-expanded="true"] .model-trigger-caret { transform: rotate(180deg); }
.model-trigger[aria-expanded="true"] { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }

.model-panel {
  position: fixed; z-index: 1200;
  width: 244px; max-width: calc(100vw - 16px);
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--border); border-radius: 14px;
  box-shadow: 0 12px 32px rgba(20, 32, 60, .18);
  padding: 8px; opacity: 0; transform: translateY(6px) scale(.985);
  transform-origin: bottom left; pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
}
.model-panel.open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.model-panel-header { font-size: 12px; font-weight: 700; color: var(--muted); padding: 6px 10px 8px; }
.model-options { display: flex; flex-direction: column; gap: 2px; }
.model-option {
  display: flex; align-items: center; gap: 10px;
  width: 100%; text-align: left; cursor: pointer;
  background: transparent; border: none; border-radius: 10px;
  padding: 9px 10px; font: inherit; color: var(--ink);
  transition: background .12s ease;
}
.model-option:hover { background: var(--bg); }
.model-option.selected { background: var(--brand-soft); }
.model-opt-icon { font-size: 18px; line-height: 1; flex: 0 0 auto; width: 22px; text-align: center; }
.model-opt-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
.model-opt-name { font-size: 13.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.model-opt-desc { font-size: 11.5px; color: var(--muted); line-height: 1.35; }
.model-opt-check { color: var(--brand); font-weight: 700; font-size: 14px; flex: 0 0 auto; opacity: 0; }
.model-option.selected .model-opt-check { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .model-panel, .model-trigger .model-trigger-caret { transition: none; }
}

/* ---------- 侧边栏「教材册选择」组件（与模型选择保持同风格） ---------- */
.book-trigger {
  width: 100%; min-height: 54px;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px;
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--border); border-radius: 12px;
  font: inherit; text-align: left; cursor: pointer;
  transition: background .15s, border-color .15s, box-shadow .15s;
}
.book-trigger:hover { background: var(--bg); border-color: var(--border); }
.book-trigger-icon { font-size: 22px; line-height: 1; flex: 0 0 auto; }
.book-trigger-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
.book-trigger-name { font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.book-trigger-desc { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.book-trigger-caret { width: 16px; height: 16px; opacity: .55; flex: 0 0 auto; transition: transform .18s ease; }
.book-trigger[aria-expanded="true"] .book-trigger-caret { transform: rotate(180deg); }
.book-trigger[aria-expanded="true"] { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }

.book-panel {
  position: fixed; z-index: 1200;
  width: 244px; max-width: calc(100vw - 16px);
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--border); border-radius: 14px;
  box-shadow: 0 12px 32px rgba(20, 32, 60, .18);
  padding: 8px; opacity: 0; transform: translateY(6px) scale(.985);
  transform-origin: bottom left; pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
}
.book-panel.open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.book-panel-header { font-size: 12px; font-weight: 700; color: var(--muted); padding: 6px 10px 8px; }
.book-options { display: flex; flex-direction: column; gap: 2px; }
.book-option {
  display: flex; align-items: center; gap: 10px;
  width: 100%; text-align: left; cursor: pointer;
  background: transparent; border: none; border-radius: 10px;
  padding: 9px 10px; font: inherit; color: var(--ink);
  transition: background .12s ease;
}
.book-option:hover { background: var(--bg); }
.book-option.selected { background: var(--brand-soft); }
.book-opt-icon { font-size: 18px; line-height: 1; flex: 0 0 auto; width: 22px; text-align: center; }
.book-opt-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
.book-opt-name { font-size: 13.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.book-opt-desc { font-size: 11.5px; color: var(--muted); line-height: 1.35; }
.book-opt-check { color: var(--brand); font-weight: 700; font-size: 14px; flex: 0 0 auto; opacity: 0; }
.book-option.selected .book-opt-check { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .book-panel, .book-trigger .book-trigger-caret { transition: none; }
}

.typing::after { content: "思考中…"; color: var(--muted); font-size: 13px; }

/* 模型思考过程（reasoning_content）展示区 —— 可点击标题折叠/展开，内容完整保留 */
.thinking { font-size: 12px; color: var(--muted); background: var(--panel);
  border-left: 3px solid var(--border); padding: 6px 10px; border-radius: 6px;
  margin: 4px 0 2px; }
.thinking .think-head { font-weight: 600; color: var(--muted); cursor: pointer;
  user-select: none; display: flex; justify-content: space-between; align-items: center; }
.thinking .chev { transition: transform .15s; }
.thinking.collapsed .chev { transform: rotate(-90deg); }
.thinking .think-body { margin-top: 6px; line-height: 1.55; white-space: pre-wrap;
  word-break: break-word; max-height: 360px; overflow-y: auto; }
.thinking.collapsed .think-body { display: none; }

/* 教材目录树（章 -> 节） */
.field-label { font-size: 13px; color: var(--muted); margin: 14px 0 2px; }
.book-switcher { width: 100%; box-sizing: border-box; margin: 4px 0 2px; padding: 7px 8px;
  border: 1px solid var(--border); border-radius: 8px; font-size: 13px; background: #fff; color: var(--ink);
  cursor: pointer; appearance: none; -webkit-appearance: none; }
.book-switcher:focus { outline: none; border-color: var(--brand); }
html[data-theme="dark"] .book-switcher { background: var(--panel); }
.tree-empty { padding: 18px 10px; text-align: center; color: var(--muted); font-size: 13px; line-height: 1.6; }
#userId { width: 100%; box-sizing: border-box; margin-top: 4px; padding: 6px 8px;
  border: 1px solid var(--border); border-radius: 8px; font-size: 13px; background: #fff; color: inherit; }
#userId:focus { outline: none; border-color: var(--brand); }
.tree { font-size: 15px; max-height: 42vh; overflow-y: auto; margin-top: 14px; border: 1px solid var(--border);
  border-radius: 8px; padding: 4px; background: #f9f9f9; }
html[data-theme="dark"] .tree { background: var(--panel); }
.tree-chapter { margin: 2px 0; }
.tree-head { display: flex; align-items: center; gap: 5px; padding: 5px 6px; border-radius: 6px;
  cursor: pointer; font-weight: 700; color: var(--ink); }
.tree-head:hover { background: var(--brand-soft); color: var(--brand); }
.tree-head .chev { color: var(--muted); font-size: 14px; width: 16px; text-align: center; transition: transform .15s; user-select: none; cursor: pointer; }
.tree-chapter.collapsed .chev { transform: rotate(-90deg); }
.tree-chapter.collapsed .tree-sections { display: none; }
.tree-section { padding: 4px 6px 4px 26px; border-radius: 6px; cursor: pointer; color: var(--ink); font-size: 14px; }
.tree-section:hover { background: var(--brand-soft); color: var(--brand); }
.tree .active { background: var(--brand-soft); color: var(--brand); }
.tree .active:hover { background: var(--brand-soft); }
.tree .tree-head.active .chev { color: var(--brand); }
.tree .tree-section.active { color: var(--brand); }
/* 深色模式下激活态及悬停态避免蓝字蓝底：用白字保证可读性 */
html[data-theme="dark"] .tree .active,
html[data-theme="dark"] .tree .tree-head.active,
html[data-theme="dark"] .tree .tree-section.active,
html[data-theme="dark"] .tree-head:hover,
html[data-theme="dark"] .tree-section:hover { color: #fff; }

/* 选节后自动生成的概览提示条 */
.sys-note { align-self: center; background: var(--brand-soft); color: var(--brand);
  font-size: 12px; padding: 5px 12px; border-radius: 999px; margin: 2px 0 4px; }
html[data-theme="dark"] .sys-note { color: #fff; }

/* 选节后显示的操作卡片：两个按钮按需生成（概括 / 思维导图） */
.action-card { align-self: center; background: var(--brand-soft); border: 1px solid var(--border);
  border-radius: 12px; padding: 12px 16px; margin: 4px 0; max-width: 860px; width: 100%;
  box-sizing: border-box; display: flex; flex-direction: column; gap: 8px; }
.action-card .ac-title { font-size: 13px; color: var(--brand); font-weight: 600; }
html[data-theme="dark"] .action-card .ac-title { color: #fff; }
.action-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.action-btn { font: inherit; font-size: 13px; padding: 8px 14px; border-radius: 10px;
  border: 1px solid var(--brand); background: var(--panel); color: var(--brand); cursor: pointer;
  transition: background .15s, color .15s; }
html[data-theme="dark"] .action-btn { color: #fff; }
.action-btn:hover:not(:disabled) { background: var(--brand); color: #fff; }
.action-btn:disabled { opacity: .6; cursor: default; }
/* 「开始预习」按钮：置于计划气泡内，强调为行动入口 */
.preview-start { margin-top: 10px; background: var(--brand); color: #fff; font-weight: 600;
  box-shadow: 0 2px 8px rgba(79,140,255,.25); }
.preview-start:hover:not(:disabled) { background: var(--brand-dark, #2f6fe0); }

/* 思维导图（Mermaid 渲染结果）容器 */
.mermaid { text-align: center; background: var(--panel); border: 1px solid var(--border);
  border-radius: 10px; padding: 10px; margin: 8px 0; overflow-x: auto; }
.mermaid svg { max-width: 100%; height: auto; }
/* timeline 描述文字折行后若强制缩放到容器宽度，字会小到不可读；
   给 timeline 容器加 .tl-scroll 后保持 SVG 自然宽度，由 .mermaid 横向滚动。 */
.mermaid.tl-scroll svg { max-width: none; width: auto; height: auto; }
/* mermaid 节点容器：MathJax 渲染分式/长公式后可能超出预设尺寸，允许溢出可见。
   同时覆盖正常缩略图（.mermaid）和全屏放大视图（.mm-stage），避免放大后 CSS 规则丢失。 */
.mermaid svg foreignObject,
.mm-stage svg foreignObject { overflow: visible !important; }
.mermaid svg .nodeLabel,
.mm-stage svg .nodeLabel { overflow: visible !important; line-height: 1.5; }
/* v11 flowchart 节点是 "外框 rect + 内嵌 foreignObject label"，内层 rect
   跟外框叠在一起会形成"双层框"效果（两个 stroke 边框 + 白色背景）。
   让内框完全透明：*/
.mermaid svg .node foreignObject *,
.mm-stage svg .node foreignObject * {
  background: transparent !important;
  stroke: none !important;
  fill: none !important;
}
.mermaid svg .node foreignObject > div,
.mermaid svg .node foreignObject > p,
.mm-stage svg .node foreignObject > div,
.mm-stage svg .node foreignObject > p {
  background: transparent !important;
}
/* 节点背景 rect 不裁切溢出内容 */
.mermaid svg g.node > rect,
.mm-stage svg g.node > rect { overflow: visible; }
/* mermaid v11 mindmap 节点在 <g class="label"> 里还套了一个 rect 做 label 背景，
   它会和 outer path/circle 重叠并产生“两个矩形”的观感；把它透明化。
   flowchart 外层节点背景 rect 在 g.node 下，不受影响。 */
.mermaid svg g.label > rect,
.mm-stage svg g.label > rect { fill: none !important; stroke: none !important; pointer-events: none; }
.mermaid-err { font-size: 12px; color: #b06a00; margin: 4px 0; }
.mermaid-fallback { border: 1px dashed #d8deea; border-radius: 8px; padding: 8px 12px;
  background: #fafbfe; margin: 8px 0; }
.mermaid-fallback-root { font-weight: 600; color: #2a3b5c; margin-bottom: 4px; }
.mermaid-fallback ul { margin: 2px 0 2px 16px; padding-left: 14px; }
.mermaid-fallback li { line-height: 1.7; }
/* 思维导图渲染前的加载占位：中性 spinner，不露灰色代码块/大纲 */
.mermaid-loading {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 120px; padding: 16px; box-sizing: border-box;
  background: #f7f9fc; border: 1px solid var(--border); border-radius: 8px;
  color: #8a98b8; font-size: 13px;
}
.mm-spinner {
  width: 18px; height: 18px; flex: none;
  border: 2px solid #cdd8f5; border-top-color: #4a6cf7;
  border-radius: 50%; animation: mm-spin .7s linear infinite;
}
.mm-loading-text { white-space: nowrap; }
@keyframes mm-spin { to { transform: rotate(360deg); } }
/* 渲染成功的思维导图淡入，避免「啪」地出现 */
.mermaid { animation: mm-fade-in .25s ease; }
@keyframes mm-fade-in { from { opacity: 0; } to { opacity: 1; } }

/* 思维导图/大纲代码块在插入 DOM 时即标记为待渲染（renderContent 打 mm-pending）：
   立刻呈现为中性 loading 占位，隐藏灰底源码文字，避免懒渲染（IntersectionObserver）
   等待期间露出灰色源码块。renderMermaid 运行后会用 JS 版 .mermaid-loading 占位替换它，
   最终淡入 SVG。视觉与 .mermaid-loading 保持一致。 */
.msg pre.mm-pending {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 120px; padding: 16px; box-sizing: border-box;
  background: #f7f9fc; border: 1px solid var(--border, #e6ebf5); border-radius: 8px;
  color: #8a98b8; font-size: 13px; overflow: hidden; white-space: normal;
}
.msg pre.mm-pending > code { display: none; }
.msg pre.mm-pending::before {
  content: ""; width: 18px; height: 18px; flex: none;
  border: 2px solid #cdd8f5; border-top-color: #4a6cf7;
  border-radius: 50%; animation: mm-spin .7s linear infinite;
}
.msg pre.mm-pending::after { content: "思维导图生成中…"; white-space: nowrap; }

/* ```chart 代码块渲染的 Chart.js 图表容器 + 降级样式 */
.chart-wrap { background: #fff; border: 1px solid var(--border); border-radius: 12px;
  padding: 12px 14px; margin: 10px 0; max-width: 560px; }
.chart-wrap canvas { width: 100% !important; height: 320px !important; }   /* 固定高度，避免 Chart.js hover 引起的 canvas 容器高度抖动推下面文字 */

/* ---------- 虚拟实验仿真面板 ---------- */
.sim { border: 1px solid #e3e8f3; border-radius: 12px; background: #fbfcff; padding: 12px; margin: 10px 0; }
.sim-ctrl { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; margin-bottom: 10px; }
.sim-ctrl label { font-size: 13px; color: #44506b; display: flex; align-items: center; gap: 6px; }
.sim-ctrl input[type=range] { width: 120px; vertical-align: middle; }
.sim-ctrl .v { color: #2f6df6; font-weight: 600; min-width: 34px; }
.sim-btns { display: flex; gap: 8px; margin-left: auto; }
.sim-btns button { border: 1px solid #cdd6ea; background: #fff; border-radius: 8px; padding: 6px 12px; cursor: pointer; font-size: 13px; }
.sim-btns button.primary { background: #2f6df6; color: #fff; border-color: #2f6df6; }
.sim-stage { display: flex; gap: 12px; flex-wrap: wrap; }
.sim-anim { width: 100%; background: #f4f6fb; border-radius: 8px; display: block; }
.sim-charts { flex: 1 1 260px; display: flex; gap: 12px; flex-wrap: wrap; }
.sim-charts > div { flex: 1 1 240px; }
.sim-cap { font-size: 12px; color: #66708a; margin: 4px 0; }
.sim-xt, .sim-vt, .sim-ht { width: 100%; background: #fff; border: 1px solid #e3e8f3; border-radius: 8px; display: block; }
.sim-vec { width: 100%; background: #fff; border: 1px solid #e3e8f3; border-radius: 8px; display: block; }
.sim-readout { display: flex; gap: 18px; margin-top: 8px; font-size: 13px; color: #33405e; }
.sim-readout b { color: #2f6df6; }
.sim-points { margin-top: 6px; font-size: 12px; color: #66708a; display: flex; flex-wrap: wrap; gap: 4px 12px; }
.sim-points .sim-cap { width: 100%; margin-bottom: 2px; }
.sim-error { color: #c0392b; font-size: 13px; padding: 8px; }
.sim-loading { color: #66708a; font-size: 13px; padding: 10px; }
.sim-generated { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; background: #fff; transform: translateZ(0); backface-visibility: hidden; }   /* translateZ(0) 提升为独立合成层，规避部分 WebView 下 canvas/卡片的亚像素重绘抖动 */
.sim-generated h4 { margin: 0 0 4px; font-size: 14px; color: #1c2742; font-weight: 600; }
.sim-desc { margin: 0 0 10px; font-size: 12px; color: #66708a; line-height: 1.5; }
.sim-toggle { display: flex; align-items: center; gap: 6px; }
.sim-toggle input { width: auto; }
.sim-charts { margin-top: 10px; }
.sim-cap { font-size: 12px; color: #66708a; margin-bottom: 4px; }
.sim-bar { width: 100%; height: 120px; display: block; vertical-align: bottom; }   /* display:block 去掉 inline 基线依赖，消除 canvas 在 WebView 下的亚像素上下抖动（轻微晃动） */
.sim-exp { margin-top: 10px; font-size: 12px; color: #33405e; line-height: 1.6;
  background: #f4f8ff; border-left: 3px solid #2f6df6; padding: 8px 10px; border-radius: 6px; }
.sim-readout b.ok { color: #1d9e75; }
.sim-readout b.no { color: #c0392b; }
/* 阶段一③：仿真入口选择器 + 对照图组件样式 */
.sim-pick-card { margin: 10px 0; padding: 12px 14px; background: #f7faff; border: 1px solid #e3e8f3; border-radius: 12px; }
.sim-pick-head { font-size: 13px; font-weight: 600; color: #1c2742; margin-bottom: 8px; }
.sim-pick-item { font: inherit; font-size: 13px; padding: 8px 12px; border-radius: 9px; border: 1px solid #cdd6ea; background: #fff; cursor: pointer; margin: 0 8px 8px 0; }
.sim-pick-item:hover { background: var(--brand); color: #fff; border-color: var(--brand); }
.sim-presets { display: flex; align-items: center; gap: 8px; }
.sim-presets-label { font-size: 13px; color: #44506b; }
.sim-presets button { border: 1px solid #cdd6ea; background: #fff; border-radius: 8px; padding: 5px 12px; cursor: pointer; font-size: 13px; }
.sim-presets button.sim-preset-active { background: #2f6df6; color: #fff; border-color: #2f6df6; }
.sim-hint { margin-top: 8px; font-size: 12px; color: #66708a; line-height: 1.5; }
.chart-fallback { background: #f8f9fb; border: 1px dashed var(--border); border-radius: 10px;
  padding: 10px 12px; margin: 10px 0; font-size: 12px; color: var(--muted);
  white-space: pre-wrap; font-family: ui-monospace, Menlo, Consolas, monospace; line-height: 1.5; }
.chart-fb-note { margin-bottom: 6px; color: #b06a00; }
.chart-tbl { border-collapse: collapse; width: 100%; margin-top: 4px; font-size: 12px; }
.chart-tbl th, .chart-tbl td { border: 1px solid var(--border); padding: 4px 8px; text-align: center; }
.chart-tbl th { background: var(--brand-soft); color: var(--brand); }

/* 思维导图：提示可点击放大 */
.mermaid { cursor: zoom-in; position: relative; transition: box-shadow .15s; }
.mermaid:hover { box-shadow: 0 0 0 2px #cdd8f5; }
.mermaid .mm-hint { position: absolute; right: 8px; bottom: 6px; font-size: 11px;
  color: #7a88a8; background: rgba(255,255,255,.82); padding: 1px 7px; border-radius: 6px;
  pointer-events: none; user-select: none; }

/* 全屏放大查看器 */
.mm-modal { position: fixed; inset: 0; background: rgba(22,30,50,.86); z-index: 1000;
  display: flex; flex-direction: column; }
.mm-modal[hidden] { display: none; }
.mm-bar { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between;
  padding: 10px 16px; color: #eaf0ff; background: rgba(0,0,0,.30); }
.mm-title { font-size: 13px; opacity: .85; }
.mm-tools { display: flex; align-items: center; gap: 8px; }
.mm-tools button { min-width: 34px; height: 30px; border: 1px solid #ffffff55; background: #ffffff1a;
  color: #fff; border-radius: 8px; cursor: pointer; font-size: 15px; line-height: 1; }
.mm-tools button:hover { background: #ffffff33; }
#mmZoomLabel { min-width: 50px; text-align: center; font-size: 13px; }
.mm-canvas { flex: 1 1 auto; overflow: hidden; position: relative; background: #f4f6fb; cursor: default; user-select: none; -webkit-user-select: none; }
.mm-canvas.grabbing { cursor: grabbing; }
.mm-stage { padding: 24px; user-select: none; -webkit-user-select: none; will-change: transform; }   /* 普通流布局 + transform 平移；svg 用自身 width 矢量缩放，始终清晰 */
.mm-stage svg { max-width: none !important; height: auto; display: block; }
.mm-stage .mermaid-fallback { background: #fff; margin: 0; }

/* 教学模式浮层遮罩（移动端 bottom sheet 用） */
.mode-panel-backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1190;
  opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s ease; pointer-events: none;
}
.mode-panel-backdrop.show { opacity: 1; visibility: visible; pointer-events: auto; }

/* ---------- 讲解通道偏好（P1#7 阶段A）---------- */
/* 小进度条展示 4 通道倾向（权重向量，非标签）；强调"仅作偏好、可改、不评判" */
.profile .pf-actions { float: right; display: inline-flex; gap: 5px; }
.profile .mini-btn { cursor: pointer; font-size: 11px; color: var(--ink); background: var(--panel);
  border: 1px solid var(--border); border-radius: 7px; padding: 2px 8px; }
.profile .mini-btn:hover { background: var(--brand-soft); border-color: var(--border); }
.profile .mini-btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; }
.profile .mini-btn.primary:hover { filter: brightness(1.05); }
.profile .modality { background: var(--bot); border-radius: 8px; padding: 8px 10px; margin-bottom: 6px; }
.profile .mod-row { display: flex; align-items: center; gap: 8px; margin: 4px 0; }
.profile .mod-name { flex: 0 0 92px; font-size: 11.5px; color: var(--ink); }
.profile .mod-bar { flex: 1 1 auto; height: 8px; background: #e6eaf1; border-radius: 6px; overflow: hidden; }
.profile .mod-fill { height: 100%; background: linear-gradient(90deg, #5b8def, #2f6df6); border-radius: 6px; }
.profile .mod-val { flex: 0 0 22px; text-align: right; font-size: 11px; color: var(--muted); }
.profile .mod-note { margin-top: 6px; font-size: 10.5px; color: #98a2b8; line-height: 1.5; }
.profile .mod-sliders { margin-top: 8px; padding-top: 8px; border-top: 1px dashed #dfe4ec; }
.profile .mod-range { flex: 1 1 auto; }
.profile .mod-sliders .mini-btn.primary { margin-top: 8px; width: 100%; }

/* 诊断问卷 modal */
.modal-mask { position: fixed; inset: 0; background: rgba(20, 28, 48, .42);
  display: flex; align-items: flex-start; justify-content: center; z-index: 1100;
  padding: 3vh 16px; }
.modal { width: min(460px, 92vw); max-height: 92vh; overflow-y: auto; background: #fff;
  border-radius: 14px; box-shadow: 0 18px 50px rgba(20, 28, 48, .28); padding: 16px 18px; }
.modal-head { display: flex; align-items: center; justify-content: space-between;
  font-size: 15px; font-weight: 700; color: var(--ink); }
.modal-x { border: none; background: transparent; cursor: pointer; font-size: 20px;
  line-height: 1; color: #98a2b8; }
.modal-x:hover { color: #4b5563; }
.modal-sub { font-size: 12px; color: var(--muted); margin: 6px 0 10px; line-height: 1.5; }
.quiz-body { display: flex; flex-direction: column; gap: 12px; }
.quiz-q { font-size: 13px; color: var(--ink); font-weight: 600; }
.quiz-opts { display: flex; flex-direction: column; gap: 6px; }
.quiz-opt { cursor: pointer; text-align: left; font-size: 12.5px; color: #34415e;
  background: #f5f7fb; border: 1px solid #e3e8f0; border-radius: 9px; padding: 8px 10px; }
.quiz-opt:hover { background: #eef3fc; border-color: #c3d2ee; }
.quiz-opt.sel { background: #e7efff; border-color: #2f6df6; color: #1f3f8f; font-weight: 600; }
.modal-foot { display: flex; gap: 8px; margin-top: 14px; }
.modal-foot .mini-btn { flex: 1; padding: 8px 0; font-size: 13px; }
.loading { font-size: 12px; color: var(--muted); padding: 8px 2px; }

/* 通用加载圆圈：替代「加载中…」纯文本，视觉更美观（移动端/抽屉/弹层均可复用） */
.loading-spinner {
  display: inline-block; width: 22px; height: 22px; flex: none; box-sizing: border-box;
  border: 2px solid var(--border, #e6ebf5); border-top-color: var(--brand, #4a6cf7);
  border-radius: 50%; animation: ls-spin .7s linear infinite;
}
.loading-spinner.sm { width: 14px; height: 14px; border-width: 2px; }
.loading-center { display: flex; align-items: center; justify-content: center; padding: 30px 0; }
@keyframes ls-spin { to { transform: rotate(360deg); } }

/* 讲解通道切换工具栏（P1#7 阶段B） */
.channel-bar { display: flex; align-items: center; gap: 6px; padding: 6px 4px 2px; flex-wrap: wrap; }
.channel-bar .ch-label { font-size: 11px; color: var(--muted); margin-right: 2px; }
.ch-btn { border: 1px solid var(--border); background: var(--panel); color: var(--ink);
  font: inherit; font-size: 12px; padding: 4px 12px; border-radius: 999px; cursor: pointer;
  transition: background .12s, border-color .12s, color .12s, transform .08s; }
.ch-btn:hover { background: var(--brand-soft); border-color: var(--border); color: var(--brand); }
.ch-btn:active { transform: translateY(1px); }
.ch-btn[data-ch="text"]:hover { background: #eef1f6; border-color: #cfd6e2; color: #3a4658; }
.ch-btn[data-ch="figure"]:hover { background: #eaf3ff; border-color: #bcd4f5; color: #1f6fd6; }
.ch-btn[data-ch="sim"]:hover { background: #e9f8f1; border-color: #b4e6cf; color: #0f9d6b; }
.ch-btn[data-ch="analogy"]:hover { background: #fdeef6; border-color: #f3c8df; color: #d63384; }

/* 学情抽屉「你常用通道」小条（仅展示，不评判） */
.ch-usage-row { font-size: 11px; color: var(--muted); margin: 4px 0 8px; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.ch-usage { border-radius: 999px; padding: 1px 8px; font-size: 10.5px; border: 1px solid transparent; }
.ch-usage.ch-text { background: #f0f2f6; color: #4a5568; }
.ch-usage.ch-figure { background: #eaf3ff; color: #1f6fd6; }
.ch-usage.ch-sim { background: #e9f8f1; color: #0f9d6b; }
.ch-usage.ch-analogy { background: #fdeef6; color: #d63384; }

/* 轻量提示条（阶段C：仿真通道降级时诚实告知，居中底部淡入淡出，不遮挡对话） */
#toastHost { position: fixed; left: 50%; bottom: 86px; transform: translateX(-50%); z-index: 1200; display: flex; flex-direction: column; align-items: center; gap: 8px; pointer-events: none; }
.toast { background: rgba(28, 35, 56, .92); color: #fff; font-size: 13px; line-height: 1.5; padding: 10px 16px; border-radius: 10px; box-shadow: 0 6px 20px rgba(0,0,0,.18); max-width: 80vw; text-align: center; opacity: 0; transform: translateY(8px); transition: opacity .26s ease, transform .26s ease; }
.toast.show { opacity: 1; transform: translateY(0); }

/* P1#7 阶段B：AI 讲解后自动挂出的「相关虚拟实验 / 教材图」卡片（软驱动，不强制） */
.mat-card { border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; margin: 8px 0; background: rgba(99,102,241,.08); }
.mat-card .mat-head { font-size: 13px; font-weight: 600; color: #818cf8; margin-bottom: 6px; cursor: pointer; }
.mat-row { display: flex; flex-wrap: wrap; gap: 6px; }
.mat-btn { border: 1px solid var(--border); background: var(--panel); color: var(--ink); border-radius: 8px; padding: 5px 10px; font-size: 13px; cursor: pointer; }
.mat-btn:hover { background: var(--brand-soft); }

/* P1#9 智能回炉：回炉对话底部的「完成回炉复习」操作条（闭环收尾入口） */
.regrind-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 8px 0; padding: 8px 12px; border: 1px dashed #34c759; border-radius: 10px; background: rgba(52,199,89,.10); font-size: 13px; }
.regrind-bar .rb-tip { color: #34c759; }
.regrind-bar .finish-retest { border: none; background: #34c759; color: #fff; border-radius: 8px; padding: 6px 14px; font-size: 13px; font-weight: 600; cursor: pointer; }
.regrind-bar .finish-retest:hover { background: #2db24b; }

/* 功能12 自适应测验（方案A：侧栏入口 + 居中模态弹窗） */
#quizBtn { background: var(--brand-soft); color: var(--brand); border-color: transparent;
  cursor: pointer; font-weight: 600; }

/* 居中遮罩：聊天区变暗，题目获得完整横向空间 */
/* 弹层宽度（讲解通道偏好诊断等模态复用） */
.quiz-modal { width: min(560px, 94vw); }

/* 通用小按钮（对话式测验卡片 / 模态内共用，脱离 .profile 作用域） */
.mini-btn { cursor: pointer; font-size: 13px; color: var(--ink); background: var(--panel); border: 1px solid var(--border); border-radius: 9px; padding: 8px 14px; }
.mini-btn:hover { background: var(--brand-soft); border-color: var(--border); }
.mini-btn.primary { background: #2f6df6; border-color: #2f6df6; color: #fff; }
.mini-btn.primary:hover { filter: brightness(1.05); }

/* 自适应测验（对话式）：题目 / 反馈 / 摘要以对话消息呈现 */
.msg.bot.quiz-card { border: 1px solid #eef1f6; }
html[data-theme="dark"] .msg.bot.quiz-card { border-color: var(--border); }
.q-intro { font-size: 13px; color: var(--ink); line-height: 1.7; background: var(--bot); border-radius: 10px; padding: 12px 14px; }
.q-scope { margin: 8px 0 2px; padding: 6px 10px; background: rgba(47,109,246,0.08); border-left: 3px solid #2f6df6; border-radius: 6px; font-size: 12.5px; color: var(--ink); }
.q-scope b { color: #2f6df6; }
.q-intro-actions { margin-top: 10px; display: flex; gap: 8px; }
.q-meta { font-size: 12px; color: var(--muted); margin-bottom: 4px; }
.q-meta .q-cons { color: #2f6df6; }
.q-stem { font-size: 16px; color: var(--ink); line-height: 1.7; overflow: hidden; }
.q-stem p { margin: 0 0 .5em 0; } .q-stem p:last-child { margin-bottom: 0; }
.q-figures, .msg-figures { margin: 12px 0; clear: both; }
.q-item { margin: 0.85em 0; }
.q-item:first-child { margin-top: 0; }
.q-item:last-child { margin-bottom: 0; }
.q-num { float: left; font-weight: 600; margin-right: 0.35em; color: var(--ink); }
.q-figures figure.chat-fig, .msg-figures figure.chat-fig { margin: 12px auto; max-width: 92%; }
.q-figures .chat-figure, .msg-figures .chat-figure { display: block; width: auto; max-width: min(100%, 760px); height: auto; margin: 0 auto; border: 1px solid var(--border); border-radius: 10px; background: #fff; }
html[data-theme="dark"] .q-figures .chat-figure,
html[data-theme="dark"] .msg-figures .chat-figure { background: var(--panel); }
.q-figures .chat-figcap, .msg-figures .chat-figcap { font-size: 12px; color: var(--muted); margin-top: 5px; text-align: center; }
.q-hint { font-size: 12.5px; color: var(--muted); background: #f6f8fc; border-radius: 8px; padding: 8px 12px; margin: 6px 0; }
html[data-theme="dark"] .q-hint { background: var(--panel); }
.q-history { margin: 0.6em 0; border: 1px dashed var(--border); border-radius: 10px; background: #f6f8fa; padding: 6px 10px 8px; }
.q-history-badge { font-size: 11px; color: var(--muted); margin-bottom: 4px; font-weight: 600; }
.q-opts { display: flex; flex-direction: column; gap: 6px; margin: 8px 0 4px; }
.q-opt { cursor: pointer; text-align: left; font-size: 13px; color: #34415e; background: #f5f7fb; border: 1px solid #e3e8f0; border-radius: 10px; padding: 8px 10px; display: flex; align-items: flex-start; gap: 8px; }
.q-opt-txt { line-height: 1.7; }
.q-opt:hover { background: #eef3fc; border-color: #c3d2ee; }
.q-opt:active { transform: translateY(1px); }
.q-opt-key { flex: 0 0 auto; width: 20px; height: 20px; border-radius: 50%; background: #e3e8f0; color: #41506e; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.q-opt.sel .q-opt-key { background: #2f6df6; color: #fff; }
.q-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; }
.q-status { font-size: 12px; color: var(--muted); }
.q-fb { margin-top: 4px; border-radius: 10px; padding: 10px 12px; font-size: 13px; line-height: 1.65; }
.q-fb.ok { background: rgba(52, 199, 89, .10); border: 1px solid #bfe9cc; }
.q-fb.bad { background: rgba(255, 159, 64, .10); border: 1px solid #ffd9ad; }
.q-verdict { font-weight: 700; margin-bottom: 4px; }
.q-fb.ok .q-verdict { color: #2f7a4a; }
.q-fb.bad .q-verdict { color: #c8741a; }
.q-feedback { color: #4a5568; }
.q-vision { display: inline-block; margin: 5px 0 2px; padding: 2px 8px; background: #eef4ff;
  border: 1px solid #cdddff; border-radius: 999px; color: #2f5fb0; font-size: 12px; }
.q-mis { margin-top: 5px; padding: 5px 8px; background: #fff4ec; border: 1px solid #ffd9ad;
  border-radius: 8px; color: #b0621a; font-size: 12.5px; }
.q-exp { margin-top: 6px; color: #4a5568; }
.q-report-h { font-size: 15px; font-weight: 700; color: var(--ink); margin-bottom: 8px; }
.q-table { width: 100%; border-collapse: collapse; font-size: 12.5px; margin: 4px 0 8px; }
.q-table th, .q-table td { border: 1px solid #e6ebf3; padding: 5px 7px; text-align: center; }
.q-table th { background: #f3f6fc; color: #41506e; font-weight: 600; }
.q-table td:first-child { text-align: left; }
.q-table tr.st-ok td { background: rgba(52, 199, 89, .08); }
.q-table tr.st-bad td { background: rgba(255, 159, 64, .08); }
.q-wrong { font-size: 12.5px; color: #4a5568; background: #fff8f3; border: 1px solid #ffe2c4; border-radius: 10px; padding: 10px 12px; margin-top: 10px; }
.q-wrong ul { margin: 6px 0 0; padding-left: 18px; } .q-wrong li { margin: 6px 0; }
.qw-stem { font-weight: 600; color: var(--ink); font-size: 14.5px; line-height: 1.7; }
.qw-line { margin-top: 2px; line-height: 1.7; } .qw-line.ok { color: #2f7a4a; }
.q-steps { font-size: 12.5px; color: #4a5568; background: var(--bot); border-radius: 8px; padding: 8px 12px; margin-top: 10px; }
.q-steps ul { margin: 4px 0 0; padding-left: 18px; }
.q-empty { font-size: 13px; color: var(--muted); }

/* ===== 题级错题本（P0#315） ===== */
.qw-line.cause-row { display: flex; align-items: center; gap: 6px; margin-top: 4px; }
.qw-cause { font-size: 12px; padding: 2px 6px; border-radius: 6px; border: 1px solid var(--border); background: var(--bot); color: var(--ink); }
.mm-list { display: flex; flex-direction: column; gap: 14px; }
/* 错题卡片：卡片化、层级分明、留白舒适 */
.card.mistake {
  background: var(--panel);
  border: 1px solid var(--border);
  border-left: 4px solid #ff9f40;
  border-radius: 14px;
  padding: 14px 16px 12px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  transition: box-shadow .15s ease, transform .15s ease;
}
.card.mistake:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.06); }
.card.mistake.st-ok { border-left-color: #34c759; }
.card.mistake.st-mid { border-left-color: #f5c518; }
html[data-theme="dark"] .card.mistake { background: var(--panel); box-shadow: 0 1px 3px rgba(0,0,0,0.18); }
html[data-theme="dark"] .card.mistake:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.25); }
/* 头部：章节位置 + 状态徽章 */
.mm-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; }
.mm-loc { font-size: 12px; color: var(--muted); background: var(--bot); border: 1px solid var(--border); border-radius: 999px; padding: 3px 10px; flex-shrink: 0; }
.mm-badges { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.mm-badge { font-size: 11.5px; font-weight: 700; padding: 3px 9px; border-radius: 999px; border: 1px solid transparent; }
.mm-badge.st-bad { background: rgba(255,159,64,0.12); color: #e67e22; border-color: rgba(255,159,64,0.35); }
.mm-badge.st-mid { background: rgba(245,197,24,0.12); color: #b38f00; border-color: rgba(245,197,24,0.4); }
.mm-badge.st-ok { background: rgba(52,199,89,0.12); color: #2f7a4a; border-color: rgba(52,199,89,0.35); }
.mm-badge.relapse { background: rgba(255,59,48,0.08); color: #c0392b; border-color: rgba(255,59,48,0.25); }
/* 错题对应概念（与测验界面 q-cons 保持一致） */
.mm-concepts { font-size: 12px; color: #2f6df6; margin-bottom: 8px; }
/* 错题卡底部“评价和解析”卡片：与自适应测验 q-fb 同款（你的作答/正确答案独立在外） */
.mm-feedback-card { margin-top: 8px; margin-bottom: 12px; }
/* 题干 */
.mm-stem { font-size: 14.5px; line-height: 1.7; color: var(--ink); margin-bottom: 12px; }
.mm-stem .qw-stem { font-weight: 500; }
/* 错题卡片内隐藏内部 figure ID 图注，避免 ch1_p25_img0 等外露 */
.card.mistake .chat-figcap { display: none; }
/* 错因行 */
.mm-cause-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.mm-label { font-size: 12px; color: var(--muted); font-weight: 600; }
.mm-cause { font-size: 12.5px; padding: 4px 8px; border-radius: 8px; border: 1px solid var(--border); background: var(--panel); color: var(--ink); cursor: pointer; }
.mm-cause:focus { outline: none; border-color: var(--brand); }
html[data-theme="dark"] .mm-cause { background: var(--panel); }
/* 作答/答案区 */
.mm-answer-row { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.mm-answer-block { border-radius: 10px; padding: 9px 12px; font-size: 13px; line-height: 1.5; }
.mm-answer-label { font-size: 13px; font-weight: 700; margin-bottom: 3px; opacity: .75; }
.mm-answer-text { color: var(--ink); }
.mm-your-block { background: rgba(255,159,64,0.08); border: 1px solid rgba(255,159,64,0.2); }
.mm-your-block .mm-answer-label { color: #e67e22; }
.mm-correct-block { background: rgba(52,199,89,0.08); border: 1px solid rgba(52,199,89,0.2); }
.mm-correct-block .mm-answer-label { color: #2f7a4a; }
html[data-theme="dark"] .mm-your-block { background: rgba(255,159,64,0.1); border-color: rgba(255,159,64,0.3); }
html[data-theme="dark"] .mm-correct-block { background: rgba(52,199,89,0.1); border-color: rgba(52,199,89,0.3); }
/* 操作按钮 */
.mm-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 10px; border-top: 1px solid var(--border); }
.btn.sm { font-size: 12px; padding: 5px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--bot); color: var(--ink); cursor: pointer; transition: background .12s ease, border-color .12s ease, color .12s ease, filter .12s ease; }
.btn.sm:hover { background: var(--brand-soft); border-color: var(--brand); color: var(--brand); }
/* 错题卡按钮层级：巩固=主操作，微测=次操作，已掌握=三级 */
.mm-actions .btn.sm.mm-review { background: var(--brand); color: #fff; border-color: var(--brand); }
.mm-actions .btn.sm.mm-review:hover { filter: brightness(1.06); }
.mm-actions .btn.sm.mm-microquiz { background: var(--brand-soft); color: var(--brand); border-color: var(--brand); }
.mm-actions .btn.sm.mm-microquiz:hover { filter: brightness(0.96); }
.mm-actions .btn.sm.mm-master { background: transparent; color: var(--muted); border-color: var(--border); }
.mm-actions .btn.sm.mm-master:hover { background: rgba(52,199,89,.1); color: #2f7a4a; border-color: rgba(52,199,89,.4); }
html[data-theme="dark"] .mm-actions .btn.sm.mm-review { filter: none; }
html[data-theme="dark"] .mm-actions .btn.sm.mm-review:hover { filter: brightness(1.1); }
html[data-theme="dark"] .mm-actions .btn.sm.mm-microquiz { background: rgba(47,128,237,.2); }
html[data-theme="dark"] .mm-actions .btn.sm.mm-master:hover { background: rgba(52,199,89,.18); }
.mm-review-set { margin-top: 8px; padding: 8px 10px; border: 1px dashed #34c759; border-radius: 10px; background: rgba(52,199,89,.07); }
.mm-microquiz-set { margin-top: 8px; padding: 8px 10px; border: 1px dashed #2f80ed; border-radius: 10px; background: rgba(47,128,237,.07); }
.mm-microquiz-set .mm-review-h { color: #2f80ed; }
.mm-review-h { font-size: 12px; font-weight: 600; color: #2f7a4a; margin-bottom: 4px; }
.card.review-q { margin-top: 6px; }
.mm-review-foot { margin-top: 8px; text-align: right; }
.rv-area { margin-top: 6px; display: flex; flex-direction: column; gap: 6px; }
.rv-editor { width: 100%; box-sizing: border-box; border: 1px solid var(--line, #e3e6ee); border-radius: 10px; padding: 8px 10px; font-size: 13px; line-height: 1.6; background: #fff; color: var(--ink); font-family: inherit; min-height: 56px; outline: none; }
.rv-editor:focus { border-color: #34c759; box-shadow: 0 0 0 2px rgba(52,199,89,.12); }
.rv-editor[contenteditable="false"] { opacity: .5; background: #f1f3f5; }
.rv-editor:empty:before { content: attr(data-placeholder); color: var(--muted, #9aa0aa); pointer-events: none; }
.rv-result { margin-top: 6px; }
.rv-result .q-fb { padding: 6px 8px; border-radius: 8px; font-size: 12px; }
.rv-result .q-fb.ok { background: rgba(52,199,89,.1); }
.rv-result .q-fb.bad { background: rgba(255,59,48,.08); }
.rv-result .q-verdict { font-weight: 600; }
.rv-result .q-fb.ok .q-verdict { color: #2f7a4a; }
.rv-result .q-fb.bad .q-verdict { color: #d33; }

/* ===== 右侧可折叠练习边栏（巩固/微测验证统一展示，保持主对话区整洁） ===== */
.practice-panel {
  flex-shrink: 0;
  width: 0;
  overflow: hidden;
  background: var(--panel, #fff);
  border-left: 1px solid var(--border, #e3e6ee);
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: width .22s ease;
}
.practice-panel.practice-open { width: clamp(360px, 34vw, 460px); }
/* 收起态下显示重开入口（仅 practice-collapsed 时） */
.practice-panel.practice-collapsed .pp-reopen { display: flex; }
.practice-panel .pp-reopen { display: none; }

.pp-reopen {
  position: fixed;
  right: 0; top: 50%;
  transform: translateY(-50%);
  z-index: 120;
  display: none;
  flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  width: 26px; padding: 12px 4px;
  background: var(--brand, #0a2540);
  color: #fff; border: none; border-radius: 10px 0 0 10px;
  cursor: pointer; font-size: 12px; writing-mode: vertical-rl;
  box-shadow: -2px 0 12px rgba(15,23,42,.18);
  -webkit-tap-highlight-color: transparent;
}
.pp-reopen svg { width: 16px; height: 16px; }
.pp-reopen:active { opacity: .85; }

.pp-head {
  flex: 0 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 12px 10px;
  border-bottom: 1px solid var(--border, #e3e6ee);
}
.pp-title { display: flex; flex-direction: column; line-height: 1.3; }
.pp-title-text { font-size: 15px; font-weight: 700; color: var(--ink); }
.pp-title-hint { font-size: 11px; color: var(--muted); }
.pp-head-actions { display: flex; gap: 4px; }
.pp-icon-btn {
  width: 30px; height: 30px; display: flex; align-items: center; justify-content: center;
  border: none; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer;
}
.pp-icon-btn:hover { background: var(--brand-soft, #eef2ff); color: var(--brand); }
.pp-icon-btn svg { width: 18px; height: 18px; }

.pp-body {
  flex: 1 1 auto; min-height: 0;
  overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: transparent transparent;
}
.pp-section { padding: 10px 12px; border-bottom: 1px solid var(--border, #e3e6ee); }
.pp-sec-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.pp-sec-title { font-size: 13px; font-weight: 700; color: var(--ink); }
.pp-again {
  font-size: 12px; padding: 4px 10px; border-radius: 8px;
  border: 1px solid var(--brand, #0a2540); background: transparent; color: var(--brand); cursor: pointer;
}
.pp-again:active { background: var(--brand-soft, #eef2ff); }
.pp-list { display: flex; flex-direction: column; }
.pp-empty { font-size: 12px; color: var(--muted); padding: 10px 4px; line-height: 1.6; }

/* 让既有练习卡样式在侧栏内更紧凑、卡片化 */
.practice-panel .mm-review-set { margin-top: 0; border: none; background: transparent; padding: 0; }
.practice-panel .mm-review-h { font-size: 12px; margin: 4px 0; }
.practice-panel .card.review-q {
  background: var(--bg, #f7f8fa); border: 1px solid var(--border, #e3e6ee);
  border-radius: 10px; padding: 8px 10px; margin-top: 6px;
}
.practice-panel .mm-review-foot { text-align: right; margin-top: 8px; }

/* 练习区题目文本去除加粗，保持普通字重 */
.practice-panel .qw-stem,
.practice-panel .qw-stem strong,
.practice-panel .qw-stem b,
.practice-panel .card.review-q .qw-stem {
  font-weight: 400 !important;
}

/* 练习区多模态输入工具条（与对话区 composer 同款布局） */
.rv-tools {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 2px 2px 0;
}
.rv-tool-left { position: relative; }
.rv-attach-more,
.rv-mic {
  width: 28px; height: 28px; border-radius: 8px; border: 1px solid var(--border, #e3e6ee);
  background: transparent; color: var(--muted); cursor: pointer;
  display: flex; align-items: center; justify-content: center; padding: 0;
  touch-action: none; -webkit-tap-highlight-color: transparent;
}
.rv-attach-more svg,
.rv-mic svg { width: 18px; height: 18px; }
.rv-attach-more:hover,
.rv-mic:hover { background: var(--brand-soft, #eef2ff); color: var(--brand); border-color: var(--brand); }
.rv-mic.recording { background: #e03131; color: #fff; border-color: #e03131; animation: mic-pulse 1.1s ease-in-out infinite; }
.rv-mic.cancel { background: #ffe3a3; color: #874d00; border-color: #ffe3a3; }
.rv-mic.busy { background: #868e96; color: #fff; cursor: progress; border-color: #868e96; }
.rv-attach-sheet {
  position: absolute; bottom: calc(100% + 8px); left: 0;
  background: var(--panel, #fff); border: 1px solid var(--border, #e3e6ee);
  border-radius: 12px; box-shadow: 0 6px 24px rgba(15,23,42,.14);
  padding: 6px; display: flex; flex-direction: column; gap: 2px; min-width: 130px; z-index: 20;
}
.rv-attach-sheet[hidden] { display: none; }
.rv-attach-sheet button {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: none; background: transparent;
  border-radius: 10px; color: var(--ink); font-size: 13px; cursor: pointer; white-space: nowrap; text-align: left; font-family: inherit;
}
.rv-attach-sheet button:hover { background: var(--brand-soft, #eef2ff); color: var(--brand); }
.rv-attach-sheet button svg { width: 18px; height: 18px; color: var(--muted); flex-shrink: 0; }
.rv-attach-sheet button:hover svg { color: var(--brand); }

/* ===== 独立全宽「错题本」主区视图（方向A：从学情画像拆出的一级入口） ===== */
#mistakeBtn, #gkBankBtn { background: var(--brand-soft); color: var(--brand); border-color: transparent;
  cursor: pointer; font-weight: 700; }
#mistakeBtn.active, #gkBankBtn.active { background: var(--brand); color: #fff; }
html[data-theme="dark"] #mistakeBtn,
html[data-theme="dark"] #gkBankBtn { color: #fff; }
/* 进入错题本视图时，隐藏对话流（对话区/公式条/输入区/提醒条），由 #mistakeView 占满主区 */
.chat.mistake-mode .chat-scroll,
.chat.mistake-mode .formula-bar,
.chat.mistake-mode .composer-wrap,
.chat.mistake-mode #nudgeBar { display: none; }
.mistake-view { display: none; flex-direction: column; flex: 1 1 auto; min-height: 0; background: var(--panel); }
.chat.mistake-mode .mistake-view { display: flex; }
.mv-head { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.mv-back { background: transparent; border: 1px solid var(--border); color: var(--muted); border-radius: 8px;
  padding: 5px 10px; font-size: 12px; cursor: pointer; flex-shrink: 0; }
.mv-back:hover { background: var(--brand-soft); color: var(--brand); }
.mv-head-main { min-width: 0; }
.mv-title { font-size: 15px; font-weight: 700; color: var(--ink); }
.mv-sub { font-size: 12px; color: var(--muted); margin-top: 2px; }
.mv-filters { display: flex; gap: 8px; padding: 10px 16px 0; flex-shrink: 0; flex-wrap: wrap; }
.mv-filter { background: var(--bot); border: 1px solid var(--border); color: var(--muted); border-radius: 999px;
  padding: 5px 14px; font-size: 12.5px; cursor: pointer; }
.mv-filter.active { background: var(--brand); color: #fff; border-color: var(--brand); }
.mv-body { flex: 1 1 auto; overflow-y: auto; min-height: 0; padding: 12px 0 24px;
  scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: transparent transparent; }
/* 错题本内容列：居中并约束到与聊天区 .chat-inner / .composer-wrap 同宽（--content-max），
   使错题卡与对话消息同处一条阅读列，避免宽屏下卡片贴边拉伸 */
/* 错题本 / 练习区滚动条：与对话区 .chat-scroll 同款（默认隐藏，hover 淡出，稳定槽位防抖动） */
.pp-body::-webkit-scrollbar, .mv-body::-webkit-scrollbar { width: 10px; }
.pp-body::-webkit-scrollbar-track, .mv-body::-webkit-scrollbar-track { background: transparent; }
.pp-body::-webkit-scrollbar-thumb, .mv-body::-webkit-scrollbar-thumb { background: transparent; border-radius: 6px;
  border: 2px solid transparent; background-clip: padding-box; transition: background .18s; }
.pp-body:hover, .mv-body:hover { scrollbar-color: var(--scrollbar) transparent; }
.pp-body:hover::-webkit-scrollbar-thumb, .mv-body:hover::-webkit-scrollbar-thumb { background: var(--scrollbar); }
.pp-body:hover::-webkit-scrollbar-thumb:hover, .mv-body:hover::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-hover); border: 2px solid transparent; background-clip: padding-box; }
.mv-inner { max-width: var(--content-max); margin: 0 auto; padding: 0 var(--content-pad-x); }
.mv-chapter { margin-bottom: 14px; }
.mv-ch-title { font-size: 13px; font-weight: 700; color: var(--ink); margin: 4px 0 8px; }
.mm-summary { display: flex; gap: 8px; margin: 6px 0 10px; flex-wrap: wrap; }
.mm-sum { flex: 1; min-width: 64px; background: var(--bot); border-radius: 8px; padding: 8px; text-align: center; }
.mm-sum .n { font-size: 18px; font-weight: 700; line-height: 1.1; }
.mm-sum .n.st-bad { color: #ff9f40; } .mm-sum .n.st-mid { color: #f5c518; } .mm-sum .n.st-ok { color: #34c759; }
.mm-sum .l { font-size: 11px; color: var(--muted); margin-top: 2px; display: block; }
.mm-jump { margin-top: 4px; background: var(--brand); color: #fff; border: none; border-radius: 8px;
  padding: 8px 14px; font-size: 13px; font-weight: 600; cursor: pointer; }
.mistake-back { background: transparent; border: 1px solid var(--border); color: var(--brand); border-radius: 8px;
  padding: 4px 10px; font-size: 12px; cursor: pointer; margin-left: 8px; }

/* ===== P2 主动伴学·提醒条（应用内 MVP） ===== */
.nudge-bar { margin: 10px 14px 0; display: flex; flex-direction: column; gap: 8px; }
.nudge-bar[hidden] { display: none; }
.nudge-card { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border-radius: 12px;
  background: linear-gradient(135deg, rgba(47,128,237,.12), rgba(52,199,89,.12));
  border: 1px solid rgba(47,128,237,.25); }
.nudge-emoji { font-size: 20px; line-height: 1.25; flex-shrink: 0; }
.nudge-body { flex: 1; min-width: 0; }
.nudge-title { font-size: 13px; font-weight: 600; color: var(--ink, #1f2530); }
.nudge-sub { font-size: 12px; color: var(--muted, #6b7280); margin-top: 2px; line-height: 1.5; }
.nudge-actions { display: flex; gap: 8px; margin-top: 8px; }
.nudge-actions .btn { font-size: 12px; padding: 4px 13px; border-radius: 8px; cursor: pointer; border: 1px solid transparent; }
.nudge-start { background: var(--brand, #2f80ed); color: #fff; border-color: var(--brand, #2f80ed); }
.nudge-start:hover { filter: brightness(1.05); }
.nudge-later { background: transparent; color: var(--muted, #6b7280); border-color: var(--border, #d8dee9); }
.nudge-later:hover { background: rgba(0,0,0,.04); }
@media (prefers-color-scheme: dark) { .nudge-later:hover { background: rgba(255,255,255,.06); } }

/* ===== S4 AI 主动跨章连接：关联知识 chips ===== */
.conn-bar { margin: 10px 14px 0; display: flex; flex-direction: column; gap: 6px; }
.conn-bar[hidden] { display: none; }
.conn-head { font-size: 12px; font-weight: 600; color: var(--muted, #6b7280);
  display: flex; align-items: center; justify-content: space-between;
  padding: 4px 4px 4px 2px; cursor: pointer; user-select: none; border-radius: 6px; }
.conn-head:hover { background: color-mix(in srgb, var(--muted, #6b7280) 10%, transparent); color: var(--ink, #1f2530); }
.conn-head:focus-visible { outline: 2px solid var(--brand, #2f80ed); outline-offset: 1px; }
.conn-head-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.conn-chev { font-size: 11px; color: var(--muted, #6b7280); flex-shrink: 0;
  transition: transform .15s ease; display: inline-block; }
.conn-bar.collapsed .conn-chips { display: none; }
.conn-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.conn-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; flex-wrap: wrap;
  padding: 5px 10px; border-radius: 999px; cursor: pointer; font-size: 12.5px; line-height: 1.3;
  background: var(--bg, #fff); border: 1px solid var(--border, #d8dee9); color: var(--ink, #1f2530);
  transition: border-color .15s, background .15s, transform .05s; }
.conn-chip:hover { border-color: var(--brand, #2f80ed); background: color-mix(in srgb, var(--brand, #2f80ed) 8%, var(--bg, #fff)); }
.conn-chip:active { transform: translateY(1px); }
.conn-chip.cross { border-color: color-mix(in srgb, var(--brand, #2f80ed) 55%, var(--border, #d8dee9));
  background: color-mix(in srgb, var(--brand, #2f80ed) 10%, var(--bg, #fff)); }
.conn-chip.weak { border-color: #e8a33d; background: color-mix(in srgb, #e8a33d 12%, var(--bg, #fff)); }
.conn-tag { font-size: 12px; flex-shrink: 0; }
.conn-label { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 160px; }
.conn-chunks { font-weight: 400; font-size: 11px; color: var(--muted, #6b7280);
  white-space: normal; overflow: visible; text-overflow: clip; max-width: 220px; }
.conn-where { color: var(--muted, #6b7280); font-size: 11px; flex-shrink: 0; }
.conn-weak { font-size: 10px; font-weight: 700; color: #b9791f; background: rgba(232,163,61,.18);
  border-radius: 6px; padding: 1px 6px; flex-shrink: 0; }
@media (prefers-color-scheme: dark) {
  .conn-chip { background: var(--bg, #15191f); }
  .conn-chip:hover { background: color-mix(in srgb, var(--brand, #2f80ed) 18%, var(--bg, #15191f)); }
  .conn-chip.cross { background: color-mix(in srgb, var(--brand, #2f80ed) 20%, var(--bg, #15191f)); }
  .conn-chip.weak { background: color-mix(in srgb, #e8a33d 22%, var(--bg, #15191f)); }
}

/* ===== enhancement #3：关联提示气泡（非侵入式主动话术，可消除） ===== */
.ai-hint-row { margin-top: 4px; }
.ai-hint { font-size: 12.5px; line-height: 1.55; color: var(--ink, #1f2530);
  background: color-mix(in srgb, var(--brand, #2f80ed) 8%, var(--card, #fff));
  border: 1px dashed color-mix(in srgb, var(--brand, #2f80ed) 45%, var(--border, #d8dee9));
  border-radius: 12px; padding: 9px 12px; position: relative; }
.ai-hint-x { position: absolute; top: 6px; right: 6px; width: 18px; height: 18px;
  line-height: 16px; text-align: center; font-size: 11px; cursor: pointer;
  color: var(--muted, #6b7280); background: transparent; border: none; border-radius: 50%;
  padding: 0; }
.ai-hint-x:hover { background: color-mix(in srgb, var(--muted, #6b7280) 16%, transparent); color: var(--ink, #1f2530); }
@media (prefers-color-scheme: dark) {
  .ai-hint { color: var(--ink, #e7ecf3);
    background: color-mix(in srgb, var(--brand, #2f80ed) 16%, var(--bg, #15191f));
    border-color: color-mix(in srgb, var(--brand, #2f80ed) 50%, var(--border, #2a3240)); }
}

/* ===== P3 成绩趋势看板（抽屉双 Tab，与内容分离） ===== */
.pf-tabs { display: flex; gap: 8px; padding: 12px 14px 10px; position: relative; z-index: 2; }
.pf-tab { flex: 1; padding: 8px 0; font-size: 13px; font-weight: 600; color: var(--muted, #6b7280);
  background: transparent; border: 1px solid var(--border, #d8dee9);
  border-radius: 10px; cursor: pointer; position: relative; z-index: 1; }
.pf-tab.active { color: var(--brand, #2f80ed); background: var(--brand-soft, #eef4ff); border-color: var(--brand, #2f80ed); z-index: 3; }
.pf-panel { position: relative; z-index: 1; }
.pf-panel[hidden] { display: none; }
.dash { display: flex; flex-direction: column; gap: 12px; padding: 14px; }
.dash-card { border: 1px solid var(--border, #d8dee9); border-radius: 12px; padding: 12px; background: var(--card, #fff); }
.dash-card-h { font-size: 13px; font-weight: 600; color: var(--ink, #1f2530); margin-bottom: 10px; }
.dash-ring { display: flex; align-items: center; gap: 12px; }
.dash-ring-n { font-size: 17px; font-weight: 700; fill: var(--ink, #1f2530); }
.dash-ring-l { font-size: 10px; fill: var(--muted, #6b7280); }
.dash-ring-cap { font-size: 13px; font-weight: 600; color: var(--ink, #1f2530); }
.dash-sub { font-size: 11px; color: var(--muted, #6b7280); font-weight: 400; margin-top: 2px; }
.dash-note { font-size: 12px; color: var(--muted, #6b7280); margin-top: 6px; }
.dash-bar-row { display: flex; align-items: center; gap: 8px; margin: 7px 0; }
.dash-bar-name { flex: 0 0 84px; font-size: 12px; color: var(--ink, #1f2530); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dash-bar-track { flex: 1; height: 8px; background: var(--brand-soft, #eef4ff); border-radius: 6px; overflow: hidden; }
.dash-bar-fill { height: 100%; background: linear-gradient(90deg, var(--warn, #f5a623), var(--brand, #2f80ed)); border-radius: 6px; }
.dash-stats { display: flex; gap: 10px; }
.dash-stat { flex: 1; text-align: center; padding: 8px 4px; border-radius: 10px; background: var(--brand-soft, #eef4ff); }
.dash-stat .n { font-size: 20px; font-weight: 700; color: var(--brand, #2f80ed); }
.dash-stat .l { font-size: 11px; color: var(--muted, #6b7280); margin-top: 2px; }

/* ===== 登录与账户体系（Phase 1） ===== */
#accountBox { position: relative; margin-top: 4px; }
.user-bar { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; cursor: pointer; transition: background .15s; }
.user-bar:hover { background: var(--brand-soft); }
.user-avatar { width: 28px; height: 28px; border-radius: 50%; background: var(--brand); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 500; flex-shrink: 0; }
.user-info { flex: 1; min-width: 0; }
.user-name { font-size: 13px; font-weight: 500; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-meta { font-size: 11px; color: var(--muted); }
.user-more { width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 6px; color: var(--muted); }
.user-more:hover { background: var(--brand-soft); }
.user-menu { position: absolute; left: 0; bottom: calc(100% + 6px); width: 100%; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 6px 20px rgba(0,0,0,.18); padding: 6px; display: flex; flex-direction: column; gap: 2px; z-index: 50; }
.user-menu[hidden] { display: none; }
.user-menu-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 8px; font-size: 14px; color: var(--ink); cursor: pointer; }
.user-menu-item:hover { background: var(--brand-soft); }
.user-menu-item .icon { width: auto; min-width: 1em; text-align: center; color: var(--muted); font-size: 1.15em; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
.user-menu-sep { height: 1px; background: var(--border); margin: 4px 0; }

/* 旧版账户区样式保留，防止历史代码/记忆引用 */
.acc-row { display: flex; align-items: center; gap: 6px; }
.acc-label { font-size: 12px; color: var(--muted); }
.acc-select { padding: 4px 6px; border-radius: 8px; border: 1px solid var(--line, #d8dee9); background: #fff; font-size: 13px; max-width: 130px; }
.acc-add, .acc-logout { padding: 4px 9px; border-radius: 8px; border: 1px solid var(--line, #d8dee9); background: #f4f7ff; color: #2b3a55; font-size: 12px; cursor: pointer; }
.acc-add:hover, .acc-logout:hover { background: #e6edff; }

/* 移动端设置弹窗从底部滑入的全屏 Sheet 动画（仅移动端使用） */
@keyframes sheetUp { from { transform: translateY(100%); } to { transform: translateY(0); } }

/* ===== 系统设置弹窗（DeepSeek 风格） ===== */
.settings-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; z-index: 200; }
.settings-overlay[hidden] { display: none; }
.settings-card { width: 720px; max-width: 92vw; height: 520px; max-height: 86vh; background: var(--panel); border-radius: 16px; display: flex; flex-direction: column; overflow: hidden; }
.settings-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; background: var(--panel); border-bottom: 1px solid var(--border); }
.settings-head h2 { font-size: 18px; font-weight: 500; margin: 0; color: var(--ink); }
.settings-close { width: 32px; height: 32px; border: none; background: transparent; border-radius: 8px; font-size: 22px; line-height: 1; color: var(--muted); cursor: pointer; }
.settings-close:hover { background: var(--brand-soft); }
/* 移动端文字关闭按钮（在 .mobile-only 覆盖规则中显示） */
.settings-close.mobile-only { display: none; }
/* 移动端底部 Sheet 的拖拽指示条 */
.sheet-handle { display: none; }
.settings-body { display: flex; flex: 1; min-height: 0; }
.settings-tabs { width: 170px; flex-shrink: 0; border-right: 1px solid var(--border); background: var(--panel); padding: 14px 10px; display: flex; flex-direction: column; gap: 4px; }
.settings-tab { text-align: left; padding: 10px 12px; border-radius: 8px; border: none; background: transparent; font-size: 15px; color: var(--ink); cursor: pointer; }
.settings-tab:hover { background: var(--brand-soft); }
.settings-tab.active { background: var(--brand-soft); color: var(--brand); font-weight: 500; }
html[data-theme="dark"] .settings-tab.active { color: #fff; }
.settings-content { flex: 1; padding: 22px 26px; overflow-y: auto; background: var(--panel);
  scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: transparent transparent; }
.settings-content::-webkit-scrollbar { width: 10px; }
.settings-content::-webkit-scrollbar-track { background: transparent; }
.settings-content::-webkit-scrollbar-thumb { background: transparent; border-radius: 6px;
  border: 2px solid transparent; background-clip: padding-box; transition: background .18s; }
.settings-content:hover { scrollbar-color: var(--scrollbar) transparent; }
.settings-content:hover::-webkit-scrollbar-thumb { background: var(--scrollbar); }
.settings-content:hover::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-hover); border: 2px solid transparent; background-clip: padding-box; }
.settings-pane { display: none; }
.settings-pane.active { display: block; }
.settings-section-title { color: var(--ink); font-size: 15px; font-weight: 500; margin-bottom: 14px; }
.settings-section-title:not(:first-child) { margin-top: 10px; }
.settings-empty { color: var(--muted); font-size: 13px; padding: 20px 0; }
.settings-row { display: flex; align-items: center; justify-content: space-between; padding: 16px 0; border-bottom: 1px solid var(--border); }
.settings-row:last-child { border-bottom: none; }
.settings-row-label { font-size: 14px; color: var(--ink); }
.settings-row-value { font-size: 14px; color: var(--muted); display: flex; align-items: center; gap: 14px; }
.settings-row-action { font-size: 14px; color: var(--brand); background: transparent; border: none; cursor: pointer; padding: 0; }
.settings-row-action:hover { text-decoration: underline; }
.settings-row-action.danger { color: #a32d2d; border: 1px solid #a32d2d; padding: 5px 14px; border-radius: 999px; }
.settings-row-action.danger:hover { background: rgba(163,45,45,.06); text-decoration: none; }
.theme-selector { display: flex; gap: 12px; }
.theme-card { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 8px; border: 1px solid var(--border); border-radius: 12px; background: var(--panel); color: var(--ink); cursor: pointer; transition: border-color .15s, background .15s; }
.theme-card:hover { border-color: var(--brand); }
.theme-card.selected { border-color: var(--brand); background: var(--brand-soft); }
.theme-card-icon { width: 24px; height: 24px; color: var(--ink); }
.theme-card-label { font-size: 14px; }

.learner-list { display: flex; flex-direction: column; gap: 8px; }
.learner-item { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; cursor: pointer; }
.learner-item:hover { background: var(--brand-soft); }
.learner-item.current { border-color: var(--brand); background: var(--brand-soft); }
.learner-item-name { font-size: 14px; font-weight: 500; }
.learner-item-grade { font-size: 13px; color: var(--muted); }
.learner-add { margin-top: 10px; width: 100%; padding: 9px; border: 1px dashed var(--border); background: transparent; border-radius: 10px; font-size: 14px; color: var(--ink); cursor: pointer; }
.learner-add:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }

.login-overlay {
  position: fixed; inset: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: center;
  background: rgba(20, 28, 46, 0.45); backdrop-filter: blur(2px);
}
.login-overlay[hidden] { display: none; }
.login-card {
  width: 340px; max-width: 90vw; padding: 26px 24px;
  background: #fff; border-radius: 16px; box-shadow: 0 18px 50px rgba(0,0,0,0.22);
  display: flex; flex-direction: column; gap: 12px;
}
.login-card h2 { margin: 0; font-size: 20px; color: #1f2a44; }
.login-card-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.login-close { background: transparent; border: none; font-size: 26px; line-height: 1; color: #8b95a8; cursor: pointer; padding: 0 2px; }
.auth-hint {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 18px; background: #fff7e6; border-bottom: 1px solid #f0d9b0;
  color: #8a5d1a; font-size: 13px;
}
.auth-hint[hidden] { display: none; }
.auth-hint-btn {
  padding: 5px 12px; border-radius: 6px; border: 1px solid #d4a340;
  background: #fff; color: #8a5d1a; font-size: 13px; cursor: pointer;
}
.auth-hint-btn:hover { background: #ffefc9; }
.login-close:hover { color: #1f2a44; }
.login-sub { margin: 0; font-size: 13px; color: #6b7689; line-height: 1.5; }
.login-field { display: flex; flex-direction: column; gap: 5px; font-size: 13px; color: #44506a; }
.login-field input {
  padding: 10px 12px; border-radius: 10px; border: 1px solid #d8dee9; font-size: 15px; outline: none;
}
.login-field input:focus { border-color: #5b8def; box-shadow: 0 0 0 3px rgba(91,141,239,0.18); }
.code-row { display: flex; gap: 8px; }
.code-row input { flex: 1; }
.login-btn-sm {
  white-space: nowrap; padding: 0 12px; border-radius: 10px; border: 1px solid #5b8def;
  background: #eaf1ff; color: #2b5fd0; font-size: 13px; cursor: pointer;
}
.login-btn-sm:disabled { opacity: 0.55; cursor: default; }
.login-btn {
  margin-top: 4px; padding: 11px; border-radius: 10px; border: none;
  background: #3b6fe0; color: #fff; font-size: 15px; font-weight: 600; cursor: pointer;
}
.login-btn:hover { background: #2f5fc6; }
.login-err { min-height: 18px; font-size: 13px; color: #d23b3b; }
.login-dev-hint { min-height: 20px; padding: 7px 10px; border-radius: 8px; background: #eef4ff; border: 1px dashed #5b8def; color: #2b5fc4; font-size: 13px; font-weight: 600; text-align: center; cursor: pointer; user-select: none; }
.login-dev-hint[hidden] { display: none; }
.login-tip { margin: 0; font-size: 12px; color: #97a0b0; text-align: center; }

/* ===== 未登录落地页（DeepSeek 风格全屏，#loginOverlay.landing） ===== */
/* 基础 .login-overlay 仍是给「添加孩子」弹窗用的半透明遮罩；.landing 变体改为不透明全屏首屏 */
.login-overlay.landing {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 100vh; overflow-y: auto;
  background: linear-gradient(180deg, #eef2fb 0%, #f7f9fd 100%);
  backdrop-filter: none;
}
/* 关键修复：.login-overlay.landing 与 .login-overlay[hidden] 特异性相同(0,2,0)，
   .landing 后定义会覆盖 [hidden] 的 display:none，导致 hideLogin() 设了 hidden=true
   浮层仍 display:block 盖在最上层（登录成功却看不到应用）。给带 [hidden] 的变体提一档
   特异性(0,3,0)，确保 hidden 时真正隐藏。 */
.login-overlay.landing[hidden] { display: none; }
.landing-inner {
  position: relative; box-sizing: border-box;
  width: 100%; max-width: 720px; margin: 0 auto;
  min-height: 100vh; padding: 40px 20px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
/* 品牌 LOGO + 文字：绝对定位在主体区顶沿正上方 40px（主体区 position:relative 为锚点） */
.landing-brand {
  position: absolute; left: 50%; transform: translateX(-50%);
  bottom: 100%; margin-bottom: 40px;
  text-align: center; display: flex; flex-direction: column; align-items: center; gap: 4px;
}
/* 表单卡片 + 底部协议：作为一个整体在竖直方向居中；
   position:relative 让上方品牌区可相对其顶沿绝对定位 */
.landing-main {
  position: relative;
  width: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 30px;
}
.brand-logo {
  width: 56px; height: 56px; border-radius: 16px;
  background: linear-gradient(135deg, #3b6fe0, #5b8def);
  color: #fff; font-size: 28px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 20px rgba(59,111,224,0.28);
}
.brand-logo-img {
  width: 240px; height: auto; display: block;
}
.brand-name { margin: 0; font-size: 26px; color: #1f2a44; letter-spacing: 1px; }
.brand-sub { margin: 0; font-size: 14px; color: #6b7689; }

.landing-body {
  width: 100%; display: flex; align-items: stretch; justify-content: center;
  background: #fff; border-radius: 18px; padding: 28px;
  box-shadow: 0 14px 40px rgba(31,42,68,0.10);
}
.landing-form { flex: 1 1 0; display: flex; flex-direction: column; gap: 12px; }
.phone-row { display: flex; align-items: stretch; gap: 0; }
.phone-prefix {
  flex: 0 0 auto; padding: 0 12px; display: flex; align-items: center;
  border-radius: 10px 0 0 10px; background: #eef2fb; color: #44506a; font-size: 15px;
  border: 1px solid #d8dee9; border-right: none;
}
.phone-row input { border-radius: 0 10px 10px 0; flex: 1; }
.landing-divider {
  flex: 0 0 1px; align-self: stretch; margin: 0 28px; position: relative; background: #e6ebf3;
}
.landing-divider span {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  background: #fff; padding: 0 8px; color: #97a0b0; font-size: 12px;
}
.landing-wx { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; }
.wx-qr {
  width: 150px; height: 150px; border-radius: 14px; border: 1px solid #e6ebf3;
  background: #f6fbf4; display: flex; align-items: center; justify-content: center;
}
.wx-qr-placeholder {
  width: 100px; height: 100px; border-radius: 10px; background: #eafff0;
  display: flex; align-items: center; justify-content: center;
}
.wx-label { margin: 0; font-size: 14px; color: #2b3a55; font-weight: 600; }
.wx-tip { margin: 0; font-size: 12px; color: #97a0b0; }

.landing-footer {
  width: 100%; max-width: 560px; text-align: center;
  font-size: 12px; color: #97a0b0; line-height: 1.7;
}
.landing-footer .lnk { color: #5b8def; text-decoration: none; }
.landing-footer .lnk:hover { text-decoration: underline; }

/* 移动端：左右分栏改为上下堆叠，竖向分隔线改为横向 */
@media (max-width: 560px) {
  .landing-inner {
    min-height: 100dvh;
    padding: 16px 16px max(16px, env(safe-area-inset-bottom));
    justify-content: flex-start;
  }
  /* 品牌区改回文档流，避免绝对定位 top 被推出小屏视口 */
  .landing-brand {
    position: static;
    transform: none;
    margin: 10px 0 16px;
  }
  .brand-logo-img { width: 160px; }
  .brand-sub { font-size: 13px; }
  .landing-main { width: 100%; gap: 16px; }
  .landing-body { flex-direction: column; padding: 18px; gap: 16px; }
  .landing-divider { flex: 0 0 1px; width: 100%; align-self: auto; margin: 4px 0; }
  .landing-wx { padding-top: 4px; }
  /* 底部协议加安全区，避免被手机手势条/导航栏遮挡 */
  .landing-footer {
    max-width: 100%;
    padding-bottom: max(12px, env(safe-area-inset-bottom));
    font-size: 11px;
    line-height: 1.6;
  }
}

/* ============================================================
   移动端适配（主聊天界面）：窄屏下侧边栏改为抽屉式，聊天区满宽。
   断点 768px 与 app.js initSideToggle 中的 matchMedia 保持一致；
   桌面端布局不变，仅在此断点内覆盖。
   ============================================================ */
@media (max-width: 768px) {
  /* 动态视口高度，避开移动端浏览器地址栏导致的高度跳动 / 底部被遮挡 */
  .app { height: 100vh; height: 100dvh; }

  /* 侧边栏：脱离 flex 流，固定为左侧抽屉，默认移出屏幕左侧 */
  .side {
    position: fixed; top: 0; bottom: 0; left: 0; z-index: 200;
    width: min(70vw, 320px);
    background: var(--panel);
    transform: translateX(-100%);
    transition: transform .25s ease;
    box-shadow: 4px 0 24px rgba(15,23,42,.18);
  }
  /* 覆盖桌面端 .side-collapsed 对 .side 的 width:0 / opacity:0 处理：
     移动端抽屉始终全宽、可见尺寸，显隐只由 transform 控制 */
  .app.side-collapsed .side {
    width: min(70vw, 320px); padding: 6px 18px 18px;
    border-right: 1px solid var(--border); opacity: 1; overflow: hidden;
  }
  /* 打开抽屉 */
  .app.side-open .side { transform: translateX(0); }

  /* 抽屉整体不滚动：滚动只发生在目录树内部，顶部/底部按钮固定 */
  .side { overflow: hidden; }
  .side-top { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; overflow: hidden; }

  /* 仅目录树内部滚动：在 .side-top 的剩余高度里撑满并滚动。
     覆盖桌面端 #chapterTree 的固定 height:400px，避免移动端把底部按钮顶上去/遮挡 */
  .tree, #chapterTree { height: auto; flex: 1 1 auto; min-height: 0; max-height: none;
          overflow-y: auto; -webkit-overflow-scrolling: touch;
          touch-action: pan-y; overscroll-behavior: contain; }
  /* #chapterTree 桌面端写死 height:400px + flex-shrink:0，ID 优先级更高，必须显式覆盖 */
  #chapterTree { height: auto !important; flex-shrink: 1 !important; }

  /* 遮罩层（点击关闭） */
  #sideMask { position: fixed; inset: 0; background: rgba(15,23,42,.52);
    opacity: 0; visibility: hidden; transition: opacity .22s ease, visibility .22s ease; z-index: 150;
    pointer-events: none; }
  #sideMask.show { opacity: 1; visibility: visible; pointer-events: auto; }

  /* 移动端侧栏顶部工具栏：隐藏"返回对话"，点击遮罩或侧栏内按钮仍可关闭抽屉 */
  .side-close { display: none; }

  /* 移动端聊天区顶部：用汉堡菜单替换原来的收起/展开图标 */
  .chat-header .side-toggle .icon-menu { display: block; }
  .chat-header .side-toggle .icon-collapse,
  .chat-header .side-toggle .icon-expand,
  .side-collapsed .chat-header .side-toggle .icon-collapse,
  .side-collapsed .chat-header .side-toggle .icon-expand { display: none; }

  /* 聊天区占满全宽；顶部栏 / 内容列收窄边距 */
  .chat-header { padding: 10px 12px; }
  .chat-title { font-size: 14px; }
  .chat-inner { padding: 14px 12px 6px; }
  .composer-wrap { padding: 0 12px calc(12px + env(safe-area-inset-bottom)); }
  /* 移动端输入框更矮：min-height 104px -> 60px，并收紧 .composer 上下内边距 */
  .composer { padding: 8px 10px; }
  .composer textarea, .composer .editor { min-height: 60px; }
  .formula-bar { padding-left: 12px; padding-right: 12px; }
  /* 移动端：把独立麦克风和模式胶囊隐藏，换成「左侧模式选择 + 右侧语音输入」组合胶囊 */
  .composer-tools .tool-center #mic,
  .composer-tools .tool-right #modeTrigger { display: none; }
  .composer-tools .tool-center .mobile-action-capsule.mobile-only { display: flex; }

  /* 移动端工具栏三栏：左右按内容宽度，中间胶囊占满「+」与「发送」之间的全部空间 */
  .composer-tools .tool-left { flex: 0 0 auto; }
  .composer-tools .tool-center { flex: 1 1 auto; padding: 0 8px; }
  .composer-tools .tool-right { flex: 0 0 auto; }

  .mobile-action-capsule {
    display: flex;
    align-items: center;
    width: 100%;
    height: 40px;
    background: var(--panel);
    border: 1px solid var(--color-border-secondary);
    border-radius: 24px;
    overflow: hidden;
  }
  .mobile-action-capsule .mode-part {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex: 1 1 0;
    min-width: 0;
    height: 100%;
    padding: 0 10px;
    border: none;
    border-radius: 24px 0 0 24px;
    background: transparent;
    color: var(--ink);
    font-size: 13px;
    white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; -webkit-user-select: none; user-select: none;
  }
  .mobile-action-capsule .mode-part:active { background: var(--brand-soft); }
  .mobile-action-capsule .mode-part-icon { font-size: 14px; line-height: 1; }
  .mobile-action-capsule .mode-part-name { max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
  .mobile-action-capsule .mode-part-caret { width: 14px; height: 14px; flex: 0 0 auto; }
  .mobile-action-capsule .mic-part {
    flex: 1 1 0;
    min-width: 0;
    height: 100%;
    border: none;
    border-radius: 0 24px 24px 0;
    background: transparent;
    color: var(--ink);
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; -webkit-user-select: none; user-select: none;
    touch-action: none;
  }
  .mobile-action-capsule .mic-part:hover { background: var(--brand-soft); color: var(--ink); }
  .mobile-action-capsule .mic-part svg { width: 20px; height: 20px; }
  .mobile-action-capsule .mic-part.recording { background: #e03131; animation: mic-pulse 1.1s ease-in-out infinite; }
  .mobile-action-capsule .mic-part.busy { background: #868e96; color: #fff; cursor: progress; }
  .mobile-action-capsule .mic-part.cancel { background: #ffe3a3; color: #874d00; }

  /* 相机弹层移动端竖向全屏：去掉圆角、占满视口，预览区 flex 撑满剩余空间，
     video 用 object-fit: cover 去掉黑边，比例接近手机竖屏 9:16 */
  .camera-modal { padding: 0; }
  .camera-modal-inner { max-width: 100%; width: 100%; height: 100%; border-radius: 0;
    display: flex; flex-direction: column; }
  .camera-stage { flex: 1 1 auto; min-height: 0; aspect-ratio: auto; }
  .camera-stage video { object-fit: cover; }
  .camera-actions { padding: 12px 12px calc(12px + env(safe-area-inset-bottom)); }

  /* 移动端隐藏独立的相机按钮：点击上传图片时，系统原生选择器已提供「相机」选项，
     底部再保留一个相机按钮属于重复入口；桌面端仍需要它（上传图片只能选本地文件） */
  #cameraBtn { display: none; }

  /* 移动端隐藏公式符号按钮/面板：屏幕窄、触屏点符号体验差，释放工具栏空间 */
  .formula-bar .fb-toggle,
  .formula-bar.open .fb-toggle,
  .fb-panel { display: none; }

  /* 通道栏：移动端单行横滑，避免换行挤占竖向空间 */
  .channel-bar { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px;
    -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .channel-bar::-webkit-scrollbar { display: none; }
  .channel-bar .ch-label { flex: 0 0 auto; }
  .channel-bar .ch-btn { flex: 0 0 auto; }

  /* 右侧抽屉（学情画像 / 复习计划）：移动端全宽铺满 */
  .drawer-mask { left: 0; }
  .drawer { left: 0; width: 100%; border-right: none; }

  /* 系统设置：移动端改成底部全屏 Sheet（原生 App 风格）
     桌面端仍是左侧 Tab + 右侧内容的居中弹窗，此处只覆盖移动端 */
  .settings-overlay { align-items: flex-end; background: rgba(0,0,0,.5); }
  .settings-card {
    width: 100%; max-width: 100%;
    /* 不能用 92vh：移动端浏览器地址栏会吃掉顶部空间，导致 Sheet 顶部的标题/关闭按钮被盖住。
       85vh 留出顶部遮罩，系统设置标题和关闭按钮就能露出来；dvh 动态单位做现代浏览器兼容。 */
    height: 85vh; max-height: 85vh;
    height: 85dvh; max-height: 85dvh;
    border-radius: 18px 18px 0 0;
    animation: sheetUp .28s ease;
    padding-top: env(safe-area-inset-top);
  }
  .sheet-handle {
    display: block;
    width: 52px; height: 6px;
    background: var(--muted);
    border-radius: 3px;
    margin: 10px auto 8px;
    opacity: 0.55;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .settings-head {
    padding: 10px 16px 10px;
    flex-shrink: 0;
    background: var(--panel);
    border-bottom: 1px solid var(--border);
    min-height: 48px;
  }
  .settings-head h2 { font-size: 17px; font-weight: 700; }
  .settings-close { display: none; }
  .settings-close.mobile-only {
    display: inline-block;
    width: auto; height: auto;
    padding: 5px 12px;
    border-radius: 10px;
    font-size: 14px; font-weight: 600;
    color: var(--brand);
    background: var(--brand-soft);
    line-height: 1.4;
  }
  .settings-close.mobile-only:active { opacity: 0.75; }
  .settings-footer { display: none; }
  .settings-footer.mobile-only {
    display: flex;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--border);
    background: var(--panel);
    flex-shrink: 0;
  }
  .settings-close-bottom {
    width: 100%;
    padding: 12px;
    border: none;
    border-radius: 12px;
    background: var(--brand);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
  }
  .settings-close-bottom:active { opacity: 0.85; }
  .settings-body { flex-direction: column; }
  .settings-tabs {
    width: 100%; flex-direction: row; flex-wrap: nowrap;
    border-right: none; border-bottom: 1px solid var(--border);
    padding: 0 4px; gap: 0; overflow-x: auto;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .settings-tabs::-webkit-scrollbar { display: none; }
  .settings-tab {
    flex: 1 0 auto; text-align: center; white-space: nowrap;
    padding: 13px 14px; font-size: 14px; border-radius: 0;
  }
  .settings-tab.active {
    background: transparent; color: var(--brand);
    font-weight: 700; border-bottom: 2px solid var(--brand);
  }
  .settings-content {
    padding: 18px 16px calc(20px + env(safe-area-inset-bottom));
  }

  /* 练习边栏：窄屏转底部抽屉，默认收起（从底部升起），不挤压主对话区 */
  .practice-panel {
    position: fixed; left: 0; right: 0; bottom: 0;
    width: 100% !important;
    height: 82vh; height: 82dvh;
    transform: translateY(100%);
    transition: transform .25s ease;
    z-index: 210;
    border-left: none;
    border-top: 1px solid var(--border, #e3e6ee);
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -6px 24px rgba(15,23,42,.2);
  }
  .practice-panel.practice-open { width: 100% !important; transform: translateY(0); }
  .practice-panel.practice-collapsed { transform: translateY(100%); }
  /* 移动端不显示手动重开入口：避免与底部输入区重叠；练习触发时面板会自动从底部升起 */
  .practice-panel.practice-collapsed .pp-reopen { display: none; }

  /* 移动端教学模式选择：改为底部 Sheet，与设置/练习区抽屉风格一致 */
  .mode-panel {
    left: 0; right: 0; bottom: 0; top: auto;
    width: 100%; max-width: none;
    border-radius: 16px 16px 0 0;
    transform: translateY(100%) scale(1);
    transform-origin: bottom center;
    max-height: 70vh; min-height: auto;
    padding: 0 0 calc(env(safe-area-inset-bottom));
    box-sizing: border-box;
    transition: transform .2s ease, opacity .16s ease;
    box-shadow: 0 -6px 24px rgba(15,23,42,.2);
  }
  .mode-panel.open { transform: translateY(0) scale(1); }
  .mode-panel-header {
    padding: 14px 16px 10px; font-size: 15px; font-weight: 700;
    color: var(--ink); text-align: center;
  }
  .mode-options { padding: 0 12px; }
  .mode-option { padding: 12px 14px; border-radius: 12px; }
  .mode-opt-name { font-size: 14.5px; }
  .mode-opt-desc { font-size: 12px; }

  /* 移动端思维导图放大：顶部只保留关闭按钮，其余缩放/比例/标题隐藏 */
  .mm-bar { background: rgba(0,0,0,.45); padding: 8px 12px; }
  .mm-bar .mm-title { display: none; }
  .mm-bar .mm-tools { width: 100%; justify-content: flex-end; gap: 0; }
  .mm-bar .mm-tools button:not(#mmClose),
  .mm-bar .mm-tools #mmZoomLabel { display: none; }
  .mm-bar .mm-tools #mmClose { min-width: 44px; height: 44px; font-size: 22px; border-radius: 10px; }
}

/* ===== 本章真题视图（#gkView 复用 .mistake-view 外壳）===== */
/* 横向 margin 归零：卡片由外层 .mv-inner（max-width: --content-max + padding）统一约束宽度，
   与错题卡 .card.mistake 处在同一条阅读列、同宽；旧的 14px 侧边距会让真题卡比错题卡窄 28px。 */
.gk-q { background: var(--bot); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; margin: 10px 0; }
.gk-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 8px; }
.gk-badge { font-size: 12px; line-height: 1; padding: 4px 8px; border-radius: 999px; background: var(--panel); border: 1px solid var(--border); color: var(--muted); }
.gk-badge.year { background: #eef4ff; border-color: #cfe0ff; color: #2b6cb0; font-weight: 600; }
.gk-badge.type { background: #fef3e7; border-color: #fbe0c2; color: #c8741a; }
.gk-badge.conf { background: #eafaf0; border-color: #c8ecd6; color: #2f7a4a; }
/* 主考点：命中当前浏览章/节的锚点。章节标题可能很长，超出用省略号，完整信息靠 title 悬浮。 */
.gk-badge.anchor-main { background: #e6f7f4; border-color: #bfe8df; color: #0f6e56; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 综合题：本题还锚定了其他章/册。cursor:help 提示可悬浮查看兼考点明细。 */
.gk-badge.anchor-multi { background: #f3edff; border-color: #ddd0f7; color: #6b46c1; cursor: help; }
.gk-badge.anchor-pure { background: var(--panel); color: var(--muted); }
html[data-theme="dark"] .gk-badge.year { background: #1e2a3a; color: #8fc1ff; }
html[data-theme="dark"] .gk-badge.type { background: #2e2418; color: #f0b372; }
html[data-theme="dark"] .gk-badge.conf { background: #16271d; color: #8fe0ad; }
html[data-theme="dark"] .gk-badge.anchor-main { background: #10312a; border-color: #1d6a58; color: #6fd3b4; }
html[data-theme="dark"] .gk-badge.anchor-multi { background: #241a3a; border-color: #4a3670; color: #c0a5f0; }
/* ===== 高考真题库筛选器（紧凑版）=====
   旧版是 5 行 chips，模块/年份占空间过大。新版：
   - 模块：只露前 5 个高频 chip，其余通过「+ N 个」展开；
   - 题型/四翼/难度：改用下拉 <select>；
   - 年份：改为「起–止」两个下拉；
   - 清空按钮与结果计数集中到一行。
   这样筛选器从 5 行压缩到 3 行，且视觉层级更清楚。 */
.gkb-filters { border-bottom: 1px solid var(--border); background: var(--chat-bg); }
/* 新增：默认折叠。常驻一行 header（筛选 + 条件摘要 + 展开），body 用 grid 0fr/1fr 做高度动画。 */
.gkb-filters[hidden] { display: none; }   /* display:flex 会盖掉 UA 的 [hidden]，同类真题入口靠它隐藏 */
.gkb-filters-header {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; cursor: pointer; user-select: none;
}
.gkb-filters-header:hover .gkb-filters-toggle { color: var(--ink); border-color: var(--muted); }
.gkb-filters-header:focus-visible { outline: 2px solid var(--brand); outline-offset: -2px; }
.gkb-filters-title { flex: 0 0 auto; font-size: 12px; font-weight: 600; color: var(--ink); }
.gkb-filters-summary {
  flex: 1 1 auto; min-width: 0; font-size: 12px; color: var(--muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gkb-filters.has-filter .gkb-filters-summary { color: var(--ink); }
.gkb-filters-clear {
  flex: 0 0 auto; font-size: 12px; line-height: 1; padding: 4px 9px;
  border-radius: 999px; background: transparent; border: 1px solid var(--border);
  color: var(--muted); cursor: pointer;
}
.gkb-filters-clear:hover { color: #c0392b; border-color: #c0392b; }
.gkb-filters-clear[hidden] { display: none; }
.gkb-filters-toggle {
  flex: 0 0 auto; font-size: 12px; line-height: 1; padding: 4px 9px;
  border-radius: 999px; background: transparent; border: 1px solid var(--border);
  color: var(--muted); white-space: nowrap;
  transition: color .15s ease, border-color .15s ease;
}
.gkb-filters-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .22s ease; }
.gkb-filters-inner {
  min-height: 0; overflow: hidden;
  display: flex; flex-direction: column; gap: 8px;
  /* 只留左右内边距：底部留白放到最后一行内部，折叠时随内容一起被 overflow 裁掉，
     否则 inner 自身的 padding 是硬性最小值，0fr 也压不到 0（会残留 10px）。 */
  padding: 0 14px;
}
.gkb-filters.expanded .gkb-filters-body { grid-template-rows: 1fr; }
@media (prefers-reduced-motion: reduce) {
  .gkb-filters-body { transition: none; }
}
.gkb-row { display: flex; align-items: center; gap: 8px; }
.gkb-row-modules { flex-wrap: wrap; }
.gkb-label { flex: 0 0 auto; font-size: 12px; color: var(--muted); }
.gkb-chips { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; min-width: 0; }
.gkb-chip { font-size: 12px; line-height: 1; padding: 5px 9px; border-radius: 999px; background: var(--panel); border: 1px solid var(--border); color: var(--ink); cursor: pointer; display: inline-flex; align-items: center; gap: 4px; }
.gkb-chip:hover { border-color: var(--muted); }
.gkb-chip.active { background: #e6f7f4; border-color: #bfe8df; color: #0f6e56; }
.gkb-chip .gkb-n { font-size: 11px; color: var(--muted); }
.gkb-chip.active .gkb-n { color: #0f6e56; }
.gkb-more { font-size: 12px; line-height: 1; padding: 5px 9px; border-radius: 999px; background: transparent; border: 1px dashed var(--border); color: var(--muted); cursor: pointer; }
.gkb-more:hover { color: var(--ink); border-color: var(--muted); }

/* 下拉控件行：题型 / 四翼 / 难度 / 年份起止 / 清空 */
.gkb-row-ctrls { flex-wrap: wrap; align-items: center; gap: 10px; }
.gkb-selectbox { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.gkb-selectbox select { font-size: 12px; padding: 5px 8px; border-radius: 8px; border: 1px solid var(--border); background: var(--panel); color: var(--ink); cursor: pointer; }
.gkb-yearbox { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.gkb-yearbox select { font-size: 12px; padding: 5px 8px; border-radius: 8px; border: 1px solid var(--border); background: var(--panel); color: var(--ink); cursor: pointer; min-width: 80px; }
.gkb-yearbox .gkb-dash { color: var(--muted); }
.gkb-reset { font-size: 12px; padding: 5px 10px; border-radius: 8px; background: transparent; border: 1px solid var(--border); color: var(--muted); cursor: pointer; margin-left: auto; }
.gkb-reset:hover { color: var(--ink); border-color: var(--muted); }

/* 信息行：当前筛选条件 + 结果计数 */
.gkb-row-info { justify-content: space-between; gap: 12px; font-size: 12px; padding-bottom: 10px; }
.gkb-tip { color: var(--muted); line-height: 1.5; }
.gkb-count { flex: 0 0 auto; color: var(--ink); font-weight: 500; }
.gkb-dim { font-size: 12px; color: var(--muted); line-height: 1.5; }

html[data-theme="dark"] .gkb-chip.active { background: #10312a; border-color: #1d6a58; color: #6fd3b4; }
html[data-theme="dark"] .gkb-chip.active .gkb-n { color: #6fd3b4; }
html[data-theme="dark"] .gkb-filters-clear:hover { color: #ff8a80; border-color: #ff8a80; }

/* 同类真题推荐（错题入口）：本章真题 / 更多变式 两个分组 */
.gkb-group { margin: 8px 0 18px; }
.gkb-group-h {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 13px 16px;
  margin: 0 0 12px;
  background: var(--panel);
  border-left: 4px solid var(--brand);
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
}
.gkb-group-h-module { border-left-color: #8b5cf6; }
.gkb-group-sub {
  font-size: 12px;
  font-weight: 400;
  color: var(--muted);
  line-height: 1.4;
}
html[data-theme="dark"] .gkb-group-h { background: var(--panel); box-shadow: 0 1px 3px rgba(0,0,0,0.25); }
html[data-theme="dark"] .gkb-group-h-module { border-left-color: #a78bfa; }

/* 窄屏：模块 chip 行允许换行，下拉行也换行 */
@media (max-width: 640px) {
  .gkb-filters-header { gap: 8px; padding: 9px 12px; }
  .gkb-filters-inner { padding: 0 12px; }   /* 同样不能带 padding-bottom，否则折叠残留高度 */
  .gkb-row-modules { flex-direction: column; align-items: flex-start; gap: 6px; }
  .gkb-row-ctrls { gap: 8px; }
  .gkb-reset { margin-left: 0; }
  .gkb-row-info { flex-direction: column; gap: 2px; }
}
/* 分页追加的触底哨兵：滚动接近它时自动渲染下一批题卡 */
.gk-page-sentinel { padding: 14px 0 4px; }
.gk-page-sentinel.loading-center { padding: 18px 0 30px; }
.gk-page-end { text-align: center; font-size: 12px; color: var(--muted); }
.gk-q .qw-stem { font-weight: 500; }
.gk-q .q-figures { margin: 10px 0; }
/* 真题插图宽度由 <img width=...> 属性提供：图片加载完成前即按固有宽高比预留高度，
   滚动时逐张进视口不再触发整容器 reflow。故这两条规则绝不能再写 width:auto —— 那会
   覆盖掉属性宽度、让预留高度失效（真题库滚动卡顿第二刀的配套约束）。 */
.gk-q .q-figures img.gk-fig { display: block; max-width: min(100%, 640px); height: auto; margin: 6px 0; border: 1px solid var(--border); border-radius: 10px; background: #fff; }
html[data-theme="dark"] .gk-q .q-figures img.gk-fig { background: #0d1117; }
/* 题干内联插图：紧跟「图(a)」所在行下方，居中、略收窄，避免喧宾夺主 */
.gk-q .qw-stem img.gk-fig-inline { display: block; max-width: min(100%, 440px); height: auto; margin: 10px auto; border: 1px solid var(--border); border-radius: 10px; background: #fff; }
html[data-theme="dark"] .gk-q .qw-stem img.gk-fig-inline { background: #0d1117; }
.gk-q .qw-stem .gk-fig-cap { display: block; text-align: center; font-size: 12px; line-height: 1.4; color: var(--muted); margin: 2px auto 12px; }
html[data-theme="dark"] .gk-q .qw-stem .gk-fig-cap { color: #8b949e; }
.gk-toggle { margin-top: 10px; }
.gk-answer { margin-top: 10px; border-top: 1px dashed var(--border); padding-top: 10px; }
.gk-answer[hidden] { display: none; }
.gk-answer .q-exp, .gk-answer .q-fb { margin-top: 6px; }
.gk-ans-label { font-weight: 600; color: var(--ink); }
.gk-empty { padding: 40px 16px; text-align: center; color: var(--muted); }

/* 真题选项：每行一个，不再前缀“选项”、不再用分号 */
.gk-options { margin: 10px 0 6px; display: flex; flex-direction: column; gap: 6px; }
.gk-opt { display: flex; align-items: baseline; gap: 6px; line-height: 1.55; }
.gk-opt-label { font-weight: 600; color: var(--ink); flex-shrink: 0; min-width: 1.3em; }
.gk-opt-text { color: var(--ink); }
.gk-options-missing { color: var(--muted); font-size: 13px; }

/* 高考真题选项为图片时使用带 A/B/C/D 标签的网格 */
.gk-opt-figs { margin: 10px 0 6px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.gk-opt-fig { display: flex; flex-direction: column; gap: 6px; padding: 10px; background: var(--panel); border: 1px solid var(--border); border-radius: 8px; }
.gk-opt-fig-label { font-weight: 600; color: var(--ink); font-size: 15px; }
.gk-opt-fig img { max-width: 100%; height: auto; border-radius: 4px; }
@media (max-width: 480px) {
  .gk-opt-figs { grid-template-columns: 1fr; }
}
html[data-theme="dark"] .gk-opt-fig { background: var(--bot); border-color: var(--border); }
html[data-theme="dark"] .gk-opt-fig-label { color: var(--ink); }
.gk-answer .analysis-figs { margin-top: 10px; }