/* ============================================================
 * 创归思伴学 · 学生端宽屏设计系统 v3（desktop.css）
 * 设计参考：Linear 2026 refresh + Notion 设计令牌
 *   · 侧栏比主区暗一档（Linear 原则："让主区成为视觉焦点"）
 *   · 行高紧凑 28-32px、padding 6-8px（Linear）
 *   · 字号节奏：Inter Display 标题 + Inter 正文，tracking -0.033em（Notion）
 *   · 圆角统一 4 / 8 / 12 / 999（不用 22-30px 大圆角）
 *   · 边线对比降低（rgba(0,0,0,0.08) 而非纯黑 1px）
 *   · active = bg + 2px 紫竖条 + 600 weight（Linear）
 *   · 95% 中性暖灰 + 5% 紫青 accent（仅用于关键强调）
 * 视觉符号：紫青双色 + 小伴在场（沿用 v0.1 概念稿）
 * 红线：离线优先 · 不喂答案 · 不渲染差生标签 · 禁自动关机 · REGISTRY=57
 * 与 style.css（client.html）/ site.css（官网）完全隔离
 * ============================================================ */
/* ============================================================
 * 离线圆体字（direction A 增强 · 不引 CDN）
 *   · 标题 Baloo 2（圆润饱满） · 正文 Quicksand（柔和圆体）
 *   · 中文 fallback 仍走系统圆润字（PingFang SC / 微软雅黑）
 *   · 仅引用本地 woff2，离线优先、无外链
 * ============================================================ */
@font-face{font-family:"Baloo 2";font-style:normal;font-weight:600;font-display:swap;
  src:url("fonts/baloo-2-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Baloo 2";font-style:normal;font-weight:700;font-display:swap;
  src:url("fonts/baloo-2-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Baloo 2";font-style:normal;font-weight:800;font-display:swap;
  src:url("fonts/baloo-2-latin-800-normal.woff2") format("woff2")}
@font-face{font-family:"Quicksand";font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/quicksand-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Quicksand";font-style:normal;font-weight:500;font-display:swap;
  src:url("fonts/quicksand-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Quicksand";font-style:normal;font-weight:600;font-display:swap;
  src:url("fonts/quicksand-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Quicksand";font-style:normal;font-weight:700;font-display:swap;
  src:url("fonts/quicksand-latin-700-normal.woff2") format("woff2")}

:root{
  /* 奶油底 + 蜜桃粉/天空蓝/薄荷绿 · 多巴胺萌系（direction A） */
  --bg:#FFF6F0;                       /* 暖奶油底，告别纯白冷淡 */
  --surface:#FFFFFF;
  --surface-2:#FBEFF4;                /* 浅蜜桃粉表面 */
  --surface-3:#F6E1EC;                /* 略深粉，用于嵌套 */
  --sidebar-bg:#FCEEF4;               /* 浅粉侧栏，萌系友好 */
  --sidebar-border:rgba(40,30,38,.05);
  --ink:rgba(40,30,38,.95);           /* 暖墨，不用冷黑 */
  --ink-2:rgba(40,30,38,.62);
  --ink-3:rgba(40,30,38,.45);
  --ink-4:rgba(40,30,38,.18);
  --hair:rgba(40,30,38,.08);
  --hair-strong:rgba(40,30,38,.12);
  --hair-soft:rgba(40,30,38,.04);

  /* 品牌紫主色（v12 设计师定稿 2026-08-20：全站换紫系，原热粉位） */
  --purple:#8B6FE8;                   /* 品牌紫 = 主操作色（v12 --brand） */
  --purple-d:#6C51C4;
  --purple-l:rgba(139,111,232,.10);
  --purple-l-2:rgba(139,111,232,.16);
  --brand:#8B6FE8;                    /* v12 token：品牌紫 */
  --brand-deep:#6C51C4;               /* v12 token：深紫（hover） */
  --brand-soft:#F1EDFD;               /* v12 token：浅紫底 */
  --accent:#D9357A;                   /* v12 token：玫红 CTA（主按钮"让小伴开讲"） */
  --cyan:#2BB6A8;                     /* 薄荷青（原青位） */
  --cyan-d:#1E968C;
  --cyan-l:rgba(43,182,168,.12);

  /* 状态色（糖果感，降饱和攻击性） */
  --green:#34B26B;
  --amber:#F0A33B;
  --red:#EC5A6E;

  /* 圆角（放大阶梯 · 萌系软润） */
  --r-xs:10px; --r-sm:12px; --r-md:16px; --r-lg:22px; --r-pill:999px;

  /* 投影（柔和粉色弥散 · claymorphism 软 3D） */
  --shadow-sm:0 0 0 1px var(--hair);
  --shadow:0 1px 2px rgba(40,30,38,.05),0 8px 20px -12px rgba(226,83,143,.28);
  --shadow-lg:0 2px 6px rgba(40,30,38,.06),0 22px 48px -18px rgba(226,83,143,.32);

  /* 字号节奏（Linear + Notion · heading tracking -0.033em） */
  --fs-xs:11px; --fs-sm:13px; --fs-base:15px; --fs-md:15px;
  --fs-lg:17px; --fs-xl:22px; --fs-2xl:28px; --fs-3xl:36px; --fs-4xl:48px;

  /* 行高（Linear · 紧凑 1.2 / 阅读 1.5 / 列表 1.4） */
  --lh-tight:1.2; --lh-snug:1.35; --lh-normal:1.5; --lh-loose:1.65;

  /* 字距（Notion · 标题紧凑） */
  --tr-tight:-0.033em; --tr-snug:-0.01em; --tr-normal:0; --tr-wide:0.04em;

  /* 字体栈（系统字体优先：Baloo2/Quicksand woff2 未随包分发，移除引用防 404；中文字体回退） */
  --font-display:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif,"Hiragino Sans GB",system-ui,sans-serif;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif,"Hiragino Sans GB",system-ui,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,"JetBrains Mono",Menlo,Consolas,monospace;

  /* 微交互 · 多巴胺弹性反馈（direction A） */
  --ease-pop:cubic-bezier(.34,1.56,.64,1);
}
.btn,.chip,.inset,.subj,.orb,.rec-row,.action-card{
  transition:transform .2s var(--ease-pop),box-shadow .2s ease,background .2s ease,border-color .2s ease;
}
.btn:active{transform:scale(.95)}
.btn.pri:hover{box-shadow:0 8px 18px -6px rgba(226,83,143,.55)}
.chip:hover,.inset:hover,.subj:hover,.orb:hover,.rec-row:hover,.action-card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 22px -12px rgba(226,83,143,.4);
}
@keyframes czs-pop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.14)}100%{transform:scale(1);opacity:1}}
.czs-pop{animation:czs-pop .44s var(--ease-pop) both}
@media (prefers-reduced-motion:reduce){
  .btn,.chip,.inset,.subj,.orb,.rec-row,.action-card{transition:none}
  .btn:active{transform:none}
  .czs-pop{animation:none}
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:var(--font);background:var(--bg);color:var(--ink);line-height:var(--lh-normal);
  font-size:var(--fs-base);min-height:100vh;overflow-x:hidden;
  font-feature-settings:"cv11","ss01","ss03","cv02"}
a{color:inherit;text-decoration:none}
button{font-family:inherit}

/* ============================================================
 * 布局 · 左侧 fixed sidebar（Linear 风格 · 暗侧栏让主区成为焦点）
 * ============================================================ */
.app-layout{display:block;min-height:100vh;width:100%}

/* ============================================================
 * 左侧菜单（fixed · Linear 紧凑 · 暗一档 · 不抢主区注意力）
 * ============================================================ */
.side-menu{position:fixed;top:0;left:0;width:260px;height:100vh;overflow-y:auto;
  background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);
  padding:14px 10px 24px;display:flex;flex-direction:column;gap:1px;z-index:50}
.side-menu::-webkit-scrollbar{width:4px}
.side-menu::-webkit-scrollbar-thumb{background:var(--ink-4);border-radius:99px}

/* wordmark 区域（去掉公仔占位 · Linear 风格纯 wordmark + 微小副标） */
.brand{display:flex;align-items:center;gap:10px;padding:8px 10px 14px;margin-bottom:6px}
.brand-dot{width:22px;height:22px;border-radius:var(--r-sm);flex:none;
  background:linear-gradient(135deg,var(--purple),var(--cyan));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.brand-txt b{display:block;font-size:17px;font-weight:700;color:var(--ink);
  letter-spacing:var(--tr-snug);line-height:var(--lh-tight)}
.brand-txt span{display:block;font-size:11px;color:var(--ink-3);
  margin-top:2px;letter-spacing:var(--tr-wide);text-transform:uppercase;font-weight:500}

.status-row{display:flex;align-items:center;gap:6px;margin:0 4px 14px}
.status-pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:500;color:var(--ink-2);
  background:var(--surface);border:1px solid var(--hair);padding:3px 9px;border-radius:var(--r-pill);
  letter-spacing:var(--tr-wide);text-transform:uppercase}
.status-pill .dot{width:5px;height:5px;border-radius:50%;background:var(--green);animation:pulse 2.4s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.theme-btn{margin-left:auto;border:1px solid var(--hair);background:transparent;color:var(--ink-2);
  width:26px;height:26px;border-radius:var(--r-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .12s,color .12s,border-color .12s}
.theme-btn:hover{background:var(--surface);color:var(--ink);border-color:var(--hair-strong)}
.theme-btn svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
/* [陪学模式20260903] 侧栏陪学开关：默认描边态，开启=品牌紫青渐变填充 */
.coach-toggle{display:inline-flex;align-items:center;gap:4px;margin-left:6px;border:1px solid var(--hair);background:transparent;color:var(--ink-2);
  border-radius:9px;padding:4px 9px;font-size:11px;font-weight:600;cursor:pointer;transition:background .15s,color .15s,border-color .15s,box-shadow .15s}
.coach-toggle:hover{background:var(--surface);color:var(--ink);border-color:var(--hair-strong)}
.coach-toggle svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.coach-toggle .ct-txt{line-height:1}
.coach-toggle.on{background:linear-gradient(135deg,#6D5EFC,#28C2C8);border-color:transparent;color:#fff;box-shadow:0 2px 10px rgba(109,94,252,.35)}

/* 菜单分组标题（Linear 风格 · 11px uppercase · tracking 1.5px · 中性） */
.menu-nav .nav-head{font-size:11px;font-weight:500;color:var(--ink-3);
  letter-spacing:var(--tr-wide);text-transform:uppercase;
  margin:14px 10px 4px;padding:0}

/* 菜单项（核心 · Linear 风格 · 行高紧凑 · active = bg + 2px 紫竖条） */
.menu-nav a{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:var(--r-sm);
  color:var(--ink-2);font-size:var(--fs-base);font-weight:500;line-height:var(--lh-snug);
  margin-bottom:1px;position:relative;transition:background .12s,color .12s;
  letter-spacing:var(--tr-snug)}

/* 3D 可视化导航入口（断点⑤挂接 2026-08-20 · 与菜单项同款间距，独立外链样式） */
.menu-nav a.nav-3d-entry{margin:10px 0 2px;color:#8B6FE8;font-weight:600;
  border:1px solid rgba(139,111,232,.28);background:rgba(139,111,232,.06)}
.menu-nav a.nav-3d-entry:hover{background:rgba(139,111,232,.14)}
.menu-nav a:hover{background:rgba(0,0,0,.04);color:var(--ink)}
.menu-nav a.on{background:var(--purple-l);color:var(--purple-d);font-weight:600}
.menu-nav a.on::before{content:"";position:absolute;left:-10px;top:3px;bottom:3px;width:2px;
  background:var(--purple);border-radius:0 99px 99px 0}
.menu-nav a.on svg{stroke:var(--purple-d)}
.menu-nav a svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.6;fill:none;
  stroke-linecap:round;stroke-linejoin:round;flex:none}
.menu-nav a.has-sub::after{content:"";margin-left:auto;width:5px;height:5px;border-right:1.4px solid currentColor;
  border-bottom:1.4px solid currentColor;transform:rotate(-45deg);transition:transform .15s;opacity:.5}
.menu-nav a.has-sub.open::after{transform:rotate(45deg);opacity:.85}

/* 二级菜单（学科 · 紧凑内嵌） */
.sub-list{max-height:0;overflow:hidden;transition:max-height .25s ease;margin:1px 0 4px 6px}
.sub-list.open{max-height:680px}
.sub-list a{display:flex;align-items:center;gap:6px;padding:3px 8px 3px 22px;border-radius:var(--r-sm);
  font-size:var(--fs-sm);font-weight:500;color:var(--ink-3);margin-bottom:1px;position:relative;background:transparent}
.sub-list a::before{content:"";position:absolute;left:10px;top:50%;width:3px;height:3px;border-radius:50%;
  background:var(--ink-4);transform:translateY(-50%);transition:background .12s}
.sub-list a:hover{color:var(--ink);background:rgba(0,0,0,.04)}
.sub-list a:hover::before{background:var(--ink-3)}
.sub-list a.on{color:var(--purple-d);background:var(--purple-l);font-weight:600}
.sub-list a.on::before{background:var(--purple)}
.sub-list a.on:hover{background:var(--purple-l)}

/* 三级菜单（语文→作文专项 / 英语→听说训练 · 更深缩进 + 更小字号） */
.sub-list.sub-nest{margin:1px 0 2px 10px}
.sub-list.sub-nest a{padding-left:38px;font-size:var(--fs-xs);color:var(--ink-3);font-weight:500}
.sub-list.sub-nest a::before{left:24px}

.side-foot{margin-top:auto;padding:14px 10px 0;border-top:1px solid var(--sidebar-border);
  font-size:11px;color:var(--ink-3);line-height:var(--lh-loose);letter-spacing:var(--tr-snug)}
.side-foot b{color:var(--ink-2);font-weight:600}

/* ============================================================
 * 主内容区 · 长滚动单页（右侧预留公仔空间）
 * ============================================================ */
.main{padding:36px 64px 80px 56px;min-width:0;max-width:1440px;margin-left:260px}
/* 2026-08-20 改：.app-layout 是 flex column 布局，.main 是 flex item 受 stretch 撑满 → 强行居中 */
/* 2026-09-05 修：width:1180px 固定宽在 780~1180 视口下溢出且 margin:auto 归零（内容贴左+横向滚动，用户报"主页往左移"）→ width:100% + max-width:1180 等价宽屏表现、窄屏自适应居中 */
.app-layout > .main{margin-left:auto !important;margin-right:auto !important;max-width:1180px !important;width:100% !important}
/* 2026-08-21 P2-1：移动端 .main 收拢至视口宽度，消除 1180 固定宽导致的横向溢出 */
@media (max-width:780px){
  .app-layout > .main{width:100% !important;max-width:100% !important;margin-left:0 !important;margin-right:0 !important;padding:14px 12px 70px !important}
}
/* 2026-08-20 加：让 .main 内子元素在剩余空间居中（而非撑满到 viewport 右边），与 app-top-nav 模式统一
   v12-skill-band / v12-feat-band 是 100vw 满屏区，保留原行为（用 left:-260px 自适应侧栏偏移） */
.main > *:not(.v12-skill-band):not(.v12-feat-band):not(footer){max-width:1180px;margin-left:auto;margin-right:auto;box-sizing:border-box}
.main > footer{max-width:1180px;margin:24px auto 0;box-sizing:border-box;text-align:center}
/* === 宽屏给右侧大公仔留通道（mascot-companion · desktop-patch.js 强制 fixed:right:36px width:280px）===
   避免公仔在 ≥1500px 视口下盖住主区右侧一截文案。 */
@media (min-width:1500px){
  .main{padding-right:340px;max-width:1640px}
}
/* === 中宽屏（1281–1499px）只让公仔缩窄版存在，主区不再额外让位 === */

.page-head{position:relative;margin-bottom:28px;padding:26px 30px;border-radius:var(--r-lg);overflow:hidden;
  background:
    radial-gradient(circle at 90% 10%,rgba(226,83,143,.16),transparent 42%),
    radial-gradient(circle at 6% 98%,rgba(43,182,168,.15),transparent 40%),
    linear-gradient(120deg,var(--surface),var(--surface-2));
  border:1px solid var(--hair);box-shadow:var(--shadow)}
/* 有 hero 奖章时，文字内容右避让（2026-08-20 P1-9） */
.page-head:has(.ph-hero) .page-h1,
.page-head:has(.ph-hero) .page-sub{padding-right:100px}
.page-eyebrow{display:inline-block;font-size:11px;font-weight:600;letter-spacing:var(--tr-wide);
  color:var(--purple-d);text-transform:uppercase;margin-bottom:12px;padding:3px 11px;border-radius:var(--r-pill);
  background:var(--purple-l);border:1px solid rgba(226,83,143,.18)}
.page-h1{font-family:var(--font-display);font-size:28px;font-weight:700;
  letter-spacing:var(--tr-tight);line-height:1.1;color:var(--ink);margin-bottom:10px}
.page-h2{font-family:var(--font-display);font-size:18px;font-weight:600;
  margin-top:32px;margin-bottom:14px;color:var(--ink);line-height:var(--lh-snug);
  display:flex;align-items:center;gap:10px;letter-spacing:var(--tr-snug)}
.page-h2::before{content:"";flex:0 0 2px;width:2px;height:16px;background:var(--purple);border-radius:99px}
.page-h3{font-size:var(--fs-md);font-weight:600;margin-top:18px;margin-bottom:10px;color:var(--ink);
  letter-spacing:var(--tr-snug)}
.page-sub{font-size:var(--fs-md);color:var(--ink-2);line-height:var(--lh-loose);margin-top:6px;max-width:780px}
.redtag{display:inline-block;margin-top:10px;font-size:11px;font-weight:500;letter-spacing:var(--tr-wide);
  padding:3px 10px;border-radius:var(--r-pill);background:rgba(120,110,150,.06);color:var(--ink-2);
  border:1px solid var(--hair);text-transform:none}

/* 2026-08-20 加：pageHead 4 种页面角色差异化视觉（解决"所有子页面长得一样"） */
/* ① 学习沉浸 study：深紫渐变大横幅 · 白字 · 无 TAB 标签 */
.page-head.tone-study{background:linear-gradient(120deg,#2A2150 0%,#4A3E8F 55%,#6B5CD0 100%);
  border:none;box-shadow:0 14px 34px rgba(60,40,140,.28)}
.page-head.tone-study .page-h1{color:#fff}
.page-head.tone-study .page-sub{color:rgba(255,255,255,.82)}
.page-head.tone-study .redtag{background:rgba(255,255,255,.14);color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.22)}
.page-head.tone-study .page-h1::after{content:"";display:block;width:52px;height:4px;border-radius:99px;
  background:linear-gradient(90deg,#FF6B9D,#FFB020);margin-top:12px}
/* ==========================================================================
   [2026-09-29 批103g] tone-study 双分支（浅色 / 深色）—— 只在 #/rflow 拍照复习生效
   动机：深紫渐变大横幅在浅色画布上是一块压顶的深色（用户："这一条在浅色时改成浅色"）；
        在深色主题下又比页面底亮太多（用户："在深色背景时要改成深色"）。
   母题不动（学习沉浸 · 右侧 eye 奖章 + 品牌紫调），只按主题翻明度：
     ① 浅色 = "白天的书桌"：浅紫纸感底 + 墨字 + 浅瓷奖章（粉/琥珀下划线保留，浅底上依旧立得住）；
     ② 深色 = "夜里的书桌"：把 55% 处的 #4A3E8F 压到 deep indigo（贴近页面底 #151229，不再发亮）。
   范围（[2026-09-30 放宽]）：原来只作用在 .rflow-shell 内；现按用户点名放宽到**全站 tone-study**，
        即 #/subjects 学科总览（"这一条在浅色时改成浅色"）与 #/rflow 一并生效；
        tone-study 在本站只有这两处 pageHead 调用（app.js: 学科总览 / renderPracticeFlow），
        放大范围不会波及 tone-map / tone-door / tone-tool 等各自独立的版式。
   ========================================================================== */
html:not([data-theme="dark"]) .page-head.tone-study{
  background:
    radial-gradient(circle at 92% 8%,rgba(139,111,232,.18),transparent 46%),
    radial-gradient(circle at 2% 96%,rgba(43,182,168,.10),transparent 42%),
    linear-gradient(120deg,#FCFAFF 0%,#F4F0FE 52%,#EDE7FC 100%);
  border:1px solid rgba(139,111,232,.22);
  box-shadow:0 12px 30px -18px rgba(80,60,160,.36),inset 0 1px 0 rgba(255,255,255,.94)}
/* 标题：白字 + 壳内扫光 → 墨字。浅底上必须深字（可读性底线，不是配色偏好）。
   ★ 必须连 -webkit-text-fill-color / background-clip / animation 一起改 ——
     .myquest-shell .page-h1 的涟漪扫光（desktop.css:4621）把字填成了 transparent（批103d 同款坑）。 */
html:not([data-theme="dark"]) .page-head.tone-study .page-h1{
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  -webkit-text-fill-color:var(--ink);color:var(--ink);animation:none}
html:not([data-theme="dark"]) .page-head.tone-study .page-sub{color:var(--ink-2)}
/* 红色小标签：深底那套是白色半透明胶囊，落浅底会「白字白底」整条消失 ⇒ 换品牌紫浅胶囊 */
html:not([data-theme="dark"]) .page-head.tone-study .redtag{
  background:rgba(139,111,232,.10);color:#5B4BA8;border-color:rgba(139,111,232,.24)}
/* 奖章：深底上的白玻璃 → 浅底上的浅瓷盘（与 warm-door 的白瓷盘同族，这枚偏紫） */
html:not([data-theme="dark"]) .page-head.tone-study .ph-hero{
  background:radial-gradient(circle at 32% 26%,#fff,#EFEAFB);
  box-shadow:0 10px 24px -8px rgba(110,90,200,.36),inset 0 0 0 1px rgba(139,111,232,.26);
  backdrop-filter:none;color:#6D5EFC}
/* 水印：深底那套是「白字反相」（brightness(0) invert(1)），落浅底会整条消失 ⇒ 换回品牌紫低透明 */
html:not([data-theme="dark"]) .page-head.tone-study .ph-wm{
  opacity:.07;filter:none;color:#6D5EFC}
/* 深色主题：同一条横幅压暗到贴近页面底（#151229），只留一点紫调自发光。
   [2026-09-30 同批放宽] 与浅色分支同范围：深色下也不能让这条横幅比页面底亮一大截。 */
html[data-theme="dark"] .page-head.tone-study{
  background:
    radial-gradient(circle at 92% 10%,rgba(139,111,232,.22),transparent 52%),
    linear-gradient(120deg,#171130 0%,#1F1841 55%,#2A2058 100%);
  border:1px solid rgba(139,111,232,.20);
  box-shadow:0 16px 36px rgba(0,0,0,.44)}

/* ② 数据看板 data：无横幅 · 标题行 + 指标 chip · 浅蓝网格底 */
.page-head.tone-data{background:
  radial-gradient(circle at 92% 12%,rgba(59,130,246,.12),transparent 46%),
  linear-gradient(120deg,#F2F6FC,#EAF1F8);
  border:1px solid rgba(120,150,200,.16)}
.page-head.tone-data .ph-data-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.page-head.tone-data .page-h1{font-size:28px;margin-bottom:4px}
.ph-data-chip{flex:none;font-size:11px;font-weight:700;letter-spacing:var(--tr-wide);
  padding:4px 12px;border-radius:var(--r-pill);background:#3B82F6;color:#fff;
  box-shadow:0 4px 12px rgba(59,130,246,.25)}
.page-head.tone-data .page-sub{font-size:13px;color:#5B6B8C}
/* ③ 工具控制台 tool：紧凑胶囊头 · 图标+标题同行 */
.page-head.tone-tool{padding:18px 24px;background:linear-gradient(120deg,#FAFAFE,#F3F1FA);
  border:1px solid var(--hair);box-shadow:0 4px 14px rgba(80,65,160,.06)}
.page-head.tone-tool .ph-tool-row{display:flex;align-items:center;gap:12px}
.ph-tool-ic{flex:none;width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-size:18px;background:linear-gradient(135deg,#F1EDFD,#FFF1F6);box-shadow:inset 0 0 0 1px rgba(139,111,232,.18)}
.page-head.tone-tool .page-h1{font-size:20px;margin-bottom:0;line-height:1.2}
.page-head.tone-tool .page-sub{font-size:12px;margin-top:6px;color:var(--ink-2)}
/* [2026-10-11 批137] 工具控制台 tool 深色分支：浅渐变底 → 深底，消深色模式发亮 */
html[data-theme="dark"] .page-head.tone-tool{
  background:linear-gradient(120deg,#211C3C,#1B1733);
  border-color:#3A3164;
  box-shadow:0 4px 14px rgba(0,0,0,.40)}
html[data-theme="dark"] .page-head.tone-tool .page-sub{color:#B8AEE0}
html[data-theme="dark"] .page-head.tone-tool .ph-tool-ic{background:linear-gradient(135deg,#2E2A55,#262148);
  box-shadow:inset 0 0 0 1px rgba(143,122,255,.30)}
/* ④ 创作工作台 input：暖白中性 + 左下强调条 */
.page-head.tone-input{background:linear-gradient(120deg,#FFF9F4,#FFF4EC);
  border:1px solid rgba(255,150,80,.18)}
.page-head.tone-input::after{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;
  background:linear-gradient(180deg,#FF9F43,#FF6B9D)}
.page-head.tone-input .page-h1{font-size:28px}

/* [2026-10-11 批137] 创作工作台 input 深色分支：暖白底 → 深底 */
html[data-theme="dark"] .page-head.tone-input{
  background:linear-gradient(120deg,#2A2230,#241B2C);
  border-color:rgba(255,150,80,.22)}
html[data-theme="dark"] .page-head.tone-input .page-sub{color:#E7C9B0}
/* 2026-08-20 晚加：每页头部 hero 插图/图标（破除纯色块 · 路由级 ROUTE_HERO 自动注入） */
/* 文本层压在水印之上 */
.page-head>.page-eyebrow,.page-head>.page-h1,.page-head>.page-sub,.page-head>.redtag,
.page-head>.ph-data-row,.page-head>.ph-tool-row{position:relative;z-index:2}
/* 背景大号水印（低透明，被 overflow:hidden 裁切出半隐效果） */
.ph-wm{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:130px;line-height:1;
  opacity:.06;z-index:0;pointer-events:none;user-select:none}
.page-head.tone-study .ph-wm{opacity:.12;filter:brightness(0) invert(1)}   /* 深紫底 → 白色水印 */
/* 右侧 hero 奖章（浮起动画） */
.ph-hero{position:absolute;right:30px;top:50%;transform:translateY(-50%);width:88px;height:88px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:42px;z-index:1;
  animation:ph-float 5s ease-in-out infinite}
@keyframes ph-float{0%,100%{transform:translateY(-50%)}50%{transform:translateY(calc(-50% - 7px))}}
/* 浅色横幅（input / 默认报表风）：白→淡紫渐变玻璃奖章 */
.page-head:not(.tone-study) .ph-hero{background:radial-gradient(circle at 32% 26%,#fff,#EFEAFB);
  box-shadow:0 12px 28px rgba(139,111,232,.22),inset 0 0 0 1px rgba(139,111,232,.20)}
/* 深紫 study 横幅：白色半透明玻璃奖章 */
.page-head.tone-study .ph-hero{background:rgba(255,255,255,.16);
  box-shadow:0 12px 30px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.32);
  backdrop-filter:blur(2px)}
/* data 头小图标（落入 ph-data-row 行首） */
.ph-data-ic{flex:none;width:42px;height:42px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  font-size:21px;background:linear-gradient(135deg,#EAF1FF,#DCEBFF);box-shadow:inset 0 0 0 1px rgba(59,130,246,.20)}
/* tool 头图标增强（hero 图标优先，否则退回齿轮 sprite） */
.page-head.tone-tool .ph-tool-ic{font-size:20px}

/* [2026-09-14] 页头 hero 由 emoji 改为 SVG sprite（emoji 在缺字形设备 / headless 截图里会渲成方块）。
   四类容器统一在此给 svg 尺寸与描边；tone-gym 有自己的 .ph-hero svg 规则（选择器更具体，不冲突）。 */
.page-head .ph-hero{color:#6D5EFC}
.page-head.tone-study .ph-hero{color:#fff}
.ph-hero svg{width:42px;height:42px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.page-head .ph-wm{color:#5B4BA8}
.ph-wm svg{width:130px;height:130px;stroke:currentColor;stroke-width:1.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.page-head.tone-data .ph-data-ic{color:#3B7DE0}
.ph-data-ic svg{width:21px;height:21px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
/* [2026-09-27 #1223] tone-data 暗色覆盖：page-head base 用 var(--surface) 可自适配，但 tone-data 硬编码浅蓝渐变且无暗色分支 ⇒ 学情报告深色下横幅仍是浅色（用户反馈） */
html[data-theme="dark"] .page-head.tone-data{
  background:
    radial-gradient(circle at 92% 12%,rgba(96,140,255,.14),transparent 46%),
    linear-gradient(120deg,#232044,#1D1A3A);
  border-color:#3A3164}
html[data-theme="dark"] .page-head.tone-data .page-sub{color:#B8AEE0}
html[data-theme="dark"] .ph-data-ic{background:linear-gradient(135deg,#2E2A55,#262148);
  box-shadow:inset 0 0 0 1px rgba(143,122,255,.30)}

.page-head.tone-tool .ph-tool-ic{color:#8B6FE8}
.ph-tool-ic svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* ⑥ 物理专属 tone-phy：深空蓝黑渐变 + 网格 mask + 发光描边，与下方 .phy-hero 同一母题 */
.page-head.tone-phy{position:relative;background:
  radial-gradient(circle at 88% 12%,rgba(40,224,255,.18),transparent 38%),
  radial-gradient(circle at 8% 90%,rgba(122,92,255,.18),transparent 42%),
  linear-gradient(120deg,#050816 0%,#0a0e22 55%,#0c0b1e 100%);
  border:1px solid rgba(40,224,255,.22);box-shadow:0 18px 40px rgba(40,100,200,.20),inset 0 0 0 1px rgba(122,92,255,.10);overflow:hidden;color:#dbe7ff}
.page-head.tone-phy::before{content:"";position:absolute;inset:0;background-image:
  linear-gradient(rgba(40,224,255,.06) 1px,transparent 1px),
  linear-gradient(90deg,rgba(40,224,255,.06) 1px,transparent 1px);
  background-size:48px 48px;background-position:-1px -1px;mask-image:radial-gradient(circle at 50% 0,#000 0%,transparent 78%);opacity:.7;pointer-events:none}
.page-head.tone-phy::after{content:"";position:absolute;right:-60px;top:50%;transform:translateY(-50%);width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(40,224,255,.22),transparent 65%);filter:blur(20px);pointer-events:none}
.page-head.tone-phy .page-h1{color:#eaf1ff}
.page-head.tone-phy .page-sub{color:rgba(219,231,255,.72)}
.page-head.tone-phy .redtag{background:rgba(40,224,255,.10);color:#a5e9ff;border:1px solid rgba(40,224,255,.30)}
.page-head.tone-phy .page-h1::after{content:"";display:block;width:60px;height:4px;border-radius:99px;background:linear-gradient(90deg,#28e0ff,#7a5cff);margin-top:12px;box-shadow:0 0 12px rgba(40,224,255,.6)}
.page-head.tone-phy .ph-hero{background:radial-gradient(circle at 32% 26%,rgba(40,224,255,.32),rgba(122,92,255,.32));
  box-shadow:0 14px 36px rgba(40,224,255,.30),inset 0 0 0 2px rgba(40,224,255,.45);
  backdrop-filter:blur(2px);color:#eaf1ff;font-size:46px}
.page-head.tone-phy .ph-wm{opacity:.10;filter:brightness(0) invert(1)}   /* 深底 → 白色水印 */

/* ⑦ 思维健身房专属 tone-gym：母题「思维回路 · 神经脉冲」（2026-09-14 美化）
   · 与 tone-study 同属深色家族但独立成 class —— study 被题单/报告/核准/商城等多页复用，禁止改动它。
   · 版式：深空紫靛底 + 脑网点阵 + 脉冲折线 + 同心环纹样 + 玻璃徽章 + 品牌紫→青强调线。 */
.page-head.tone-gym{
  background:
    radial-gradient(120% 130% at 100% 4%,rgba(40,194,200,.30),transparent 46%),
    radial-gradient(92% 112% at 0% 102%,rgba(217,53,122,.26),transparent 52%),
    radial-gradient(72% 84% at 62% 120%,rgba(139,111,232,.32),transparent 62%),
    linear-gradient(118deg,#1E1740 0%,#2E2467 46%,#4A3A9E 100%);
  border:none;padding:28px 30px 30px;
  box-shadow:0 18px 42px -10px rgba(46,28,120,.42),inset 0 0 0 1px rgba(255,255,255,.08)}
/* 脑网点阵（左侧清晰 → 右侧渐隐，给右侧徽章让位） */
.page-head.tone-gym::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:radial-gradient(rgba(255,255,255,.17) 1px,transparent 1px);
  background-size:22px 22px;opacity:.7;
  mask-image:linear-gradient(105deg,#000 0%,rgba(0,0,0,.35) 58%,transparent 88%)}
/* 脉冲折线：三层斜切条（隐喻"一步一步推演"），底部渐隐 */
.page-head.tone-gym::after{content:"";position:absolute;left:0;right:0;bottom:0;height:78px;
  pointer-events:none;z-index:1;opacity:.72;
  background:
    linear-gradient(115deg,transparent 30%,rgba(255,255,255,.11) 30%,rgba(255,255,255,.11) 30.6%,transparent 30.6%),
    linear-gradient(115deg,transparent 48%,rgba(40,194,200,.36) 48%,rgba(40,194,200,.36) 48.7%,transparent 48.7%),
    linear-gradient(115deg,transparent 63%,rgba(255,255,255,.17) 63%,rgba(255,255,255,.17) 63.5%,transparent 63.5%);
  mask-image:linear-gradient(90deg,transparent,#000 30%,#000 72%,transparent 96%)}
.page-head.tone-gym .page-h1{color:#fff;font-size:28px;text-shadow:0 2px 18px rgba(10,4,40,.42)}
.page-head.tone-gym .page-h1::after{content:"";display:block;width:64px;height:4px;border-radius:99px;
  margin-top:13px;background:linear-gradient(90deg,#28C2C8,#8B6FE8);
  box-shadow:0 0 14px rgba(40,194,200,.55)}
.page-head.tone-gym .page-sub{color:rgba(255,255,255,.80);max-width:640px;font-size:14px}
.page-head.tone-gym .redtag{background:rgba(40,194,200,.16);color:#A9EEF2;border:1px solid rgba(40,194,200,.38)}
/* 同心环纹样（替代大号 emoji 水印：后者在 overflow:hidden 下被裁成"白色方块"，与徽章叠加显脏） */
.ph-rings{position:absolute;right:-42px;top:50%;transform:translateY(-50%);width:250px;height:250px;
  border-radius:50%;z-index:2;pointer-events:none;
  background:radial-gradient(circle,transparent 0 54%,rgba(255,255,255,.10) 54% 55.2%,transparent 55.2% 70%,
    rgba(40,194,200,.24) 70% 71.4%,transparent 71.4% 86%,rgba(255,255,255,.08) 86% 87%,transparent 87%)}
.page-head.tone-gym .ph-rings{animation:gym-ring 6s ease-in-out infinite}
@keyframes gym-ring{
  0%,100%{transform:translateY(-50%) scale(1);opacity:.85}
  50%{transform:translateY(-50%) scale(1.045);opacity:1}}
/* 徽章：深底玻璃 + 双层外光环（与公仔紫青渐变同源） */
.page-head.tone-gym .ph-hero{right:34px;width:92px;height:92px;font-size:44px;z-index:3;
  background:linear-gradient(140deg,rgba(255,255,255,.26),rgba(255,255,255,.09));
  box-shadow:0 16px 34px rgba(10,4,40,.34),inset 0 0 0 1px rgba(255,255,255,.40),
    0 0 0 8px rgba(255,255,255,.05),0 0 0 16px rgba(40,194,200,.06);
  backdrop-filter:blur(3px)}
.page-head.tone-gym .ph-wm{display:none}   /* 防御：本版式不渲染大号水印 */
/* 徽章内 SVG（灯泡）：白色描边 + 柔光，尺寸随徽章 */
.page-head.tone-gym .ph-hero svg{width:42px;height:42px;stroke:#fff;stroke-width:1.5;fill:none;
  stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 10px rgba(255,255,255,.45))}
@media (max-width:760px){
  .page-head.tone-gym{padding:22px 20px 24px}
  .page-head.tone-gym .page-h1{font-size:26px}
  .page-head.tone-gym .ph-hero{width:56px;height:56px;font-size:26px;right:14px}
  .page-head.tone-gym .ph-rings{display:none}
}

/* ⑦ 知识开门 tone-door：母题「门缝光」——深靛门框里透出一道暖金光，右侧是拱形门洞。
   刻意**不与 tone-input（暖白创作工作台）共享任何背景/强调条**：
   那是一张纸（写东西的桌子），这是一扇门。换几个色值不算母题，所以整块重写。 */
.page-head.tone-door{position:relative;background:
  radial-gradient(58% 132% at 92% 50%,rgba(255,196,110,.34),rgba(255,150,80,.10) 40%,transparent 62%),
  radial-gradient(74% 120% at 4% 108%,rgba(40,194,200,.17),transparent 58%),
  linear-gradient(112deg,#17122E 0%,#241A4C 48%,#3A2470 100%);
  border:1px solid rgba(255,196,110,.28);
  box-shadow:0 20px 46px -20px rgba(28,18,66,.66),inset 0 1px 0 rgba(255,214,150,.34),
    inset 0 -1px 0 rgba(255,196,110,.20)}
/* 门后溢出的光：以拱门为圆心的一大团暖光 + 斜向左下扩散的光柱（光要有来源，不能是"贴一块亮色"） */
.page-head.tone-door::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:
    radial-gradient(46% 190% at calc(100% - 73px) 52%,rgba(255,232,178,.52),rgba(255,190,110,.17) 36%,transparent 70%),
    linear-gradient(186deg,rgba(255,224,160,.26),rgba(255,198,124,.05) 48%,transparent 74%);
  -webkit-mask-image:linear-gradient(93deg,transparent 4%,rgba(0,0,0,.55) 30%,#000 62%);
  mask-image:linear-gradient(93deg,transparent 4%,rgba(0,0,0,.55) 30%,#000 62%)}
/* 三道细光缝（从门洞斜射出来）——有方向的光才像"门开了"
   ★ 两个坑（2x 采样才看得出，1x 截图上是"看着还行"）：
     ① 渐变方向 ≠ 光线方向：要一条**横向**光缝，色带必须落在渐变轴的"高度百分比"上；
        写成 `184deg, color 0 11%` 得到的是"元素顶部 11% 那一条"，而本元素 top:-14% → 全在卡片外，等于没画。
     ② 三条缝必须落在元素中段（26%~67%），否则同样被裁掉。 */
.page-head.tone-door .ph-rays{position:absolute;right:64px;top:0;bottom:0;width:56%;z-index:1;
  pointer-events:none;filter:blur(4.5px);
  background:
    linear-gradient(173deg,transparent 25%,rgba(255,240,206,.32) 25% 32%,transparent 32.6%),
    linear-gradient(187deg,transparent 43%,rgba(255,232,180,.22) 43% 49%,transparent 49.6%),
    linear-gradient(161deg,transparent 60%,rgba(255,236,196,.15) 60% 64.5%,transparent 65.1%);
  -webkit-mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.35) 32%,#000 84%);
  mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.35) 32%,#000 84%)}
/* 左侧发光门边（取代 input 的橙粉强调条）：门框边缘在发亮，不是一条装饰色 */
.page-head.tone-door::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,#FFE3B0,#FFB65C 46%,rgba(255,182,92,.10));
  box-shadow:0 0 20px rgba(255,190,110,.55)}
.page-head.tone-door .page-h1{color:#fff;font-size:28px;text-shadow:0 2px 18px rgba(255,200,120,.22)}
.page-head.tone-door .page-sub{color:rgba(255,255,255,.80)}
.page-head.tone-door .redtag{background:rgba(255,255,255,.12);color:rgba(255,255,255,.84);border-color:rgba(255,255,255,.20)}
/* 拱形门洞 hero：拱顶圆角 + 门后暖金透光 + 外发光（"门口"，不是"奖章"） */
.page-head.tone-door .ph-hero{right:36px;width:84px;height:112px;border-radius:50% 50% 9px 9px/37% 37% 9px 9px;
  background:radial-gradient(88% 66% at 50% 100%,#FFEBC4 0%,#FFC978 32%,rgba(255,163,74,.44) 60%,rgba(58,36,112,.18) 100%);
  box-shadow:0 0 52px 6px rgba(255,190,105,.34),0 0 96px 22px rgba(255,172,86,.16),
    0 14px 30px -10px rgba(20,10,50,.60),inset 0 0 0 1.6px rgba(255,225,175,.72);
  z-index:2}
/* 门槛上的一滩光（门开了，光洒到地上）—— 没有这条，门洞只是个"发光的胶囊" */
.page-head.tone-door .ph-hero::after{content:"";position:absolute;left:-30%;right:-30%;bottom:-11px;height:20px;
  border-radius:50%;background:radial-gradient(50% 50% at 50% 50%,rgba(255,222,164,.80),rgba(255,178,96,.28) 44%,transparent 74%);
  filter:blur(6px);pointer-events:none}
.page-head.tone-door .ph-hero svg{width:66px;height:86px}
/* ★ 门把必须是暖金实心：全局 `.ph-hero svg{stroke:currentColor}` 会给它套一圈靛蓝描边，
   半径只有 1.7 → 描边把整颗珠子染成蓝紫色（2x 采样才发现，1x 看成"一个亮点"）。 */
.page-head.tone-door .ph-hero svg circle{stroke:none}
.page-head.tone-door .ph-wm{display:none}   /* 防御：本版式不渲染大号水印 */
@media (max-width:760px){
  .page-head.tone-door{padding:22px 20px}
  .page-head.tone-door .page-h1{font-size:25px}
  .page-head.tone-door .ph-hero{width:58px;height:78px;right:16px}
  .page-head.tone-door .ph-hero svg{width:46px;height:60px}
  .page-head.tone-door::before{width:72%}
}

/* ==========================================================================
   [2026-09-28 批103e] tone-door 浅色版 —— 同一扇门，挪到「白天」
   动机：深靛门框页头在浅色画布上是一块压顶的黑（用户反馈："这一条在浅色时也改成浅色"）。
   母题不动（拱形门洞 + 门缝光 + 门槛光滩 + 左侧发光门边），只把「暗处的光」翻成「白天的门口」：
     ① 底：暖白纸感（左靛雾 → 右暖金），整条提到与下方卡片同一明度带；
     ② 门后溢光：仍是"以拱门为圆心往外扩"，但落色改成暖金雾 —— 浅底上「更亮」不再等于
        「看得见」（白底再亮也还是白），必须靠**色相**（靛 / 金）把光画出来；
     ③ 三道斜射光缝、左侧门边、门槛光滩全换暖金：深底那套白线落白底上会直接消失；
     ④ 门扇线整族转暖金墨色（.pd-* 见 app.js 手绘拱门）。
   边界：**只在 html:not([data-theme="dark"]) 下生效**，深色主题那一版（deep indigo + 白字）
        完全不受影响；tone-door 只被 #/eyes 一页使用，改它不牵连他页。
   ========================================================================== */
html:not([data-theme="dark"]) .page-head.tone-door{
  background:
    radial-gradient(58% 132% at 92% 50%,rgba(255,178,88,.30),rgba(255,206,140,.12) 42%,transparent 64%),
    radial-gradient(74% 120% at 4% 108%,rgba(40,194,200,.13),transparent 58%),
    linear-gradient(112deg,#FFFCF7 0%,#FAF6FF 46%,#FFF3E2 100%);
  border:1px solid rgba(255,176,90,.34);
  box-shadow:0 12px 30px -18px rgba(140,90,30,.30),inset 0 1px 0 rgba(255,255,255,.92),
    inset 0 -1px 0 rgba(255,186,104,.22)}
/* 门后溢光（暖金雾；mask 沿用深色版的方向性渐隐，这里只换 background 落色） */
html:not([data-theme="dark"]) .page-head.tone-door::before{
  background:
    radial-gradient(46% 190% at calc(100% - 73px) 52%,rgba(255,206,138,.62),rgba(255,190,116,.22) 38%,transparent 70%),
    linear-gradient(186deg,rgba(255,222,164,.34),rgba(255,204,138,.07) 48%,transparent 74%)}
/* 三道斜射光缝：深底上是"亮线"，浅底上换成"暖金线"（同一条缝，换介质） */
html:not([data-theme="dark"]) .page-head.tone-door .ph-rays{
  background:
    linear-gradient(173deg,transparent 25%,rgba(255,188,110,.44) 25% 32%,transparent 32.6%),
    linear-gradient(187deg,transparent 43%,rgba(255,188,110,.30) 43% 49%,transparent 49.6%),
    linear-gradient(161deg,transparent 60%,rgba(255,196,124,.20) 60% 64.5%,transparent 65.1%)}
/* 左侧发光门边 */
html:not([data-theme="dark"]) .page-head.tone-door::after{
  background:linear-gradient(180deg,#FFD79A,#F0A94A 46%,rgba(240,169,74,.12));
  box-shadow:0 0 18px rgba(255,186,104,.46)}
/* 标题/副标/标签：从「白字」切到墨字 —— 浅底上必须深字，这是可读性底线，不是配色偏好。
   ★ 必须连 -webkit-text-fill-color 一起改：批103d 给壳内 tone-door 标题强制了
     text-fill-color:#fff（那时是全深底），只改 color 会被它整条盖掉。 */
html:not([data-theme="dark"]) .page-head.tone-door .page-h1,
html:not([data-theme="dark"]) .myquest-shell .page-head.tone-door .page-h1{
  color:var(--ink);-webkit-text-fill-color:var(--ink);text-shadow:0 1px 12px rgba(255,214,160,.42)}
html:not([data-theme="dark"]) .page-head.tone-door .page-sub{color:var(--ink-2)}
html:not([data-theme="dark"]) .page-head.tone-door .redtag{
  background:rgba(255,176,90,.14);color:#8A5A16;border-color:rgba(240,169,74,.34)}
/* 拱门：浅底上不能再用「深底 + 外发光」（外发光落浅底只剩一圈脏灰），改成
   白瓷拱洞 + 暖金光从门槛往上漫 + 外圈一道暖金环把体量立住（与 tone-map/practice 的
   白瓷盘同族，但那两枚是冷瓷盘，这枚是暖瓷盘 —— 门后有光）。 */
html:not([data-theme="dark"]) .page-head.tone-door .ph-hero{
  background:radial-gradient(88% 70% at 50% 100%,#FFF6E2 0%,#FFDCA4 34%,#FFC77E 62%,#FFEBC9 100%);
  box-shadow:0 0 0 1.4px rgba(240,169,74,.55),0 8px 22px -8px rgba(150,96,24,.34),
    0 0 34px 4px rgba(255,186,104,.30);
  color:#B8761E}
html:not([data-theme="dark"]) .page-head.tone-door .ph-door svg .pd-arch{stroke:#B8761E;opacity:1}
html:not([data-theme="dark"]) .page-head.tone-door .ph-door svg .pd-seam{stroke:rgba(184,118,30,.45)}
html:not([data-theme="dark"]) .page-head.tone-door .ph-door svg .pd-leaf{
  fill:rgba(255,255,255,.62);stroke:#B8761E}
html:not([data-theme="dark"]) .page-head.tone-door .ph-door svg .pd-knob{fill:#D98A1F}
/* 门槛光滩 */
html:not([data-theme="dark"]) .page-head.tone-door .ph-hero::after{
  background:radial-gradient(50% 50% at 50% 50%,rgba(255,196,120,.70),rgba(255,178,88,.24) 44%,transparent 74%)}

/* ==========================================================================
   [2026-09-15] 学习地图专属母题 tone-map ——「等高线 · 学习路线」（浅色版）
   动机：本页此前借用 tone-study 的深紫大横幅。但这是一张「地图」——第一眼该看见
         "路怎么走、走到哪了"，而不是先被一块深色压住；深紫底还会把下方的
         topStats 与卡点列表衬得发灰发沉（用户反馈："这一条的色调比较深"）。
   做法：把母题自己长出来，不是换个色值 ——
         ① 底：近白（浅靛 → 浅青）双光斑，整条横幅提亮到与卡片同一明度带；
         ② 等高线：同心环纹，右侧密集、向左渐隐 = 地形图语汇；
         ③ 底部一条「学习路线」：虚线路径 + 4 个途经节点，两端渐隐（起点 → 终点）；
         ④ hero 退回浅色白瓷盘，图标仍用全站 sprite 的 map（不再是深底白玻璃）。
   边界：tone-study 被题单/报告/核准/商城等多页复用，**禁止改动它**；本版式独立成类。
   ========================================================================== */
.page-head.tone-map{
  background:
    radial-gradient(62% 126% at 97% 42%,rgba(109,94,252,.15),transparent 64%),
    radial-gradient(72% 124% at 0% 108%,rgba(40,194,200,.14),transparent 60%),
    linear-gradient(118deg,#FBFBFF 0%,#F5F2FF 46%,#EDF8FA 100%);
  border:1px solid rgba(109,94,252,.16);
  box-shadow:0 12px 30px -16px rgba(88,72,180,.26)}
/* 等高线：同心环纹（右侧密集 → 向左渐隐）。用 repeating-radial-gradient 画「一圈圈」，
   再靠 mask 做方向性渐隐 —— 直接铺满会在大屏上糊成一片灰底。
   z-index 必须留在 0：::after 是伪元素里最后绘制的，若给它 1 会盖住 .ph-hero 徽章。 */
.page-head.tone-map::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:repeating-radial-gradient(circle at 98% 46%,transparent 0 20px,rgba(109,94,252,.12) 20px 21.4px);
  -webkit-mask-image:linear-gradient(96deg,transparent 4%,rgba(0,0,0,.40) 40%,#000 76%);
  mask-image:linear-gradient(96deg,transparent 4%,rgba(0,0,0,.40) 40%,#000 76%)}
/* 底部「学习路线」：一条虚线 + 4 个途经节点（前三个紫＝已走过，末节点青＝终点）
   · 虚线层靠 background-size 裁成 2px 细线（不裁的话重复渐变会填满整条高度成色块）；
   · 节点层用显式半径的 radial-gradient，逐个绝对定位在同一水平线上；
   · 两端 mask 渐隐，避免「一条横线从卡片边缘硬切进来」。 */
.page-head.tone-map::after{content:"";position:absolute;left:0;right:0;bottom:13px;height:14px;
  pointer-events:none;z-index:0;
  background-image:
    radial-gradient(circle 4.5px at 8% 50%,rgba(109,94,252,.62) 0 99%,transparent 100%),
    radial-gradient(circle 4.5px at 36% 50%,rgba(109,94,252,.34) 0 99%,transparent 100%),
    radial-gradient(circle 4.5px at 64% 50%,rgba(40,194,200,.44) 0 99%,transparent 100%),
    radial-gradient(circle 4.5px at 86% 50%,rgba(40,194,200,.72) 0 99%,transparent 100%),
    repeating-linear-gradient(90deg,rgba(109,94,252,.30) 0 9px,transparent 9px 19px);
  background-repeat:no-repeat,no-repeat,no-repeat,no-repeat,repeat-x;
  background-size:100% 100%,100% 100%,100% 100%,100% 100%,19px 2px;
  background-position:0 0,0 0,0 0,0 0,0 50%;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
/* 标题下的强调线：品牌紫 → 青（与公仔 v5 渐变同源），替代 study 的粉橙条 */
.page-head.tone-map .page-h1::after{content:"";display:block;width:58px;height:4px;border-radius:99px;
  background:linear-gradient(90deg,#6D5EFC,#28C2C8);margin-top:12px}
/* redtag：浅靛底 + 靛字（study 是白字半透明，在浅底上会看不见） */
.page-head.tone-map .redtag{background:rgba(109,94,252,.07);color:#5B4BA8;border-color:rgba(109,94,252,.20)}
/* hero 白瓷盘：沿用全局浅色徽章底色，只补一圈靛色光环 + 外扩淡环，
   让「地图」这枚徽章在近白底上仍然立得住（z-index 抬到 3：压住底部路线带） */
.page-head.tone-map .ph-hero{z-index:3;
  background:radial-gradient(circle at 32% 26%,#fff,#EFEAFB);
  box-shadow:0 10px 26px rgba(109,94,252,.22),inset 0 0 0 1px rgba(109,94,252,.22),
    0 0 0 8px rgba(109,94,252,.05);
  color:#6D5EFC}
.page-head.tone-map .ph-wm{display:none}   /* 防御：本版式用等高线做底纹，不再叠大号水印 */
@media (prefers-reduced-motion:reduce){
  .page-head.tone-map .ph-hero{animation:none}}
@media (max-width:820px){
  .page-head.tone-map{padding:22px 20px 26px}
  .page-head.tone-map .page-h1{font-size:27px}
  .page-head.tone-map .page-sub{font-size:14px}
  .page-head.tone-map::after{bottom:11px;height:12px}
  .page-head.tone-map::before{display:none}   /* 窄屏优先可读性，去掉等高线 */
}

/* ==========================================================================
   [2026-09-15] 题单练习专属母题 tone-practice ——「答题卡 · 掌握台阶」（浅色版）
   动机：本页此前借用 tone-study 的深紫大横幅 —— "练一练"是孩子动手做题的地方，
         深色压顶、还把下方四张粉彩统计卡衬得发灰（用户反馈："这一条颜色有点深"）。
   做法：把母题自己长出来，不是换个色值 ——
         ① 底：题卡纸感近白浅靛，明度提到与下方统计卡同带；
         ② 答题卡列线：竖向分列线向左渐隐 = OMR 答题卡语汇；
         ③ 底部「掌握台阶」：四级台阶步步升高，末级品牌青 = 掌握/通关（练得越多，站得越高）；
         ④ hero 换 target 靶心 sprite（瞄准薄弱点），白瓷盘 + 双环靶纹。
   边界：tone-study 被题单(其它分支)/报告/核准/商城等多页复用，禁止改动它；本版式独立成类。
   ========================================================================== */
.page-head.tone-practice{
  background:
    radial-gradient(58% 120% at 96% 30%,rgba(109,94,252,.13),transparent 62%),
    radial-gradient(66% 110% at 2% 110%,rgba(40,194,200,.10),transparent 58%),
    linear-gradient(118deg,#FDFDFF 0%,#F5F3FE 50%,#EFF9FA 100%);
  border:1px solid rgba(109,94,252,.15);
  box-shadow:0 12px 30px -16px rgba(88,72,180,.24)}
/* 答题卡列线：竖向分列线，右侧可见 → 向左渐隐（mask 方向性渐隐；z-index 必须留在 0，
   否则会盖住 .ph-hero 徽章 —— 见 tone-map 的同款陷阱注释）。 */
.page-head.tone-practice::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:repeating-linear-gradient(90deg,rgba(109,94,252,.11) 0 1.5px,transparent 1.5px 34px);
  -webkit-mask-image:linear-gradient(96deg,transparent 8%,rgba(0,0,0,.42) 46%,#000 80%);
  mask-image:linear-gradient(96deg,transparent 8%,rgba(0,0,0,.42) 46%,#000 80%)}
/* 底部「掌握台阶」：四级台阶步步升高（练 → 会 → 熟 → 掌握），末级品牌青 = 通关；
   下衬一条 2px 基线；右端 mask 渐隐，避免从卡片边缘硬切进来。 */
.page-head.tone-practice::after{content:"";position:absolute;left:0;right:0;bottom:12px;height:26px;
  pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(109,94,252,.52) 0 0),
    linear-gradient(rgba(109,94,252,.36) 0 0),
    linear-gradient(rgba(109,94,252,.24) 0 0),
    linear-gradient(rgba(40,194,200,.55) 0 0),
    linear-gradient(rgba(109,94,252,.26) 0 0);
  background-repeat:no-repeat;
  background-size:30px 7px,30px 13px,30px 19px,30px 25px,100% 2px;
  background-position:40px 100%,74px 100%,108px 100%,142px 100%,0 100%;
  -webkit-mask-image:linear-gradient(90deg,#000 72%,transparent 98%);
  mask-image:linear-gradient(90deg,#000 72%,transparent 98%)}
/* 标题下的强调线：分段进度条语汇（实 62% + 轨道 38%），与 map 的渐变条、study 的粉橙条都不同 */
.page-head.tone-practice .page-h1::after{content:"";display:block;width:58px;height:4px;border-radius:99px;
  background:linear-gradient(90deg,#6D5EFC 0 62%,rgba(109,94,252,.25) 62% 100%);margin-top:12px}
/* redtag：浅靛底 + 靛字（防御性定义；本页分支与 study 一致不渲染 redtag） */
.page-head.tone-practice .redtag{background:rgba(109,94,252,.07);color:#5B4BA8;border-color:rgba(109,94,252,.20)}
/* hero 白瓷盘 + 双环靶纹：外圈两层淡环 = 靶环，呼应「瞄准薄弱点」 */
.page-head.tone-practice .ph-hero{z-index:3;
  background:radial-gradient(circle at 32% 26%,#fff,#EFEAFB);
  box-shadow:0 10px 26px rgba(109,94,252,.20),inset 0 0 0 1px rgba(109,94,252,.22),
    0 0 0 8px rgba(109,94,252,.06),0 0 0 16px rgba(109,94,252,.03);
  color:#6D5EFC}
.page-head.tone-practice .ph-wm{display:none}   /* 防御：本版式用答题卡列线做底纹，不叠大号水印 */
@media (prefers-reduced-motion:reduce){
  .page-head.tone-practice .ph-hero{animation:none}}
@media (max-width:820px){
  .page-head.tone-practice{padding:22px 20px 24px}
  .page-head.tone-practice .page-h1{font-size:27px}
  .page-head.tone-practice .page-sub{font-size:14px}
  .page-head.tone-practice::before{display:none}   /* 窄屏优先可读性，去掉列线 */
}

/* [2026-10-11 批137] 练一练 practice 深色分支：浅答题卡底 → 深底，文本转亮，消浅色残留 */
html[data-theme="dark"] .page-head.tone-practice{
  background:
    radial-gradient(58% 120% at 96% 30%,rgba(109,94,252,.20),transparent 62%),
    radial-gradient(66% 110% at 2% 110%,rgba(40,194,200,.16),transparent 58%),
    linear-gradient(118deg,#171130 0%,#1F1841 55%,#23233F 100%);
  border-color:rgba(109,94,252,.22);
  box-shadow:0 12px 30px -16px rgba(0,0,0,.50)}
html[data-theme="dark"] .page-head.tone-practice .page-sub{color:#B8AEE0}

/* ==========================================================================
   [2026-09-15] 学习计划专属母题 tone-plan ——「周历 · 排程带」（浅色版）
   动机：本页此前借用 tone-tool 紧凑胶囊头，过于局促（用户反馈：参照 tone-practice「做大气一点」）。
   语汇：① 底：清晨周历纸感（青绿↔靛双向雾，与 practice 的靛→青方向相反，避免撞脸）；
         ② 周历列线：宽间距竖列 + 顶部表头横线（周视图日历语汇，向左渐隐）；
         ③ 排程带：基线 + 刻度 + 三个已排课块沿时间轴排开，末块品牌青（自动排程落地）；
         ④ 标题下周条：7 格中 3 格已填 = 一周进度；hero 白瓷盘 + calendar 周历章。
   边界：tone-tool 被管控/设置/资料导入等 7 处复用，禁止改动；本版式独立成类。
   ========================================================================== */
/* [2026-09-26 P2] hero 收窄（149px → 实测 92px）：竖排压缩 + 同步缩小 hero 白瓷盘。
   hero 是 absolute 88×88 + 父级 overflow:hidden ⇒ 不缩 hero 就会把双环光晕裁没。 */
.page-head.tone-plan{
  background:
    radial-gradient(58% 120% at 96% 30%,rgba(40,194,200,.12),transparent 62%),
    radial-gradient(66% 110% at 2% 110%,rgba(109,94,252,.10),transparent 58%),
    linear-gradient(118deg,#FCFEFF 0%,#F3FAFB 50%,#F4F3FE 100%);
  border:1px solid rgba(40,194,200,.18);
  box-shadow:0 12px 30px -16px rgba(60,140,150,.24);
  padding:14px 28px 16px;   /* [2026-09-26 P2] 原 26px 30px */
  margin-bottom:20px;       /* [2026-09-26 P2] 原 28px，让出中屏首屏 */
}
/* 周历列线：宽间距竖列（64px，比 practice 答题卡 34px 疏一档 = 日历列宽）+ 顶部表头横线；
   向左渐隐 mask；z-index 必须留在 0，否则盖住 .ph-hero（见 tone-map 同款陷阱注释）。 */
.page-head.tone-plan::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(109,94,252,.14) 0 0),
    repeating-linear-gradient(90deg,rgba(109,94,252,.10) 0 1.5px,transparent 1.5px 64px);
  background-repeat:no-repeat,repeat;
  background-size:100% 1.5px,auto;
  background-position:0 30px,0 0;
  -webkit-mask-image:linear-gradient(96deg,transparent 8%,rgba(0,0,0,.40) 46%,#000 80%);
  mask-image:linear-gradient(96deg,transparent 8%,rgba(0,0,0,.40) 46%,#000 80%)}
/* 底部「排程带」：2px 基线 + 24px 距刻度 + 三个已排课块（靛深→靛浅→品牌青）坐在基线上；
   右端 mask 渐隐，避免从卡片边缘硬切进来。 */
.page-head.tone-plan::after{content:"";position:absolute;left:0;right:0;bottom:12px;height:20px;
  pointer-events:none;z-index:0;
  background-image:
    repeating-linear-gradient(90deg,rgba(109,94,252,.26) 0 1px,transparent 1px 24px),
    linear-gradient(rgba(40,194,200,.60) 0 0),
    linear-gradient(rgba(109,94,252,.38) 0 0),
    linear-gradient(rgba(109,94,252,.55) 0 0),
    linear-gradient(rgba(109,94,252,.22) 0 0);
  background-repeat:repeat-x,no-repeat,no-repeat,no-repeat,no-repeat;
  background-size:100% 5px,34px 9px,26px 9px,40px 9px,100% 2px;
  background-position:0 100%,186px calc(100% - 2px),148px calc(100% - 2px),104px calc(100% - 2px),0 100%;
  -webkit-mask-image:linear-gradient(90deg,#000 70%,transparent 98%);
  mask-image:linear-gradient(90deg,#000 70%,transparent 98%)}
/* 标题下的强调线：七格周条（7 段中 3 段已填）—— 周视图语汇，与 map 渐变条/practice 进度条都不同 */
.page-head.tone-plan .page-h1{font-size:28px;line-height:32px}   /* [2026-09-26 P2] 原 40/44 */
.page-head.tone-plan .page-sub{font-size:13px;line-height:18px}   /* [2026-09-26 P2] 原 15/24.75 */
.page-head.tone-plan .page-h1::after{content:"";display:block;width:56px;height:4px;border-radius:99px;
  margin-top:8px;                                                  /* [2026-09-26 P2] 原 12px */
  background-image:
    linear-gradient(rgba(109,94,252,.30) 0 0),
    linear-gradient(#6D5EFC 0 0);
  background-repeat:no-repeat,no-repeat;
  background-size:100% 100%,28px 100%;
  -webkit-mask-image:repeating-linear-gradient(90deg,#000 0 8px,transparent 8px 10px);
  mask-image:repeating-linear-gradient(90deg,#000 0 8px,transparent 8px 10px)}
/* redtag：浅青底 + 靛字（防御性定义；本页分支与 tool/study 一致不渲染 redtag） */
.page-head.tone-plan .redtag{background:rgba(40,194,200,.07);color:#2A7F86;border-color:rgba(40,194,200,.22)}
/* hero 白瓷盘（青调）+ 双环：呼应「一周之约」的约定感 */
.page-head.tone-plan .ph-hero{z-index:3;
  width:56px;height:56px;   /* [2026-09-26 P2] 全局 88×88 → 56：60 时双环最外圈差 1px 被裁 */
  background:radial-gradient(circle at 32% 26%,#fff,#EAF7F8);
  box-shadow:0 10px 26px rgba(40,194,200,.20),inset 0 0 0 1px rgba(109,94,252,.20),
    0 0 0 8px rgba(40,194,200,.07),0 0 0 16px rgba(40,194,200,.03);
  color:#5B4BA8}

/* [2026-10-11 批137] 学习计划 plan 深色分支：浅周历纸感底 → 深底 */
html[data-theme="dark"] .page-head.tone-plan{
  background:
    radial-gradient(58% 120% at 96% 30%,rgba(40,194,200,.16),transparent 62%),
    radial-gradient(66% 110% at 2% 110%,rgba(109,94,252,.16),transparent 58%),
    linear-gradient(118deg,#171327 0%,#1C2636 50%,#201C33 100%);
  border-color:rgba(40,194,200,.22);
  box-shadow:0 12px 30px -16px rgba(0,0,0,.50)}
html[data-theme="dark"] .page-head.tone-plan .page-sub{color:#B8AEE0}
.page-head.tone-plan .ph-hero svg{width:28px;height:28px}   /* [2026-09-26 P2] 跟随 88→60 */
.page-head.tone-plan .ph-wm{display:none}   /* 防御：本版式用周历列线做底纹，不叠大号水印 */
@media (prefers-reduced-motion:reduce){
  .page-head.tone-plan .ph-hero{animation:none}}
@media (max-width:820px){
  .page-head.tone-plan{padding:22px 20px 24px}
  .page-head.tone-plan .page-h1{font-size:27px}
  .page-head.tone-plan .page-sub{font-size:14px}
  .page-head.tone-plan::before{display:none}   /* 窄屏优先可读性，去掉列线 */
}
/* 物理整页外壳（subj-phy-page）：透明 wrapper，配合 body[data-subject="physics"] 整页深空画布，不再做孤岛
   · 内部网格/水印装饰保留在 .phy-hero 自身；.subj-phy-page 仅作语义边界，杜绝「深空卡片浮在浅色页面」 */
.subj-phy-page{position:relative;overflow:visible;background:transparent;border:none;border-radius:0;
  padding:0;margin:0;box-shadow:none;color:#dbe7ff}
/* 水印挪到 fixed 位置，避免被 wrapper 边界裁切；网格已迁移到 body::before，统一绘制避免双层 */
.subj-phy-page::before{display:none}
.subj-phy-page::after{color:rgba(40,224,255,.22);position:fixed;right:24px;bottom:18px;z-index:1}
/* pageHead 在整页深空画布里走扁平样式（去掉自身大块衬底，靠发光标题+分隔线分隔内容）*/
.subj-phy-page > .page-head.tone-phy{margin:0 0 14px;border-radius:0;border-bottom:1px solid rgba(40,224,255,.16);padding:8px 0 14px}
/* qswitch 切到深空 chip 条 */
.subj-phy-page .v12-qswitch{background:rgba(13,18,38,.66);border:1px solid rgba(40,224,255,.18);box-shadow:0 8px 24px rgba(7,11,24,.32),inset 0 0 0 1px rgba(122,92,255,.08);backdrop-filter:blur(6px);color:#dbe7ff}
.subj-phy-page .v12-qswitch .qs-lbl{color:rgba(219,231,255,.55)}
.subj-phy-page .v12-qswitch .qs-pill{background:rgba(40,224,255,.06);color:#a5e9ff;border:1px solid rgba(40,224,255,.22)}
.subj-phy-page .v12-qswitch .qs-pill:hover:not(.on){background:rgba(40,224,255,.12);border-color:rgba(40,224,255,.45);color:#dbe7ff}
.subj-phy-page .v12-qswitch .qs-pill.on{background:linear-gradient(120deg,#28e0ff,#7a5cff);color:#03102a;font-weight:700;border-color:transparent;box-shadow:0 6px 16px rgba(40,224,255,.34),0 0 0 1px rgba(255,255,255,.10) inset}
.subj-phy-page .v12-qswitch .qs-sep{background:rgba(40,224,255,.18)}
/* 章节区域名小印：物理页无 chn-toc，但 #sxDomains / .chn-scroll-toc 等其他壳背景也要压暗 */
.subj-phy-page #subjChapters{position:relative;margin-top:14px}
.subj-phy-page #subjChapters .gx-chapter{background:rgba(13,18,38,.66);border:1px solid rgba(40,224,255,.18);color:#dbe7ff;backdrop-filter:blur(6px)}
.subj-phy-page #subjChapters .gx-chapter h3{color:#eaf1ff}

/* [2026-09-15] 物理深空页内的「前置基础 · 待确认」区块：琥珀色在深底上提亮，不与青色主调打架 */
.subj-phy-page .prereq-pending{background:linear-gradient(135deg,rgba(245,158,11,.10),rgba(249,115,22,.05));border-color:rgba(245,158,11,.34)}
.subj-phy-page .prereq-pending .pp-kicker{color:#ffd591;background:rgba(245,158,11,.18);border-color:rgba(245,158,11,.45)}
.subj-phy-page .prereq-pending .pp-sub,.subj-phy-page .prereq-pending .pp-note{color:rgba(219,231,255,.6)}
.subj-phy-page .prereq-pending .pp-item{border-left-color:rgba(245,158,11,.6)}
.subj-phy-page #subjChapters .gx-chapter small{color:rgba(219,231,255,.62)}
/* KP 小关面板深色适配（物理深空主题）
   · 原 .gx-kp 用 var(--kp-bg,#f8f9fc) 近白底 + var(--ink) 浅字 => 白底白字看不清
   · kpListHtml 会给每张卡写内联 style="--kp-bg:#f8f9fc;--kp-color:#9ca3af"，
     故此处必须用 !important 覆盖内联自定义属性 */
.subj-phy-page #subjKps{background:rgba(13,18,38,.55);border:1px solid rgba(40,224,255,.16);backdrop-filter:blur(6px)}
.subj-phy-page #subjKps .gx-sub,
.subj-phy-page .sx-kp-head .gx-sub{color:#eaf1ff}
.subj-phy-page .gx-kp{--kp-bg:rgba(13,18,38,.72)!important;--kp-color:#a5e9ff!important;
  background:rgba(13,18,38,.72);border:1px solid rgba(40,224,255,.18);color:#dbe7ff}
.subj-phy-page .gx-kp:hover{background:rgba(40,224,255,.10);border-color:rgba(40,224,255,.45);
  box-shadow:0 8px 22px -10px rgba(40,224,255,.34)}
.subj-phy-page .gx-kp-name{color:#eaf1ff}
.subj-phy-page .kp-ic{background:rgba(40,224,255,.08);border-color:rgba(40,224,255,.20)}
.subj-phy-page .gx-kp-mas{background:rgba(40,224,255,.08);color:#a5e9ff;border-color:rgba(40,224,255,.22)}
.subj-phy-page .gx-kp-mas i{color:#a5e9ff}
.subj-phy-page .gx-kp-video{color:#a5e9ff;background:rgba(40,224,255,.10)}
.subj-phy-page .gx-kp-video:hover{background:rgba(40,224,255,.20)}
.subj-phy-page .gx-kp-cta{color:#dbe7ff;background:linear-gradient(135deg,rgba(109,94,252,.32),rgba(40,194,200,.28));border-color:rgba(40,224,255,.45)}
.subj-phy-page .gx-kp-cta:hover{background:linear-gradient(135deg,rgba(109,94,252,.5),rgba(40,194,200,.45));box-shadow:0 4px 14px -4px rgba(40,224,255,.5)}
.subj-phy-page .sx-kp-back{background:rgba(13,18,38,.72);color:#dbe7ff;border-color:rgba(40,224,255,.22)}
.subj-phy-page .sx-kp-back:hover{background:rgba(40,224,255,.12);border-color:rgba(40,224,255,.45);color:#eaf1ff}
.subj-phy-page #subjKps .gx-muted{color:rgba(219,231,255,.62)}
/* 让 .subj-phy-page 内默认链接颜色压暗适配 */
.subj-phy-page .redtag,.subj-phy-page .link{color:#28e0ff}

/* ③ 内容区背景差异化（承接头部 tone · 让白卡浮在不同性格的画布上，告别全站一个奶油底）
   · 仅浅色模式生效；深色模式保持中性暗底，不回退 · 仅作用于 .main，不动 body 其余区域 */
html:not([data-theme="dark"]) body[data-tone="study"] .main{
  background:
    radial-gradient(120% 55% at 50% -8%,rgba(107,92,208,.14),transparent 60%),
    radial-gradient(85% 42% at 100% 0%,rgba(139,111,232,.10),transparent 55%),
    linear-gradient(180deg,#F7F5FE 0%,#F1EDFB 100%)}
html:not([data-theme="dark"]) body[data-tone="data"] .main{
  background-color:#F3F7FC;
  background-image:
    linear-gradient(rgba(59,130,246,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(59,130,246,.06) 1px,transparent 1px);
  background-size:28px 28px}
html:not([data-theme="dark"]) body[data-tone="tool"] .main{background:#FAFAFB}
html:not([data-theme="dark"]) body[data-tone="input"] .main{
  background:linear-gradient(180deg,#FFFAF5 0%,#FFF5EE 100%)}
/* 知识开门（tone-door）：门里透出的暖光留在页头，画布只承接一点余温，别抢工作台 */
html:not([data-theme="dark"]) body[data-tone="door"] .main{
  background:
    radial-gradient(115% 50% at 50% -6%,rgba(74,44,140,.12),transparent 62%),
    radial-gradient(70% 34% at 96% 0%,rgba(255,186,104,.14),transparent 60%),
    linear-gradient(180deg,#FAF7FF 0%,#F4F1FC 100%)}
/* 思维健身房（tone-gym）：紫青雾感画布，承接头部母题但不抢内容 */
html:not([data-theme="dark"]) body[data-tone="gym"] .main{
  background:
    radial-gradient(110% 46% at 82% -6%,rgba(40,194,200,.13),transparent 58%),
    radial-gradient(92% 42% at 8% 2%,rgba(139,111,232,.14),transparent 60%),
    linear-gradient(180deg,#F7F5FE 0%,#EFEBFB 100%)}/* 学习地图（tone-map）：极浅靛青雾画布，承接头部母题但不抢内容 */
html:not([data-theme="dark"]) body[data-tone="map"] .main{
  background:
    radial-gradient(108% 46% at 92% -6%,rgba(109,94,252,.11),transparent 58%),
    radial-gradient(88% 40% at 4% 2%,rgba(40,194,200,.11),transparent 60%),
    linear-gradient(180deg,#FBFBFF 0%,#F2F0FC 100%)}
/* 题单练习（tone-practice）：题卡纸感画布，承接头部母题但不抢下方统计卡 */
html:not([data-theme="dark"]) body[data-tone="practice"] .main{
  background:
    radial-gradient(105% 44% at 90% -6%,rgba(109,94,252,.10),transparent 56%),
    radial-gradient(85% 40% at 6% 2%,rgba(40,194,200,.09),transparent 58%),
    linear-gradient(180deg,#FCFCFF 0%,#F3F1FC 100%)}
/* 学习计划（tone-plan）：清晨周历画布，承接头部母题但不抢内容 */
html:not([data-theme="dark"]) body[data-tone="plan"] .main{
  background:
    radial-gradient(105% 44% at 88% -6%,rgba(40,194,200,.10),transparent 56%),
    radial-gradient(85% 40% at 8% 2%,rgba(109,94,252,.09),transparent 58%),
    linear-gradient(180deg,#FBFEFF 0%,#F2F1FC 100%)}

/* ============================================================
 * 通用 card（Linear 风格 · hairline border + 极轻投影 + 12px 圆角）
 * ============================================================ */
.card{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:18px 22px;box-shadow:var(--shadow-sm);margin-bottom:12px}
.card h4{font-size:var(--fs-md);font-weight:600;color:var(--ink);margin-bottom:8px;letter-spacing:var(--tr-snug)}
.card p{font-size:var(--fs-base);color:var(--ink-2);line-height:var(--lh-loose)}
.card-lg{padding:22px 26px}

/* ============================================================
 * Linear 风 inset 极简卡（截图参考 · 左上 icon + 标题 + 副文本 + 行动箭头）
 * 设计原则：单 hairline border + 单 icon 块 + 中性文字，无渐变无投影无大圆角
 * ============================================================ */
.inset{display:flex;flex-direction:column;gap:14px;background:var(--surface);
  border:1px solid var(--hair);border-radius:var(--r-lg);padding:24px 26px;
  cursor:pointer;transition:background .12s,border-color .12s;position:relative;overflow:hidden}
.inset:hover{background:var(--surface-2);border-color:var(--hair-strong)}
.inset .ic{width:44px;height:44px;border-radius:var(--r-md);
  background:linear-gradient(135deg,var(--purple),var(--cyan));color:#fff;
  display:flex;align-items:center;justify-content:center;flex:none;
  box-shadow:0 6px 14px -6px rgba(226,83,143,.55)}
.inset .ic svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.8;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.inset .ic.cy{background:linear-gradient(135deg,var(--cyan),#7fd6cb)}
.inset .ic.bk{background:linear-gradient(135deg,#F0A33B,#f6c46b)}
.inset .ic.gn{background:linear-gradient(135deg,var(--green),#6fd6a0)}
.inset b{font-size:var(--fs-md);font-weight:600;color:var(--ink);line-height:var(--lh-snug);
  letter-spacing:var(--tr-snug);display:block}
.inset span{font-size:var(--fs-sm);color:var(--ink-3);line-height:var(--lh-loose);display:block;
  margin-top:2px}
.inset .arrow{position:absolute;right:20px;top:50%;transform:translateY(-50%);
  width:22px;height:22px;color:var(--ink-3);opacity:.45;transition:transform .15s,opacity .15s}
.inset:hover .arrow{transform:translateY(-50%) translateX(2px);opacity:.8}
.inset .arrow svg{width:100%;height:100%;stroke:currentColor;stroke-width:1.6;fill:none;
  stroke-linecap:round;stroke-linejoin:round}

/* Inset grid（3 / 4 列自适应） */
.inset-grid{display:grid;gap:12px;grid-template-columns:repeat(3,1fr)}
.inset-grid.g4{grid-template-columns:repeat(4,1fr)}

/* ============================================================
 * Top stats（每页顶部 · 4 个数字 + label · Linear 风）
 * 用于屏学 / 题单 / 卡点 / 错本 / 听说 / 报告 顶部摘要
 * ============================================================ */
.top-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px}
.top-stat{position:relative;overflow:hidden;background:var(--surface);border:1px solid var(--hair);
  border-radius:var(--r-lg);padding:18px 18px;display:flex;flex-direction:column;gap:5px;box-shadow:var(--shadow-sm)}
.top-stat::before{content:"";position:absolute;right:-16px;top:-16px;width:60px;height:60px;border-radius:50%;opacity:.55}
.top-stat:nth-child(1)::before{background:rgba(226,83,143,.18)}
.top-stat:nth-child(2)::before{background:rgba(43,182,168,.18)}
.top-stat:nth-child(3)::before{background:rgba(240,163,59,.18)}
.top-stat:nth-child(4)::before{background:rgba(155,140,255,.18)}
.top-stat b{position:relative;z-index:1;font-family:var(--font-display);font-size:28px;font-weight:700;color:var(--ink);
  letter-spacing:var(--tr-tight);line-height:1}
.top-stat:nth-child(1) b{color:var(--purple-d)}
.top-stat:nth-child(2) b{color:var(--cyan-d)}
.top-stat:nth-child(3) b{color:var(--amber)}
.top-stat:nth-child(4) b{color:#7c6df5}
.top-stat .lbl{position:relative;z-index:1;font-size:11px;color:var(--ink-3);font-weight:500;letter-spacing:var(--tr-wide);
  text-transform:uppercase}
.top-stat .trend{position:relative;z-index:1;font-size:11px;font-weight:600;letter-spacing:var(--tr-snug)}
.top-stat .trend.up{color:var(--green)}
.top-stat .trend.dn{color:var(--red)}
.top-stat .trend.flat{color:var(--ink-3)}

/* ---- KPI per-page variant differentiation (2026-08-20) ---- */
/* errorbook: warm left accent + softer */
.top-stats--errorbook .top-stat{border-left:3px solid var(--amber);border-radius:14px}
.top-stats--errorbook .top-stat b{font-size:26px}
/* report: clean gradient top line */
.top-stats--report .top-stat{border-top:2.5px solid;color-mix(in srgb,var(--purple-d) 25%,transparent)}
.top-stats--report .top-stat:nth-child(1){border-top-color:var(--purple-d)}
.top-stats--report .top_stat:nth-child(2){border-top-color:var(--cyan-d)}
.top-stats--report .top-stat:nth-child(3){border-top-color:var(--amber)}
.top-stats--report .top-stat:nth-child(4){border-top-color:#7c6df5}
/* plan: progress-bar under number */
.top-stats--plan .top-stat{padding-bottom:14px}
.top-stats--plan .top-stat::after{content:'';position:absolute;bottom:0;left:18px;right:18px;height:3px;border-radius:2px;
  background:linear-gradient(90deg,var(--purple-d),color-mix(in srgb,var(--purple-d) 30%,#fff));opacity:.35}
/* control: technical / structured */
.top-stats--control .top-stat b{font-family:'Cascadia Code','Consolas',monospace,system-ui;font-size:24px;letter-spacing:-0.5px}
.top-stats--control .top-stat .lbl{text-transform:none;font-size:12px}
/* listening: audio rhythm feel */
.top-stats--listening .top-stat{background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--cyan-d) 4%,var(--surface)))}
/* essay: writing feel */
.top-stats--essay .top-stat b{font-style:italic;font-weight:600}
.top-stats--essay .top-stat .lbl{text-transform:none;font-style:italic}
/* stuck: problem-solving warmth — 浅底轻卡+强层级（拒绝黑块） */
.top-stats--stuck{gap:16px;margin-bottom:22px}
.top-stats--stuck .top-stat{
  position:relative;overflow:hidden;
  border-radius:16px;padding:18px 18px 16px;
  background:linear-gradient(168deg,#FFFFFF 0%,#FAF8FF 100%);
  border:1px solid rgba(139,111,232,.14);
  box-shadow:0 1px 2px rgba(40,30,38,.02),
             0 8px 22px -10px rgba(109,94,252,.22),
             0 18px 40px -18px rgba(109,94,252,.14);
  transition:transform .18s var(--ease-pop),box-shadow .18s ease,border-color .18s ease;
}
.top-stats--stuck .top-stat:hover{
  transform:translateY(-2px);
  border-color:rgba(139,111,232,.28);
  box-shadow:0 1px 2px rgba(40,30,38,.02),
             0 12px 28px -10px rgba(109,94,252,.28),
             0 24px 48px -18px rgba(109,94,252,.18);
}
/* 淡色装饰圆，不压暗卡片 */
.top-stats--stuck .top-stat::before{
  content:'';position:absolute;right:-14px;top:-14px;width:52px;height:52px;border-radius:50%;opacity:.22;z-index:0;
}
.top-stats--stuck .top-stat b{
  position:relative;z-index:1;
  font-size:32px;font-variant-numeric:tabular-nums;letter-spacing:-.03em;
}
.top-stats--stuck .top-stat .lbl{position:relative;z-index:1;color:var(--ink-3)}
.top-stats--stuck .top-stat:nth-child(1)::before{background:rgba(240,163,59,.28)}
.top-stats--stuck .top-stat:nth-child(1) b{color:#D4820F}
.top-stats--stuck .top-stat:nth-child(2)::before{background:rgba(43,182,168,.26)}
.top-stats--stuck .top-stat:nth-child(2) b{color:#0E9B8C}
.top-stats--stuck .top-stat:nth-child(3)::before{background:rgba(108,81,196,.24)}
.top-stats--stuck .top-stat:nth-child(3) b{color:#6C51C4}
.top-stats--stuck .top-stat:nth-child(4)::before{background:rgba(217,53,122,.20)}
.top-stats--stuck .top-stat:nth-child(4) b{color:#C42E6F}
/* [2026-09-19] 暗色主题数据卡片：**必须比页底亮**（旧值 #252230→#1E1B2E 与页底 #151229
   几乎同色 = 「深底加深底」，信息全部沉下去，用户实测反馈）。新层级：
   页底 #151229 → 卡片 #2D2748 + 1px #5B4EA6 弱发光描边 → 数字纯白放大 → 说明 #B8AEE0。
   分层顺序：页面底最深、卡片稍亮、标题更亮、按钮最亮（暗但清晰，不是全暗）。 */
[data-theme="dark"] .top-stats--stuck .top-stat{
  background:linear-gradient(168deg,#332C52 0%,#2D2748 100%);
  border:1px solid #5B4EA6;
  box-shadow:0 1px 0 rgba(255,255,255,.05) inset,
             0 0 18px -6px rgba(91,78,166,.55),
             0 14px 32px -14px rgba(0,0,0,.60),
             0 26px 56px -28px rgba(143,90,240,.35);
}
[data-theme="dark"] .top-stats--stuck .top-stat:hover{
  border-color:#7B6BC4;
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,
             0 0 24px -6px rgba(123,107,196,.65),
             0 18px 38px -14px rgba(0,0,0,.66),
             0 30px 64px -28px rgba(143,90,240,.42);
}
/* 数字纯白 + 继续放大；说明/趋势统一 #B8AEE0（旧值 --ink-3 在深底上发灰发旧） */
[data-theme="dark"] .top-stats--stuck .top-stat b{color:#FFFFFF;font-size:34px}
[data-theme="dark"] .top-stats--stuck .top-stat .lbl,
[data-theme="dark"] .top-stats--stuck .top-stat .trend{color:#B8AEE0}
[data-theme="dark"] .top-stats--stuck .top-stat::before{opacity:.30}
/* screen: 能量仪表块（2026-09-14 美化）—— 左缘色条 + emoji 徽片 + 大号等宽数字 + 悬浮抬升 */
.top-stats--screen{gap:14px}
.top-stats--screen .top-stat{border-radius:18px;padding:16px 18px 15px 21px;
  background:linear-gradient(168deg,#FFFFFF 0%,#FCFAFF 100%);
  border:1px solid rgba(139,111,232,.14);
  box-shadow:0 2px 4px rgba(40,30,38,.03),0 12px 26px -16px rgba(110,80,200,.30);
  transition:transform .22s var(--ease-pop),box-shadow .22s ease}
.top-stats--screen .top-stat:hover{transform:translateY(-3px);
  box-shadow:0 6px 10px rgba(40,30,38,.05),0 20px 34px -18px rgba(110,80,200,.42)}
/* 左缘纵向色条（紫 / 青 / 琥珀 / 玫 —— 与头部母题同源） */
.top-stats--screen .top-stat::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px}
.top-stats--screen .top-stat:nth-child(1)::after{background:linear-gradient(180deg,#8B6FE8,#6C51C4)}
.top-stats--screen .top-stat:nth-child(2)::after{background:linear-gradient(180deg,#40D6C4,#1E968C)}
.top-stats--screen .top-stat:nth-child(3)::after{background:linear-gradient(180deg,#FFC46B,#F0A33B)}
.top-stats--screen .top-stat:nth-child(4)::after{background:linear-gradient(180deg,#FF86B4,#D9357A)}
/* 右上装饰圆压柔（原 .55 不透明度偏脏） */
.top-stats--screen .top-stat::before{opacity:.5;right:-18px;top:-18px;width:66px;height:66px}
/* emoji 徽片 */
.top-stats--screen .ts-ic{position:relative;z-index:1;width:30px;height:30px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;font-size:15px;margin-bottom:4px;
  box-shadow:inset 0 0 0 1px rgba(139,111,232,.16)}
/* 徽片图标：全站统一线性 SVG（不依赖 emoji 字体，色随卡片母题） */
.top-stats--screen .ts-ic svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.9;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.top-stats--screen .top-stat:nth-child(1) .ts-ic{background:linear-gradient(140deg,#F3EFFF,#E7DFFD);color:#6C51C4}
.top-stats--screen .top-stat:nth-child(2) .ts-ic{background:linear-gradient(140deg,#E8FBF8,#D6F4EF);color:#1E968C}
.top-stats--screen .top-stat:nth-child(3) .ts-ic{background:linear-gradient(140deg,#FFF6E7,#FDEBD1);color:#D9861F}
.top-stats--screen .top-stat:nth-child(4) .ts-ic{background:linear-gradient(140deg,#FFEFF5,#FCE1EC);color:#D9357A}
/* 数字：放大 + 等宽（轮次/分钟跳动时不抖宽） */
.top-stats--screen .top-stat b{font-size:32px;font-variant-numeric:tabular-nums;letter-spacing:-.035em}
.top-stats--screen .top-stat .lbl{text-transform:none;font-size:12px;font-weight:600;
  letter-spacing:0;color:var(--ink-2)}
.top-stats--screen .top-stat .trend{font-size:11.5px}
/* bookshelf: book-spine feel */
.top-stats--bookshelf .top-stat{border-left:4px solid;color-mix(in srgb,var(--ink-2) 20%,transparent);padding-left:14px}
/* growth: data-rich */
.top-stats--growth .top-stat b{font-size:30px}
/* problemset: practice focus */
.top-stats--problemset .top-stat{border-radius:12px}

/* ---- Unified empty state (2026-08-20 P1-8) ---- */
.empty-state{text-align:center;padding:48px 24px;color:var(--ink-3)}
.empty-state .es-ic{font-size:48px;margin-bottom:14px;display:block;line-height:1}
.empty-state .es-title{font-size:16px;font-weight:700;color:var(--ink);margin-bottom:6px;display:block}
.empty-state .es-desc{font-size:13px;color:var(--ink-3);max-width:420px;margin:0 auto;line-height:1.55}

/* ============================================================
 * Action card（Linear 风 hero 卡 · 左 icon + 大标题 + 副文本 + 双按钮）
 * ============================================================ */
.action-card{background:linear-gradient(120deg,var(--surface),var(--surface-2));border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:24px 28px;margin-bottom:24px;display:grid;grid-template-columns:auto 1fr auto;gap:24px;
  align-items:center;box-shadow:var(--shadow-sm)}
.action-card .lead-ic{width:52px;height:52px;border-radius:var(--r-md);
  background:linear-gradient(135deg,var(--purple),var(--cyan));color:#fff;
  display:flex;align-items:center;justify-content:center;flex:none;
  box-shadow:0 8px 18px -8px rgba(226,83,143,.6)}
.action-card .lead-ic svg{width:26px;height:26px;stroke:currentColor;stroke-width:1.8;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.action-card h3{font-family:var(--font-display);font-size:20px;font-weight:600;color:var(--ink);
  letter-spacing:var(--tr-snug);line-height:var(--lh-snug);margin-bottom:4px}
.action-card p{font-size:var(--fs-sm);color:var(--ink-2);line-height:var(--lh-loose);max-width:540px}
.action-card .acts{display:flex;gap:8px;flex:none}

/* ============================================================
 * Callout（提示条 · 通用 · 紫色 / 青色 / 红色 三色变体）
 * ============================================================ */
.callout{display:flex;gap:12px;background:var(--surface);border:1px solid var(--hair);
  border-radius:var(--r-lg);padding:14px 16px;font-size:var(--fs-base);color:var(--ink-2);
  line-height:var(--lh-loose);align-items:flex-start;box-shadow:var(--shadow-sm)}
.callout .ci{width:18px;height:18px;flex:none;margin-top:1px}
.callout .ci svg{width:100%;height:100%;stroke:currentColor;stroke-width:1.8;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.callout.pri{color:var(--purple-d);border-color:rgba(91,77,224,.18);background:var(--purple-l)}
.callout.cy{color:var(--cyan-d);border-color:rgba(15,165,175,.18);background:var(--cyan-l)}
.callout.alert{color:#8A5A00;border-color:rgba(245,158,11,.22);background:rgba(245,158,11,.07)}
.callout b{font-weight:600;margin-right:4px}

/* ============================================================
 * 两列主区（桌面端常用 · 主 1fr + 侧 sidebar 280）
 * ============================================================ */
.two-col{display:grid;grid-template-columns:1fr 300px;gap:24px;margin-bottom:16px;align-items:start}

/* ============================================================
 * 专项工具三卡（#/extras：记忆法 / 思维导图 / 心算）
 * 2026-08-20 审计：原 mini 列宽 280px 把 textarea 与输出都挤到一栏，连排 3 张
 * 体验劣化；改响应式：≥1100 三栏（每张≥360）/780–1099 两栏 / <780 一栏。
 * ============================================================ */
.extras-grid{display:grid;gap:18px;grid-template-columns:1fr}
@media (min-width:780px){.extras-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.extras-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.extras-grid .gx-card{padding:18px 18px 16px;border:1px solid var(--line,#d8dce6);border-radius:14px;
  background:var(--surface,#fff);display:flex;flex-direction:column;min-width:0}
.extras-grid .gx-card h3{margin:0 0 4px;font-size:16px;font-weight:600;color:var(--ink-1,#1f2330)}
.extras-grid .gx-card p.sub{margin:0 0 10px;color:var(--muted,#6b7080);font-size:12.5px;line-height:1.55}
.extras-grid .gx-card textarea,
.extras-grid .gx-card input[type="text"],
.extras-grid .gx-card select{width:100%;box-sizing:border-box;padding:8px 10px;border-radius:8px;
  border:1px solid var(--line,#d8dce6);font:inherit;background:#fff;color:var(--ink-1,#1f2330);min-width:0}
.extras-grid .gx-card textarea{resize:vertical;min-height:54px}
.extras-grid .gx-card .acts{display:flex;gap:10px;margin-top:10px}
.extras-grid .gx-card .acts .btn{flex:1;font-size:13.5px;padding:9px 12px}
.extras-grid .gx-card .out{margin-top:12px;padding:12px;border-radius:10px;
  background:#f7f8fb;border:1px dashed var(--line,#d8dce6);font-size:13px;line-height:1.65;
  color:var(--ink-2,#3a3f4d);min-height:46px;word-break:break-word;overflow-wrap:anywhere}
.extras-grid .gx-card .out:empty::before{content:"—— 输出会显示在这里 ——";color:var(--muted,#9aa0b4)}
.extras-grid .gx-card .out pre{margin:0;font:inherit;white-space:pre-wrap;word-break:break-word}
.extras-grid .gx-card .out .offline-hint{display:inline-block;padding:3px 8px;border-radius:999px;
  background:#FFF1E6;color:#B45309;font-size:12px;margin-bottom:8px}
.extras-grid .gx-card .out .out-section{margin-top:10px}
.extras-grid .gx-card .out .out-section h5{margin:0 0 4px;font-size:13px;color:var(--ink-1,#1f2330);font-weight:600}
.extras-grid .gx-card .out .out-section .kp-chip{display:inline-block;padding:2px 8px;margin:2px 4px 2px 0;
  border-radius:999px;background:#EEF2FF;color:#4338CA;font-size:12.5px}
.extras-grid .gx-card .out .err{color:#B91C1C;font-size:12.5px}
.extras-grid .gx-card .out .mnemonic-line{margin:6px 0;padding:8px 10px;border-radius:8px;background:#fff;border:1px solid var(--line,#d8dce6)}
.extras-grid .gx-card .out .mnemonic-line b{color:var(--ink-1,#1f2330);margin-right:6px}
.extras-grid .gx-card .mental-q{padding:10px 12px;margin:8px 0;border-radius:10px;background:#fff;border:1px solid var(--line,#d8dce6)}
.extras-grid .gx-card .mental-q .q-level{font-size:12px;color:var(--muted,#6b7080);margin-bottom:4px;letter-spacing:.04em;text-transform:uppercase}
.extras-grid .gx-card .mental-q .q-text{font-size:14px;line-height:1.7;color:var(--ink-1,#1f2330)}
.extras-grid .gx-card .mental-q .q-input{display:flex;gap:8px;margin-top:8px;align-items:center}
.extras-grid .gx-card .mental-q .q-input input{flex:1;min-width:0}
.extras-grid .gx-card .mental-q .q-input .verdict{font-size:12.5px}
.extras-grid .gx-card .mental-q details{margin-top:8px;font-size:12.5px;color:var(--muted,#6b7080)}

/* ============================================================
 * Sub section（页内分组卡 · 标题 + 内容）
 * ============================================================ */
.sub-section{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:22px 26px;margin-bottom:16px}
.sub-section .sub-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.sub-section .sub-h h3{font-size:var(--fs-md);font-weight:600;color:var(--ink);letter-spacing:var(--tr-snug);
  display:flex;align-items:center;gap:10px}
.sub-section .sub-h h3 .ic{width:28px;height:28px;border-radius:var(--r-sm);
  background:linear-gradient(135deg,var(--purple),var(--cyan));color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 5px 12px -6px rgba(226,83,143,.5)}
.sub-section .sub-h h3 .ic svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.6;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.sub-section .sub-h .meta{font-size:11px;color:var(--ink-3);letter-spacing:var(--tr-wide);
  text-transform:uppercase;font-weight:500}

/* Chip row（学科 / 标签 / 类型 chip） */
.chip-row{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:5px;padding:4px 11px;border-radius:var(--r-pill);
  font-size:12px;font-weight:600;background:var(--surface);color:var(--ink-2);
  border:1px solid var(--hair);letter-spacing:var(--tr-snug);transition:background .12s,color .12s,border-color .12s}
.chip.on{background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;border-color:transparent;
  box-shadow:0 6px 14px -6px rgba(226,83,143,.5)}
.chip:hover{border-color:var(--hair-strong);color:var(--ink)}
.chip.on:hover{background:var(--purple-d);border-color:var(--purple-d);color:#fff}

/* ============================================================
 * Hero 区（克制 · hairline border + 极轻底色 · 不堆装饰）
 * ============================================================ */
.hero{display:grid;grid-template-columns:140px 1fr;gap:24px;align-items:center;
  background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:24px 26px;margin-bottom:24px;box-shadow:var(--shadow-sm)}
.hero.hero-single{grid-template-columns:1fr;padding:28px 30px}
.hero.hero-single .hero-bubble-full h3{font-size:24px}
.hero-stage{width:120px;height:150px;flex:none;margin:0 auto;display:flex;align-items:center;justify-content:center}
.hero-stage svg{width:100%;height:100%;animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.hero-bubble h3{font-family:var(--font-display);font-size:22px;color:var(--ink);
  font-weight:600;margin-bottom:6px;line-height:var(--lh-tight);letter-spacing:var(--tr-snug)}
.hero-bubble p{font-size:var(--fs-base);color:var(--ink-2);line-height:var(--lh-loose)}
.hero-quicks{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}

/* ============================================================
 * 行动光球（3 列 · 简化）
 * ============================================================ */
.orb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:24px}
.orb{position:relative;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-md);
  padding:18px 18px;box-shadow:var(--shadow-sm);
  transition:background .12s,border-color .12s;cursor:pointer}
.orb:hover{background:var(--surface-2);border-color:var(--hair-strong)}
.orb .ic{width:32px;height:32px;border-radius:var(--r-sm);background:var(--purple-l);
  display:flex;align-items:center;justify-content:center;color:var(--purple-d);margin-bottom:12px}
.orb .ic svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.orb b{display:block;font-size:var(--fs-md);color:var(--ink);font-weight:600;margin-bottom:3px;
  line-height:var(--lh-snug);letter-spacing:var(--tr-snug)}
.orb span{font-size:var(--fs-sm);color:var(--ink-3);line-height:var(--lh-loose)}

/* ============================================================
 * 学习旅程 · 大定位针（含描述行）
 * ============================================================ */
.journey-list{list-style:none;padding:0}
.jn{display:flex;align-items:flex-start;gap:14px;padding:10px 0;position:relative}
.jn:not(:last-child)::after{content:"";position:absolute;left:18px;top:38px;bottom:-6px;width:1px;background:var(--hair)}
.jn .pin{position:relative;flex:0 0 36px;width:36px;height:44px;z-index:1;margin-top:2px}
.jn .pin svg{width:36px;height:44px}
.jn .jn-card{flex:1;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-md);
  padding:10px 14px;display:flex;align-items:center;gap:12px}
.jn .jn-card .txt{flex:1;min-width:0}
.jn .jn-card b{display:block;font-size:var(--fs-md);color:var(--ink);font-weight:600;line-height:var(--lh-snug);
  letter-spacing:var(--tr-snug)}
.jn .jn-card span{display:block;font-size:var(--fs-sm);color:var(--ink-3);margin-top:2px;line-height:var(--lh-loose)}
.jn-badge{flex:0 0 auto;font-size:var(--fs-sm);font-weight:600;color:var(--ink-2);min-width:54px;text-align:right}
.jn-badge.ok{color:var(--green)}

/* ============================================================
 * 学科卡（响应式网格 · 现 11 个 canonical 学科）
 * ============================================================ */
.subj-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.subj{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--hair);
  border-radius:var(--r-md);padding:10px 12px;cursor:pointer;
  transition:background .12s,border-color .12s;color:inherit}
.subj:hover{background:var(--surface-2);border-color:var(--hair-strong)}
.subj .ic{width:32px;height:32px;flex:none;border-radius:var(--r-sm);
  background:linear-gradient(135deg,var(--purple),var(--cyan));color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 5px 12px -6px rgba(226,83,143,.5)}
.subj .ic svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.subj b{font-size:var(--fs-base);color:var(--ink);font-weight:600;display:block;line-height:var(--lh-tight);
  letter-spacing:var(--tr-snug)}
.subj span{font-size:11px;color:var(--ink-3);margin-top:2px;display:block;letter-spacing:var(--tr-snug)}

/* ============================================================
 * 家长绑定面板（Linear 风格 · hairline border + 极轻投影）
 * ============================================================ */
.bind-box{border:1px solid var(--hair);border-radius:var(--r-lg);padding:22px 24px;
  background:var(--surface);margin-bottom:16px}
.bind-box h4{font-size:var(--fs-md);color:var(--ink);font-weight:600;margin-bottom:6px;letter-spacing:var(--tr-snug)}
.bind-box .desc{font-size:var(--fs-base);color:var(--ink-2);line-height:var(--lh-loose);max-width:780px}
.bind-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;align-items:center}
.bind-row input{flex:1;min-width:240px;padding:7px 12px;border:1px solid var(--hair-strong);
  border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font-size:var(--fs-base);font-family:inherit;
  transition:border-color .12s,box-shadow .12s}
.bind-row input:focus{outline:none;border-color:var(--purple);
  box-shadow:0 0 0 3px rgba(91,77,224,.12)}
.bind-code-row{display:flex;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap}
.bind-code{font:600 22px/1 var(--font-mono);letter-spacing:4px;color:var(--purple-d)}
.bind-hint{margin-top:10px;font-size:var(--fs-sm);color:var(--cyan-d);line-height:var(--lh-loose)}
.bind-err{margin-top:10px;font-size:var(--fs-sm);color:var(--red);line-height:var(--lh-loose)}

/* ============================================================
 * 按钮（统一 · Linear 风格 · 不堆渐变）
 * ============================================================ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 14px;
  border-radius:var(--r-sm);border:1px solid var(--hair-strong);background:var(--surface);color:var(--ink);
  font-size:var(--fs-base);font-weight:500;cursor:pointer;
  transition:background .12s,border-color .12s,color .12s;font-family:inherit;
  letter-spacing:var(--tr-snug);line-height:var(--lh-tight)}
.btn:hover{background:var(--surface-2);border-color:var(--ink-4)}
.btn:active{transform:scale(.98)}
.btn.pri{background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;border-color:transparent;
  box-shadow:0 8px 18px -8px rgba(226,83,143,.55)}
.btn.pri:hover{background:linear-gradient(135deg,var(--purple-d),#a8336f);border-color:transparent}
.btn svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* ============================================================
 * 会话屏（屏学 · 左栏小伴 + 右栏对话流）
 *   · 窄屏：guide 隐藏（避免和右侧公仔重复 + 防塑料感回潮）
 * ============================================================ */
/* ---- 思维健身房 · 主题框 ---- */
.screen-topic-bar{margin:0 0 12px;padding:12px 16px;border-radius:12px;
  background:linear-gradient(135deg,rgba(109,94,252,.06),rgba(40,194,200,.04));
  border:1px solid rgba(109,94,252,.14)}
  /* [#200 用户要求：主题框不 sticky（可随对话滚走），仅在屏学顶部可见一次 */
.screen-topic-label{font-size:12px;font-weight:700;color:var(--purple);margin-bottom:8px;
  letter-spacing:.5px}
.screen-topic-row{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.screen-topic-row input{flex:1;padding:9px 14px;border-radius:10px;
  border:1px solid rgba(109,94,252,.22);background:#fff;font-size:14px;font-weight:600;
  color:var(--ink);outline:none;transition:border-color .2s,box-shadow .2s}
.screen-topic-row input:focus{border-color:var(--purple);
  box-shadow:0 0 0 3px rgba(109,94,252,.12)}
.screen-topic-row input::placeholder{color:var(--ink-3);font-weight:400}
.screen-topic-btn{padding:7px 18px;border-radius:10px;background:var(--purple);color:#fff;
  font-size:13px;font-weight:700;border:none;cursor:pointer;transition:background .2s,transform .15s}
.screen-topic-btn:hover{background:var(--purple-d);transform:translateY(-1px)}
.screen-topic-suggestions{display:flex;flex-wrap:wrap;gap:6px}
.screen-topic-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;
  border-radius:99px;border:1. solid var(--hair);background:#fff;font-size:12px;
  cursor:pointer;transition:all .2s;white-space:nowrap}
.screen-topic-chip:hover{border-color:var(--purple);box-shadow:0 2px 8px rgba(109,94,252,.12);transform:translateY(-1px)}
.screen-topic-chip.screen-topic-active{border-color:var(--purple);background:rgba(109,94,252,.08);
  box-shadow:0 0 0 2px rgba(109,94,252,.1)}
.screen-topic-chip span:first-child{font-size:15px;flex-shrink:0}
.screen-topic-chip b{font-size:12px;color:var(--ink)}
.screen-topic-chip small{display:block;font-size:10px;color:var(--ink-3);line-height:1.2}
.session{display:flex;flex-direction:column;gap:0;border-radius:var(--r-lg);
  overflow:hidden;border:1px solid var(--hair);margin-bottom:16px;background:var(--surface);
  height:60vh;min-height:420px;max-height:700px}
.session .guide{display:none}
.session .conv{padding:22px 24px;display:flex;flex-direction:column;gap:10px;
  flex:1;overflow-y:auto;min-height:0}
.bubble-xl{max-width:78%;padding:10px 14px;border-radius:var(--r-md);font-size:var(--fs-base);line-height:var(--lh-loose)}
.bubble-xl.xb{align-self:flex-start;background:var(--surface);border:1px solid var(--hair);color:var(--ink);
  border-bottom-left-radius:4px}
.bubble-xl.xb .who{font-size:11px;font-weight:500;color:var(--purple-d);margin-bottom:3px;display:block;
  letter-spacing:var(--tr-wide);text-transform:uppercase}
.bubble-xl.me{align-self:flex-end;background:linear-gradient(135deg,#28C2C8 0%,#1FB3A8 100%);color:#fff;border-bottom-right-radius:4px;box-shadow:0 2px 8px rgba(40,194,200,.25)}
.hint-xl{align-self:flex-start;max-width:78%;border:1px dashed rgba(15,165,175,.3);background:var(--cyan-l);
  border-radius:var(--r-md);padding:10px 14px;font-size:var(--fs-sm);color:var(--cyan-d);line-height:var(--lh-loose)}
.hint-xl .ht{font-size:11px;font-weight:500;color:var(--cyan-d);margin-bottom:3px;display:flex;align-items:center;gap:6px;
  letter-spacing:var(--tr-wide);text-transform:uppercase}

/* ===== [#745 2026-09-14] 学习页「小伴看到的这一页」扫描内容卡 =====
   眼睛页点「听小伴讲解」→ 学习页要把扫描内容（原文 + 缩略图）摆在页面上，
   不能只藏在一条消息里（用户报「要将扫描内容一起转到学习页面」）。 */
.xb-scan-card{margin:6px 0 14px;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-md);
  padding:12px 14px;box-shadow:0 2px 12px rgba(109,94,252,.07)}
.xb-scan-h{display:flex;align-items:center;gap:7px;font-size:var(--fs-sm);font-weight:600;color:var(--purple-d);
  margin-bottom:9px}
.xb-scan-ico{font-size:14px}
.xb-scan-sub{margin-left:auto;font-weight:500;font-size:12px;color:var(--ink-3);letter-spacing:var(--tr-wide)}
.xb-scan-img{display:block;max-width:100%;max-height:240px;width:auto;margin:0 auto 10px;border-radius:10px;
  border:1px solid var(--hair);object-fit:contain}
.xb-scan-body{font-size:var(--fs-base);line-height:var(--lh-loose);color:var(--ink);
  max-height:230px;overflow:auto;padding:10px 12px;border-radius:10px;background:var(--bg-2)}
.xb-scan-acts{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}
.xb-scan-hint{font-size:12px;color:var(--ink-3)}

/* ===== 思维健身房·可交互可视化气泡（沙箱 iframe）===== */
.viz-bubble{max-width:92%;padding:0}
.viz-frame{border:1px solid var(--hair);border-radius:var(--r-md);overflow:hidden;background:#fff;
  box-shadow:0 4px 20px rgba(40,30,90,.14);margin-top:4px}
.viz-bar{display:flex;align-items:center;gap:6px;padding:8px 14px;font-size:12px;font-weight:600;
  color:#fff;background:linear-gradient(135deg,#7C6BF0,#28C2C8);
  border-bottom:none;letter-spacing:var(--tr-wide);user-select:none}
.viz-bar .viz-ico{font-size:14px}
.viz-bar .viz-enlarge{margin-left:auto;border:1px solid var(--hair);background:transparent;color:inherit;font:inherit;font-size:11.5px;font-weight:600;padding:3px 11px;border-radius:99px;cursor:pointer;opacity:.72;transition:.15s;flex-shrink:0}
.viz-bar .viz-enlarge:hover{opacity:1;border-color:currentColor}
/* iframe 高度：给足空间放 canvas + 滑块 + 控件 + 说明文字。
   clamp(min, preferred, max)：桌面 480~720px（优先 66vh），移动端 400~580px（优先 70vh）。 */
.viz-iframe{display:block;width:100%;height:clamp(480px,66vh,720px);border:none;background:#fff;
  border-bottom-left-radius:0;border-bottom-right-radius:0}
@media (max-width:560px){.viz-bubble{max-width:100%}.viz-iframe{height:clamp(400px,70vh,580px)}}
/* [2026-10-08] 演示放大窗：居中大图，克隆同一份 srcdoc，交互完整保留；遮罩/✕/Esc 关闭 */
.viz-modal{position:fixed;inset:0;z-index:4000;display:none;align-items:center;justify-content:center;background:rgba(24,20,40,.55);backdrop-filter:blur(3px);padding:24px}
.viz-modal.is-open{display:flex}
.viz-modal-box{width:min(760px,94vw);height:min(86vh,700px);display:flex;flex-direction:column;background:#fff;border-radius:16px;box-shadow:0 24px 64px rgba(20,16,48,.35);overflow:hidden}
.viz-modal-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;font-size:13px;font-weight:700;color:#3A3352;background:#FAF8FF;border-bottom:1px solid #ECE8F6}
.viz-modal-close{border:none;background:transparent;color:#8A8398;font-size:15px;cursor:pointer;padding:2px 8px;border-radius:8px;line-height:1.4}
.viz-modal-close:hover{background:#EFEBFA;color:#3A3352}
/* [修复20261008] box 必须定高：容器无确定高度时 flex:1 子项高度=min-content=iframe 默认 150px，
   height:min(...) 在主轴上被 flex-basis 覆盖 → 弹窗塌成一条。定高后 flex:1 才真正撑满。 */
.viz-modal-iframe{display:block;width:100%;flex:1 1 auto;min-height:0;border:none;background:#fff}
[data-theme="dark"] .viz-modal-box{background:#221E33}
[data-theme="dark"] .viz-modal-bar{background:#2A2540;color:#E8E4F5;border-bottom-color:#3A3455}
[data-theme="dark"] .viz-modal-close{color:#9C95B5}
[data-theme="dark"] .viz-modal-close:hover{background:#3A3455;color:#E8E4F5}

/* ===== 思维健身房·正在思考（加载态）===== */
.typing-bubble{display:flex;align-items:center;gap:8px;padding:12px 16px;
  background:var(--surface);border:1px solid var(--hair);border-bottom-left-radius:4px;opacity:.85}
.typing-dots{display:inline-flex;gap:4px}
.typing-dots span{width:7px;height:7px;border-radius:50%;background:var(--purple);
  animation:typing-bounce 1.2s infinite ease-in-out}
.typing-dots span:nth-child(2){animation-delay:.15s}
.typing-dots span:nth-child(3){animation-delay:.30s}
.typing-label{font-size:13px;color:var(--ink-2);font-style:italic}
@keyframes typing-bounce{
  0%,80%,100%{transform:scale(.6);opacity:.4}
  40%{transform:scale(1);opacity:1}}
.composer{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--hair);
  border-radius:var(--r-md);padding:8px 10px;margin-top:auto;flex-shrink:0}
.composer input{flex:1;border:none;background:transparent;color:var(--ink);font-size:var(--fs-base);
  outline:none;padding:6px;font-family:inherit;letter-spacing:var(--tr-snug)}
.composer input::placeholder{color:var(--ink-3)}
.mic-btn{flex:0 0 auto;width:34px;height:34px;border-radius:var(--r-pill);border:none;cursor:pointer;
  background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;
  transition:background .12s,transform .12s;box-shadow:none}
.mic-btn:hover{background:var(--purple-d);transform:scale(1.04)}
.mic-btn svg{width:18px;height:18px;stroke:#fff;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.mic-btn.rec{background:var(--red);animation:czs-pulse 1.2s infinite}
.mic-btn.rec svg{width:18px;height:18px}
@keyframes czs-pulse{0%{box-shadow:0 0 0 0 rgba(236,90,110,.5)}70%{box-shadow:0 0 0 8px rgba(236,90,110,0)}100%{box-shadow:0 0 0 0 rgba(236,90,110,0)}}
/* 2026-08-26 统一 composer 工具栏按钮风格：线框+浅底（与 attach-btn 一致） */
.composer .mic-btn{flex:0 0 auto;width:36px;height:32px;padding:0;border-radius:var(--r-md);border:1px solid var(--hair);
  background:var(--surface);color:var(--ink);cursor:pointer;font-size:16px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  transition:background .12s,transform .12s,color .12s,border-color .12s}
.composer .mic-btn:hover{background:var(--purple);color:#fff;border-color:var(--purple);transform:scale(1.04)}
.composer .mic-btn.rec{background:var(--red);color:#fff;border-color:var(--red);animation:czs-pulse 1.2s infinite}
.composer .mic-btn svg{width:20px;height:20px;fill:currentColor;stroke:currentColor}
.eyes-mic.rec{background:var(--red);color:#fff;border-color:var(--red);animation:czs-pulse 1.2s infinite}
.send-btn{flex:0 0 auto;height:32px;padding:0 14px;border-radius:var(--r-md);border:none;cursor:pointer;
  background:var(--purple);color:#fff;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:center;
  transition:background .12s,transform .12s;box-shadow:none}
.send-btn:hover{background:var(--purple-d);transform:scale(1.04)}
.send-btn:disabled{background:var(--ink-3);cursor:not-allowed;transform:none}

/* [多模态输入] composer 附件按钮（图片/拍照/草图） */
.attach-btn{flex:0 0 auto;width:36px;height:32px;border-radius:var(--r-md);border:1px solid var(--hair);
  background:var(--surface);color:var(--ink);cursor:pointer;font-size:16px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  transition:background .12s,transform .12s,color .12s,border-color .12s}
.attach-btn:hover{background:var(--purple);color:#fff;border-color:var(--purple);transform:scale(1.04)}
/* 待发送附件预览条（composer 上方） */
.attach-preview{display:flex;align-items:center;gap:10px;padding:8px 10px;margin-bottom:8px;position:relative;
  background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-md)}
.attach-thumb{max-width:120px;max-height:84px;border-radius:var(--r-sm);border:1px solid var(--hair);object-fit:cover}
.attach-doc{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:var(--r-sm);
  background:var(--surface-2);font-size:13px;color:var(--ink);max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attach-doc-ico{font-size:16px;flex:0 0 auto}
.attach-remove{position:absolute;top:6px;right:8px;width:22px;height:22px;border-radius:50%;border:none;cursor:pointer;
  background:rgba(0,0,0,.45);color:#fff;font-size:12px;line-height:1;display:flex;align-items:center;justify-content:center}
.attach-remove:hover{background:var(--red)}
.attach-hint{font-size:12px;color:var(--ink-3)}
/* 已发送气泡内：图片缩略图 / 文档卡片 */
.bubble-attach{max-width:200px;max-height:150px;border-radius:10px;display:block;margin-bottom:6px;border:1px solid rgba(255,255,255,.25)}
.bubble-doc{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:10px;
  background:rgba(255,255,255,.16);font-size:13px;margin-bottom:6px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bubble-text{white-space:pre-wrap;word-break:break-word}
/* 拍照 / 手写草图 模态 */
.mm-overlay{position:fixed;inset:0;background:rgba(20,22,40,.6);display:flex;align-items:center;justify-content:center;z-index:9999}
.mm-panel{background:var(--surface);border-radius:var(--r-lg);padding:14px;box-shadow:0 12px 40px rgba(0,0,0,.3);max-width:94vw}
.mm-cam,.mm-sketch{display:flex;flex-direction:column;gap:10px}
.mm-video,.mm-canvas{width:min(80vw,520px);height:auto;background:#000;border-radius:var(--r-md);border:1px solid var(--hair)}
.mm-canvas{background:#fff;touch-action:none}
.mm-bar{display:flex;gap:10px;justify-content:center}
.mm-btn{height:38px;padding:0 18px;border-radius:var(--r-md);border:none;cursor:pointer;font-size:14px;font-weight:500;background:var(--surface-2);color:var(--ink)}
.mm-btn:hover{background:var(--hair)}
.mm-btn.mm-cancel{background:transparent;border:1px solid var(--hair)}
.mm-btn.mm-shoot{background:var(--purple);color:#fff}
.mm-btn.mm-shoot:hover{background:var(--purple-d)}

/* ============================================================
 * 通用 grid
 * ============================================================ */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}

/* ============================================================
 * 进度条 / 列表项（Linear 风格 · 行高紧凑 · 1px hairline）
 * ============================================================ */
.bar{height:6px;background:var(--surface-2);border-radius:99px;overflow:hidden;margin-top:6px}
.bar i{display:block;height:100%;background:var(--ink);border-radius:99px}
.rec-row{display:flex;align-items:center;gap:14px;padding:14px 18px;background:var(--surface);
  border:1px solid var(--hair);border-radius:var(--r-md);margin-bottom:8px;cursor:pointer;
  transition:background .12s,border-color .12s;min-height:60px}
.rec-row:hover{background:var(--surface-2);border-color:var(--hair-strong)}
/* 眼睛模块刚录入高亮条 */
.rec-row.hl-new{background:linear-gradient(90deg,rgba(226,83,143,.10),rgba(63,224,200,.06));
  border:1px solid rgba(226,83,143,.5);box-shadow:0 0 0 4px rgba(226,83,143,.06);position:relative}
.rec-row.hl-new::before{content:'';position:absolute;left:-3px;top:0;bottom:0;width:3px;background:var(--purple);border-radius:0 var(--r-pill) var(--r-pill) 0}
.tag{display:inline-block;font-size:11px;font-weight:600;padding:3px 10px;border-radius:var(--r-pill);
  flex:0 0 auto;letter-spacing:var(--tr-wide);text-transform:uppercase}
.tag.s1{color:var(--purple-d);background:var(--purple-l);border:1px solid rgba(91,77,224,.2)}
.tag.s2{color:var(--cyan-d);background:var(--cyan-l);border:1px solid rgba(15,165,175,.2)}
.tag.s3{color:var(--red);background:rgba(214,59,59,.06);border:1px solid rgba(214,59,59,.2)}
.tag.s4{color:var(--green);background:rgba(15,157,110,.06);border:1px solid rgba(15,157,110,.2)}
.rec-row .txt{flex:1;min-width:0}
.rec-row b{font-size:var(--fs-md);color:var(--ink);font-weight:600;display:block;line-height:1.3;
  letter-spacing:var(--tr-snug)}
.rec-row span{font-size:var(--fs-sm);color:var(--ink-3);margin-top:2px;display:block;line-height:1.5}
.rec-row .go{flex:0 0 auto;width:24px;height:24px;color:var(--ink-3);opacity:.6;
  transition:opacity .15s,transform .15s}
.rec-row:hover .go{opacity:1;transform:translateX(2px)}
.rec-row .go svg{width:100%;height:100%;stroke:currentColor;stroke-width:1.6;fill:none;
  stroke-linecap:round;stroke-linejoin:round}

/* ============================================================
 * 成长中枢
 * ============================================================ */
.gh-chips{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.gh-chip{border:1px solid var(--hair);background:var(--surface);color:var(--ink-2);
  font-size:13px;font-weight:600;padding:6px 14px;border-radius:var(--r-pill);cursor:pointer;
  transition:background .12s,border-color .12s,color .12s;letter-spacing:var(--tr-snug)}
.gh-chip:hover{border-color:var(--hair-strong);color:var(--ink)}
.gh-chip.on{color:#fff;background:var(--ink);border-color:var(--ink)}
.gh-graph-wrap{margin-top:14px;border:1px solid var(--hair);border-radius:var(--r-md);
  background:#fbfbfb;overflow:hidden}
.gh-graph-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;
  border-bottom:1px solid var(--hair);background:var(--surface)}
.gh-graph-title{display:flex;align-items:center;gap:10px;font-size:var(--fs-md);font-weight:600;color:var(--ink);
  letter-spacing:var(--tr-snug)}
.gh-graph-title .ic{width:28px;height:28px;border-radius:var(--r-sm);
  background:linear-gradient(135deg,var(--purple),var(--cyan));color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 5px 12px -6px rgba(226,83,143,.5)}
.gh-graph-title .ic svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.gh-graph-meta{font-size:var(--fs-sm);color:var(--ink-3);letter-spacing:var(--tr-snug)}
.gh-graph-head-r{display:flex;align-items:center;gap:14px}
.gh-zoombar{display:inline-flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--hair);
  border-radius:999px;background:var(--surface-2)}
.gh-zoom-btn{width:30px;height:30px;border:0;background:transparent;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;color:var(--ink-2);cursor:pointer;
  transition:background .15s,color .15s}
.gh-zoom-btn:hover{background:var(--purple-l);color:var(--purple-d)}
.gh-zoom-btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.gh-zoom-label{font-size:12px;color:var(--ink-3);min-width:44px;text-align:center;
  font-variant-numeric:tabular-nums;letter-spacing:.3px}
.gh-svg{display:block;width:100%;height:760px;background:linear-gradient(180deg,#FFFDFB 0%,#FBEFF4 100%);
  cursor:grab;touch-action:none;user-select:none}
.gh-svg.grabbing{cursor:grabbing}
.gh-svg text{font-family:Inter,Geist,"PingFang SC",-apple-system,sans-serif}
/* 主节点 label：20px + 600 weight + 5.5px 白底描边（halo 抗节点色干扰） */
.gh-svg text.node-label{font-weight:600;letter-spacing:.2px;
  fill:var(--ink);paint-order:stroke;stroke:#fbfbfb;stroke-width:5.5px;stroke-linejoin:round}
.gh-svg text.node-label.major{font-size:20px}
.gh-svg text.node-label.minor{font-size:13px;font-weight:500;fill:var(--ink-2);
  stroke-width:3.5px}
.gh-svg .edge{stroke-width:1.1}
.gh-svg .gnode{cursor:pointer;transition:opacity .15s}
.gh-svg .gnode:hover rect,.gh-svg .gnode:hover circle,.gh-svg .gnode:hover path{filter:drop-shadow(0 2px 4px rgba(0,0,0,.15))}
[data-theme="dark"] .gh-graph-wrap{background:#0d0d12}
[data-theme="dark"] .gh-graph-head{background:var(--surface-2);border-bottom-color:var(--hair)}
[data-theme="dark"] .gh-svg{background:linear-gradient(180deg,#0d0d12 0%,#0a0a0f 100%)}
[data-theme="dark"] .gh-zoombar{background:var(--surface);border-color:var(--hair)}
[data-theme="dark"] .gh-zoom-btn{color:var(--ink-2)}
[data-theme="dark"] .gh-zoom-btn:hover{background:var(--purple-l);color:var(--purple-d)}
[data-theme="dark"] .gh-zoom-label{color:var(--ink-3)}
[data-theme="dark"] .gh-svg text.node-label.major{stroke:#0d0d12}
[data-theme="dark"] .gh-svg text.node-label.minor{stroke:#0d0d12;fill:var(--ink-3)}
.gh-stat4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}
.gh-s{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-sm);
  padding:10px 6px;text-align:center;display:flex;flex-direction:column;gap:2px}
.gh-s b{font-size:var(--fs-xl);font-weight:600;color:var(--ink);line-height:var(--lh-tight);
  font-family:var(--font-display);letter-spacing:var(--tr-snug)}
.gh-s span{font-size:11px;color:var(--ink-3);letter-spacing:var(--tr-wide);text-transform:uppercase;font-weight:500}
.gh-diag-row{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.gh-diag{display:flex;gap:8px;font-size:var(--fs-sm);color:var(--ink-2);background:var(--surface);
  border:1px solid rgba(214,59,59,.14);border-radius:var(--r-sm);padding:8px 12px;align-items:flex-start}
.gh-diag b{flex:0 0 auto;color:var(--red);font-weight:600}
.gh-diag span{flex:1;line-height:var(--lh-loose)}
.gh-legend{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:10px;font-size:11px;color:var(--ink-3);
  letter-spacing:var(--tr-snug)}
.gh-lg{display:inline-flex;align-items:center;gap:5px}
.gh-lg i{width:8px;height:8px;border-radius:2px;display:inline-block}
.gh-bar{display:flex;align-items:center;gap:10px;margin:7px 0;font-size:var(--fs-sm);color:var(--ink-2)}
.gh-bar-l{flex:0 0 100px;font-weight:500;color:var(--ink);letter-spacing:var(--tr-snug)}
.gh-bar-track{flex:1;height:5px;background:var(--surface-2);border-radius:99px;overflow:hidden}
.gh-bar-track i{display:block;height:100%;background:var(--ink);border-radius:99px}
.gh-bar-v{flex:0 0 44px;font-weight:600;color:var(--ink);text-align:right;letter-spacing:var(--tr-snug)}
.gh-rec,.gh-evo{display:flex;gap:8px;font-size:var(--fs-sm);color:var(--ink-2);padding:7px 0;border-bottom:1px solid var(--hair);align-items:center}
.gh-rec b,.gh-evo b{flex:0 0 60px;color:var(--ink);font-weight:600;letter-spacing:var(--tr-snug)}
.gh-rec:last-of-type,.gh-evo:last-of-type{border-bottom:none}
/* #62 间隔复习卡片（接前端，替代离线占位） */
.gh-recs{display:flex;flex-direction:column;gap:10px}
.gh-sr{display:block;border:1px solid var(--hair);border-radius:var(--r-sm);padding:11px 13px;background:var(--surface)}
.gh-sr-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.gh-sr-top>b{flex:1 1 auto;color:var(--ink);font-weight:600;font-size:var(--fs-sm)}
.gh-sr-tag,.gh-sr-stage{font-size:11px;font-weight:600;padding:1px 8px;border-radius:99px;letter-spacing:var(--tr-wide);flex:0 0 auto}
.gh-sr-tag{color:var(--purple-d);background:var(--purple-l);border:1px solid rgba(226,83,143,.22)}
.gh-sr-stage{color:#B45309;background:#FFF3DF;border:1px solid rgba(180,83,9,.2)}
.gh-sr-prompt{margin:7px 0 10px;font-size:var(--fs-sm);line-height:var(--lh-loose);color:var(--ink-2)}
.sr-btns{display:flex;gap:7px;flex-wrap:wrap}
.sr-btn{font-size:var(--fs-sm);font-weight:600;border:none;border-radius:99px;padding:6px 13px;cursor:pointer;
  background:var(--hair);color:var(--ink);transition:transform .12s,filter .12s}
.sr-btn:hover{filter:brightness(.97);transform:translateY(-1px)}
.sr-ok{background:#DCFCE7;color:#15803D}
.sr-fz{background:#FEF3C7;color:#B45309}
.sr-fg{background:#FEE2E2;color:#B91C1C}
.sr-skip{background:transparent;color:var(--ink-3);border:1px solid var(--hair)}
.sr-add{background:var(--bn,#6D5EFC);color:#fff}
/* [R13 2026-09-21] 🔴 hover 底色必须逐变体钉住：本组件是 <button>，而 page.css:58 有
   一条**无作用域**的 `button:hover{background:var(--accent-d)}`（0,1,1）；本文件在 app.html 里
   **先于** page.css 加载，`.sr-ok:hover` 这种同特异性写法比不过文档顺序 ⇒ 必须用双类选择器
   把特异性抬到 (0,2,1)。实测（CDP forcePseudoState 强制 :hover）：修前 想起来了 #15803D/深紫 =
   **1.16**、有点模糊 **1.16**、忘了 **1.11**、稍后 **2.77** —— 四种都「字看不清」。
   修后各自回到本变体底色，对比度与静置一致（同 .gym-quick .asp-chip 的历史事故修法）。 */
.sr-btn.sr-btn:hover{background:var(--hair)}
.sr-btn.sr-ok:hover{background:#DCFCE7}
.sr-btn.sr-fz:hover{background:#FEF3C7}
.sr-btn.sr-fg:hover{background:#FEE2E2}
.sr-btn.sr-skip:hover{background:transparent}
.sr-btn.sr-add:hover{background:var(--bn,#6D5EFC)}
.gh-sr-add{display:flex;gap:8px;margin-top:10px}
.gh-sr-add input{flex:1 1 auto;border:1px solid var(--hair);border-radius:var(--r-sm);padding:8px 11px;font-size:var(--fs-sm);background:var(--surface);color:var(--ink)}
.gh-sr-add input:focus{outline:none;border-color:var(--bn,#6D5EFC)}
/* 离线占位标记：示例内容（非真实学情），仅作界面形态演示，运行版接入后端后替换 */
.gh-mock{opacity:.7}
.gh-mock .gh-ph{display:inline-block;font-size:10px;font-weight:600;color:var(--purple-d);
  background:var(--purple-l);border:1px solid rgba(226,83,143,.22);padding:1px 7px;border-radius:99px;
  margin-left:6px;letter-spacing:var(--tr-wide);vertical-align:middle}
.gh-redline{margin-top:12px;font-size:var(--fs-sm);line-height:var(--lh-loose);color:var(--ink-2);
  background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-sm);padding:10px 14px}
.gh-toast{position:fixed;left:50%;bottom:48px;transform:translateX(-50%) translateY(16px);
  max-width:88%;background:var(--ink);color:#fff;font-size:var(--fs-sm);line-height:var(--lh-loose);padding:10px 16px;
  border-radius:var(--r-sm);box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;
  transition:opacity .15s,transform .15s;z-index:80}
.gh-toast.show{opacity:.95;transform:translateX(-50%) translateY(0)}
/* [2026-10-06 · 物理深色壳兜底] 深空背景上 .gh-toast 不可读。
 *
 * ⚠️ [2026-10-06 修正 P0 · 前一版 selectors 全是死代码]
 *   前一版写的是 `html.phy-shell .gh-toast` + `!important`，看着很硬，实则**永不命中**：
 *   物理学科页走 SPA 壳 app.html，而 app.html **根本不加载 physics-shell.css**，
 *   且它自己**从不给 <html> 加 .phy-shell**（实测 html.className === ''，只有 body 挂
 *   `.phy-darkonly`）。于是唯一生效的仍是 .gh-toast{background:var(--ink);color:#fff}，
 *   而物理页强制 data-theme=dark ⇒ --ink = #FFFFFF（desktop.css L2501）
 *   ⇒ **白底 + 白字**＝用户截图里那团"重影/看不清"的 toast。
 *   （"重影"其实是白字压在近白底上、边缘抗锯齿残留造成的视觉错觉，不是元素重复。）
 *
 * 修法：作用域改成**真实存在的** `body.phy-darkonly`（app.js 进物理学科页时挂的），
 *   并把深色字与浅底一起显式给出，不依赖 --ink 的取值。
 *   口径：浅底 #F2EDFF + 深墨字 #1A1530 ⇒ 对比度 ≈ 15:1，远超 AA 4.5:1。 */
body.phy-darkonly .gh-toast,
body.phy-darkonly .gh-toast.show{
  background:#F2EDFF !important;
  color:#1A1530 !important;
  border:1px solid rgba(122,92,255,.55) !important;
  box-shadow:0 0 0 1px rgba(122,92,255,.35),0 12px 40px rgba(0,0,0,.65) !important;
  font-weight:600 !important;
}

/* [#t888 2026-10-18 · 全局深色档兜底] .gh-toast 用 --ink 当**底色**，深色主题里 --ink 近白、
   而文字恒为 #fff ⇒ 白底白字，真机上只剩一个白色空胶囊（等于没有提示）。
   #t888 修的正是「点了没反应」——这个 toast 是提示的主通道之一，所以在这里给全局兜底，
   口径与上面 gym / 物理两条一致（深卡底 + 纯白字），浅色档不动。 */
[data-theme="dark"] .gh-toast{background:#2D2748;color:#FFFFFF;box-shadow:0 0 0 1px #3A3164,0 10px 28px rgba(0,0,0,.55)}

/* ============================================================
 * 小伴公仔外壳（容器定位 · 不影响 shadowRoot 内部子元素）
 * 真正改造在 desktop-patch.js 里穿透 shadowDOM
 * ============================================================ */
mascot-companion#xb-companion{position:fixed;right:36px;top:50%;transform:translateY(-50%);
  z-index:60;width:auto;height:auto;pointer-events:none;
  display:none !important} /* 旧 v4 呼吸公仔视觉隐藏；右侧改由 mascot-v5-embed.js 注入的 v5 iframe 常驻（#568） */

/* 小伴问候气泡（首页浮动 · 多巴胺陪伴感） */
.xb-greet{position:fixed;right:34px;bottom:132px;z-index:59;max-width:228px;pointer-events:none;
  background:var(--surface);border:1px solid var(--hair);border-radius:18px 18px 18px 4px;
  padding:12px 14px;box-shadow:var(--shadow-lg);font-size:var(--fs-sm);color:var(--ink-2);
  line-height:var(--lh-loose);filter:drop-shadow(0 6px 14px rgba(226,83,143,.18))}
.xb-greet .who{display:block;font-size:11px;font-weight:600;color:var(--purple-d);margin-bottom:3px;
  letter-spacing:var(--tr-wide);text-transform:uppercase}
.xb-greet::after{content:"";position:absolute;right:18px;bottom:-7px;width:14px;height:14px;
  background:var(--surface);border-right:1px solid var(--hair);border-bottom:1px solid var(--hair);
  transform:rotate(45deg)}
@media (max-width:1100px){.xb-greet{display:none}}
@media (prefers-reduced-motion:reduce){.xb-greet{animation:none}}

/* 首页打卡连胜徽标（接 czs-pop 弹性反馈） */
.streak-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px 8px 12px;border-radius:var(--r-pill);
  background:linear-gradient(135deg,var(--purple),var(--cyan));color:#fff;font-weight:600;
  box-shadow:0 10px 22px -10px rgba(226,83,143,.6);cursor:pointer;border:0;font-family:inherit}
.streak-badge .flame{font-size:18px;line-height:1}
.streak-badge b{font-family:var(--font-display);font-size:20px;font-weight:700;letter-spacing:var(--tr-tight)}
.streak-badge .lbl{font-size:11px;font-weight:500;opacity:.9;letter-spacing:var(--tr-wide);text-transform:uppercase}
.streak-badge.pop b{animation:czs-pop .5s var(--ease-pop) both}
.streak-badge:active{transform:scale(.95)}
.streak-row{display:flex;align-items:center;gap:14px;margin-bottom:24px;flex-wrap:wrap}

/* ============================================================
 * 空状态 / 提示
 * ============================================================ */
.empty{padding:28px;text-align:center}
.empty .skel-ill{width:96px;height:120px;color:var(--purple);opacity:.85;margin:0 auto 10px}
.empty h4{font-size:var(--fs-lg);font-weight:600;color:var(--ink);margin-bottom:4px;letter-spacing:var(--tr-snug)}
.empty p{font-size:var(--fs-base);color:var(--ink-2);line-height:var(--lh-loose);max-width:400px;margin:0 auto}
.muted{color:var(--ink-3);font-size:var(--fs-sm);line-height:var(--lh-loose)}
.tiny{font-size:11px;color:var(--ink-3);line-height:var(--lh-loose);letter-spacing:var(--tr-snug)}
.note-bar{margin-top:12px;padding:10px 14px;border-radius:var(--r-sm);background:var(--surface-2);
  border:1px solid var(--hair);font-size:var(--fs-sm);color:var(--ink-2);line-height:var(--lh-loose)}

/* ============================================================
 * 创归思之眼（系统之眼 · 首页摄像头 / 高拍仪）
 * 清晰度档：高拍仪级 · canvas 抽帧 jpeg 0.92 高保真 · 屏幕渲染贴近原画
 * ============================================================ */
.eyes-card{position:relative;overflow:hidden;background:linear-gradient(135deg,#FFF1F7 0%,#EAFBF6 100%);
  border:1px solid var(--hair);border-radius:var(--r-lg);padding:26px 28px;margin-bottom:26px}
.eyes-glow{position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle,rgba(226,83,143,.20),transparent 70%);pointer-events:none}
.eyes-head{position:relative;z-index:1}
.eyes-badge{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;letter-spacing:var(--tr-wide);
  color:var(--purple-d);background:rgba(255,255,255,.7);border:1px solid var(--purple-l);padding:4px 12px;border-radius:var(--r-pill)}
.eyes-badge .dot{width:8px;height:8px;border-radius:50%;background:var(--purple);box-shadow:0 0 0 4px var(--purple-l);
  animation:eyesBadgePulse 2s ease-in-out infinite}
@keyframes eyesBadgePulse{0%,100%{box-shadow:0 0 0 4px var(--purple-l)}50%{box-shadow:0 0 0 7px var(--purple-l)}}
.eyes-title{font-family:var(--font-display);font-size:26px;font-weight:700;letter-spacing:var(--tr-tight);
  color:var(--ink);margin:12px 0 6px;line-height:1.15}
.eyes-sub{font-size:var(--fs-base);color:var(--ink-2);line-height:var(--lh-loose);max-width:680px;margin:0}
.eyes-body{position:relative;z-index:1;display:flex;flex-direction:column;gap:18px;margin-top:20px}
.eyes-stage{position:relative;aspect-ratio:16/9;border-radius:var(--r-md);overflow:hidden;
  background:repeating-linear-gradient(45deg,rgba(226,83,143,.04) 0 8px,transparent 8px 16px);
  border:1px dashed var(--purple-l);display:flex;align-items:center;justify-content:center;min-height:260px;
  transition:border-color .3s, box-shadow .3s}
/* 高清档：object-fit:contain 保留全画面，filter 微调，image-rendering sharp */
.eyes-video{width:100%;height:100%;object-fit:contain;display:block;background:#F4F2EE;
  image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;image-rendering:high-quality;
  filter:contrast(1.06) saturate(1.03) brightness(1.02);
  cursor:zoom-in}
.eyes-video:hover{outline:2px dashed rgba(226,83,143,.45);outline-offset:-4px}
/* 选区截图 overlay：进入选区模式时覆盖整个 stage，画布与 stage 同尺寸 */
.eyes-sel{position:absolute;inset:0;z-index:5;background:transparent;display:block}
.eyes-sel[hidden]{display:none}
.eyes-sel #eyesSelCanvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair;touch-action:none}
.eyes-sel .eyes-sel-tip{position:absolute;left:50%;top:10px;transform:translateX(-50%);
  background:rgba(15,13,28,.7);color:#fff;font-size:12px;padding:4px 10px;border-radius:999px;
  pointer-events:none;white-space:nowrap}
/* 选区模式二级工具栏：覆盖在眼睛动作栏上方 */
.eyes-sel-tools{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.eyes-sel-tools[hidden]{display:none}
.eyes-sel-tools .btn{font-size:13px !important;padding:7px 14px !important;border-radius:var(--r-pill)}
.eyes-sel-tools .btn[data-sel-mode].on,
.eyes-sel-tools .btn.ghost{background:rgba(226,83,143,.1);border:1px solid var(--purple-l);color:var(--purple-d)}
/* [#t893] 选区工具条贴到遮罩底部（永远可见，不再挂底部动作栏）。深色药丸底 + 白字，压在暗化画布上可读。 */
.eyes-sel .eyes-sel-tools{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:7;
  max-width:calc(100% - 24px);background:rgba(22,17,42,.86);padding:8px 10px;border-radius:999px;
  box-shadow:0 10px 30px rgba(8,4,22,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.eyes-sel .eyes-sel-tools .btn{color:#fff;box-shadow:none}
.eyes-sel .eyes-sel-tools .btn.ghosts{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);color:#fff}
.eyes-sel .eyes-sel-tools .btn.ghosts:hover{background:rgba(255,255,255,.28)}
.eyes-sel .eyes-sel-tools .btn.ghost{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.26);color:#F2EEFF}
.eyes-sel .eyes-sel-tools .btn.pri{background:linear-gradient(135deg,#7b5cff,#4ad7d9);border:none;color:#fff}
#eyesSnapSel{background:linear-gradient(135deg,#7b5cff,#4ad7d9) !important;color:#fff !important;border:none !important;
  box-shadow:0 4px 12px rgba(123,92,255,.25)}
/* 上传预览图（独立样式，不复用 video） */
.eyes-shot{width:100%;height:100%;object-fit:contain;display:block;background:#F4F2EE;cursor:zoom-in;
  image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;image-rendering:high-quality}
/* [#t893] 图框内滚动视口：PM「看图用右边上下拉条」。空态（shot 隐藏）时整层 display:none，
   不遮挡摄像头/占位按钮；双图模式 display:contents 让 img 仍是 grid 子项（不破并排布局）。 */
.eyes-shot-scroll{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;background:transparent;
  display:none;scrollbar-width:thin}
.eyes-shot-scroll:has(> .eyes-shot:not([hidden])){display:block}
.eyes-card[data-kind="split"] .eyes-shot-scroll{display:contents!important}
.eyes-shot-scroll::-webkit-scrollbar{width:10px}
.eyes-shot-scroll::-webkit-scrollbar-thumb{background:rgba(109,94,252,.45);border-radius:999px;
  border:2px solid transparent;background-clip:content-box}
.eyes-shot-scroll::-webkit-scrollbar-track{background:transparent}
.eyes-card[data-kind="detected-exercise"] .eyes-stage,
.eyes-card[data-kind="detected-text_passage"] .eyes-stage{background:rgba(246,242,236,.92)}
/* 上传图独立显示（shot 模式）：占满 stage */
.eyes-card[data-kind="shot"] .eyes-shot{width:100%;height:100%;object-fit:contain;display:block}
/* 双图模式：左流 + 右图，两图并排、各占 50% */
.eyes-card[data-kind="split"] .eyes-stage{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  aspect-ratio:auto;
  align-items:stretch;
  background:#F8F6F2;
  min-height:340px;
  padding:6px;
  overflow-x:auto;   /* 窄屏触发横向滚动 */
  scroll-snap-type:x mandatory;
}
.eyes-card[data-kind="split"] .eyes-video,
.eyes-card[data-kind="split"] .eyes-shot{
  width:100%;height:100%;min-width:0;
  object-fit:contain;border-radius:14px;border:1px solid var(--hair);
  background:#F4F2EE;scroll-snap-align:start;
  image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges
}
@media (max-width:980px){
  .eyes-card[data-kind="split"] .eyes-stage{grid-template-columns:minmax(260px,1fr) minmax(260px,1fr)}
}
@media (max-width:680px){
  .eyes-card[data-kind="split"] .eyes-stage{grid-template-columns:minmax(260px,90vw);min-height:260px}
}
.eyes-card[data-kind="split"] .eyes-video::after,
.eyes-card[data-kind="split"] .eyes-shot::after{content:""}
.eyes-placeholder{display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--ink-3);text-align:center;padding:28px 20px}
/* 高拍仪空状态增强：更大图标 + 拍摄框暗示（2026-08-20 P1-11） */
.eyes-placeholder::before{content:'';position:absolute;inset:12px;border:2px dashed rgba(139,111,232,.2);border-radius:14px;pointer-events:none}
.eyes-eye{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,var(--purple),var(--cyan));
  color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 28px -10px rgba(226,83,143,.65)}
.eyes-eye svg{width:32px;height:32px;stroke:#fff;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.eyes-placeholder[hidden]{display:none !important}
.eyes-placeholder p{margin:0;font-size:var(--fs-base);color:var(--ink-2);font-weight:600}
.eyes-tip{font-size:11px;color:var(--ink-3)}
.eyes-hint-strong{color:#a13b6c !important;font-weight:700 !important;background:rgba(226,83,143,.08);padding:6px 10px;border-radius:999px;display:inline-block}
.eyes-grant{font-size:14px !important;font-weight:600 !important;background:linear-gradient(135deg,var(--purple),var(--cyan)) !important;color:#fff !important;border:none !important;padding:8px 18px !important}
.eyes-grant:disabled{opacity:.55;cursor:wait}
/* 📸 截图存错题本 主按钮（更醒目一点，与「授权摄像头」并列时易识别） */
#eyesSnap{font-size:14px !important;font-weight:600 !important;
  background:linear-gradient(135deg,#FF7E5F,#FEB47B) !important;color:#fff !important;border:none !important;padding:8px 18px !important;
  box-shadow:0 4px 12px rgba(255,126,95,.25)}
#eyesSnap:hover{filter:brightness(1.05);box-shadow:0 6px 18px rgba(255,126,95,.35)}
#eyesSnap[hidden]{display:none}
.eyes-fallback{margin-top:6px;background:transparent;border:1px dashed var(--purple-l);color:var(--purple-d);
  font-size:12px;padding:4px 14px;border-radius:var(--r-pill);cursor:pointer;transition:all .2s}
.eyes-fallback:hover{background:var(--purple-l);color:var(--ink)}
.eyes-detect{position:absolute;right:14px;bottom:14px;display:flex;align-items:center;gap:8px;font-size:12px;
  font-weight:600;color:#fff;background:linear-gradient(135deg,#E2538F,#2BB6A8);padding:6px 14px;border-radius:var(--r-pill);
  box-shadow:0 6px 18px -6px rgba(226,83,143,.7);letter-spacing:var(--tr-snug);z-index:2}
.eyes-detect .pulse{width:8px;height:8px;border-radius:50%;background:#fff;animation:eyesPulse 1.4s ease-in-out infinite}
@keyframes eyesPulse{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.25)}}
/* 上下文结果卡（小伴主动问 + 闭环动作）—— 默认贴底绝对定位（非 detected 态复用） */
.eyes-ctx{position:absolute;left:14px;right:14px;bottom:14px;background:rgba(255,255,255,.97);
  backdrop-filter:blur(10px);border:1px solid rgba(226,83,143,.4);border-radius:var(--r-md);padding:14px 18px;
  box-shadow:0 12px 32px -10px rgba(226,83,143,.25);font-size:14px;color:var(--ink);animation:eyesCtxIn .4s ease;z-index:3;
  max-height:calc(100% - 28px);overflow-y:auto}
/* detected 态：stage 改为纵向弹性布局（图在上、ctx 在下），ctx 紧跟图片永不沉底 */
.eyes-card[data-kind^="detected-"]{overflow:visible}
.eyes-card[data-kind^="detected-"] .eyes-stage{
  display:flex;flex-direction:column;overflow:visible;
  aspect-ratio:auto;min-height:420px;
  border-style:solid;border-color:rgba(226,83,143,.4);
  box-shadow:0 0 0 6px rgba(226,83,143,.08)}
.eyes-card[data-kind^="detected-"] .eyes-shot{width:100%;height:auto;max-height:48vh;object-fit:contain;order:0}
.eyes-card[data-kind^="detected-"] .eyes-ctx{
  position:relative;left:auto;right:auto;bottom:auto;max-height:none;overflow-y:visible;
  order:2;flex-shrink:0}
/* [#723] 对话历史：识别后保留小伴/用户每句气泡，可滚动；置于图片之下、动作条之上 */
.eyes-card[data-kind^="detected-"] .eyes-chat{order:1;max-height:32vh}
@keyframes eyesCtxIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
/* [#723] 对话历史气泡（小伴在左、用户在右） */
.eyes-chat{display:flex;flex-direction:column;gap:8px;max-height:32vh;overflow-y:auto;
  padding:10px 12px;margin-top:10px;background:rgba(255,255,255,.72);border:1px solid rgba(109,94,252,.18);
  border-radius:var(--r-md);font-size:13.5px;color:var(--ink)}
.eyes-chat .eyes-msg{max-width:88%;padding:8px 12px;border-radius:14px;line-height:1.55;
  animation:eyesMsgIn .3s ease both;word-break:break-word}
.eyes-chat .eyes-msg .who{display:inline-block;font-size:11px;font-weight:700;opacity:.65;margin-right:6px}
.eyes-chat .eyes-msg-bot{align-self:stretch;max-width:100%;background:linear-gradient(135deg,#f3edff,#e7faf7);
  border:1px solid rgba(109,94,252,.22);border-bottom-left-radius:4px;border-radius:14px}
.eyes-chat .eyes-msg-user{align-self:flex-end;background:linear-gradient(135deg,#6D5EFC,#28C2C8);color:#fff;
  border-bottom-right-radius:4px}
.eyes-chat .eyes-msg-user .who{color:rgba(255,255,255,.85)}
@keyframes eyesMsgIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.eyes-ctx .ctx-tip{font-size:13px;color:var(--ink-2);line-height:1.55;margin-bottom:10px}
.eyes-ctx .ctx-tip b{color:var(--purple-d)}
.eyes-ctx .ctx-actions{display:flex;flex-wrap:wrap;gap:8px}
.eyes-ctx .ctx-actions .btn{flex:1 1 auto;min-width:140px;font-size:14px;padding:9px 12px}
.eyes-ctx .ctx-tell{margin-top:10px;display:flex;gap:8px;align-items:center}
.eyes-ctx .ctx-tell input{flex:1;padding:8px 12px;border:1px solid var(--hair);border-radius:var(--r-pill);
  font-size:14px;background:#fff;color:var(--ink)}
.eyes-ctx .ctx-tell .btn{padding:8px 14px;font-size:13px}
/* 对话式输入：小伴问"哪道题不明白" → 讲解并存入错题本 */
.eyes-ctx .ctx-ask{margin-bottom:10px;display:flex;gap:8px;align-items:center;background:rgba(226,83,143,.07);
  border:1px solid rgba(226,83,143,.25);border-radius:var(--r-pill);padding:6px 6px 6px 14px}
.eyes-ctx .ctx-ask input{flex:1;border:none;background:transparent;font-size:14px;color:var(--ink);outline:none}
.eyes-ctx .ctx-ask input::placeholder{color:var(--ink-3)}
.eyes-ctx .ctx-ask .btn{flex:0 0 auto;padding:8px 16px;font-size:14px}
/* 改动 B：识别后顶部「小伴建议下一步」强 CTA 卡——醒目标签 + 主推/次推按钮，让 4 个承接环节一眼可见 */
.eyes-ctx .ctx-propose{margin:-2px 0 12px;padding:11px 14px;border-radius:var(--r-md);
  background:linear-gradient(135deg,rgba(109,94,252,.12),rgba(40,194,200,.14));
  border:1.5px solid rgba(109,94,252,.45);box-shadow:0 6px 20px -8px rgba(109,94,252,.5)}
.eyes-ctx .ctx-propose-h{display:block;font-size:12.5px;font-weight:700;letter-spacing:.3px;color:var(--purple-d);margin-bottom:9px}
.eyes-ctx .ctx-propose-actions{display:flex;flex-wrap:wrap;gap:8px}
.eyes-ctx .ctx-propose-actions .btn{flex:1 1 auto;min-width:140px;font-size:14px;padding:10px 12px;font-weight:600;
  animation:eyesProposePop .42s cubic-bezier(.2,.9,.3,1.2) both}
.eyes-ctx .ctx-propose-actions .btn:nth-child(2){animation-delay:.07s}
@keyframes eyesProposePop{from{opacity:0;transform:translateY(7px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
/* 首次安装·小伴问名字 onboarding 模态 */
.name-onboard{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;overflow:auto;padding:24px;
  background:rgba(20,16,40,.55);backdrop-filter:blur(4px);animation:eyesCtxIn .35s ease}
.name-onboard-card{width:min(420px,86vw);background:#fff;border-radius:18px;padding:28px 26px;
  box-shadow:0 24px 60px -16px rgba(226,83,143,.4);text-align:center;border:1px solid rgba(226,83,143,.25)}
.name-onboard-card .no-xb{margin-bottom:8px}
.name-onboard-card .who{display:inline-block;font-weight:800;color:var(--purple-d);
  background:rgba(226,83,143,.1);padding:4px 12px;border-radius:999px;font-size:14px}
.name-onboard-card .no-greet{font-size:16px;line-height:1.7;color:var(--ink);margin:8px 0 18px}
.name-onboard-card .no-input{width:100%;padding:12px 14px;border:1px solid var(--hair);border-radius:12px;
  font-size:15px;background:var(--bg-2);color:var(--ink);text-align:center;margin-bottom:16px;outline:none}
.name-onboard-card .no-input:focus{border-color:var(--purple)}
.name-onboard-card .no-acts{display:flex;gap:10px;justify-content:center}
/* 2026-08-21：首次资料卡（欢迎页）扩展样式 */
.po-card{text-align:left;width:min(460px,90vw)}
.po-card .po-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.po-card .po-title{font-size:18px;color:var(--ink)}
.po-card .po-sub{font-size:13px;color:var(--ink-2);line-height:1.6;margin:4px 0 14px}
.po-card .po-steps{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.po-card .po-dot{font-size:12px;color:var(--ink-3);background:var(--bg-2);padding:3px 9px;border-radius:999px}
.po-card .po-dot.on{color:#fff;background:var(--purple)}
.po-card .po-dot.done{color:var(--purple-d);background:rgba(139,107,232,.14)}
.po-card .po-hint{display:block;font-size:11px;color:var(--ink-3);margin-top:8px;line-height:1.5}
.po-card .po-grade{display:flex;flex-direction:column;gap:10px;margin:6px 0}
.po-card .po-grade-btn{width:100%;text-align:left;padding:14px 16px;border:1px solid var(--hair);border-radius:12px;
  background:var(--bg-2);color:var(--ink);font-size:15px;cursor:pointer;transition:.15s}
.po-card .po-grade-btn.sel{border-color:var(--purple);background:rgba(139,107,232,.12);font-weight:700}
.po-card .po-scores{display:flex;flex-direction:column;gap:8px;margin:6px 0;max-height:42vh;overflow:auto}
.po-card .po-score-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--hair)}
.po-card .po-score-name{font-size:14px;color:var(--ink)}
.po-card .po-score-btns{display:flex;gap:6px}
.po-card .po-lv{padding:6px 12px;border:1px solid var(--hair);border-radius:999px;background:#fff;color:var(--ink-2);
  font-size:13px;cursor:pointer;transition:.15s}
.po-card .po-lv.sel{border-color:var(--purple);background:var(--purple);color:#fff;font-weight:700}
.po-card .po-grade-num{margin-top:10px}
.po-card .po-grade-num-row{display:flex;flex-wrap:wrap;gap:8px}
.po-card .po-grade-num-btn{padding:8px 14px;border:1px solid var(--hair);border-radius:10px;background:#fff;color:var(--ink);font-size:14px;cursor:pointer;transition:.15s;min-width:64px}
.po-card .po-grade-num-btn:hover{border-color:var(--purple);color:var(--purple)}
.po-card .po-grade-num-btn.sel{border-color:var(--purple);background:var(--purple);color:#fff;font-weight:700}
.po-card #poNext[disabled]{opacity:.45;cursor:not-allowed}
.po-card .po-fallback-tip{font-size:11px;color:#B45309;background:#FEF3C7;border:1px solid #FCD34D;border-radius:8px;padding:6px 10px;margin-top:6px;line-height:1.5}
/* 选择层 · 同步/补弱双模式（T1） */
.sel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px 16px;margin-bottom:14px}
.sel-row{display:flex;align-items:center;gap:10px}
.sel-row .sel-l{min-width:40px;font-size:14px;color:var(--ink-2);font-weight:600}
.sel-row .sel-s{flex:1;padding:8px 10px;border:1px solid var(--hair);border-radius:10px;background:var(--bg-2);
  color:var(--ink);font-size:14px;outline:none}
.sel-row .sel-s:focus{border-color:var(--purple)}
.sel-mode{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px;
  padding:10px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.sel-mode-l{font-size:14px;color:var(--ink-2);font-weight:600}
.sel-mode .seg{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--ink);cursor:pointer;user-select:none}
.sel-mode .seg input{width:18px;height:18px;accent-color:var(--purple)}
.sel-acts{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sel-acts .btn{padding:10px 22px;font-size:15px;border-radius:var(--r-pill)}
.sel-note{font-size:12px;color:var(--ink-3);line-height:1.5;flex:1;min-width:200px}
/* 操作区（下方一整行，按钮全部展开） */
.eyes-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:6px 4px 0}
.eyes-actions-hint{font-size:13px;color:var(--ink-3);font-weight:500}

/* ===== 语文学科专属功能网格（2026-08-26 接入思维健身房多模态后，主页补语文专项入口）===== */
.chn-feat{margin:22px 0 4px}
.chn-feat-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.chn-feat-title{font-size:20px;font-weight:700;color:var(--ink);margin:0}
.chn-feat-sub{font-size:13px;color:var(--ink-3)}
.chn-feat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.chn-card{display:flex;align-items:center;gap:14px;padding:16px 18px;background:var(--surface);border:1px solid var(--line,var(--hair));border-radius:var(--r-lg,14px);text-decoration:none;color:inherit;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;min-width:0}
.chn-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(225,29,72,.4);border-color:rgba(225,29,72,.4)}
.chn-card-ic{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex:0 0 auto}
.chn-card-bd{display:flex;flex-direction:column;gap:3px;min-width:0}
.chn-card-bd b{font-size:15px;color:var(--ink);font-weight:600}
.chn-card-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.4}
.chn-card-go{margin-left:auto;font-size:13px;color:var(--cn,#E11D48);font-weight:600;flex:0 0 auto}
.chn-ask{display:flex;align-items:center;gap:14px;margin-top:14px;padding:16px 18px;background:linear-gradient(135deg,rgba(225,29,72,.07),rgba(225,29,72,.02));border:1px solid rgba(225,29,72,.22);border-radius:var(--r-lg,14px);text-decoration:none;color:inherit;transition:transform .15s ease,box-shadow .15s ease}
.chn-ask:hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(225,29,72,.4)}
.chn-ask-ic{width:42px;height:42px;border-radius:50%;background:var(--cn,#E11D48);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;flex:0 0 auto}
.chn-ask-bd{display:flex;flex-direction:column;gap:3px;min-width:0}
.chn-ask-bd b{font-size:15px;color:var(--ink);font-weight:600}
.chn-ask-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.5}
.chn-ask-go{margin-left:auto;font-size:13px;color:var(--cn,#E11D48);font-weight:600;flex:0 0 auto;white-space:nowrap}
[data-theme="dark"] .chn-card,[data-theme="dark"] .chn-ask{background:var(--surface-2,#1e2030)}
/* ===== 物理专属 · 深空科技感（母题 A：深空蓝黑 + 发光网格 + 矢量场 + HUD） ===== */
/* 物理 hero：始终深色面板，独立于页面明暗主题 */
.phy-hero{position:relative;overflow:hidden;margin:18px 0 14px;padding:48px 36px;border-radius:0;
  /* [#544] hero 完全融入底色：去掉圆角、取消 linear 底色，仅保留右侧微弱 radial 发光打亮矢量场；hero 与 body 是同一片深空，不再切出独立亮卡片 */
  background:
    radial-gradient(900px 520px at 84% -12%, rgba(40,224,255,.10) 0%, transparent 62%),
    radial-gradient(820px 480px at 4% 116%, rgba(122,92,255,.12) 0%, transparent 58%);
  border:0;box-shadow:none;color:#dbe7ff}
  /* [#542] 物理 hero 嵌入底色：去掉外框 box-shadow，让 hero 与 body 深空画布融合；靠内部 radial 发光 + 网格营造深空质感，不再做"卡片浮在页面上"观感 */
.phy-hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(40,224,255,.10) 1px,transparent 1px),linear-gradient(90deg,rgba(40,224,255,.10) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(circle at 60% 40%,#000 0%,transparent 80%);mask-image:radial-gradient(circle at 60% 40%,#000 0%,transparent 80%);opacity:.6;pointer-events:none}
.phy-hero-in{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;min-height:360px}
.phy-kicker{display:inline-flex;align-items:center;gap:9px;font-size:12px;letter-spacing:3px;color:#28e0ff;border:1px solid rgba(40,224,255,.4);padding:6px 13px;border-radius:999px;background:rgba(40,224,255,.07);text-transform:uppercase}
.phy-kicker .d{width:7px;height:7px;border-radius:50%;background:#28e0ff;box-shadow:0 0 12px #28e0ff;animation:phyPulse 1.6s infinite}
.phy-title{font-size:44px;line-height:1.08;margin:18px 0 14px;font-weight:800;letter-spacing:.5px;color:#eaf1ff}
.phy-title .g{background:linear-gradient(90deg,#28e0ff,#3af0c8);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 30px rgba(40,224,255,.35)}
.phy-lede{color:#9fb2d8;font-size:15px;line-height:1.75;max-width:440px}
.phy-acts{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}
.phy-hero .btn{border:1px solid rgba(130,148,189,.4);background:rgba(255,255,255,.04);color:#dbe7ff}
.phy-hero .btn.pri{background:linear-gradient(135deg,#28e0ff,#7a5cff);color:#04111f;border:none;box-shadow:0 0 24px rgba(40,224,255,.45)}
.phy-hero .btn:hover{transform:translateY(-2px)}
.phy-stats{display:flex;gap:24px;margin-top:26px;align-items:center}
.phy-stat-col{display:flex;flex-direction:column;gap:8px}
.phy-stat-col .row{display:flex;gap:22px}
.phy-stat-col b{font-size:26px;color:#dbe7ff;text-shadow:0 0 16px rgba(122,92,255,.4)}
.phy-stat-col span{display:block;font-size:12px;color:#8294bd;letter-spacing:1px}
.phy-stat-note{font-size:12px;color:#8294bd}
.phy-viz{position:relative;height:360px;border:1px solid rgba(40,224,255,.2);border-radius:20px;overflow:hidden;background:linear-gradient(160deg,rgba(18,28,58,.55),rgba(5,7,15,.9));box-shadow:inset 0 0 60px rgba(40,224,255,.10)}
.phy-viz svg{position:absolute;inset:0;width:100%;height:100%}
.phy-scan{position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,#28e0ff,transparent);opacity:.5;animation:phyScan 4.2s linear infinite}
.phy-hud{position:absolute;font-family:ui-monospace,Menlo,monospace;font-size:11px;color:#28e0ff;opacity:.85;letter-spacing:1px}
.phy-hud.tl{top:14px;left:16px}.phy-hud.br{bottom:14px;right:16px;text-align:right;line-height:1.7}
.phy-spin{transform-origin:center;animation:phySpin 20s linear infinite}
.phy-orbit{transform-origin:center;animation:phyOrbit 8s linear infinite}
.phy-orbit-r{transform-origin:center;animation:phyOrbit 13s linear infinite;animation-direction:reverse}
.phy-dash{stroke-dasharray:5 7;animation:phyFlow 3s linear infinite}

/* 四大领域矩阵 */
.phy-domains{margin:6px 0 4px}
.phy-dom-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.phy-dom-title{font-size:20px;font-weight:700;color:#dbe7ff;margin:0}
.phy-dom-sub{font-size:13px;color:#8294bd}
.phy-dom-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.phy-dom{position:relative;padding:18px 16px 20px;border-radius:16px;border:1px solid rgba(130,148,189,.22);background:linear-gradient(160deg,rgba(20,30,60,.5),rgba(6,9,18,.65));overflow:hidden;transition:.25s;text-decoration:none;color:inherit}
.phy-dom:hover{transform:translateY(-3px);border-color:rgba(40,224,255,.5);box-shadow:0 14px 36px rgba(40,224,255,.14)}
  .phy-dom.on{border-color:rgba(40,224,255,.7);background:linear-gradient(160deg,rgba(40,224,255,.16),rgba(122,92,255,.10));box-shadow:0 0 0 1px rgba(40,224,255,.35) inset,0 14px 36px rgba(40,224,255,.18)}
.phy-dom::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(#28e0ff,#7a5cff);box-shadow:0 0 12px #28e0ff}
.phy-dom .ico{font-size:26px;filter:drop-shadow(0 0 8px rgba(40,224,255,.5))}
.phy-dom h3{font-size:16px;margin:10px 0 5px;color:#eaf1ff}
.phy-dom p{font-size:12.5px;color:#8294bd;line-height:1.6;min-height:38px}
.phy-dom .cnt{margin-top:10px;font-size:12px;color:#28e0ff;font-family:ui-monospace,monospace}
.phy-dom .cnt b{font-size:15px}

/* 实验舱网格：PhET 主视觉大卡 + 其余胶囊条（去盒子化） */
.phy-feat{margin:22px 0 4px}
.phy-feat-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.phy-feat-title{font-size:20px;font-weight:700;color:#dbe7ff;margin:0}
.phy-feat-sub{font-size:13px;color:#8294bd}
.phy-phet{display:flex;align-items:center;gap:16px;padding:14px 18px;margin-bottom:10px;border-radius:14px;text-decoration:none;color:inherit;
  background:linear-gradient(135deg,rgba(255,110,199,.44),rgba(255,110,199,.22)),rgba(255,255,255,.08);border:1px solid rgba(255,110,199,.50);border-left:3px solid rgba(255,110,199,.95);transition:.2s;overflow:hidden;position:relative;box-sizing:border-box;height:98px}
.phy-phet:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(255,110,199,.18);border-color:rgba(255,110,199,.6)}
.phy-phet-art{flex:0 0 auto;width:56px;height:56px}
.phy-phet-bd{display:flex;flex-direction:column;gap:6px;min-width:0}
.phy-phet-bd b{font-size:15px;color:#eaf1ff;font-weight:600;line-height:1.3}
.phy-phet-bd small{font-size:12.5px;color:#9fb2d8;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.phy-phet-go{margin-left:auto;flex:0 0 auto;background:linear-gradient(135deg,#28e0ff,#7a5cff);color:#04111f;font-size:12.5px;font-weight:700;padding:7px 14px;border-radius:99px;white-space:nowrap;box-shadow:0 4px 12px rgba(40,224,255,.4)}
.phy-caps{display:flex;flex-wrap:wrap;gap:12px}
/* [#545] 物理实验舱 2 列横排卡片（数学工具箱 sfeat-card 范式适配深空黑背景）：
  *   每张卡通过 inline style 注入 --accent（边框/icon/进入按钮色）+ --softBg（icon 背景色）
  *   左 3px 彩色边 + 右下进入按钮用对应色，hover 时整卡浮起 + 描边色发光 */

.phy-cap{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:99px;text-decoration:none;color:#dbe7ff;font-size:14px;font-weight:600;
  background:linear-gradient(135deg,rgba(20,30,60,.6),rgba(6,9,18,.7));border:1px solid rgba(40,224,255,.22);transition:.18s}
.phy-cap:hover{transform:translateY(-2px);border-color:rgba(40,224,255,.55);box-shadow:0 10px 24px rgba(40,224,255,.14);color:#fff}
.phy-cap .e{font-size:18px}
.phy-ask{display:flex;align-items:center;gap:14px;margin-top:16px;padding:16px 18px;border-radius:14px;text-decoration:none;color:inherit;
  background:linear-gradient(135deg,rgba(40,224,255,.10),rgba(122,92,255,.05));border:1px solid rgba(40,224,255,.28);transition:.18s}
.phy-ask:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(40,224,255,.16)}
.phy-ask-ic{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#28e0ff,#7a5cff);color:#04111f;display:flex;align-items:center;justify-content:center;font-size:20px;flex:0 0 auto}
.phy-ask-bd{display:flex;flex-direction:column;gap:3px;min-width:0}
.phy-ask-bd b{font-size:15px;color:#eaf1ff;font-weight:600}
.phy-ask-bd small{font-size:12.5px;color:#9fb2d8;line-height:1.5}
.phy-ask-go{margin-left:auto;font-size:13px;color:#28e0ff;font-weight:600;flex:0 0 auto;white-space:nowrap}
@keyframes phyPulse{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes phyScan{0%{top:0}100%{top:100%}}
@keyframes phySpin{to{transform:rotate(360deg)}}
@keyframes phyOrbit{to{transform:rotate(360deg)}}
@keyframes phyFlow{to{stroke-dashoffset:-48}}
/* 化学主页（试管实验台母题 · 绿青品牌色 #10B981→#06B6D4） */
.chem-hero{position:relative;overflow:hidden;margin:18px 0 14px;padding:42px 36px;border-radius:20px;
  background:
    radial-gradient(820px 480px at 86% -14%, rgba(16,185,129,.12) 0%, transparent 60%),
    radial-gradient(760px 460px at 2% 118%, rgba(6,182,212,.12) 0%, transparent 58%),
    linear-gradient(135deg, rgba(16,185,129,.06), rgba(6,182,212,.04));
  border:1px solid rgba(16,185,129,.18);box-shadow:0 18px 48px -28px rgba(16,185,129,.5);color:var(--ink)}
.chem-hero-glow{position:absolute;inset:0;background-image:radial-gradient(rgba(16,185,129,.5) 1px,transparent 1px);background-size:30px 30px;-webkit-mask-image:radial-gradient(circle at 70% 36%,#000 0%,transparent 72%);mask-image:radial-gradient(circle at 70% 36%,#000 0%,transparent 72%);opacity:.18;pointer-events:none}
.chem-hero-in{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;min-height:340px}
.chem-kicker{display:inline-flex;align-items:center;gap:9px;font-size:12px;letter-spacing:2px;color:#0F766E;border:1px solid rgba(16,185,129,.4);padding:6px 13px;border-radius:999px;background:rgba(16,185,129,.08);text-transform:uppercase}
.chem-kicker .dot{width:7px;height:7px;border-radius:50%;background:#10B981;box-shadow:0 0 12px #10B981;animation:chemPulse 1.6s infinite}
.chem-title{font-size:42px;line-height:1.08;margin:18px 0 14px;font-weight:800;letter-spacing:.5px;color:var(--ink)}
.chem-title .g{background:linear-gradient(90deg,#10B981,#06B6D4);-webkit-background-clip:text;background-clip:text;color:transparent}
.chem-lede{color:var(--ink-3);font-size:15px;line-height:1.75;max-width:440px}
.chem-acts{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}
.chem-hero .btn{border:1px solid rgba(15,118,110,.35);background:#fff;color:var(--ink)}
.chem-hero .btn.pri{background:linear-gradient(135deg,#10B981,#06B6D4);color:#fff;border:none;box-shadow:0 10px 24px -8px rgba(16,185,129,.55)}
.chem-hero .btn:hover{transform:translateY(-2px)}
.chem-stats{display:flex;gap:24px;margin-top:26px;align-items:center}
.chem-stat-col{display:flex;flex-direction:column;gap:8px}
.chem-stat-col .row{display:flex;gap:22px}
.chem-stat-col b{font-size:26px;color:var(--ink)}
.chem-stat-col span{display:block;font-size:12px;color:var(--ink-3);letter-spacing:1px}
.chem-stat-note{font-size:12px;color:var(--ink-3)}
.chem-viz{position:relative;height:340px;border:1px solid rgba(16,185,129,.22);border-radius:20px;overflow:hidden;background:linear-gradient(160deg,rgba(16,185,129,.06),rgba(6,182,212,.05));box-shadow:inset 0 0 60px rgba(16,185,129,.08)}
.chem-viz svg{position:absolute;inset:0;width:100%;height:100%}
.chem-mol{transform-origin:center;animation:chemFloat 5s ease-in-out infinite}
.chem-tiles{animation:chemFloat 6.5s ease-in-out infinite}
@keyframes chemPulse{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes chemFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* 四大知识域矩阵（化学） */
.chem-domains{margin:18px 0 6px}
.chem-dom-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:0 0 18px;padding:0 4px}
.chem-dom-title{font-size:21px;font-weight:800;color:var(--ink);margin:0;letter-spacing:-.3px}
.chem-dom-sub{font-size:13px;color:var(--ink-3);max-width:560px;line-height:1.5}
.chem-dom-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.chem-dom{position:relative;display:flex;flex-direction:column;padding:0;border-radius:20px;border:1.5px solid rgba(16,185,129,.15);background:linear-gradient(165deg,#fff 40%,rgba(16,185,129,.03) 100%);overflow:hidden;transition:.3s cubic-bezier(.22,1,.36,1);text-decoration:none;color:inherit;min-height:200px}
.chem-dom:hover{transform:translateY(-5px) scale(1.01);border-color:rgba(16,185,129,.45);box-shadow:0 20px 50px -12px rgba(16,185,129,.2),0 0 0 1px rgba(16,185,129,.06) inset}
.chem-dom.is-empty{opacity:.55}
/* 左侧色带 + 角标装饰 */
.chem-dom::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--pc,#10B981),color-mix(in srgb,var(--pc,#10B981) 60%,#fff));box-shadow:2px 0 14px -2px color-mix(in srgb,var(--pc,#10B981) 40%,transparent)}
.chem-dom::after{content:"";position:absolute;top:12px;right:12px;width:28px;height:28px;border-radius:8px;background:var(--pc,#10B981);opacity:.07;transform:rotate(12deg)}
/* 图标区 */
.chem-dom-art{padding:22px 20px 12px;height:72px;display:flex;align-items:center;justify-content:center}
.chem-dom-art svg{width:56px;height:56px;color:var(--pc,#10B981);filter:drop-shadow(0 4px 10px color-mix(in srgb,var(--pc,#10B981) 30%,transparent))}
/* 内容区 */
.chem-dom-body{padding:0 18px 14px;flex:1;display:flex;flex-direction:column}
.chem-dom h3{font-size:17px;margin:0 0 6px;color:var(--ink);font-weight:700;letter-spacing:-.2px}
.chem-dom p{font-size:12.5px;color:var(--ink-3);line-height:1.65;margin:0 0 12px;flex:1}
/* 浏览按钮 */
.chem-dom-go{display:inline-flex;align-items:center;font-size:12.5px;font-weight:600;color:var(--pc,#10B981);gap:4px;transition:gap .2s}
.chem-dom:hover .chem-dom-go{gap:8px}
/* 章数角标 */
.chem-dom-badge{position:absolute;bottom:14px;right:16px;font-size:11.5px;color:var(--ink-3);background:rgba(16,185,129,.07);border:1px solid rgba(16,185,129,.12);padding:4px 10px;border-radius:99px;font-family:ui-monospace,monospace}
.chem-dom-badge b{color:var(--pc,#10B981);font-weight:700;font-size:13px}

/* 化学专属行动条（方程式配平挑战） */
.chem-cta{display:flex;align-items:center;gap:16px;margin:14px 0 4px;padding:16px 20px;border-radius:16px;text-decoration:none;color:inherit;
  background:linear-gradient(135deg,rgba(16,185,129,.10),rgba(6,182,212,.05));border:1px solid rgba(16,185,129,.28);transition:.2s;box-sizing:border-box}
.chem-cta:hover{transform:translateY(-2px);box-shadow:0 14px 32px -12px rgba(16,185,129,.4);border-color:rgba(16,185,129,.5)}
.chem-cta-ic{width:46px;height:46px;border-radius:13px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#10B981,#06B6D4);color:#fff;box-shadow:0 8px 18px -8px rgba(16,185,129,.6)}
.chem-cta-ic svg{width:26px;height:26px}
.chem-cta-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.chem-cta-title{font-size:16px;font-weight:700;color:var(--ink)}
.chem-cta-sub{font-size:12.5px;color:var(--ink-3);line-height:1.5}
.chem-cta-go{margin-left:auto;flex:0 0 auto;background:linear-gradient(135deg,#10B981,#06B6D4);color:#fff;font-size:13px;font-weight:700;padding:9px 18px;border-radius:99px;white-space:nowrap;box-shadow:0 6px 14px -5px rgba(16,185,129,.5)}

/* 化学实验舱 PhET 主视觉大卡 */
.chem-phet{display:flex;align-items:center;gap:16px;padding:14px 18px;margin-bottom:10px;border-radius:14px;text-decoration:none;color:inherit;
  background:linear-gradient(135deg,rgba(16,185,129,.16),rgba(6,182,212,.10)),#fff;border:1px solid rgba(16,185,129,.4);border-left:3px solid rgba(16,185,129,.95);transition:.2s;overflow:hidden;position:relative;box-sizing:border-box;height:98px}
.chem-phet:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(16,185,129,.18);border-color:rgba(16,185,129,.6)}
.chem-phet-art{flex:0 0 auto;width:56px;height:56px}
.chem-phet-bd{display:flex;flex-direction:column;gap:6px;min-width:0}
.chem-phet-bd b{font-size:15px;color:var(--ink);font-weight:600;line-height:1.3}
.chem-phet-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.chem-phet-go{margin-left:auto;flex:0 0 auto;background:linear-gradient(135deg,#10B981,#06B6D4);color:#fff;font-size:12.5px;font-weight:700;padding:7px 14px;border-radius:99px;white-space:nowrap;box-shadow:0 4px 12px rgba(16,185,129,.4)}
@media (max-width:780px){
  .chem-hero-in{grid-template-columns:1fr;gap:24px}
  .chem-viz{height:280px}
  .chem-dom-grid{grid-template-columns:repeat(2,1fr)}
  .chem-dom{min-height:180px}
  .chem-phet{flex-wrap:wrap;height:auto}
}
/* 生物实验舱（[#820 用户反馈]）—— 对齐 phy-feat 视觉范式，绿主题 15803D/1F9D6B */
.bio-feat{margin:22px 0 4px}
.bio-feat-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.bio-feat-title{font-size:20px;font-weight:700;color:var(--ink);margin:0}
.bio-feat-sub{font-size:13px;color:var(--ink-3)}
.bio-feat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.bio-card{display:flex;align-items:center;gap:14px;padding:16px 18px;background:var(--surface);border:1px solid var(--line,var(--hair));border-radius:var(--r-lg,14px);text-decoration:none;color:inherit;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;min-width:0}
.bio-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(21,128,61,.45);border-color:rgba(21,128,61,.45)}
.bio-card-ic{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex:0 0 auto}
.bio-card-bd{display:flex;flex-direction:column;gap:3px;min-width:0}
.bio-card-bd b{font-size:15px;color:var(--ink);font-weight:600}
.bio-card-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.4}
.bio-card-go{margin-left:auto;font-size:13px;color:var(--bn,#15803D);font-weight:600;flex:0 0 auto}
.bio-ask{display:flex;align-items:center;gap:14px;margin-top:14px;padding:16px 18px;background:linear-gradient(135deg,rgba(21,128,61,.08),rgba(34,197,94,.04));border:1px solid rgba(21,128,61,.25);border-radius:var(--r-lg,14px);text-decoration:none;color:inherit;transition:transform .15s ease,box-shadow .15s ease}
.bio-ask:hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(21,128,61,.45)}
.bio-ask-ic{width:42px;height:42px;border-radius:50%;background:var(--bn,#15803D);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;flex:0 0 auto}
.bio-ask-bd{display:flex;flex-direction:column;gap:3px;min-width:0}
.bio-ask-bd b{font-size:15px;color:var(--ink);font-weight:600}
.bio-ask-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.5}
.bio-ask-go{margin-left:auto;font-size:13px;color:var(--bn,#15803D);font-weight:600;flex:0 0 auto;white-space:nowrap}
[data-theme="dark"] .bio-card,[data-theme="dark"] .bio-ask{background:var(--surface-2,#1e2030)}
@media (max-width:780px){
  .chn-feat-grid{grid-template-columns:1fr}
  .chn-card,.chn-ask{flex-wrap:wrap}
  .chn-card-go,.chn-ask-go{margin-left:0}
  .phy-hero-in{grid-template-columns:1fr;gap:24px}
  .phy-viz{height:280px}
  .phy-dom-grid{grid-template-columns:repeat(2,1fr)}
  .phy-phet{flex-wrap:wrap;height:auto}
  .bio-feat-grid{grid-template-columns:1fr}
  .bio-card,.bio-ask{flex-wrap:wrap}
  .bio-card-go,.bio-ask-go{margin-left:0}
  .phy-feat-grid .sfeat-card{height:auto}
}
/* 通用学科实验舱网格（历史/地理/道法/科学/信息技术 共用 · --accent 主题色由 JS 注入；与 .bio-feat 同范式）*/
.sfeat{margin:22px 0 4px}
.sfeat-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.sfeat-title{font-size:20px;font-weight:700;color:var(--ink);margin:0}
.sfeat-sub{font-size:13px;color:var(--ink-3)}
.sfeat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.sfeat-card{display:flex;align-items:center;gap:14px;padding:16px 18px;background:var(--surface);border:1px solid var(--line,var(--hair));border-radius:var(--r-lg,14px);text-decoration:none;color:inherit;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;min-width:0}
/* [#545] 物理实验舱 2 列横排卡片（数学工具箱 sfeat-card 范式适配深空黑背景） */
.phy-feat-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:8px 0 4px}
.phy-feat-grid .sfeat-card{position:relative;background:linear-gradient(135deg,rgba(var(--accent-rgb,40,224,255),.44) 0%,rgba(var(--accent-rgb,40,224,255),.22) 100%),rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.16);border-left:3px solid var(--accent,#28e0ff)!important;color:#eaf1ff;min-width:0;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;box-sizing:border-box;height:98px}
.phy-feat-grid .sfeat-card:hover{border-color:var(--accent)!important;box-shadow:0 14px 30px -14px var(--accent-glow,rgba(40,224,255,.50));transform:translateY(-2px)}
.phy-feat-grid .sfeat-card-ic{background:var(--softBg,#0d1830)!important;color:var(--accent,#28e0ff)!important;border:1px solid var(--accent);width:46px;height:46px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:20px;flex:0 0 auto}
.phy-feat-grid .sfeat-card-bd b{font-size:15px;color:#eaf1ff!important;font-weight:600}
.phy-feat-grid .sfeat-card-bd small{font-size:12.5px;color:#9fb2d8!important;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.phy-feat-grid .sfeat-card-go{margin-left:auto;font-size:13px;color:var(--accent,#28e0ff)!important;font-weight:600;flex:0 0 auto;white-space:nowrap}
@media (max-width:1100px){.phy-feat-grid{grid-template-columns:1fr}}
.sfeat-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px var(--accent-shadow,rgba(100,116,139,.45));border-color:var(--accent-border,rgba(100,116,139,.45))}
.sfeat-card-ic{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex:0 0 auto}
.sfeat-card-bd{display:flex;flex-direction:column;gap:3px;min-width:0}
.sfeat-card-bd b{font-size:15px;color:var(--ink);font-weight:600}
.sfeat-card-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.4}
.sfeat-card-go{margin-left:auto;font-size:13px;color:var(--accent,#64748b);font-weight:600;flex:0 0 auto}
.sfeat-ask{display:flex;align-items:center;gap:14px;margin-top:14px;padding:16px 18px;background:linear-gradient(135deg,var(--accent-soft,rgba(100,116,139,.08)),var(--accent-soft-2,rgba(100,116,139,.04)));border:1px solid var(--accent-border,rgba(100,116,139,.25));border-radius:var(--r-lg,14px);text-decoration:none;color:inherit;transition:transform .15s ease,box-shadow .15s ease}
.sfeat-ask:hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px var(--accent-shadow,rgba(100,116,139,.45))}
.sfeat-ask-ic{width:42px;height:42px;border-radius:50%;background:var(--accent,#64748b);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;flex:0 0 auto}
.sfeat-ask-bd{display:flex;flex-direction:column;gap:3px;min-width:0}
.sfeat-ask-bd b{font-size:15px;color:var(--ink);font-weight:600}
.sfeat-ask-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.5}
.sfeat-ask-go{margin-left:auto;font-size:13px;color:var(--accent,#64748b);font-weight:600;flex:0 0 auto;white-space:nowrap}
[data-theme="dark"] .sfeat-card,[data-theme="dark"] .sfeat-ask{background:var(--surface-2,#1e2030)}
@media (max-width:780px){
  .sfeat-grid{grid-template-columns:1fr}
  .sfeat-card,.sfeat-ask{flex-wrap:wrap}
  .sfeat-card-go,.sfeat-ask-go{margin-left:0}
}
.eyes-actions .btn{font-size:14px;padding:9px 18px;border-radius:var(--r-pill)}
.eyes-actions .btn.ghosts{background:transparent;border:1px solid var(--hair);color:var(--ink-2)}
.eyes-actions .btn.ghosts:hover{background:rgba(226,83,143,.08);color:var(--purple-d);border-color:var(--purple-l)}
/* 摄像头选择器（高拍仪/外置优先）——胶囊样式 */
.eyes-cam-select{
  font-size:13px;padding:7px 28px 7px 14px;border-radius:var(--r-pill);
  border:1px solid var(--purple-l);background:#fff;color:var(--purple-d);
  font-weight:600;cursor:pointer;outline:none;
  appearance:none;-webkit-appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--purple) 50%),linear-gradient(135deg,var(--purple) 50%,transparent 50%);
  background-position:calc(100% - 14px) center,calc(100% - 9px) center;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
  transition:border-color .2s,box-shadow .2s;
}
.eyes-cam-select:hover{border-color:var(--purple);box-shadow:0 0 0 3px var(--purple-l)}
@media (max-width:780px){.eyes-body{gap:14px}.eyes-actions{flex-direction:column;align-items:stretch}.eyes-actions .btn{width:100%}}

/* 眼睛模块图片放大 modal（全屏 float） */
.eyes-modal{position:fixed;inset:0;background:rgba(15,13,28,.78);backdrop-filter:blur(6px);
  display:none;align-items:center;justify-content:center;z-index:9999;padding:32px;animation:eyesModalIn .2s ease}
.eyes-modal.on{display:flex}
@keyframes eyesModalIn{from{opacity:0}to{opacity:1}}
.eyes-modal img{max-width:92vw;max-height:90vh;border-radius:var(--r-md);background:#fff;
  box-shadow:0 24px 60px rgba(0,0,0,.5)}
.eyes-modal-close{position:fixed;top:24px;right:24px;width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.2);font-size:18px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}
.eyes-modal-close:hover{background:rgba(255,255,255,.22);transform:rotate(90deg)}

/* 暗色模式 */
[data-theme="dark"] .eyes-card{background:linear-gradient(135deg,#241B33 0%,#16261F 100%);border-color:var(--hair)}
[data-theme="dark"] .eyes-badge{background:rgba(155,140,255,.18);border-color:var(--purple-l);color:var(--purple-d)}
[data-theme="dark"] .eyes-stage{background:rgba(255,255,255,.04);border-color:var(--purple-l)}
[data-theme="dark"] .eyes-placeholder p{color:var(--ink-2)}
[data-theme="dark"] .eyes-shot{background:#1E1B2E}
[data-theme="dark"] .eyes-modal{background:rgba(0,0,0,.85)}

/* ============================================================
 * 创归思之眼 · 取景台重塑（2026-09-13）
 * ① 修布局病灶：[hidden] 被 class 里的 display 覆盖
 *    病灶实证：idle 态下 #eyesVideo / #eyesShot 各带 hidden 却仍是 display:block，
 *    作为 .eyes-stage(flex) 的 flex 项各占 384px，把空态从 ~910px 挤成 **196px** 窄条
 *    → 文案竖着折行、右侧「看不到」。同源还有 4 个 .btn（收起预览/双图/放大/选区截图）
 *    本该隐藏却因 .btn{display:inline-flex} 提前显形。
 *    根因：UA 的 [hidden]{display:none} 特异性低于任何 class 规则里的 display。
 * ② 视觉母题：稿纸网格 + 四角取景括号 + 自上而下扫描光（"眼睛正在看"的呼吸感）
 * ============================================================ */

/* —— ① 根因修复：作用域收在眼睛卡片内，不外溢影响他页 —— */
.eyes-card [hidden]{display:none !important}
.eyes-card .btn[hidden],
.eyes-card .eyes-video[hidden],
.eyes-card .eyes-shot[hidden],
.eyes-card .eyes-cam-select[hidden]{display:none !important}

/* —— ② 卡片：纸感 + 顶部品牌细线 —— */
.eyes-card{
  background:
    radial-gradient(120% 90% at 10% -10%, #FFFFFF 0%, rgba(255,255,255,0) 58%),
    linear-gradient(135deg,#FDF4F9 0%,#F0FBF8 52%,#F4F1FF 100%);
  border:1px solid rgba(109,94,252,.14);
  box-shadow:0 26px 64px -38px rgba(109,94,252,.55), inset 0 1px 0 #fff;
  padding:30px 30px 26px}
.eyes-card::before{
  content:'';position:absolute;left:30px;right:30px;top:0;height:3px;
  background:linear-gradient(90deg,#6D5EFC 0%,#28C2C8 52%,#E2538F 100%);
  border-radius:0 0 4px 4px;opacity:.85}
.eyes-glow{right:-40px;top:-70px;width:300px;height:300px;
  background:radial-gradient(circle,rgba(109,94,252,.20),transparent 68%)}

/* —— 标题区：招呼感 —— */
.eyes-badge{background:rgba(255,255,255,.82);border-color:rgba(109,94,252,.28);color:#5a49d6}
.eyes-badge .dot{background:#6D5EFC;box-shadow:0 0 0 4px rgba(109,94,252,.16)}
@keyframes eyesBadgePulse{0%,100%{box-shadow:0 0 0 4px rgba(109,94,252,.16)}50%{box-shadow:0 0 0 8px rgba(109,94,252,.09)}}
.eyes-title{font-size:26px;letter-spacing:-.022em;margin:14px 0 8px}
.eyes-sub{font-size:15.5px;line-height:1.85;max-width:760px}

/* —— 取景台（stage）：稿纸网格 + 四角括号 + 扫描光 —— */
.eyes-stage{
  aspect-ratio:16/9;min-height:330px;border:1px solid rgba(109,94,252,.20);border-radius:18px;
  background:
    repeating-linear-gradient(0deg,rgba(109,94,252,.055) 0 1px,transparent 1px 26px),
    repeating-linear-gradient(90deg,rgba(109,94,252,.055) 0 1px,transparent 1px 26px),
    radial-gradient(92% 74% at 50% 44%,#FFFFFF 0%,#F8F6FF 66%,#F1F6FB 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75),
             inset 0 20px 46px -34px rgba(109,94,252,.75),
             0 20px 50px -34px rgba(109,94,252,.5)}
.eyes-frame{position:absolute;inset:14px;pointer-events:none;z-index:1;border-radius:14px;
  background:
    linear-gradient(#6D5EFC,#6D5EFC) 0 0/30px 3px no-repeat,
    linear-gradient(#6D5EFC,#6D5EFC) 0 0/3px 30px no-repeat,
    linear-gradient(#28C2C8,#28C2C8) 100% 0/30px 3px no-repeat,
    linear-gradient(#28C2C8,#28C2C8) 100% 0/3px 30px no-repeat,
    linear-gradient(#28C2C8,#28C2C8) 0 100%/30px 3px no-repeat,
    linear-gradient(#28C2C8,#28C2C8) 0 100%/3px 30px no-repeat,
    linear-gradient(#6D5EFC,#6D5EFC) 100% 100%/30px 3px no-repeat,
    linear-gradient(#6D5EFC,#6D5EFC) 100% 100%/3px 30px no-repeat;
  animation:eyesFrameBreathe 4.8s ease-in-out infinite}
@keyframes eyesFrameBreathe{0%,100%{opacity:.5}50%{opacity:.92}}
/* 扫描光带：只在"还没看清"的三个态里跑（idle / streaming / detected-*），
   已出图（shot / split）时收掉，避免压住静态图 */
.eyes-sweep{position:absolute;left:0;right:0;top:0;height:160px;pointer-events:none;z-index:1;
  background:linear-gradient(180deg,
    rgba(109,94,252,0) 0%,rgba(40,194,200,.22) 48%,rgba(226,83,143,.16) 70%,rgba(109,94,252,0) 100%);
  animation:eyesSweep 3.6s cubic-bezier(.45,0,.55,1) infinite}
@keyframes eyesSweep{0%{transform:translateY(-170px)}100%{transform:translateY(640px)}}
.eyes-card[data-kind="shot"] .eyes-sweep,
.eyes-card[data-kind="split"] .eyes-sweep,
.eyes-card[data-kind^="detected-"] .eyes-sweep{display:none}
.eyes-card[data-kind="shot"] .eyes-frame,
.eyes-card[data-kind="split"] .eyes-frame,
.eyes-card[data-kind^="detected-"] .eyes-frame{opacity:.3;animation:none}

/* —— [#751 2026-09-14] 朗读控制条：浮在扫描画面**上方**，带读时手边就一个「暂停 / 继续」—— */
/*    只在朗读中（⏸ 暂停）或暂停后（▶ 继续读）出现，其余时候整条 hidden 不占位、不遮挡纸面。 */
/*    [#751b 2026-09-14] 改贴**右上角**：居中会把正上方那几行正文压掉（用户截图反馈），
      右上角是纸面留白位，且离左上「题号/标题」和底部「已识别」徽标都最远。 */
.eyes-readbar{
  position:absolute;right:16px;top:16px;left:auto;transform:none;
  z-index:6;display:flex;align-items:center;gap:10px;
  padding:6px 15px 6px 7px;border-radius:999px;
  background:rgba(23,19,36,.76);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 16px 36px -18px rgba(23,19,36,.8), inset 0 1px 0 rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);
  animation:eyesReadBarIn .22s ease-out}
@keyframes eyesReadBarIn{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:translateY(0)}}
.eyes-readbar .btn.eyes-readbar-btn{
  min-width:0;padding:7px 17px;font-size:14px;font-weight:800;letter-spacing:-.01em;
  border-radius:999px;white-space:nowrap;border:none;color:#fff;
  background:linear-gradient(135deg,#6D5EFC 0%,#28C2C8 145%);
  box-shadow:0 8px 18px -9px rgba(109,94,252,.95)}
.eyes-readbar .btn.eyes-readbar-btn:hover{filter:brightness(1.07)}
.eyes-readbar .btn.eyes-readbar-btn:active{transform:translateY(1px)}
.eyes-readbar-meta{font-size:12.5px;color:rgba(255,255,255,.87);white-space:nowrap;letter-spacing:-.01em;
  overflow:hidden;text-overflow:ellipsis;max-width:44vw}
/* [#755 2026-09-14] 贴视口兜底：控制条 absolute 在 stage 内，页面向下滚（stage 顶边出屏）时
   它会跟着滚出可视区 —— 实测 stage.top=-154 时按钮已经点不到。此时改贴视口右上（顶栏 sticky 100px 之下）。
   只在「本来就看不着」时才贴，不改变未滚动时的位置，因此不会重新挡住纸面正文。 */
.eyes-readbar.is-stuck{position:fixed;right:24px;top:112px;z-index:90}
/* 窄 stage（分屏/小屏）：右上角只留「暂停/继续」按钮，说明文字收起，绝不向左吃到纸面正文 */
@media (max-width:720px){
  .eyes-readbar{right:10px;top:10px;gap:8px;padding:5px 11px 5px 6px}
  .eyes-readbar.is-stuck{right:12px;top:96px}
  .eyes-readbar .btn.eyes-readbar-btn{padding:6px 12px;font-size:13px}
  .eyes-readbar-meta{display:none}}
/* —— 空态：从"图标+三段小字"改为"瞳孔环 + 一句主话 + 三种可识别物 + 一行授权提示" —— */
.eyes-placeholder{position:relative;z-index:2;gap:13px;padding:34px 26px;max-width:600px}
.eyes-placeholder::before{display:none}   /* 老的内层虚线框让位给四角取景括号 */
.eyes-eye{width:96px;height:96px;
  background:linear-gradient(135deg,#6D5EFC 0%,#28C2C8 100%);
  box-shadow:0 20px 44px -18px rgba(109,94,252,.8),
             0 0 0 10px rgba(109,94,252,.07),
             0 0 0 22px rgba(40,194,200,.045);
  animation:eyesEyeFloat 5.4s ease-in-out infinite}
@keyframes eyesEyeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.eyes-eye svg{width:42px;height:42px;stroke-width:1.6}
.eyes-placeholder p{margin:2px 0 0;font-size:20px;font-weight:800;letter-spacing:-.015em;color:var(--ink)}
/* 三种可识别物：把"课本 / 作业 / 考卷"从纯文字变成三枚图标胶囊 */
.eyes-kinds{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.eyes-kinds i{display:inline-flex;align-items:center;gap:6px;font-style:normal;font-size:12.5px;font-weight:600;
  color:#5a49d6;background:rgba(255,255,255,.88);border:1px solid rgba(109,94,252,.22);
  padding:6px 13px;border-radius:999px;box-shadow:0 6px 16px -10px rgba(109,94,252,.85)}
.eyes-kinds i svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.7;fill:none;flex:0 0 auto}
.eyes-tip{font-size:12px;color:var(--ink-3);max-width:430px;line-height:1.75}
/* 空态里的那颗按钮才是"主 CTA"（动作栏那颗降为工具位，避免两个孪生按钮） */
.eyes-fallback{margin-top:6px;font-size:14.5px;font-weight:700;color:#fff;padding:12px 28px;
  background:linear-gradient(135deg,#6D5EFC,#28C2C8);border:none;
  box-shadow:0 14px 32px -14px rgba(109,94,252,.9);transition:transform .18s,box-shadow .18s,filter .18s}
.eyes-fallback:hover{background:linear-gradient(135deg,#7d6ffd,#3ad3d9);color:#fff;transform:translateY(-1px);
  box-shadow:0 18px 38px -14px rgba(109,94,252,1);filter:saturate(1.05)}

/* —— 隐私说明：从被 pageHead 丢弃的注脚，改成卡片里一枚清楚的胶囊 —— */
.eyes-privacy{display:flex;align-items:center;justify-content:center;gap:8px;align-self:center;
  font-size:12.5px;color:var(--ink-3);background:rgba(255,255,255,.72);
  border:1px solid rgba(40,194,200,.28);border-radius:999px;padding:8px 18px}
.eyes-privacy svg{width:15px;height:15px;stroke:#2BB6A8;stroke-width:1.7;fill:none;flex:0 0 auto}

/* —— 动作栏：主 CTA 在空态里已出现，这里降为工具位；ghost 更轻 —— */
.eyes-actions{gap:12px;padding:4px 2px 0}
.eyes-actions-hint{font-size:13px}
.eyes-actions .btn{font-size:14px;padding:10px 18px}
.eyes-actions .btn.ghosts{background:rgba(255,255,255,.72);border:1px solid rgba(109,94,252,.18);color:var(--ink-2)}
.eyes-actions .btn.ghosts:hover{background:rgba(109,94,252,.08);color:#5a49d6;border-color:rgba(109,94,252,.4)}
#eyesGrant{background:rgba(255,255,255,.9) !important;color:#5a49d6 !important;
  border:1.5px solid rgba(109,94,252,.42) !important;box-shadow:none !important}
#eyesGrant:hover{background:rgba(109,94,252,.10) !important;color:#4a3ac0 !important}
#eyesGrant:disabled{opacity:.6}
#eyesSnap{background:linear-gradient(135deg,#FF7E5F,#FEB47B) !important}
#eyesSnapSel{background:linear-gradient(135deg,#6D5EFC,#28C2C8) !important}
.eyes-actions .eyes-sel-tools .btn{font-size:13px !important;padding:8px 15px !important}

/* —— 识别中徽标 —— */
.eyes-detect{right:16px;bottom:16px;z-index:3;font-size:12.5px;padding:8px 16px;
  background:linear-gradient(135deg,#6D5EFC,#28C2A8);
  box-shadow:0 12px 28px -12px rgba(109,94,252,.85)}

/* —— 暗色模式对齐 —— */
[data-theme="dark"] .eyes-card{background:
  radial-gradient(120% 90% at 10% -10%,rgba(109,94,252,.16) 0%,rgba(255,255,255,0) 58%),
  linear-gradient(135deg,#241B33 0%,#16261F 100%)}
[data-theme="dark"] .eyes-card::before{opacity:.55}
[data-theme="dark"] .eyes-stage{background:
  repeating-linear-gradient(0deg,rgba(155,140,255,.07) 0 1px,transparent 1px 26px),
  repeating-linear-gradient(90deg,rgba(155,140,255,.07) 0 1px,transparent 1px 26px),
  radial-gradient(92% 74% at 50% 44%,rgba(255,255,255,.05) 0%,rgba(255,255,255,.02) 70%,rgba(255,255,255,.03) 100%)}
[data-theme="dark"] .eyes-kinds i{background:rgba(155,140,255,.14);color:#c7bcff;border-color:rgba(155,140,255,.3)}
[data-theme="dark"] .eyes-privacy{background:rgba(255,255,255,.06);color:var(--ink-2)}
[data-theme="dark"] .eyes-actions .btn.ghosts{background:rgba(255,255,255,.06);border-color:rgba(155,140,255,.24)}
[data-theme="dark"] #eyesGrant{background:rgba(255,255,255,.07) !important;color:#c7bcff !important}

/* —— 无障碍：尊重"减少动态效果" —— */
@media (prefers-reduced-motion:reduce){
  .eyes-frame,.eyes-sweep,.eyes-eye,.eyes-badge .dot{animation:none !important}
}
/* —— 窄屏：取景台别太高，标题收一号 —— */
@media (max-width:780px){
  .eyes-title{font-size:24px}
  .eyes-sub{font-size:14.5px}
  .eyes-stage{aspect-ratio:4/3;min-height:260px}
  .eyes-placeholder p{font-size:18px}
  .eyes-eye{width:78px;height:78px}
  .eyes-eye svg{width:34px;height:34px}
  .eyes-privacy{align-self:stretch;border-radius:14px;text-align:left}
}

/* —— 就地指令板（2026-09-13）：收掉重复按钮后的版式微调 —— */
/* 工具动作（再来一次 / 标定画面）不该跟主推 CTA 抢宽度，按内容宽度排 */
.eyes-card .ctx-actions .btn.ghost{flex:0 0 auto;min-width:0}
/* 输入框那一行：按钮不参与 flex 拉伸，长 placeholder 也不会把它挤变形 */
.eyes-card .ctx-ask .btn.pri{flex:0 0 auto;min-width:0;white-space:nowrap}
[data-theme="dark"] .ctx-ask{background:rgba(226,83,143,.1);border-color:rgba(226,83,143,.3)}
/* —— [#t871 2026-10-16] 识别区「选项收敛」：置信度胶囊 + 「更多」折叠 —— */
.eyes-ctx .ctx-conf{display:inline-block;margin-left:8px;font-size:11.5px;font-weight:700;color:var(--purple-d);
  background:var(--purple-l);border-radius:999px;padding:2px 9px;white-space:nowrap;vertical-align:1px}
.eyes-ctx .ctx-more{margin-top:10px;border-top:1px dashed var(--hair);padding-top:8px}
.eyes-ctx .ctx-more>summary{list-style:none;cursor:pointer;font-size:12.5px;color:var(--ink-3);
  user-select:none;display:inline-block;padding:2px 0}
.eyes-ctx .ctx-more>summary::-webkit-details-marker{display:none}
.eyes-ctx .ctx-more>summary::after{content:' \25BE'}
.eyes-ctx .ctx-more[open]>summary::after{content:' \25B4'}
.eyes-ctx .ctx-more-body{display:flex;flex-wrap:wrap;gap:8px;padding:6px 0 2px}
.eyes-ctx .ctx-more-body .btn{flex:0 0 auto;min-width:0;font-size:13px;padding:7px 12px}
/* —— 深色主题补全（修既有缺陷，非新功能）——
   此前 .eyes-ctx / .eyes-chat / .ctx-propose 全无深色规则：底是 rgba(255,255,255,.97)、
   而 --ink 在深色下是白色 → 深底上浮一块白卡且白底白字不可读。这里按暗色令牌补齐。 */
[data-theme="dark"] .eyes-ctx{background:rgba(32,28,58,.97);border-color:rgba(155,140,255,.38);
  box-shadow:0 12px 32px -10px rgba(0,0,0,.6)}
[data-theme="dark"] .eyes-ctx .ctx-tip{color:var(--ink-2)}
[data-theme="dark"] .eyes-ctx .ctx-tip b{color:var(--purple-d)}
[data-theme="dark"] .eyes-ctx .ctx-propose{background:linear-gradient(135deg,rgba(155,140,255,.18),rgba(63,224,200,.16));
  border-color:rgba(155,140,255,.45);box-shadow:0 6px 20px -8px rgba(0,0,0,.55)}
[data-theme="dark"] .eyes-ctx .ctx-propose-h{color:var(--purple-d)}
[data-theme="dark"] .eyes-ctx .ctx-conf{background:var(--purple-l);color:var(--purple-d)}
[data-theme="dark"] .eyes-ctx .ctx-more{border-top-color:var(--hair)}
[data-theme="dark"] .eyes-ctx .ctx-tell input{background:var(--surface-2);color:var(--ink);border-color:var(--hair)}
[data-theme="dark"] .eyes-chat{background:rgba(255,255,255,.06);border-color:rgba(155,140,255,.22)}
[data-theme="dark"] .eyes-chat .eyes-msg-bot{background:linear-gradient(135deg,rgba(155,140,255,.20),rgba(63,224,200,.14));
  border-color:rgba(155,140,255,.28)}

/* —— [#t884h 2026-10-17] 识别态版式重构（PM 参考示意图 + 思伴聊屋对话流）——
   ① 根因：detected 态未覆盖 base .eyes-stage 的 align-items:center ⇒ 对话/建议卡缩成内容宽居中
   （实测 ctx 仅 587px / stage 1441px），两侧大空白；
   ② 对话气泡改思伴聊屋式：小伴=头像+名+白气泡，同学=右对齐紫气泡；
   ③ 建议区一行平铺（HTML 侧同步撤分组卡），提示条改全宽浅底居中。 */
.eyes-card[data-kind^="detected-"] .eyes-stage{align-items:stretch;justify-content:flex-start}
.eyes-chat{background:transparent;border:none;padding:2px 2px;margin-top:12px}
.eyes-chat .eyes-msg{max-width:82%}
.eyes-chat .eyes-msg-bot{position:relative;margin-left:40px;background:#fff;border:1px solid var(--hair);
  border-radius:14px;box-shadow:0 2px 12px rgba(30,20,60,.06)}
.eyes-chat .eyes-msg-bot::before{content:'';position:absolute;left:-40px;top:2px;width:31px;height:31px;
  border-radius:50%;background:url('mascot/mascot-v5-3d-base-transparent.png') center/contain no-repeat;
  background-color:#f3edff;border:1px solid var(--hair)}
.eyes-chat .eyes-msg-bot .who{display:block;font-size:11.5px;font-weight:700;color:var(--ink-3);margin:0 0 3px}
.eyes-chat .eyes-msg-user{background:linear-gradient(135deg,#7C5CFC,#6D5EFC);color:#fff;
  border-radius:14px;box-shadow:0 3px 14px rgba(109,94,252,.28)}
.eyes-chat .eyes-msg-user .who{display:none}
.eyes-ctx .ctx-tip{background:rgba(109,94,252,.07);border:1px solid rgba(109,94,252,.2);
  border-radius:14px;padding:9px 14px;text-align:center;margin-bottom:12px}
.eyes-ctx .ctx-propose{margin:0 0 10px;padding:0;border:none;background:transparent;box-shadow:none}
.eyes-ctx .ctx-propose .ctx-propose-h{display:none}
.eyes-ctx .ctx-propose-actions{display:flex;flex-wrap:wrap;gap:10px}
.eyes-ctx .ctx-propose-actions .btn{flex:1 1 0;min-width:132px;font-size:13.5px;padding:11px 10px;text-align:center}
.eyes-ctx .ctx-more{border-top:none;text-align:right;padding-top:2px}
[data-theme="dark"] .eyes-chat{background:transparent;border:none}
[data-theme="dark"] .eyes-chat .eyes-msg-bot{background:rgba(38,34,66,.92);border-color:rgba(155,140,255,.3);box-shadow:none}
[data-theme="dark"] .eyes-chat .eyes-msg-bot::before{background-color:rgba(155,140,255,.18)}
[data-theme="dark"] .eyes-chat .eyes-msg-user{background:linear-gradient(135deg,#6D5EFC,#5847e8);color:#fff}
[data-theme="dark"] .eyes-ctx .ctx-tip{background:rgba(155,140,255,.12);border-color:rgba(155,140,255,.32)}
[data-theme="dark"] .eyes-ctx .ctx-propose{background:transparent;border:none;box-shadow:none}

/* 专项练习通用壳 */
.practice-shell{display:flex;flex-direction:column;align-items:center;gap:14px;padding:30px 20px;text-align:center}
.practice-ico{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--purple),var(--cyan));
  color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px -10px rgba(226,83,143,.6)}
.practice-ico svg{width:30px;height:30px;stroke:#fff;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* —— 练习页：内容入口 + 结构化 Skill 输出（T12-fix 英语阅读/词汇差异渲染） —— */
.practice-entry{margin:16px 0;padding:16px 18px;border:1px solid var(--hair);border-radius:var(--r-md);background:var(--surface);display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.practice-entry .pe-title{font-size:13px;font-weight:800;color:var(--brand-d);letter-spacing:var(--tr-wide)}
.en-sel{padding:8px 10px;border:1px solid var(--hair);border-radius:10px;background:var(--surface-2);color:var(--ink);font-size:14px;min-width:200px}
.pe-btn{display:inline-block;padding:9px 16px;border-radius:10px;background:linear-gradient(135deg,var(--purple),var(--cyan));color:#fff;font-size:14px;font-weight:800;border:none;cursor:pointer;text-decoration:none}
.pe-btn:hover{filter:brightness(1.05)}
.en-area{width:100%;min-height:120px;padding:10px 12px;border:1px solid var(--hair);border-radius:10px;background:var(--surface-2);color:var(--ink);font-size:14px;line-height:var(--lh-loose);resize:vertical;font-family:inherit}
.en-cards{display:flex;flex-wrap:wrap;gap:10px}
.en-card{padding:10px 14px;border:1px solid var(--hair);border-radius:12px;background:var(--surface-2);min-width:150px}
.en-card .en-w{font-size:18px;font-weight:800;color:var(--ink)}
.en-card .en-ph{font-size:12px;color:var(--ink-3);margin-top:2px}
.en-card .en-pos{display:inline-block;font-size:11px;color:var(--cyan-d);background:var(--cyan-l);border-radius:6px;padding:1px 6px;margin-top:4px}
.en-card .en-df{font-size:13px;color:var(--ink-2);margin-top:4px;line-height:var(--lh-loose)}
.en-sum{margin-top:8px}
.en-queue{display:flex;flex-direction:column;gap:6px}
.en-q{display:flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid var(--hair);border-radius:10px;background:var(--surface-2)}
.en-qw{font-weight:700;color:var(--ink);min-width:90px}
.en-band{width:10px;height:10px;border-radius:50%}
.en-band.green{background:#22a06b}.en-band.yellow{background:#e0a106}.en-band.red{background:#e0533d}
.en-reason{font-size:12px;color:var(--ink-3)}
.en-read{display:flex;flex-direction:column;gap:14px}
.en-passage{padding:14px 16px;border:1px solid var(--hair);border-radius:12px;background:var(--surface-2)}
.en-pt{font-size:15px;font-weight:800;color:var(--brand-d);margin-bottom:6px}
.en-body{font-size:14px;line-height:1.8;color:var(--ink)}
.en-tap{color:var(--purple-d);border-bottom:1px dashed var(--purple);cursor:help}
.en-q2{margin-top:8px;font-size:13px;color:var(--ink-2)}
.en-qstep{display:inline-block;font-size:11px;font-weight:800;color:#fff;background:var(--cyan);border-radius:6px;padding:1px 6px;margin-right:6px}
.en-guide{font-size:12px;color:var(--ink-3);margin-top:3px}
.en-fix{display:flex;flex-direction:column;gap:8px}
.en-f{padding:10px 12px;border:1px solid var(--hair);border-left:3px solid var(--bad);border-radius:10px;background:var(--surface-2)}
.en-ft{font-size:12px;font-weight:800;color:var(--bad)}
.en-fe{font-size:13px;color:var(--ink-2);margin-top:3px;line-height:var(--lh-loose)}

/* ===== 英语跟读练习面板（Phase 1：听标准 + 录音纠音 + 文本比对）===== */
.ra-entry{margin-top:12px;display:flex;flex-direction:column;gap:10px}
.ra-panel{margin-top:10px;border:1px solid var(--hair);border-radius:14px;background:linear-gradient(135deg,rgba(109,94,252,.06),rgba(40,194,200,.06));padding:14px 16px;box-shadow:0 4px 14px rgba(31,27,46,.05)}
.ra-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ra-title{font-size:14px;font-weight:800;color:var(--brand-d)}
.ra-title b{color:var(--purple-d)}
.ra-x{border:none;background:rgba(31,27,46,.06);color:var(--ink-2);width:26px;height:26px;border-radius:8px;cursor:pointer;font-size:14px;line-height:1;flex:none}
.ra-x:hover{background:rgba(31,27,46,.12);color:var(--ink)}
.ra-prog{font-size:12px;color:var(--ink-3);margin-top:6px}
.ra-prog span{color:var(--purple-d);font-weight:800}
.ra-sent{font-size:18px;line-height:2.1;color:var(--ink);margin:10px 0;letter-spacing:.2px;word-break:break-word}
.ra-sent .rw{display:inline-block;padding:1px 4px;border-radius:6px;transition:background .12s,color .12s;cursor:pointer}
.ra-sent .rw:hover{background:rgba(109,94,252,.12)}
.ra-sent .rw.cur{background:var(--purple);color:#fff;box-shadow:0 2px 6px rgba(109,94,252,.4)}
.ra-sent .rw.match{background:rgba(34,197,94,.16);color:#15803d}
.ra-sent .rw.miss{background:rgba(239,68,68,.16);color:#b91c1c;text-decoration:underline wavy rgba(239,68,68,.6)}
.ra-ctl{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.ra-btn{padding:8px 14px;border-radius:10px;border:1.5px solid var(--hair);background:#fff;color:var(--ink-2);font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;font-family:inherit}
.ra-btn:hover{border-color:var(--purple);color:var(--purple-d)}
.ra-btn.ra-listen{background:linear-gradient(135deg,var(--purple),var(--cyan));color:#fff;border-color:transparent}
.ra-btn.ra-rec{border-color:var(--cyan);color:var(--cyan-d,#0e7490)}
.ra-btn.ra-rec.on{background:#ef4444;color:#fff;border-color:#ef4444;animation:ra-pulse 1s infinite}
@keyframes ra-pulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.5)}50%{box-shadow:0 0 0 6px rgba(239,68,68,0)}}
.ra-status{font-size:12px;color:var(--ink-3);margin-top:10px;line-height:1.6;min-height:18px}
.ra-result{margin-top:10px;padding:10px 12px;border-radius:10px;background:#fff;border:1px solid var(--hair)}
.ra-score{font-size:14px;color:var(--ink-2)}
.ra-score b{font-size:22px;color:var(--purple-d);font-weight:900;margin-left:4px}
.ra-miss{margin-top:6px;font-size:13px;color:var(--ink-2);line-height:1.7}
.ra-mw{display:inline-block;background:rgba(239,68,68,.14);color:#b91c1c;border-radius:6px;padding:1px 7px;margin:2px 3px 2px 0;font-weight:700}
.ra-ok{color:#15803d;font-weight:800}
@media (max-width:600px){.ra-sent{font-size:16px;line-height:2}.ra-btn{flex:1 1 auto;text-align:center}}
.en-fs{font-size:13px;color:var(--cyan-d);margin-top:3px}

/* ============================================================
 * 暗色模式（克制 · 中性偏蓝灰 · 不黑得太重）
 * ============================================================ */
[data-theme="dark"]{
  /* 液态玻璃科技酷感（direction B）· 作 A 的深色模式皮肤 */
  --bg:#15131F;                       /* 深紫蓝底 */
  --surface:#1E1B2E;
  --surface-2:#272338;
  --surface-3:#332E47;
  --sidebar-bg:#100E18;
  --sidebar-border:rgba(255,255,255,.06);
  --ink:rgba(255,255,255,.92);
  --ink-2:rgba(255,255,255,.65);
  --ink-3:rgba(255,255,255,.42);
  --ink-4:rgba(255,255,255,.18);
  --hair:rgba(255,255,255,.08);
  --hair-strong:rgba(255,255,255,.14);
  --hair-soft:rgba(255,255,255,.04);
  --purple:#9B8CFF;                   /* 电光紫（霓虹） */
  --purple-d:#B3A6FF;
  --purple-l:rgba(155,140,255,.16);
  --purple-l-2:rgba(155,140,255,.22);
  --cyan:#3FE0C8;                     /* 霓虹薄荷 */
  --cyan-d:#28C7B0;
  --cyan-l:rgba(63,224,200,.14);
  --shadow-sm:0 0 0 1px var(--hair);
  --shadow:0 0 0 1px var(--hair),0 1px 2px rgba(0,0,0,.3);
  --shadow-lg:0 0 0 1px var(--hair),0 8px 24px -8px rgba(0,0,0,.5);
}
[data-theme="dark"] body{background:var(--bg);color:var(--ink)}
[data-theme="dark"] .btn.pri{background:#fafafa;color:#18181b;border-color:#fafafa}
[data-theme="dark"] .btn.pri:hover{background:var(--purple);color:#fff;border-color:var(--purple)}
[data-theme="dark"] .bar i,.gh-bar-track i{background:var(--ink-2)}
[data-theme="dark"] .bubble-xl.me{background:linear-gradient(135deg,#1BA6AC 0%,#148C92 100%);color:#fff;box-shadow:0 2px 8px rgba(40,194,200,.3)}
[data-theme="dark"] .mic-btn{background:var(--surface-3);color:var(--ink);border-color:var(--hair)}
[data-theme="dark"] .mic-btn:hover{background:var(--purple);color:#fff;border-color:var(--purple)}
[data-theme="dark"] .menu-nav a:hover{background:rgba(255,255,255,.04)}
[data-theme="dark"] .sub-list a:hover{background:rgba(255,255,255,.04)}
[data-theme="dark"] .eyes-card{background:linear-gradient(135deg,#241B33 0%,#16261F 100%);border-color:var(--hair)}
[data-theme="dark"] .eyes-badge{background:rgba(155,140,255,.18);border-color:var(--purple-l);color:var(--purple-d)}
[data-theme="dark"] .eyes-stage{background:rgba(255,255,255,.04);border-color:var(--purple-l)}
[data-theme="dark"] .eyes-placeholder p{color:var(--ink-2)}
[data-theme="dark"] .orb:hover,[data-theme="dark"] .subj:hover,[data-theme="dark"] .rec-row:hover,
[data-theme="dark"] .inset:hover,[data-theme="dark"] .chip:hover{background:var(--surface-2)}
[data-theme="dark"] .top-stats{background:var(--hair)}
[data-theme="dark"] .top-stat{background:var(--surface)}
[data-theme="dark"] .callout.pri{background:var(--purple-l);border-color:rgba(124,109,245,.3)}
[data-theme="dark"] .callout.cy{background:var(--cyan-l);border-color:rgba(63,196,201,.3)}
[data-theme="dark"] .callout.alert{background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.3)}
[data-theme="dark"] .inset .ic{background:rgba(124,109,245,.18);color:#a99cff}
[data-theme="dark"] .inset .ic.cy{background:rgba(63,196,201,.16);color:#5dd3d8}
[data-theme="dark"] .inset .ic.gn{background:rgba(15,157,110,.18);color:#34c08a}

/* ============================================================
 * [2026-09-19] 全局暗色令牌夺回 —— 修既有缺陷（非新功能）
 *   缺陷：page.css 的 :root 重映射块（奶油底 #FFF6F0 / 暖墨字 rgba(40,30,38,.95)）
 *   在 app.html 里 <link> 于 desktop.css **之后**，且与 :root 同为 (0,1,0) 特异性 →
 *   深色主题下 --bg / --card / --ink / --muted / --line 被字面量钉死在浅色，
 *   于是出现「深底 + 深字」不可读、「深底 + 浅卡」突兀（首页实测 body 底 #0B0817
 *   而 color 仍是 rgba(40,30,38,.95)；学习地图/思维健身房同源）。
 *   修法：用 html[data-theme="dark"]（(0,1,1) > :root 的 (0,1,0)，与加载顺序无关）
 *   只夺回被钉死的那几个语义令牌；--surface/--purple/--cyan 等仍走上面的暗色块。
 *   取值即「暗但清晰」层级：页底最深 → 卡片稍亮 → 文字最亮 → 按钮最亮（品牌紫/橙）。
 *   ⚠️ 与文件顶部 :root 的浅色取值一一对应，改一处必须两处同改。
 * ============================================================ */
html[data-theme="dark"]{
  --bg:#151229;        /* 页面最底层（最深） */
  --card:#2D2748;      /* 数据卡 / 业务卡（中深） */
  --ink:#FFFFFF;       /* 主文字（最亮） */
  --muted:#B8AEE0;     /* 辅助文字（浅紫灰） */
  --line:#3A3164;      /* 描边 / 分隔线 */
}

/* ============================================================
 * 响应式（中等屏与窄屏降级）
 * 窄屏：1) 隐藏右侧公仔 2) session 的 guide 隐藏（避免塑料感回潮）
 * ============================================================ */
@media (max-width:1100px){
  .side-menu{width:220px;padding:12px 8px 20px}
  .main{padding:28px 56px 60px 36px;margin-left:220px}
  .orb-grid,.grid-3{grid-template-columns:repeat(2,1fr)}
  .inset-grid{grid-template-columns:repeat(2,1fr)}
  .inset-grid.g4{grid-template-columns:repeat(2,1fr)}
  .top-stats{grid-template-columns:repeat(2,1fr)}
  .two-col{grid-template-columns:1fr}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .hero{grid-template-columns:120px 1fr;padding:20px;gap:20px}
  .session{grid-template-columns:180px 1fr}
  .action-card{grid-template-columns:auto 1fr;gap:18px;padding:20px}
  .action-card .acts{grid-column:2;margin-top:8px}
  .page-h1{font-size:32px}
  .subj-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:780px){
  /* 2026-08-20 晚加：移动端 hero 奖章缩小、水印隐藏，避免与标题重叠 */
  html,body{overflow-x:hidden}
  .ph-hero{width:60px;height:60px;font-size:28px;right:16px}
  .ph-wm{display:none}
  .ph-data-ic{width:36px;height:36px;font-size:18px}
  /* [2026-09-14] hero 改 SVG 后窄屏同步缩小图标本体 */
  .ph-hero svg{width:28px;height:28px}
  .ph-data-ic svg{width:18px;height:18px}
  .side-menu{position:static;width:100%;height:auto;border-right:none;
    border-bottom:1px solid var(--sidebar-border);padding:12px 10px}
  .main{padding:24px 18px 60px;margin-left:0;overflow-x:hidden}
  /* 移动端全宽条带不溢出（2026-08-20 P2-4） */
  .v12-skill-band,.v12-feat-band{left:0;width:100%;margin-left:0;margin-right:0}
  .menu-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
  .menu-nav .nav-head{display:none}
  .menu-nav a{padding:6px;font-size:11px;flex-direction:column;gap:3px;text-align:center}
  .menu-nav a svg{width:14px;height:14px}
  .menu-nav a.has-sub::after{display:none}
  .menu-nav a.on::before{display:none}
  .sub-list{display:none}
  mascot-companion#xb-companion{display:none}
  /* 2026-08-20 加：v5 公仔已迁到 Hero 居中渲染，右侧常驻（mascot-companion）全屏隐藏，避免占位失真 */
  mascot-companion#xb-companion{display:none !important}
  /* 同上：app.js 主动创建的浮动问候气泡（#xbGreet）全屏隐藏，v5 公仔已居中显示 */
  #xbGreet.xb-greet{display:none !important}
  /* 窄屏下隐藏 session 左侧 guide，避免和已隐藏的右侧公仔并存时显得拥挤，
     同时杜绝"小伴·你的引导者"塑料卡片回潮 */
  .session{grid-template-columns:1fr}
  .session .guide{display:none}
  .orb-grid,.grid-3,.grid-4,.grid-2,.inset-grid,.inset-grid.g4,.top-stats{grid-template-columns:1fr}
  .hero{grid-template-columns:1fr;gap:14px;padding:18px}
  .hero-stage{width:96px;height:120px}
  .subj-grid{grid-template-columns:repeat(2,1fr)}
  .action-card{grid-template-columns:auto 1fr;padding:16px;gap:12px}
  .action-card h3{font-size:18px}
  .page-h1{font-size:26px}
  .page-h2{font-size:16px}
  .gh-svg{height:520px}
  .gh-svg text.node-label.major{font-size:14px}
  .gh-graph-head{flex-wrap:wrap;gap:10px}
  .gh-graph-head-r{width:100%;justify-content:space-between}
}

/* ============================================================
 * 尊重 prefers-reduced-motion
 * ============================================================ */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;scroll-behavior:auto !important}
  .hero-stage svg,.orb,.status-pill .dot{animation:none}
}
/* ===== R4' 侧栏极简：分组折叠按钮 + 折叠容器（2026-08-19 整改批次2） ===== */
.menu-nav .nav-toggle{display:flex;align-items:center;gap:6px;width:calc(100% - 20px);
  margin:14px 10px 2px;padding:4px 8px;background:none;border:none;cursor:pointer;text-align:left;
  font-family:inherit;font-size:11px;font-weight:500;color:var(--ink-3);
  letter-spacing:var(--tr-wide);text-transform:uppercase;
  border-radius:var(--r-sm);transition:color .12s}
.menu-nav .nav-toggle:hover{color:var(--ink)}
.menu-nav .nav-toggle.open{color:var(--ink)}
.menu-nav .nav-toggle .nt-ic{display:flex;width:14px;height:14px;opacity:.75;flex:none}
.menu-nav .nav-toggle .nt-ic svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.menu-nav .nav-toggle .nt-ar{width:6px;height:6px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;
  transform:rotate(-45deg);opacity:.55;transition:transform .15s;margin-left:auto;flex:none}
.menu-nav .nav-toggle.open .nt-ar{transform:rotate(45deg);opacity:.85}
.nav-group-body{max-height:0;overflow:hidden;transition:max-height .25s ease;margin-left:6px}
.nav-group-body.open{max-height:760px}
.nav-group-body .subj-ctx-bar{margin:6px 10px 4px 4px}
.nav-group-body .subj-ctx-bar select{font-size:12px}

/* ===== v20 顶部通栏（2026-09-02 · 单行 64px · 品牌+菜单+状态横排 · 数学学科 5 fold group 自适配）===== */
.app-top-nav{display:flex;flex-direction:column;min-height:100vh}
/* ---- [#v27] 顶栏背景回到 #8B6FE8 实色品牌紫 + 白字（用户反馈「改回原来的颜色」；86f1338 改成毛玻璃渐变被否） ---- */
.app-top-nav .top-nav{position:sticky;top:0;z-index:60;color:#221838;
  background:#FFFFFF;
  box-shadow:0 2px 10px rgba(80,65,160,.20);border-radius:0}
/* ---- [#v30] 数学主页顶栏：与英语页同款 160° 紫→白→青渐变 + 18px 毛玻璃 + 深紫字（用户 v30 image#2 参考英语主页 web/english/index.html .page-topbar）；主页（#/home）保持 #8B6FE8 实色紫不变 ---- */
body[data-subject="math"] .app-top-nav .top-nav{
  color:#221838;
  background:#FFFFFF;
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 6px 24px -18px rgba(60,52,140,.50);
  border-radius:0}
body[data-subject="math"] .app-top-nav .brand .brand-txt b{color:#1A1B2E}
body[data-subject="math"] .app-top-nav .brand .brand-txt span{color:rgba(26,27,46,.62)}
body[data-subject="math"] .app-top-nav .status-pill{color:#1A1B2E;background:rgba(109,94,252,.10);border:1px solid rgba(109,94,252,.22)}
body[data-subject="math"] .app-top-nav .status-pill .dot{background:#6D5EFC;box-shadow:0 0 6px rgba(109,94,252,.55)}
body[data-subject="math"] .app-top-nav .theme-btn{background:rgba(109,94,252,.10);border:1px solid rgba(109,94,252,.22);color:#1A1B2E}
body[data-subject="math"] .app-top-nav .menu-nav > a{color:rgba(26,27,46,.62)}
body[data-subject="math"] .app-top-nav .menu-nav > a:hover{background:rgba(109,94,252,.10);color:#1A1B2E;transform:translateY(-1px)}
body[data-subject="math"] .app-top-nav .menu-nav .nav-toggle{color:rgba(26,27,46,.62)}
body[data-subject="math"] .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(109,94,252,.10);color:#1A1B2E;transform:translateY(-1px)}
/* active 状态保持紫青渐变（与 v27 全局 .on/.open 一致）：毛玻璃顶栏里依旧夺目 */
body[data-subject="math"] .app-top-nav .menu-nav > a.on,
body[data-subject="math"] .app-top-nav .menu-nav .nav-toggle.on,
body[data-subject="math"] .app-top-nav .menu-nav .nav-toggle.open{
  background:linear-gradient(120deg,#6D5EFC 0%,#28C2C8 100%);color:#ffffff;font-weight:700;box-shadow:0 8px 20px -8px rgba(109,94,252,.60)}
/* 单行布局（v20→v21）：padding 18+18 单行 ~76，与英语页顶栏同款高度 */
.top-nav-row{max-width:1180px;margin:0 auto;width:100%;display:flex;align-items:center;gap:14px;
  padding:18px 24px;flex-wrap:nowrap;min-height:0}
/* ---- [#v31] 学生端主页（body 无 data-subject）顶栏增高到 ~99px：padding 30+30 + min-height:99（参考 image#2 紫色块 99px 高度）；数学/英语/其他学科页保持 76px 不动 ---- */
body:not([data-subject]) .app-top-nav .top-nav-row{padding:30px 24px;min-height:99px}
/* 重置 .top-nav-row 内 .brand/.status-row 在 sidebar 的内边距/外边距 */
.app-top-nav .top-nav-row .brand{padding:0;margin:0;gap:10px;flex:none}
.app-top-nav .top-nav-row .status-row{margin:0 0 0 auto;gap:10px;flex:none}
.app-top-nav .brand .brand-txt b{font-size:17px;color:#ffffff;font-weight:700;letter-spacing:-.2px}
.app-top-nav .brand .brand-txt span{font-size:11px;color:rgba(255,255,255,.82);margin-top:2px}
.app-top-nav .status-row{display:flex;align-items:center;gap:10px}
.app-top-nav .status-pill{color:#ffffff;background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.32);font-size:11.5px;padding:5px 12px;border-radius:99px;font-weight:600}
.app-top-nav .status-pill .dot{background:#ffffff;box-shadow:0 0 6px rgba(255,255,255,.6)}
.app-top-nav .theme-btn{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32);color:#ffffff}
.app-top-nav .theme-btn svg{stroke:currentColor}

/* ---- [#v34 走法B] 数学工具箱 SPA 工具（problemset / eyes）顶栏统一到 image#2 实色紫 + 白字 + 紧凑 + 菜单居中单行
   这两个路由非 subject 页（router 会清掉 data-subject），故用隔离属性 data-mathtop 标记，
   不碰 subject 语义、不触发「· 数学专属陪练」::after 后缀。 ---- */
body[data-mathtop] .app-top-nav .top-nav{
  color:#221838;
  background:#FFFFFF;
  box-shadow:0 4px 18px -10px rgba(60,52,140,.45);
  border-radius:0}
body[data-mathtop] .app-top-nav .brand .brand-txt b{color:#ffffff}
body[data-mathtop] .app-top-nav .brand .brand-txt span{display:none}
body[data-mathtop] .app-top-nav .top-nav-row{padding:14px 24px;min-height:100px!important;flex-wrap:nowrap}
body[data-mathtop] .app-top-nav .status-pill{color:#ffffff;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32)}
body[data-mathtop] .app-top-nav .status-pill .dot{background:#ffffff;box-shadow:0 0 6px rgba(255,255,255,.65)}
body[data-mathtop] .app-top-nav .theme-btn{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32);color:#ffffff}
body[data-mathtop] .app-top-nav .menu-nav > a{color:rgba(255,255,255,.85)}
body[data-mathtop] .app-top-nav .menu-nav > a:hover{background:rgba(255,255,255,.14);color:#ffffff;transform:none}
body[data-mathtop] .app-top-nav .menu-nav .nav-toggle{color:rgba(255,255,255,.85)}
body[data-mathtop] .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(255,255,255,.14);color:#ffffff;transform:none}
body[data-mathtop] .app-top-nav .menu-nav > a.on,
body[data-mathtop] .app-top-nav .menu-nav .nav-toggle.on,
body[data-mathtop] .app-top-nav .menu-nav .nav-toggle.open{
  background:rgba(255,255,255,.22);color:#ffffff;font-weight:700;box-shadow:0 6px 18px -8px rgba(0,0,0,.30)}
/* 菜单横排（v20 · 居中弹性占位 · flex:1） */
.app-top-nav .menu-nav{display:flex;align-items:center;justify-content:center;gap:2px;
  flex:1 1 auto;min-width:0;padding:0;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;
  scrollbar-width:none;-ms-overflow-style:none}
.app-top-nav .menu-nav::-webkit-scrollbar{display:none}
.app-top-nav .menu-nav > a{display:inline-flex;align-items:center;gap:7px;color:rgba(255,255,255,.88);
  background:transparent;padding:9px 14px;border-radius:99px;text-decoration:none;
  font-size:13.5px;font-weight:600;letter-spacing:.2px;transition:.2s ease;white-space:nowrap;flex:none}
.app-top-nav .menu-nav > a:hover{background:rgba(255,255,255,.18);color:#ffffff;transform:translateY(-1px)}
.app-top-nav .menu-nav > a.on{background:linear-gradient(120deg,#6D5EFC 0%,#28C2C8 100%);color:#fff;font-weight:700;
  box-shadow:0 8px 20px -8px rgba(109,94,252,.60)}
.app-top-nav .menu-nav > a.on::before{display:none}
.app-top-nav .menu-nav > a.on svg{stroke:#fff}
.app-top-nav .menu-nav > a svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
/* 折叠按钮（顶部 tab · v20 字号略缩 + 单行对齐） */
.app-top-nav .menu-nav .nav-toggle{position:relative;display:inline-flex;align-items:center;gap:7px;
  color:rgba(255,255,255,.88);background:transparent;border:none;cursor:pointer;padding:9px 14px;border-radius:99px;
  font-size:13.5px;font-weight:600;font-family:inherit;margin:0;width:auto;text-transform:none;letter-spacing:.2px;
  transition:.2s ease;white-space:nowrap;flex:none}
.app-top-nav .menu-nav .nav-toggle:hover{background:rgba(255,255,255,.18);color:#ffffff;transform:translateY(-1px)}
.app-top-nav .menu-nav .nav-toggle.open{background:linear-gradient(120deg,#6D5EFC 0%,#28C2C8 100%);color:#fff;
  box-shadow:0 8px 20px -8px rgba(109,94,252,.60)}
/* 数学学科专属高亮：复用 .on 视觉（紫青渐变 + 白字 + 微阴影），与"分板块" 按钮一眼可辨 */
.app-top-nav .menu-nav .nav-toggle.on{background:linear-gradient(120deg,#6D5EFC 0%,#28C2C8 100%);color:#fff;font-weight:700;
  box-shadow:0 8px 20px -8px rgba(109,94,252,.60)}
.app-top-nav .menu-nav .nav-toggle .nt-ic{display:flex;width:15px;height:15px;opacity:.9}
.app-top-nav .menu-nav .nav-toggle .nt-ic svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.app-top-nav .menu-nav .nav-toggle .nt-text{font:inherit;color:inherit}
.app-top-nav .menu-nav .nav-toggle .nt-ar{width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg);opacity:.8;transition:transform .15s;margin-left:2px;flex:none}
.app-top-nav .menu-nav .nav-toggle.open .nt-ar{transform:rotate(225deg)}
/* 数学学科专属隐藏通用项 · 展示数学特有项 */
.app-top-nav .menu-nav > a.mth-only,
.app-top-nav .nav-group-body > a.mth-only{display:none}
body[data-subject="math"] .app-top-nav .menu-nav > a.mth-only,
body[data-subject="math"] .app-top-nav .nav-group-body > a.mth-only{display:inline-flex}
/* 下拉子菜单（absolute 紧贴单行顶栏正下方，不撑高） */
.app-top-nav .nav-group-body{position:absolute;top:calc(100% + 4px);left:0;z-index:70;background:#fff;color:#241F38;
    border-radius:14px;box-shadow:0 18px 40px rgba(40,10,80,.18);padding:8px;min-width:220px;max-height:70vh;overflow:auto;
    border:1px solid rgba(120,110,150,.12);
    /* 默认收起，用户点 nav-toggle 加 .open 才展示 —— 单行布局友好 */
    display:none}
.app-top-nav .nav-group-body.open{display:block}
.app-top-nav .nav-group-body > a{display:flex;align-items:center;gap:8px;color:#241F38;padding:8px 12px;border-radius:10px;
  text-decoration:none;font-size:13px;position:relative;transition:background .12s}
.app-top-nav .nav-group-body > a:hover{background:#F4F2F7}
.app-top-nav .nav-group-body > a.on{background:#F1EDFD;color:#8B6FE8;font-weight:600}
.app-top-nav .nav-group-body > a.on::before{display:none}
.app-top-nav .nav-group-body > a svg{width:15px;height:15px;stroke:#8B6FE8;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
.app-top-nav .nav-group-body .subj-ctx-bar{display:flex;gap:6px;padding:6px 8px 10px;border-bottom:1px solid rgba(120,110,150,.1)}
.app-top-nav .nav-group-body .subj-ctx-bar select{flex:1;min-width:0;font-size:12px;padding:5px 6px;border-radius:8px;border:1px solid rgba(120,110,150,.25);background:#fff;color:#241F38}
.app-top-nav .sub-list a{color:#241F38}
/* 主区全宽 */
.app-top-nav .main{margin-left:0;width:100%;padding:0 28px 40px;max-width:1180px}
/* 2026-08-20 加：v5 公仔已迁到 Hero 居中渲染，右侧常驻（mascot-companion + xbGreet 浮动气泡）全屏隐藏，避免占位失真 */
mascot-companion#xb-companion{display:none !important}
#xbGreet.xb-greet{display:none !important}

/* ===== 整改 2026-08-20：章关卡按 grade 分组标签 ===== */
.gx-grade-group{display:flex;align-items:center;gap:10px;margin:14px 0 6px;padding:6px 0}
.gx-grade-group .gx-grade-label{font-size:11px;font-weight:600;letter-spacing:.5px;color:#fff;background:linear-gradient(135deg,#8B6FE8,#A56FE0);padding:4px 12px;border-radius:99px;text-transform:uppercase;box-shadow:0 3px 8px rgba(139,111,232,.22)}
.gx-grade-group:first-child{margin-top:6px}


/* ===== 顶栏毛玻璃改造（2026-09-02 · 与英语页/数学页同款 160° 紫→白→青渐变 + 3D 小伴图 + 学科专属命名）===== */
.app-top-nav .brand .tb-mascot{width:40px;height:40px;object-fit:contain;flex:none;
  filter:drop-shadow(0 4px 10px rgba(109,94,252,.35));animation:tbFloat 5s ease-in-out infinite}
@keyframes tbFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.app-top-nav .brand .brand-txt b::after{content:""}
body[data-subject="math"]      .app-top-nav .brand .brand-txt b::after{content:" · 数学专属陪练"}
body[data-subject="english"]   .app-top-nav .brand .brand-txt b::after{content:" · 英语专属陪练"}
body[data-subject="chinese"]   .app-top-nav .brand .brand-txt b::after{content:" · 语文专属陪练"}
body[data-subject="physics"]   .app-top-nav .brand .brand-txt b::after{content:" · 物理专属陪练"}
body[data-subject="chemistry"] .app-top-nav .brand .brand-txt b::after{content:" · 化学专属陪练"}
body[data-subject="biology"]   .app-top-nav .brand .brand-txt b::after{content:" · 生物专属陪练"}
body[data-subject="history"]   .app-top-nav .brand .brand-txt b::after{content:" · 历史专属陪练"}
body[data-subject="geography"] .app-top-nav .brand .brand-txt b::after{content:" · 地理专属陪练"}
body[data-subject="politics"]  .app-top-nav .brand .brand-txt b::after{content:" · 政治专属陪练"}
body[data-subject="science"]   .app-top-nav .brand .brand-txt b::after{content:" · 科学专属陪练"}
/* ---- [#语文主页] 语文学科顶栏：墨黑底 + 朱红印章式点缀（共享「学科专属顶栏」共性，区别于数学毛玻璃/英语紫底）---- */
body[data-subject="chinese"] .app-top-nav .top-nav{
  color:#fff;
  background:#1F2937;
  box-shadow:0 4px 18px -10px rgba(15,18,28,.5);
  border-radius:0}
body[data-subject="chinese"] .app-top-nav .brand .brand-txt b{color:#fff}
body[data-subject="chinese"] .app-top-nav .brand .brand-txt b::after{color:#F2C14E}
body[data-subject="chinese"] .app-top-nav .brand .brand-txt span{color:rgba(255,255,255,.7)}
body[data-subject="chinese"] .app-top-nav .status-pill{color:#fff;background:rgba(192,57,43,.22);border:1px solid rgba(192,57,43,.4)}
body[data-subject="chinese"] .app-top-nav .status-pill .dot{background:#E4564A;box-shadow:0 0 6px rgba(228,86,74,.6)}
body[data-subject="chinese"] .app-top-nav .theme-btn{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);color:#fff}
body[data-subject="chinese"] .app-top-nav .menu-nav > a{color:rgba(255,255,255,.82)}
body[data-subject="chinese"] .app-top-nav .menu-nav > a:hover{background:rgba(255,255,255,.1);color:#fff;transform:translateY(-1px)}
body[data-subject="chinese"] .app-top-nav .menu-nav .nav-toggle{color:rgba(255,255,255,.82)}
body[data-subject="chinese"] .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(255,255,255,.1);color:#fff;transform:translateY(-1px)}
body[data-subject="chinese"] .app-top-nav .menu-nav > a.on,
body[data-subject="chinese"] .app-top-nav .menu-nav .nav-toggle.on,
body[data-subject="chinese"] .app-top-nav .menu-nav .nav-toggle.open{
  background:linear-gradient(120deg,#C0392B 0%,#E4564A 100%);color:#fff;font-weight:700;box-shadow:0 8px 20px -8px rgba(192,57,43,.6)}
body[data-subject="info_tech"] .app-top-nav .brand .brand-txt b::after{content:" · 信息科技专属陪练"}
/* 中等屏（1279 及以下）：菜单字号略缩 · 单行不换 */
@media (max-width:1279px){
  .app-top-nav .menu-nav > a,.app-top-nav .menu-nav .nav-toggle{font-size:12.5px;padding:8px 12px}
  .app-top-nav .brand .brand-txt b{font-size:15px}
}
/* 小屏（760 及以下）：单行变两行 · 品牌一行 + 菜单换行横滑 */
@media (max-width:760px){
  .app-top-nav .top-nav-row{flex-wrap:wrap;padding:10px 14px 6px;gap:8px;min-height:auto}
  .app-top-nav .menu-nav{order:3;flex-basis:100%;padding:4px 0 12px;overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;white-space:nowrap;justify-content:flex-start}
  .app-top-nav .menu-nav > a,.app-top-nav .menu-nav .nav-toggle{padding:6px 11px;font-size:12px}
  .app-top-nav .brand .tb-mascot{width:30px;height:30px}
  .app-top-nav .status-row .theme-btn{display:none}
}

/* ===== [#541] 物理学科整页深空外壳（drawable shell） =====
   · 仅在 body[data-subject="physics"] 作用域下激活，其他学科完全不受影响
   · 让画布 + 顶部通栏 + 公仔 + 本地模式 banner 全部进入深空母题，对齐 mockup 整页深空期望
   · 离开物理路由时 app.js:16813 delete dataset.subject → 自动回退到默认主题，不会跨学科注入 */
body[data-subject="physics"]{color-scheme:dark}
body[data-subject="physics"]{
  --ink:#eaf1ff;--ink-2:rgba(219,231,255,.78);--ink-3:rgba(219,231,255,.55);
  --hair:rgba(40,224,255,.18);--hair-strong:rgba(40,224,255,.26);--hair-soft:rgba(40,224,255,.10);
  --remain:rgba(13,18,38,.66);--muted:rgba(219,231,255,.62);--line:rgba(40,224,255,.18)}
body[data-subject="physics"]{
  /* [#544] 物理底色回到深空黑：去掉大色斑+蓝紫色谱 → 用 #070b18→#050816→#04060f 这种近黑冷调；保留极弱青/紫微光让 hero 文本不寡，但页面整体仍是深空黑体验 */
  background:
    radial-gradient(circle at 12% -4%, rgba(40,224,255,.06), transparent 44%),
    radial-gradient(circle at 92% 96%, rgba(122,92,255,.07), transparent 50%),
    linear-gradient(180deg, #070b18 0%, #050816 55%, #04060f 100%);
  background-attachment:fixed;color:var(--ink)}
body[data-subject="physics"]::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(40,224,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(40,224,255,.045) 1px,transparent 1px);
  background-size:56px 56px;background-position:-1px -1px;
  mask-image:radial-gradient(ellipse at 50% 14%,#000 0%,transparent 70%);opacity:.85}
body[data-subject="physics"] .app-layout{position:relative;z-index:1}
body[data-subject="physics"] .app-top-nav .top-nav{
  color:#eaf1ff;
  background:linear-gradient(180deg,rgba(7,11,24,.92) 0%,rgba(10,16,32,.86) 100%);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border-bottom:1px solid rgba(40,224,255,.22);
  box-shadow:0 6px 28px -18px rgba(40,224,255,.55);
  border-radius:0}
body[data-subject="physics"] .app-top-nav .brand .brand-txt b{color:#eaf1ff}
body[data-subject="physics"] .app-top-nav .brand .brand-txt span{color:rgba(219,231,255,.62)}
body[data-subject="physics"] .app-top-nav .status-pill{color:#a5e9ff;background:rgba(40,224,255,.10);border:1px solid rgba(40,224,255,.30)}
body[data-subject="physics"] .app-top-nav .status-pill .dot{background:#28e0ff;box-shadow:0 0 6px rgba(40,224,255,.60)}
body[data-subject="physics"] .app-top-nav .theme-btn{background:rgba(40,224,255,.10);border:1px solid rgba(40,224,255,.30);color:#dbe7ff}
body[data-subject="physics"] .app-top-nav .menu-nav > a{color:rgba(219,231,255,.72)}
body[data-subject="physics"] .app-top-nav .menu-nav > a:hover{background:rgba(40,224,255,.14);color:#eaf1ff;transform:translateY(-1px)}
body[data-subject="physics"] .app-top-nav .menu-nav .nav-toggle{color:rgba(219,231,255,.72)}
body[data-subject="physics"] .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(40,224,255,.14);color:#eaf1ff;transform:translateY(-1px)}
body[data-subject="physics"] .app-top-nav .menu-nav > a.on,
body[data-subject="physics"] .app-top-nav .menu-nav .nav-toggle.on,
body[data-subject="physics"] .app-top-nav .menu-nav .nav-toggle.open{
  background:linear-gradient(120deg,#28e0ff 0%,#7a5cff 100%);color:#03102a;font-weight:700;
  box-shadow:0 8px 22px -10px rgba(40,224,255,.70)}
body[data-subject="physics"] #mascotV5Wrap{
  /* [#544] 小伴完全融入底色：去掉外框/阴影/radial 背景，让小伴公仔像漂浮在深空里，而不是装在胶囊容器里 */
  background:transparent !important;
  border:0;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-radius:0}
body[data-subject="physics"] .local-mode-banner{color:rgba(219,231,255,.78);background:rgba(13,18,38,.66);border-color:rgba(40,224,255,.22)}
body[data-subject="physics"] .local-mode-banner b{color:#a5e9ff}

/* ===== 化学专属整页主题（绿青「实验室」母题）=====
   · 仅在 body[data-subject="chemistry"] 作用域激活，与其他学科完全隔离
   · 浅色实验室底（绿青微染 + 元素周期表点阵纹理）；顶栏绿青渐变通栏，区别于默认紫/物理深空/数学紫青毛玻璃
   · 离开化学路由时 app.js 清 dataset.subject → 自动回退默认主题，不跨学科注入 */
body[data-subject="chemistry"]{
  --ink:#0E2A22;--ink-2:rgba(14,42,34,.72);--ink-3:rgba(14,42,34,.55);
  --hair:rgba(16,185,129,.16);--hair-strong:rgba(16,185,129,.24);--hair-soft:rgba(16,185,129,.08);
  --line:rgba(16,185,129,.16);
  background:
    /* 左上 清新薄荷绿辉（替代旧版发黄） */
    radial-gradient(circle at 8% 4%, rgba(16,185,129,.14) 0%, rgba(16,185,129,.04) 42%, transparent 64%),
    /* 右上 浅青辉 */
    radial-gradient(circle at 92% 2%, rgba(6,182,212,.12) 0%, rgba(6,182,212,.03) 44%, transparent 66%),
    /* 左下 青绿辅辉 */
    radial-gradient(circle at 2% 96%, rgba(20,184,166,.12) 0%, rgba(20,184,166,.03) 44%, transparent 64%),
    /* 右下 蓝青辅辉 */
    radial-gradient(circle at 98% 94%, rgba(6,182,212,.13) 0%, rgba(6,182,212,.04) 44%, transparent 64%),
    /* 中央 通透绿青漫射 */
    radial-gradient(ellipse at 50% 42%, rgba(45,212,191,.07) 0%, rgba(6,182,212,.04) 52%, transparent 74%),
    /* 底层 现代冷调薄荷→青过渡（无发黄） */
    linear-gradient(158deg, #F4FFFB 0%, #EEFBF8 26%, #E9F9F7 48%, #E6F7FB 72%, #EDF7F5 100%);
  background-attachment:fixed;color:var(--ink)}
body[data-subject="chemistry"]::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:radial-gradient(rgba(16,185,129,.06) 1.2px,transparent 1.2px);
  background-size:28px 28px;
  mask-image:radial-gradient(ellipse at 50% 10%,#000 0%,transparent 70%);
  -webkit-mask-image:radial-gradient(ellipse at 50% 10%,#000 0%,transparent 70%);
  opacity:.7}
body[data-subject="chemistry"] .app-layout{position:relative;z-index:1}
/* 顶栏：绿青渐变通栏 */
body[data-subject="chemistry"] .app-top-nav .top-nav{
  color:#fff;
  background:linear-gradient(120deg,#10B981 0%,#06B6D4 100%);
  box-shadow:0 6px 26px -14px rgba(16,185,129,.7);
  border-bottom:1px solid rgba(255,255,255,.18);
  border-radius:0}
body[data-subject="chemistry"] .app-top-nav .brand .brand-txt b{color:#fff}
body[data-subject="chemistry"] .app-top-nav .brand .brand-txt b::after{color:rgba(255,255,255,.8)}
body[data-subject="chemistry"] .app-top-nav .brand .brand-txt span{color:rgba(255,255,255,.8)}
body[data-subject="chemistry"] .app-top-nav .status-pill{color:#fff;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32)}
body[data-subject="chemistry"] .app-top-nav .status-pill .dot{background:#fff;box-shadow:0 0 6px rgba(255,255,255,.6)}
body[data-subject="chemistry"] .app-top-nav .theme-btn{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32);color:#fff}
body[data-subject="chemistry"] .app-top-nav .menu-nav > a{color:rgba(255,255,255,.85)}
body[data-subject="chemistry"] .app-top-nav .menu-nav > a:hover{background:rgba(255,255,255,.16);color:#fff;transform:translateY(-1px)}
body[data-subject="chemistry"] .app-top-nav .menu-nav .nav-toggle{color:rgba(255,255,255,.85)}
body[data-subject="chemistry"] .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(255,255,255,.16);color:#fff;transform:translateY(-1px)}
/* active：白底绿字胶囊，在绿青栏上最夺目 */
body[data-subject="chemistry"] .app-top-nav .menu-nav > a.on,
body[data-subject="chemistry"] .app-top-nav .menu-nav .nav-toggle.on,
body[data-subject="chemistry"] .app-top-nav .menu-nav .nav-toggle.open{
  background:#fff;color:#0E9F6E;font-weight:700;box-shadow:0 6px 16px -6px rgba(0,0,0,.22)}
body[data-subject="chemistry"] .app-top-nav .menu-nav > a.on::before{display:none}
body[data-subject="chemistry"] .app-top-nav .menu-nav > a.on svg{stroke:#0E9F6E}
body[data-subject="chemistry"] .local-mode-banner{color:rgba(14,42,34,.78);background:rgba(255,255,255,.7);border-color:rgba(16,185,129,.22)}
body[data-subject="chemistry"] .local-mode-banner b{color:#0E9F6E}

/* ============================================================
   生物专属整页主题（[#生物改造]）
   · 仅在 body[data-subject="biology"] 作用域激活，与其他学科完全隔离
   · 浅色叶绿底（绿系微染 + 点阵纹理）；顶栏叶绿渐变通栏，区别于化学绿青/物理深空/数学紫青
   · 离开生物路由时 app.js 清 dataset.subject → 自动回退默认主题，不跨学科注入 */
body[data-subject="biology"]{
  --ink:#0E2A1A;--ink-2:rgba(14,42,26,.72);--ink-3:rgba(14,42,26,.55);
  --hair:rgba(34,197,94,.16);--hair-strong:rgba(34,197,94,.24);--hair-soft:rgba(34,197,94,.08);
  --line:rgba(34,197,94,.16);
  background:
    /* 左上 清新叶绿辉 */
    radial-gradient(circle at 8% 4%, rgba(34,197,94,.14) 0%, rgba(34,197,94,.04) 42%, transparent 64%),
    /* 右上 深叶绿辉 */
    radial-gradient(circle at 92% 2%, rgba(22,163,74,.12) 0%, rgba(22,163,74,.03) 44%, transparent 66%),
    /* 左下 嫩绿（lime）生长辉 */
    radial-gradient(circle at 2% 96%, rgba(132,204,22,.12) 0%, rgba(132,204,22,.03) 44%, transparent 64%),
    /* 右下 叶绿辅辉 */
    radial-gradient(circle at 98% 94%, rgba(21,128,61,.13) 0%, rgba(21,128,61,.04) 44%, transparent 64%),
    /* 中央 通透绿漫射 */
    radial-gradient(ellipse at 50% 42%, rgba(74,222,128,.07) 0%, rgba(34,197,94,.04) 52%, transparent 74%),
    /* 底层 现代绿调（无发黄/无青） */
    linear-gradient(158deg, #F4FBF4 0%, #EEF8F0 26%, #E8F6F3 48%, #E6F7EF 72%, #EDF8F2 100%);
  background-attachment:fixed;color:var(--ink)}
body[data-subject="biology"]::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1440'%20height='900'%20viewBox='0%200%201440%20900'%3E%3Cg%20fill='none'%20stroke='%2322C55E'%20stroke-opacity='0.05'%20stroke-width='2'%3E%3Cpath%20d='M-40%20760C240%20680%20360%20800%20600%20700C840%20600%20980%20760%201240%20640'/%3E%3Cpath%20d='M-40%20820C260%20760%20380%20860%20620%20760C860%20660%201000%20820%201280%20700'/%3E%3Cpath%20d='M-40%20130C220%20180%20360%2080%20600%20180C840%20280%20980%20140%201240%20230'/%3E%3C/g%3E%3Cg%20fill='%2322C55E'%20fill-opacity='0.05'%3E%3Ccircle%20cx='600'%20cy='700'%20r='4'/%3E%3Ccircle%20cx='1190'%20cy='650'%20r='3'/%3E%3Ccircle%20cx='300'%20cy='765'%20r='3'/%3E%3Ccircle%20cx='900'%20cy='700'%20r='3'/%3E%3Ccircle%20cx='620'%20cy='180'%20r='3'/%3E%3Ccircle%20cx='300'%20cy='130'%20r='3'/%3E%3C/g%3E%3C/svg%3E");
  background-size:cover;background-repeat:no-repeat;background-position:center top;
  mask-image:radial-gradient(ellipse at 50% 20%,#000 0%,transparent 80%);
  -webkit-mask-image:radial-gradient(ellipse at 50% 20%,#000 0%,transparent 80%);
  opacity:.9}
body[data-subject="biology"] .app-layout{position:relative;z-index:1}
/* 顶栏：叶绿渐变通栏 */
body[data-subject="biology"] .app-top-nav .top-nav{
  color:#fff;
  background:linear-gradient(120deg,#22C55E 0%,#15803D 100%);
  box-shadow:0 6px 26px -14px rgba(34,197,94,.7);
  border-bottom:1px solid rgba(255,255,255,.18);
  border-radius:0}
body[data-subject="biology"] .app-top-nav .brand .brand-txt b{color:#fff}
body[data-subject="biology"] .app-top-nav .brand .brand-txt b::after{color:rgba(255,255,255,.8)}
body[data-subject="biology"] .app-top-nav .brand .brand-txt span{color:rgba(255,255,255,.8)}
body[data-subject="biology"] .app-top-nav .status-pill{color:#fff;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32)}
body[data-subject="biology"] .app-top-nav .status-pill .dot{background:#fff;box-shadow:0 0 6px rgba(255,255,255,.6)}
body[data-subject="biology"] .app-top-nav .theme-btn{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32);color:#fff}
body[data-subject="biology"] .app-top-nav .menu-nav > a{color:rgba(255,255,255,.85)}
body[data-subject="biology"] .app-top-nav .menu-nav > a:hover{background:rgba(255,255,255,.16);color:#fff;transform:translateY(-1px)}
body[data-subject="biology"] .app-top-nav .menu-nav .nav-toggle{color:rgba(255,255,255,.85)}
body[data-subject="biology"] .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(255,255,255,.16);color:#fff;transform:translateY(-1px)}
/* active：白底绿字胶囊，在叶绿栏上最夺目 */
body[data-subject="biology"] .app-top-nav .menu-nav > a.on,
body[data-subject="biology"] .app-top-nav .menu-nav .nav-toggle.on,
body[data-subject="biology"] .app-top-nav .menu-nav .nav-toggle.open{
  background:#fff;color:#15803D;font-weight:700;box-shadow:0 6px 16px -6px rgba(0,0,0,.22)}
body[data-subject="biology"] .app-top-nav .menu-nav > a.on::before{display:none}
body[data-subject="biology"] .app-top-nav .menu-nav > a.on svg{stroke:#15803D}
body[data-subject="biology"] .local-mode-banner{color:rgba(14,42,26,.78);background:rgba(255,255,255,.7);border-color:rgba(34,197,94,.22)}
body[data-subject="biology"] .local-mode-banner b{color:#15803D}

/* ===== 生物 Hero（生命母题：有机叶片形 + 显微镜头框 + 年轮掌握度 + 叶片标本标签） ===== */
.bio-hero{position:relative;margin:18px 0 6px;padding:34px 38px 38px;border-radius:36px 36px 72px 36px;overflow:hidden;
  background:linear-gradient(160deg, rgba(255,255,255,.94) 0%, rgba(236,252,240,.82) 55%, rgba(220,247,232,.72) 100%);
  border:1px solid rgba(34,197,94,.20);box-shadow:0 22px 60px -30px rgba(34,197,94,.55)}
.bio-hero-glow{position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(520px 300px at 90% 8%, rgba(34,197,94,.18), transparent 60%),
    radial-gradient(460px 280px at 4% 96%, rgba(132,204,22,.14), transparent 60%)}
.bio-hero-leaf{position:absolute;right:-60px;top:-70px;width:240px;height:240px;pointer-events:none;opacity:.5;
  background:radial-gradient(circle at 40% 40%, rgba(74,222,128,.30), rgba(34,197,94,.10) 60%, transparent 72%);
  border-radius:0 0 0 100%;transform:rotate(8deg)}
.bio-hero-in{position:relative;z-index:1;display:grid;grid-template-columns:1.04fr .96fr;gap:28px;align-items:center}
.bio-copy{min-width:0}
.bio-kicker{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.12em;color:#15803D;
  background:rgba(255,255,255,.7);border:1px solid rgba(34,197,94,.28);padding:7px 13px;border-radius:8px 14px 8px 14px;
  box-shadow:0 4px 12px -6px rgba(34,197,94,.4)}
.bio-kicker-leaf{width:16px;height:16px;color:#22C55E;flex:0 0 auto}
.bio-title{position:relative;font-size:40px;line-height:1.1;margin:18px 0 6px;font-weight:800;color:var(--ink);letter-spacing:-.5px}
.bio-title .g{background:linear-gradient(120deg,#22C55E,#15803D);-webkit-background-clip:text;background-clip:text;color:transparent}
.bio-scribble{display:block;width:250px;max-width:80%;height:14px;margin:2px 0 14px;overflow:visible}
.bio-lede{font-size:15px;line-height:1.7;color:var(--ink-3);margin:0 0 20px;max-width:520px}
.bio-lede b{color:#15803D;font-weight:700}
.bio-acts{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.bio-acts .btn{border-radius:99px;padding:10px 18px;font-size:13.5px;font-weight:600;border:1px solid rgba(34,197,94,.25);background:#fff;color:#15803D;cursor:pointer;transition:.18s}
.bio-acts .btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(34,197,94,.5)}
.bio-acts .btn.pri{background:linear-gradient(135deg,#22C55E,#15803D);color:#fff;border-color:transparent;box-shadow:0 10px 24px -10px rgba(34,197,94,.6)}
.bio-acts .btn.ghost{background:rgba(34,197,94,.06)}
.bio-stats{display:flex;align-items:center;gap:16px}
.bio-ring-wrap{position:relative;flex:0 0 auto}
.bio-ring{flex:0 0 auto;display:block}
.bio-ring-seed{position:absolute;right:-6px;bottom:-6px;font-size:20px;filter:drop-shadow(0 2px 4px rgba(34,197,94,.4))}
.bio-stat-col{display:flex;flex-direction:column;gap:6px}
.bio-stat-col .row{display:flex;gap:22px}
.bio-stat-col .row > div{display:flex;flex-direction:column}
.bio-stat-col b{font-size:22px;font-weight:800;color:#15803D;line-height:1}
.bio-stat-col span{font-size:11.5px;color:var(--ink-3);margin-top:3px}
.bio-stat-note{font-size:11px;color:var(--ink-3);opacity:.85}
/* 右视觉：显微镜头框（细胞 + DNA 双螺旋） */
.bio-viz{position:relative;min-height:300px;display:flex;align-items:center;justify-content:center}
.bio-lens{position:relative;width:100%;max-width:380px;aspect-ratio:1/1;margin:0 auto;border-radius:50%;overflow:hidden;
  background:radial-gradient(circle at 42% 38%, rgba(236,252,240,.9), rgba(220,247,232,.7) 60%, rgba(187,247,208,.35) 100%);
  border:2px solid rgba(34,197,94,.30);box-shadow:0 22px 50px -22px rgba(34,197,94,.6), inset 0 0 40px rgba(34,197,94,.10)}
.bio-lens-reticle{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.bio-lens-viz{position:absolute;inset:0;width:100%;height:100%;z-index:1}
.bio-dna,.bio-orbit,.bio-particles{transform-box:fill-box}
/* 生物专属行动条（生命母题 · 书签横幅，区别于化学配平横条） */
.bio-cta{position:relative;display:flex;align-items:center;gap:16px;margin:20px 0 4px;padding:18px 22px 18px 26px;border-radius:14px 22px 14px 22px;text-decoration:none;color:inherit;overflow:hidden;
  background:linear-gradient(120deg, rgba(34,197,94,.14), rgba(132,204,22,.06) 70%, rgba(255,255,255,.5));
  border:1px solid rgba(34,197,94,.28);box-shadow:0 12px 30px -18px rgba(34,197,94,.6);transition:transform .2s ease,box-shadow .2s ease}
.bio-cta::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(180deg,#22C55E,#15803D)}
.bio-cta:hover{transform:translateY(-3px);box-shadow:0 18px 40px -20px rgba(34,197,94,.7);border-color:rgba(34,197,94,.5)}
.bio-cta-ic{width:48px;height:48px;border-radius:50%;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 38% 34%, #4ADE80, #15803D);color:#fff;box-shadow:0 8px 18px -8px rgba(34,197,94,.7)}
.bio-cta-ic svg{width:26px;height:26px}
.bio-cta-body{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.bio-cta-title{font-size:16px;font-weight:700;color:var(--ink)}
.bio-cta-sub{font-size:12.5px;color:var(--ink-3);line-height:1.55}
.bio-cta-go{margin-left:auto;flex:0 0 auto;font-size:13.5px;font-weight:700;color:#15803D;white-space:nowrap}
/* ===== 生物域卡：生命之树 · 有机细胞形卡片（区别于化学矩形 .chem-dom） ===== */
.bio-domains{margin:8px 0 4px}
.bio-dom-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 10px}
.bio-dom-title{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:800;color:var(--ink);margin:0;letter-spacing:.2px}
.bio-dom-title-ic{font-size:22px}
.bio-dom-sub{font-size:13px;color:var(--ink-3);line-height:1.5}
.bio-tree{position:relative}
.bio-vine{position:absolute;left:0;right:0;top:6px;width:100%;height:120px;z-index:0;pointer-events:none;opacity:.9}
.bio-dom-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding-top:18px}
.bio-dom{position:relative;display:flex;flex-direction:column;gap:10px;padding:22px 20px 20px;border-radius:30px 30px 30px 12px;text-decoration:none;color:inherit;overflow:hidden;
  background:linear-gradient(165deg,#fff 38%, color-mix(in srgb, var(--pc) 7%, #fff) 100%);
  border:1.5px solid rgba(34,197,94,.22);box-shadow:0 10px 26px -16px rgba(34,197,94,.5);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.bio-dom:hover{transform:translateY(-6px);border-color:var(--pc);box-shadow:0 20px 40px -18px color-mix(in srgb, var(--pc) 50%, transparent)}
.bio-dom.is-empty{opacity:.55;filter:grayscale(.2)}
.bio-dom-stem{position:absolute;top:-20px;left:50%;width:3px;height:22px;transform:translateX(-50%);background:linear-gradient(180deg, rgba(34,197,94,0), rgba(34,197,94,.4));border-radius:2px}
.bio-dom-nuc{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  background:radial-gradient(circle at 38% 34%, color-mix(in srgb, var(--pc) 32%, #fff), color-mix(in srgb, var(--pc) 12%, #fff));
  border:1.5px solid color-mix(in srgb, var(--pc) 45%, transparent);color:var(--pc);box-shadow:0 6px 16px -8px color-mix(in srgb, var(--pc) 60%, transparent)}
.bio-dom-nuc svg{width:32px;height:32px}
.bio-dom-body{min-width:0}
.bio-dom-body h3{font-size:17px;font-weight:700;color:var(--ink);margin:0 0 6px}
.bio-dom-body p{font-size:12.5px;line-height:1.55;color:var(--ink-3);margin:0 0 8px}
.bio-dom-go{display:inline-block;font-size:13px;font-weight:700;color:var(--pc)}
.bio-dom-badge{position:absolute;top:16px;right:16px;font-size:11px;font-weight:600;color:#15803D;background:rgba(34,197,94,.10);border:1px solid rgba(34,197,94,.18);padding:4px 9px;border-radius:99px}
.bio-dom-badge b{font-size:13px}
/* 响应式 */
@media (max-width:1080px){
  .bio-dom-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .bio-vine{display:none}
  .bio-dom-stem{display:none}
}
@media (max-width:880px){
  .bio-hero-in{grid-template-columns:1fr}
  .bio-viz{min-height:300px;order:-1}
  .bio-lens{max-width:320px}
}
@media (max-width:780px){
  .bio-hero{padding:24px 18px 26px;border-radius:26px 26px 50px 26px}
  .bio-title{font-size:30px}
  .bio-dom-grid{grid-template-columns:1fr}
  .bio-cta{flex-wrap:wrap}
  .bio-cta-go{margin-left:0}
}

/* ============ 历史 · 青铜古卷母题（文科，与理科三科彻底分家）============ */
/* 仅在 body[data-subject="history"] 作用域激活，完全隔离 */
body[data-subject="history"]{
  --ink:#3B2F1E; --ink-2:#5B4A32; --ink-3:#8A7656;
  --his:#B45309; --his-deep:#92400E; --his-bright:#D97706; --his-seal:#B91C1C; --his-paper:#FBF6EC;
  background:
    radial-gradient(900px 520px at 86% 6%, rgba(217,119,6,.13), transparent 60%),
    radial-gradient(820px 480px at 5% 95%, rgba(146,64,14,.10), transparent 60%),
    linear-gradient(160deg,#FBF6EC 0%,#F7EFDD 38%,#F4ECD8 70%,#F2E9D4 100%);
  color:var(--ink);
}
body[data-subject="history"]::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:repeating-linear-gradient(90deg, rgba(146,64,14,.05) 0 1px, transparent 1px 28px);
  mask-image:radial-gradient(ellipse at 50% 2%, #000 0%, transparent 76%);
  -webkit-mask-image:radial-gradient(ellipse at 50% 2%, #000 0%, transparent 76%);
  opacity:.7}
body[data-subject="history"] .app-layout{position:relative;z-index:1}
/* 青铜顶栏 */
body[data-subject="history"] .app-top-nav .top-nav{background:#1A1635;border-bottom:1px solid rgba(146,64,14,.4);box-shadow:0 6px 18px -8px rgba(146,64,14,.5)}
body[data-subject="history"] .app-top-nav .brand .brand-txt b{color:#FFF8EC}
body[data-subject="history"] .app-top-nav .brand .brand-txt b::after{content:" · 历史专属陪练";color:rgba(255,248,236,.78);font-weight:500}
body[data-subject="history"] .app-top-nav .brand .brand-txt span{color:rgba(255,248,236,.78)}
body[data-subject="history"] .app-top-nav .status-pill{color:#FFF8EC;background:rgba(255,248,236,.18);border:1px solid rgba(255,248,236,.34)}
body[data-subject="history"] .app-top-nav .status-pill .dot{background:#FFF8EC;box-shadow:0 0 6px rgba(255,248,236,.6)}
body[data-subject="history"] .app-top-nav .theme-btn{background:rgba(255,248,236,.18);border:1px solid rgba(255,248,236,.34);color:#FFF8EC}
body[data-subject="history"] .app-top-nav .menu-nav > a{color:rgba(255,248,236,.86)}
body[data-subject="history"] .app-top-nav .menu-nav > a:hover{background:rgba(255,248,236,.16);color:#fff;transform:translateY(-1px)}
body[data-subject="history"] .app-top-nav .menu-nav .nav-toggle{color:rgba(255,248,236,.86)}
body[data-subject="history"] .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(255,248,236,.16);color:#fff;transform:translateY(-1px)}
body[data-subject="history"] .app-top-nav .menu-nav > a.on,
body[data-subject="history"] .app-top-nav .menu-nav .nav-toggle.on,
body[data-subject="history"] .app-top-nav .menu-nav .nav-toggle.open{background:#FFF8EC;color:var(--his-deep);font-weight:700;box-shadow:0 4px 12px -4px rgba(0,0,0,.25)}
body[data-subject="history"] .app-top-nav .menu-nav > a.on::before{display:none}
body[data-subject="history"] .app-top-nav .menu-nav > a.on svg{stroke:var(--his-deep)}
body[data-subject="history"] .local-mode-banner{color:rgba(59,47,30,.78);background:rgba(255,248,236,.72);border-color:rgba(180,83,9,.22)}
body[data-subject="history"] .local-mode-banner b{color:var(--his-deep)}

/* Hero */
.his-hero{position:relative;margin:18px 0 6px;padding:30px 34px 34px;border-radius:22px;overflow:hidden;
  background:linear-gradient(165deg, rgba(255,253,248,.94) 0%, rgba(247,239,221,.82) 100%);
  border:1px solid rgba(180,83,9,.22);box-shadow:0 18px 48px -28px rgba(146,64,14,.5)}
.his-hero-grain{position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:repeating-linear-gradient(90deg, rgba(146,64,14,.04) 0 1px, transparent 1px 30px)}
.his-hero-in{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:center}
.his-copy{min-width:0}
.his-kicker{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--his-deep);
  background:rgba(180,83,9,.1);border:1px solid rgba(180,83,9,.24);padding:6px 12px;border-radius:99px}
.his-kicker .seal{width:20px;height:20px;border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#FFF8EC;background:linear-gradient(135deg,#C9821F,#92400E);box-shadow:0 2px 6px -2px rgba(146,64,14,.6);font-family:serif}
.his-title{font-size:38px;line-height:1.12;margin:16px 0 12px;font-weight:800;color:var(--ink);letter-spacing:-.5px;font-family:"Songti SC","SimSun",serif}
.his-title .g{background:linear-gradient(120deg,#D97706,#92400E);-webkit-background-clip:text;background-clip:text;color:transparent}
.his-lede{font-size:15px;line-height:1.7;color:var(--ink-3);margin:0 0 20px;max-width:520px}
.his-lede b{color:var(--his-deep);font-weight:700}
.his-acts{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.his-acts .btn{border-radius:99px;padding:10px 18px;font-size:13.5px;font-weight:600;border:1px solid rgba(180,83,9,.28);background:#fff;color:var(--his-deep);cursor:pointer;transition:.18s}
.his-acts .btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(180,83,9,.5)}
.his-acts .btn.pri{background:linear-gradient(135deg,#C9821F,#92400E);color:#FFF8EC;border-color:transparent;box-shadow:0 10px 24px -10px rgba(146,64,14,.6)}
.his-acts .btn.ghost{background:rgba(180,83,9,.06)}
.his-stats{display:flex;align-items:center;gap:16px}
.his-ring{flex:0 0 auto}
.his-stat-col{display:flex;flex-direction:column;gap:6px}
.his-stat-col .row{display:flex;gap:22px}
.his-stat-col .row > div{display:flex;flex-direction:column}
.his-stat-col b{font-size:22px;font-weight:800;color:var(--his-deep);line-height:1}
.his-stat-col span{font-size:11.5px;color:var(--ink-3);margin-top:3px}
.his-stat-note{font-size:11px;color:var(--ink-3);opacity:.85}
.his-viz{position:relative;min-height:320px}
.his-viz svg{width:100%;height:100%;display:block;max-height:380px}
.his-scroll,.his-ding{transform-box:fill-box}
.his-seal{transform-box:fill-box;transform-origin:center}
.his-seal.s1{animation:hisFloat1 4.6s ease-in-out infinite}
.his-seal.s2{animation:hisFloat2 5.2s ease-in-out infinite}
.his-seal.s3{animation:hisFloat1 5.8s ease-in-out infinite .4s}
.his-seal.s4{animation:hisFloat2 4.2s ease-in-out infinite .8s}
@keyframes hisFloat1{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-9px) rotate(-3deg)}}
@keyframes hisFloat2{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(8px) rotate(3deg)}}
.his-river{transform-box:fill-box}

/* 三域时光长河矩阵 */
.his-domains{position:relative;margin:24px 0 4px;padding:26px 30px 30px;border-radius:22px;
  background:linear-gradient(165deg, rgba(255,253,248,.9), rgba(247,239,221,.78));
  border:1px solid rgba(180,83,9,.2);box-shadow:0 14px 38px -26px rgba(146,64,14,.5)}
.his-dom-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 8px}
.his-dom-title{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:800;color:var(--ink);margin:0;letter-spacing:.2px;font-family:"Songti SC","SimSun",serif}
.his-dom-sub{font-size:13px;color:var(--ink-3);line-height:1.5}
.his-river{position:relative;height:18px;margin:6px 0 4px;overflow:hidden}
.his-river svg{width:100%;height:100%}
.his-dom-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding-top:14px}
.his-dom{position:relative;display:flex;flex-direction:column;gap:10px;padding:22px 20px 20px;border-radius:14px 14px 30px 14px;text-decoration:none;color:inherit;overflow:hidden;
  background:linear-gradient(165deg,#FFFDF8 40%, color-mix(in srgb, var(--pc) 6%, #fff) 100%);
  border:1px solid color-mix(in srgb, var(--pc) 30%, #e8ddc6)}
.his-dom:hover{transform:translateY(-6px);border-color:var(--pc);box-shadow:0 20px 40px -18px color-mix(in srgb, var(--pc) 50%, transparent)}
.his-dom.is-empty{opacity:.55;filter:grayscale(.2)}
.his-dom-seal{position:absolute;top:16px;right:16px;width:38px;height:38px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800;color:#FFF8EC;
  background:linear-gradient(135deg, color-mix(in srgb, var(--pc) 86%, #7c2a12), color-mix(in srgb, var(--pc) 60%, #000 10%));
  box-shadow:0 4px 10px -4px color-mix(in srgb, var(--pc) 60%, transparent);font-family:serif;transform:rotate(-6deg)}
.his-dom-art{width:50px;height:50px;color:var(--pc);flex:0 0 auto}
.his-dom-art svg{width:50px;height:50px}
.his-dom-body{min-width:0}
.his-dom-body h3{font-size:17px;font-weight:700;color:var(--ink);margin:0 0 6px;font-family:"Songti SC","SimSun",serif}
.his-dom-body p{font-size:12.5px;line-height:1.55;color:var(--ink-3);margin:0 0 8px}
.his-dom-go{display:inline-block;font-size:13px;font-weight:700;color:var(--pc)}
.his-dom-badge{position:absolute;bottom:16px;right:16px;font-size:11px;font-weight:600;color:var(--his-deep);background:rgba(180,83,9,.1);border:1px solid rgba(180,83,9,.18);padding:4px 9px;border-radius:99px}
.his-dom-badge b{font-size:13px}

/* 学习舱 CTA（书签绶带） */
.his-cta{display:flex;align-items:center;gap:16px;margin:20px 0 4px;padding:18px 22px 18px 26px;border-radius:16px;text-decoration:none;color:inherit;position:relative;overflow:hidden;
  background:linear-gradient(135deg, rgba(180,83,9,.1), rgba(146,64,14,.05));
  border:1px solid rgba(180,83,9,.26);box-shadow:0 12px 30px -18px rgba(146,64,14,.6);transition:transform .2s ease,box-shadow .2s ease}
.his-cta:hover{transform:translateY(-3px);box-shadow:0 18px 40px -20px rgba(146,64,14,.7);border-color:rgba(180,83,9,.5)}
.his-cta-ribbon{position:absolute;left:0;top:0;bottom:0;width:7px;background:linear-gradient(180deg,#C9821F,#92400E)}
.his-cta-ic{width:48px;height:48px;border-radius:14px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-size:24px;background:linear-gradient(135deg,#C9821F,#92400E);color:#FFF8EC;box-shadow:0 8px 18px -8px rgba(146,64,14,.7)}
.his-cta-body{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.his-cta-title{font-size:16px;font-weight:700;color:var(--ink);font-family:"Songti SC","SimSun",serif}
.his-cta-sub{font-size:12.5px;color:var(--ink-3);line-height:1.55}
.his-cta-go{margin-left:auto;flex:0 0 auto;font-size:13.5px;font-weight:700;color:var(--his-deep);white-space:nowrap}

/* 研习舱能力网格 */
.his-feat{margin:24px 0 4px;padding:24px 28px 26px;border-radius:22px;
  background:linear-gradient(165deg, rgba(255,253,248,.9), rgba(247,239,221,.8));
  border:1px solid rgba(180,83,9,.2);box-shadow:0 14px 38px -26px rgba(146,64,14,.5)}
.his-feat-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.his-feat-title{font-size:20px;font-weight:800;color:var(--ink);margin:0;font-family:"Songti SC","SimSun",serif}
.his-feat-sub{font-size:13px;color:var(--ink-3)}
.his-feat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.his-card{display:flex;align-items:center;gap:14px;padding:16px 18px;background:#FFFDF8;border:1px solid rgba(180,83,9,.2);border-radius:14px;text-decoration:none;color:inherit;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;min-width:0}
.his-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(146,64,14,.45);border-color:rgba(180,83,9,.45)}
.his-card-ic{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex:0 0 auto}
.his-card-bd{display:flex;flex-direction:column;gap:3px;min-width:0}
.his-card-bd b{font-size:15px;color:var(--ink);font-weight:600}
.his-card-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.4}
.his-card-go{margin-left:auto;font-size:13px;color:var(--his-deep);font-weight:600;flex:0 0 auto}
.his-ask{display:flex;align-items:center;gap:14px;margin-top:16px;padding:16px 20px;border-radius:16px;text-decoration:none;color:inherit;
  background:linear-gradient(135deg, rgba(180,83,9,.08), rgba(146,64,14,.03));border:1px solid rgba(180,83,9,.22)}
.his-ask:hover{border-color:rgba(180,83,9,.5)}
.his-ask-ic{width:42px;height:42px;border-radius:12px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-size:21px;background:rgba(180,83,9,.14);color:var(--his-deep)}
.his-ask-bd{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.his-ask-bd b{font-size:15px;color:var(--ink);font-weight:600}
.his-ask-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.45}
.his-ask-go{margin-left:auto;font-size:13.5px;font-weight:700;color:var(--his-deep);white-space:nowrap}

/* 历史章节卡着重色（data-his-domain 打标） */
body[data-subject="history"] .gx-chapter{border-left:3px solid var(--ch-accent,#B45309)}

/* 响应式 */
@media (max-width:980px){
  .his-feat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:880px){
  .his-hero-in{grid-template-columns:1fr}
  .his-viz{min-height:280px;order:-1}
}
@media (max-width:780px){
  .his-hero{padding:24px 18px 26px;border-radius:26px 26px 50px 26px}
  .his-title{font-size:30px}
  .his-dom-grid{grid-template-columns:1fr}
  .his-feat-grid{grid-template-columns:1fr}
  .his-cta{flex-wrap:wrap}
  .his-cta-go{margin-left:0}
  .his-ask{flex-wrap:wrap}
  .his-ask-go{margin-left:0}
}

/* ===== 地理 · 山河舆图主题（文科第二科 · 独立视觉语言，不与物理/化学/生物/历史串色） ===== */
/* 仅在 body[data-subject="geography"] 作用域激活，完全隔离 */
body[data-subject="geography"]{
  --ink:#0F2A35;--ink-3:#4A6373;
  background:
    radial-gradient(620px 360px at 86% 10%, rgba(34,211,238,.12), transparent 60%),
    radial-gradient(520px 320px at 8% 94%, rgba(14,116,144,.16), transparent 62%),
    radial-gradient(420px 280px at 50% 60%, rgba(37,99,235,.07), transparent 60%),
    linear-gradient(158deg,#F4F0E4 0%, #EEE7D6 38%, #E9E2CF 70%, #E7E0D2 100%);
}
body[data-subject="geography"]::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(14,116,144,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(14,116,144,.05) 1px,transparent 1px);
  background-size:38px 38px;
  mask-image:radial-gradient(ellipse at 50% 14%,#000 0%,transparent 74%);
  -webkit-mask-image:radial-gradient(ellipse at 50% 14%,#000 0%,transparent 74%);
  opacity:.65}
body[data-subject="geography"] .app-layout{position:relative;z-index:1}
body[data-subject="geography"] .app-top-nav .top-nav{background:#1A1635;border-bottom:1px solid rgba(21,94,117,.4);box-shadow:0 6px 18px -8px rgba(14,116,144,.5)}
body[data-subject="geography"] .app-top-nav .brand .brand-txt b{color:#F0FEFF}
body[data-subject="geography"] .app-top-nav .brand .brand-txt b::after{content:" · 地理专属陪练";color:rgba(240,254,255,.78);font-weight:500}
body[data-subject="geography"] .app-top-nav .brand .brand-txt span{color:rgba(240,254,255,.78)}
body[data-subject="geography"] .app-top-nav .status-pill{color:#F0FEFF;background:rgba(240,254,255,.18);border:1px solid rgba(240,254,255,.34)}
body[data-subject="geography"] .app-top-nav .status-pill .dot{background:#F0FEFF;box-shadow:0 0 6px rgba(240,254,255,.6)}
body[data-subject="geography"] .app-top-nav .theme-btn{background:rgba(240,254,255,.18);border:1px solid rgba(240,254,255,.34);color:#F0FEFF}
body[data-subject="geography"] .app-top-nav .menu-nav > a{color:rgba(240,254,255,.86)}
body[data-subject="geography"] .app-top-nav .menu-nav > a:hover{background:rgba(240,254,255,.16);color:#fff;transform:translateY(-1px)}
body[data-subject="geography"] .app-top-nav .menu-nav .nav-toggle{color:rgba(240,254,255,.86)}
body[data-subject="geography"] .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(240,254,255,.16);color:#fff;transform:translateY(-1px)}
body[data-subject="geography"] .app-top-nav .menu-nav > a.on,
body[data-subject="geography"] .app-top-nav .menu-nav .nav-toggle.on,
body[data-subject="geography"] .app-top-nav .menu-nav .nav-toggle.open{background:#F0FEFF;color:#0E7490;font-weight:700;box-shadow:0 4px 12px -4px rgba(0,0,0,.25)}
body[data-subject="geography"] .app-top-nav .menu-nav > a.on::before{display:none}
body[data-subject="geography"] .app-top-nav .menu-nav > a.on svg{stroke:#0E7490}
body[data-subject="geography"] .local-mode-banner{color:rgba(15,42,53,.78);background:rgba(207,250,254,.72);border-color:rgba(14,116,144,.22)}
body[data-subject="geography"] .local-mode-banner b{color:#0E7490}

/* Hero */
.geo-hero{position:relative;margin:18px 0 6px;padding:30px 34px 34px;border-radius:22px 22px 60px 22px;overflow:hidden;
  background:linear-gradient(160deg, rgba(255,255,255,.94) 0%, rgba(243,233,210,.72) 100%);
  border:1px solid rgba(14,116,144,.22);box-shadow:0 18px 48px -28px rgba(14,116,144,.55)}
.geo-hero-glow{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(560px 320px at 88% 12%, rgba(34,211,238,.18), transparent 60%),radial-gradient(480px 300px at 6% 92%, rgba(14,116,144,.16), transparent 60%)}
.geo-hero-in{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:center}
.geo-copy{min-width:0}
.geo-kicker{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.12em;color:#0E7490;
  background:rgba(14,116,144,.1);border:1px solid rgba(14,116,144,.24);padding:6px 12px;border-radius:99px}
.geo-kicker .dot{width:7px;height:7px;border-radius:50%;background:#22D3EE;box-shadow:0 0 8px rgba(34,211,238,.7)}
.geo-title{font-size:38px;line-height:1.12;margin:16px 0 12px;font-weight:800;color:var(--ink);letter-spacing:-.5px}
.geo-title .g{background:linear-gradient(120deg,#22D3EE,#0E7490);-webkit-background-clip:text;background-clip:text;color:transparent}
.geo-lede{font-size:15px;line-height:1.7;color:var(--ink-3);margin:0 0 20px;max-width:520px}
.geo-lede b{color:#0E7490;font-weight:700}
.geo-acts{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.geo-acts .btn{border-radius:99px;padding:10px 18px;font-size:13.5px;font-weight:600;border:1px solid rgba(14,116,144,.25);background:#fff;color:#0E7490;cursor:pointer;transition:.18s}
.geo-acts .btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(14,116,144,.5)}
.geo-acts .btn.pri{background:linear-gradient(135deg,#22D3EE,#0E7490);color:#fff;border-color:transparent;box-shadow:0 10px 24px -10px rgba(14,116,144,.6)}
.geo-acts .btn.ghost{background:rgba(14,116,144,.06)}
.geo-stats{display:flex;align-items:center;gap:16px}
.geo-ring{flex:0 0 auto}
.geo-stat-col{display:flex;flex-direction:column;gap:6px}
.geo-stat-col .row{display:flex;gap:22px}
.geo-stat-col .row > div{display:flex;flex-direction:column}
.geo-stat-col b{font-size:22px;font-weight:800;color:#0E7490;line-height:1}
.geo-stat-col span{font-size:11.5px;color:var(--ink-3);margin-top:3px}
.geo-stat-note{font-size:11px;color:var(--ink-3);opacity:.85}
.geo-viz{position:relative;min-height:340px;border-radius:20px;overflow:hidden}
.geo-viz svg{width:100%;height:100%;display:block}
/* 2026-09-05 换：SVG 手绘地球 → Three.js 真实遥感地球（web/assets/geo_earth.html，本地 three + NASA 贴图，离线可用） */
.earth-frame{width:100%;height:100%;min-height:inherit;display:block;border:0;position:absolute;inset:0}
/* 旧 .earth-svg 样式保留给潜在历史节点，不再被新结构引用 */

/* CTA 书签绶带 */
.geo-cta{display:flex;align-items:center;gap:16px;margin:20px 0 4px;padding:18px 22px;border-radius:18px;text-decoration:none;color:inherit;position:relative;overflow:hidden;
  background:linear-gradient(135deg, rgba(14,116,144,.1), rgba(37,99,235,.05));
  border:1px solid rgba(14,116,144,.26);box-shadow:0 12px 30px -18px rgba(14,116,144,.6);transition:transform .2s ease,box-shadow .2s ease}
.geo-cta:hover{transform:translateY(-3px);box-shadow:0 18px 40px -20px rgba(14,116,144,.7);border-color:rgba(14,116,144,.5)}
.geo-cta-ribbon{position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(180deg,#22D3EE,#0E7490)}
.geo-cta-ic{width:48px;height:48px;border-radius:14px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#22D3EE,#0E7490);color:#fff;box-shadow:0 8px 18px -8px rgba(14,116,144,.7);font-size:24px}
.geo-cta-body{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.geo-cta-title{font-size:16px;font-weight:700;color:var(--ink)}
.geo-cta-sub{font-size:12.5px;color:var(--ink-3);line-height:1.55}
.geo-cta-go{margin-left:auto;flex:0 0 auto;font-size:13.5px;font-weight:700;color:#0E7490;white-space:nowrap}

/* 五域矩阵（图例瓦片） */
.geo-domains{position:relative;margin:6px 0 4px}
.geo-dom-head{display:flex;flex-direction:column;gap:4px;margin-bottom:14px}
.geo-dom-title{font-size:22px;font-weight:800;color:var(--ink);margin:0}
.geo-dom-sub{font-size:13px;color:var(--ink-3)}
.geo-grid-spine{position:absolute;left:0;right:0;top:108px;height:60px;z-index:0;pointer-events:none;opacity:.8}
.geo-dom-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:16px;padding-top:14px}
.geo-dom{position:relative;display:flex;flex-direction:column;gap:10px;padding:18px 18px 16px;border-radius:16px;text-decoration:none;color:inherit;
  background:linear-gradient(165deg,#fff 42%, rgba(14,116,144,.05) 100%);
  border:1px solid rgba(14,116,144,.2);border-top:4px solid var(--pc);
  box-shadow:0 10px 26px -18px rgba(14,116,144,.5);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.geo-dom:hover{transform:translateY(-4px);box-shadow:0 16px 38px -16px rgba(14,116,144,.55);border-color:var(--pc)}
.geo-dom-legend{position:absolute;top:-14px;right:14px;width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  background:var(--pc);color:#fff;font-size:14px;font-weight:800;font-family:"KaiTi","STKaiti","楷体",serif;box-shadow:0 6px 14px -6px var(--pc)}
.geo-dom-art{width:46px;height:46px;color:var(--pc)}
.geo-dom-art svg{width:100%;height:100%}
.geo-dom-body h3{font-size:16px;font-weight:700;color:var(--ink);margin:0 0 4px}
.geo-dom-body p{font-size:12px;line-height:1.55;color:var(--ink-3);margin:0;min-height:50px}
.geo-dom-go{font-size:12.5px;font-weight:600;color:var(--pc)}
.geo-dom-badge{align-self:flex-start;font-size:12px;color:var(--pc);background:color-mix(in srgb, var(--pc) 12%, #fff);border:1px solid color-mix(in srgb, var(--pc) 22%, #fff);padding:3px 10px;border-radius:99px}
.geo-dom-badge b{font-weight:800}

/* 研习舱能力网格 */
.geo-feat{margin:22px 0 4px}
.geo-feat-head{display:flex;flex-direction:column;gap:4px;margin-bottom:14px}
.geo-feat-title{font-size:20px;font-weight:700;color:var(--ink);margin:0}
.geo-feat-sub{font-size:13px;color:var(--ink-3)}
.geo-feat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.geo-card{display:flex;flex-direction:column;gap:10px;padding:18px 20px;background:#fff;border:1px solid rgba(14,116,144,.18);border-radius:16px;text-decoration:none;color:inherit;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;min-width:0}
.geo-card:hover{transform:translateY(-3px);box-shadow:0 14px 32px -16px rgba(14,116,144,.5);border-color:rgba(14,116,144,.45)}
.geo-card-ic{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px;flex:0 0 auto;box-shadow:0 6px 14px -6px rgba(14,116,144,.4)}
.geo-card-bd{display:flex;flex-direction:column;gap:4px;min-width:0}
.geo-card-bd b{font-size:16px;color:var(--ink);font-weight:700}
.geo-card-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.55}
.geo-card-go{font-size:13.5px;font-weight:700;color:#0E7490;white-space:nowrap;margin-top:auto;padding-top:8px;border-top:1px solid rgba(14,116,144,.1);align-self:flex-start}
.geo-ask{display:flex;align-items:center;gap:14px;margin-top:14px;padding:16px 20px;border-radius:16px;text-decoration:none;color:inherit;
  background:linear-gradient(135deg, rgba(14,116,144,.08), rgba(37,99,235,.04));border:1px solid rgba(14,116,144,.2)}
.geo-ask-ic{width:42px;height:42px;border-radius:12px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#22D3EE,#0E7490);color:#fff;font-size:20px}
.geo-ask-bd{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.geo-ask-bd b{font-size:15px;color:var(--ink);font-weight:600}
.geo-ask-bd small{font-size:12.5px;color:var(--ink-3);line-height:1.5}
.geo-ask-go{font-size:13.5px;font-weight:700;color:#0E7490;white-space:nowrap;flex:0 0 auto}

/* 章节卡左条 accent（点击筛选生效） */
body[data-subject="geography"] .gx-chapter{border-left:3px solid var(--ch-accent,#0E7490)}

@media (max-width:880px){
  .geo-hero-in{grid-template-columns:1fr}
  .geo-viz{min-height:260px;order:-1}
}
@media (max-width:780px){
  .geo-hero{padding:24px 18px 26px;border-radius:24px 24px 50px 24px}
  .geo-title{font-size:30px}
  .geo-dom-grid{grid-template-columns:1fr 1fr}
  .geo-feat-grid{grid-template-columns:1fr}
  .geo-cta{flex-wrap:wrap}
  .geo-cta-go{margin-left:0}
  .geo-ask{flex-wrap:wrap}
  .geo-ask-go{margin-left:0}
}

/* ============================================================
   道法（道德与法治）学科页 · 权衡 · 明镜 母题
   文科第三科 · 独立视觉语言：宣纸米底 + 米字格 + 青铜锈绿 +
   朱砂印红 + 铜金秤星；方印底（非圆底）、秤星刻度条（非圆点）
   不复用 .geo-* / .his-* / .chem-* 任何卡片与装饰语汇
   ============================================================ */
.pol-hero{position:relative;margin:18px 0 6px;padding:30px 34px 34px;border-radius:22px 22px 22px 60px;overflow:hidden;
  background:linear-gradient(158deg,#FDFBF4 0%,#F8F2E4 52%,#F1E7D3 100%);
  border:1px solid rgba(78,110,90,.26);
  box-shadow:0 20px 46px -28px rgba(78,110,90,.55),inset 0 1px 0 rgba(255,255,255,.75)}
.pol-hero-glow{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(40% 48% at 84% 18%,rgba(110,135,122,.18) 0,rgba(110,135,122,0) 70%),
             radial-gradient(32% 42% at 12% 82%,rgba(185,28,28,.11) 0,rgba(185,28,28,0) 70%)}
.pol-hero-in{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:center}
.pol-copy{min-width:0}
.pol-kicker{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.12em;color:#7F1D1D;
  background:rgba(185,28,28,.07);border:1px solid rgba(185,28,28,.22);padding:6px 12px;border-radius:99px}
.pol-kicker .seal{width:10px;height:10px;border-radius:2px;background:#B91C1C;box-shadow:0 0 0 2px rgba(185,28,28,.16)}
.pol-title{font-size:38px;line-height:1.12;margin:16px 0 12px;font-weight:800;color:var(--ink);letter-spacing:-.5px}
.pol-title .g{background:linear-gradient(118deg,#B91C1C 0%,#C9A227 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.pol-lede{font-size:15px;line-height:1.7;color:var(--ink-3);margin:0 0 20px;max-width:520px}
.pol-lede b{color:#B91C1C;font-weight:700}
.pol-acts{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.pol-acts .btn{border-radius:99px;padding:10px 18px;font-size:13.5px;font-weight:600;border:1px solid rgba(185,28,28,.26);background:#fff;color:#7F1D1D;cursor:pointer;transition:.18s}
.pol-acts .btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(185,28,28,.55)}
.pol-acts .btn.pri{background:linear-gradient(135deg,#DC2626,#B91C1C);color:#fff;border-color:transparent;box-shadow:0 10px 24px -10px rgba(185,28,28,.65)}
.pol-acts .btn.ghost{background:rgba(185,28,28,.06)}
.pol-stats{display:flex;align-items:center;gap:16px}
.pol-stat-col{display:flex;flex-direction:column;gap:6px}
.pol-stat-col .row{display:flex;gap:22px}
.pol-stat-col .row > div{display:flex;flex-direction:column}
.pol-stat-col b{font-size:22px;font-weight:800;color:#B91C1C;line-height:1}
.pol-stat-col span{font-size:12px;color:var(--ink-3);margin-top:3px}
.pol-stat-note{font-size:11.5px;color:var(--ink-3);opacity:.8}
.pol-viz{position:relative;min-height:392px;display:flex;align-items:center;justify-content:center}
.pol-viz svg{width:100%;height:100%;max-height:360px;display:block;filter:drop-shadow(0 14px 26px rgba(78,110,90,.16))}
.pol-viz img{width:100%;height:100%;max-height:360px;display:block;object-fit:contain;object-position:center}
/* 法治舞台：深蓝金调 + 脉冲光晕 + 城市剪影，天平悬浮其上 */
.pol-stage{position:relative;width:100%;min-height:392px;border-radius:18px;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:
    radial-gradient(circle at 20% 18%,rgba(255,215,0,.16),transparent 46%),
    radial-gradient(circle at 82% 84%,rgba(80,140,255,.22),transparent 46%),
    linear-gradient(135deg,#162b58,#203b78);
  box-shadow:0 18px 44px -18px rgba(22,43,88,.7),inset 0 0 0 1px rgba(255,215,0,.14)}
.pol-stage-halo{position:absolute;top:calc(50% - 34px);left:50%;width:min(72%,300px);aspect-ratio:1/1;
  border-radius:50%;transform:translate(-50%,-50%);z-index:0;
  background:radial-gradient(circle,rgba(255,215,0,.40),transparent 68%);
  animation:polHalo 4.6s ease-in-out infinite}
@keyframes polHalo{0%,100%{opacity:.42;transform:translate(-50%,-50%) scale(1)}
  50%{opacity:.88;transform:translate(-50%,-50%) scale(1.13)}}
/* 城市剪影：法治/国情意象，底部渐隐 */
.pol-stage-city{position:absolute;left:0;right:0;bottom:0;height:104px;z-index:1;opacity:.55;
  background-image:
    linear-gradient(32deg,#12244d 12px,transparent 13px),
    linear-gradient(58deg,#12244d 18px,transparent 19px),
    linear-gradient(21deg,#1b3470 22px,transparent 23px);
  background-size:88px 70px;background-repeat:repeat-x;background-position:bottom;
  -webkit-mask-image:linear-gradient(to top,#000 0%,transparent 92%);
  mask-image:linear-gradient(to top,#000 0%,transparent 92%)}
/* 天平称量动画：静止底座 + 摆动横梁（两层同画布叠加） */
.pol-scale{position:relative;width:min(66%,286px);aspect-ratio:1/1;z-index:2;margin-bottom:60px;
  filter:drop-shadow(0 18px 26px rgba(6,14,32,.5)) drop-shadow(0 0 28px rgba(255,215,0,.26))}
.pol-scale img{position:absolute;inset:0;width:100%;height:100%;max-height:none;
  object-fit:fill;display:block}
.pol-scale-base{z-index:1}
.pol-scale-beam{z-index:2;filter:drop-shadow(0 0 3px rgba(212,175,55,.45)) drop-shadow(0 0 1px rgba(180,140,30,.3))}
.pol-stage-tags{position:absolute;bottom:56px;z-index:3;display:flex;flex-wrap:wrap;gap:8px;
  justify-content:center;padding:0 16px}
.pol-tag{padding:5px 13px;border:1px solid rgba(255,215,0,.5);border-radius:99px;
  color:#FFE9A8;background:rgba(255,215,0,.08);font-size:12px;letter-spacing:2px;
  backdrop-filter:blur(2px)}
.pol-stage-cap{position:absolute;bottom:22px;z-index:3;font-size:12.5px;letter-spacing:3px;
  color:rgba(255,255,255,.74)}
.pol-stage-line{position:absolute;left:0;right:0;bottom:0;height:4px;z-index:3;
  background:linear-gradient(90deg,transparent,rgba(255,215,0,.85),rgba(120,170,255,.85),transparent);
  animation:polLine 5s ease-in-out infinite}
@keyframes polLine{0%,100%{opacity:.45}50%{opacity:1}}
/* 漂浮金尘 */
.pol-dust{position:absolute;width:5px;height:5px;border-radius:50%;background:#FFD700;
  opacity:0;z-index:2;box-shadow:0 0 10px rgba(255,215,0,.9);
  animation:polFloat 4s ease-in infinite}
@keyframes polFloat{0%{transform:translate(0,0);opacity:0}
  18%{opacity:.95}100%{transform:translate(24px,-72px);opacity:0}}
@media (prefers-reduced-motion:reduce){
  .pol-scale-beam,.pol-stage-halo,.pol-dust,.pol-stage-line{animation:none}}
/* 知识域 · 五大核心素养 */
.pol-domains{position:relative;margin:22px 0 6px;padding:26px 30px 30px;border-radius:20px;
  background:linear-gradient(180deg,#FFFDF7 0%,#F8F3E7 100%);border:1px solid rgba(78,110,90,.2)}
.pol-dom-head{margin-bottom:16px}
.pol-dom-title{font-size:20px;font-weight:800;color:#7F1D1D;margin:0 0 6px;letter-spacing:-.2px}
.pol-dom-sub{font-size:12.5px;color:var(--ink-3);line-height:1.6}
.pol-grid-spine{margin:0 0 16px}
.pol-grid-spine svg{width:100%;height:40px;display:block}
.pol-dom-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pol-dom{position:relative;display:block;text-decoration:none;padding:18px 18px 16px;border-radius:16px;background:#fff;
  border:1px solid rgba(78,110,90,.18);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;overflow:hidden}
.pol-dom::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:repeating-linear-gradient(180deg,var(--pc) 0 7px,transparent 7px 14px);opacity:.75}
.pol-dom:hover{transform:translateY(-3px);border-color:var(--pc);box-shadow:0 16px 30px -18px var(--pc)}
.pol-dom.on{border-color:var(--pc);box-shadow:inset 0 0 0 1px var(--pc),0 12px 26px -18px var(--pc)}
.pol-dom-seal{position:absolute;top:14px;right:14px;width:26px;height:26px;border-radius:6px;display:grid;place-items:center;
  font-size:13px;font-weight:800;color:#fff;background:var(--pc);opacity:.92;letter-spacing:0}
.pol-dom-art{width:52px;height:52px;color:var(--pc);margin-bottom:10px}
.pol-dom-art svg{width:100%;height:100%;display:block}
.pol-dom-body h3{font-size:16px;font-weight:800;color:var(--ink);margin:0 0 6px}
.pol-dom-body p{font-size:12.5px;line-height:1.65;color:var(--ink-3);margin:0 0 10px}
.pol-dom-go{font-size:12px;font-weight:700;color:var(--pc)}
.pol-dom-badge{position:absolute;bottom:14px;right:16px;font-size:11.5px;color:var(--ink-3);opacity:.85}
.pol-dom-badge b{color:var(--pc);font-size:13px}
.pol-dom.is-empty{opacity:.5}
/* 行动条 */
.pol-cta{position:relative;display:flex;align-items:center;gap:14px;margin:16px 0 4px;padding:18px 22px;border-radius:16px;
  text-decoration:none;overflow:hidden;
  background:linear-gradient(120deg,#FFF6F6 0%,#FDF8EC 100%);border:1px solid rgba(185,28,28,.24);transition:.18s}
.pol-cta:hover{transform:translateY(-2px);box-shadow:0 16px 32px -20px rgba(185,28,28,.7)}
.pol-cta-ribbon{position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#B91C1C,#C9A227)}
.pol-cta-ic{width:44px;height:44px;border-radius:8px;display:grid;place-items:center;font-size:22px;background:rgba(185,28,28,.09);flex:0 0 auto}
.pol-cta-body{flex:1;min-width:0}
.pol-cta-title{display:block;font-size:15.5px;font-weight:800;color:#7F1D1D}
.pol-cta-sub{display:block;font-size:12.5px;color:var(--ink-3);margin-top:3px;line-height:1.6}
.pol-cta-go{font-size:13px;font-weight:700;color:#B91C1C;flex:0 0 auto}
/* 研习舱卡片（道法权衡台）— 方印底 + 秤星刻度条 */
.pol-feat{margin:22px 0 6px;padding:24px 26px 26px;border-radius:20px;background:linear-gradient(180deg,#FFFDF7,#F8F3E7);border:1px solid rgba(78,110,90,.2)}
.pol-feat-head{margin-bottom:18px}
.pol-feat-title{font-size:19px;font-weight:800;color:#7F1D1D;margin:0 0 5px}
.pol-feat-sub{font-size:12.5px;color:var(--ink-3)}
.pol-feat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.pol-card{position:relative;display:flex;align-items:flex-start;gap:12px;padding:16px 18px;border-radius:14px;background:#fff;
  border:1px solid rgba(78,110,90,.16);text-decoration:none;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease}
.pol-card-tick{position:absolute;left:0;top:0;bottom:0;width:3px;
  background:repeating-linear-gradient(180deg,#C9A227 0 6px,transparent 6px 12px);opacity:.8}
.pol-card:hover{transform:translateY(-3px);box-shadow:0 16px 30px -18px rgba(78,110,90,.6)}
.pol-card-ic{width:44px;height:44px;border-radius:8px;display:grid;place-items:center;font-size:22px;flex:0 0 auto}
.pol-card-bd{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.pol-card-bd b{font-size:14.5px;font-weight:800;color:var(--ink)}
.pol-card-bd small{font-size:12px;line-height:1.6;color:var(--ink-3)}
.pol-card-go{font-size:12px;font-weight:700;color:#B91C1C;flex:0 0 auto;align-self:center}
.pol-ask{display:flex;align-items:center;gap:14px;margin-top:16px;padding:16px 20px;border-radius:14px;text-decoration:none;
  background:linear-gradient(120deg,#FFF6F6,#FDF8EC);border:1px solid rgba(185,28,28,.2);transition:.18s}
.pol-ask:hover{transform:translateY(-2px);box-shadow:0 14px 28px -18px rgba(185,28,28,.6)}
.pol-ask-ic{width:42px;height:42px;border-radius:8px;display:grid;place-items:center;font-size:21px;background:rgba(185,28,28,.09);flex:0 0 auto}
.pol-ask-bd{flex:1;min-width:0}
.pol-ask-bd b{display:block;font-size:14.5px;font-weight:800;color:#7F1D1D}
.pol-ask-bd small{display:block;font-size:12px;line-height:1.6;color:var(--ink-3);margin-top:3px}
.pol-ask-go{font-size:12.5px;font-weight:700;color:#B91C1C;flex:0 0 auto}
@media (max-width:1180px){
  .pol-hero-in{grid-template-columns:1fr;gap:18px}
  .pol-viz{min-height:280px}
  .pol-dom-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  .pol-dom-grid{grid-template-columns:1fr}
  .pol-feat-grid{grid-template-columns:1fr}
  .pol-title{font-size:28px}
}

/* ==========================================================================
   [2026-09-14] 学情测评专属母题 tone-joy ——「轻松起点」
   动机：原版沿用 tone-study 的深紫底 + 灰白线条柱状图徽章 —— 观感沉重、单薄，
         像企业后台的报表头。而这一页是孩子第一次见到产品的入口，
         视觉该传达的是"轻松、被欢迎、没有压力"，而不是"来接受考核"。
   做法：同族品牌紫但整体提亮，引入暖色（阳光黄 / 樱花粉）光斑 + 细网点手感；
         hero 换成小伴本人（真 v5 公仔 PNG）坐在明亮白盘里，缓慢浮动。
   边界：tone-study 被题单/报告/核准等多页复用，**禁止改动它**；本版式独立成类。
   ========================================================================== */
.page-head.tone-joy{
  background:
    radial-gradient(circle at 88% 12%,rgba(255,209,102,.38),transparent 46%),
    radial-gradient(circle at 8% 96%,rgba(40,194,200,.34),transparent 44%),
    radial-gradient(circle at 58% -14%,rgba(255,111,167,.30),transparent 50%),
    linear-gradient(118deg,#7C5CF5 0%,#8E63F0 44%,#3FC5D6 100%);
  border:none;box-shadow:0 16px 38px rgba(88,58,190,.28)}
/* 细网点底纹：给大块渐变一点手感，避免死平 */
.page-head.tone-joy::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:radial-gradient(rgba(255,255,255,.26) 1px,transparent 1px);
  background-size:17px 17px;opacity:.55;
  -webkit-mask-image:linear-gradient(112deg,rgba(0,0,0,.95),transparent 58%);
  mask-image:linear-gradient(112deg,rgba(0,0,0,.95),transparent 58%)}
/* 右上暖光斑：把视线引向小伴徽章 */
.page-head.tone-joy::after{content:"";position:absolute;right:-56px;top:-76px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.34),transparent 66%);filter:blur(16px);pointer-events:none;z-index:0}
.page-head.tone-joy .page-h1{color:#fff;font-size:28px;text-shadow:0 2px 16px rgba(28,10,70,.26)}
.page-head.tone-joy .page-h1::after{content:"";display:block;width:58px;height:4px;border-radius:99px;
  background:linear-gradient(90deg,#FFD166,#FF8FA3);margin-top:12px;box-shadow:0 0 12px rgba(255,209,102,.6)}
.page-head.tone-joy .page-sub{color:rgba(255,255,255,.94);font-weight:500}
.page-head.tone-joy .redtag{background:rgba(255,255,255,.20);color:#fff;border-color:rgba(255,255,255,.32)}
/* 小伴徽章：明亮白盘 + 柔光环 + 缓慢浮动（prefers-reduced-motion 下静止） */
.page-head.tone-joy .ph-hero{right:30px;width:98px;height:98px;z-index:3;
  background:radial-gradient(circle at 34% 24%,#FFFFFF,#F3EEFF 58%,#E3D9FF);
  border:2px solid rgba(255,255,255,.9);
  box-shadow:0 10px 26px rgba(56,28,128,.30),0 0 0 9px rgba(255,255,255,.15);
  animation:joy-bob 3.8s ease-in-out infinite}
/* hero = 真 v5 小伴（紫毛公仔 PNG，与全站 talking 公仔同一张图，浏览器已缓存不额外开销）。
   注意不要用 sprite #xiaoban —— app.html 里那个 symbol 是 v4 遗留（已被 v5 取代），
   且原 viewBox 260×330 在正方形盘里会被压扁。object-fit:contain 保住原始 790×734 比例。 */
.page-head.tone-joy .ph-hero img{width:76px;height:76px;object-fit:contain;display:block;
  filter:drop-shadow(0 4px 7px rgba(56,28,128,.26))}
.page-head.tone-joy .ph-wm{display:none}
@keyframes joy-bob{
  0%,100%{transform:translateY(-50%) rotate(-1.5deg)}
  50%{transform:translateY(calc(-50% - 7px)) rotate(1.5deg)}}
@media (prefers-reduced-motion:reduce){
  .page-head.tone-joy .ph-hero{animation:none;transform:translateY(-50%)}}
.page-head.tone-joy:has(.ph-hero) .page-h1,
.page-head.tone-joy:has(.ph-hero) .page-sub{padding-right:122px}
@media (max-width:820px){
  .page-head.tone-joy{padding:22px 20px 24px}
  .page-head.tone-joy .page-h1{font-size:27px}
  .page-head.tone-joy .page-sub{font-size:14px}
  .page-head.tone-joy .ph-hero{width:64px;height:64px;right:16px;
    box-shadow:0 6px 16px rgba(56,28,128,.26),0 0 0 6px rgba(255,255,255,.14)}
  .page-head.tone-joy .ph-hero img{width:52px;height:52px}
  .page-head.tone-joy:has(.ph-hero) .page-h1,
  .page-head.tone-joy:has(.ph-hero) .page-sub{padding-right:80px}}

/* --- 学情测评选择题选项行（含旧 SPA 路由；独立页 web/assessment/ 复用本类）---
   选中态用 :has(input:checked) 而非内联样式：测评页的 input 事件刻意不重渲染
   （避免填空作答被抹掉），内联 checked 分支只在"翻页回来"时回填；
   点击当次必须有即时反馈，否则孩子点了没反应，只能靠原生 radio 圆点。 */
.as-opt{display:flex;align-items:flex-start;gap:11px;padding:13px 15px;border-radius:12px;cursor:pointer;
  margin-bottom:8px;background:#fff;border:1.5px solid #e7eaf2;
  transition:border-color .15s,background .15s,box-shadow .15s}
.as-opt:hover{border-color:#c9c3ee;background:#fbfaff}
.as-opt:has(input:checked){background:linear-gradient(135deg,rgba(109,94,252,.10),rgba(40,194,200,.08));
  border-color:#6D5EFC;box-shadow:0 2px 10px rgba(109,94,252,.16)}
.as-opt input{flex:0 0 auto;width:17px;height:17px;margin-top:3px;accent-color:#6D5EFC;cursor:pointer}
.as-opt span{flex:1;min-width:0;font-size:14.5px;line-height:1.65;color:#1f2430}
.as-opt b{color:#6D5EFC;font-weight:700}

/* [2026-09-16] 学习计划专属顶栏：品牌 + 视图菜单 + 深浅色 / 刷新 / 回主页 */
/* [2026-09-26 P0-1] 顶栏改浅：深蓝彩底 → 学习地图 v30 浅顶栏（160° 三停点淡紫→近白→青白
   + backdrop 毛玻璃 + 一道几乎看不见的下缘阴影），与 #/stuck 学习地图、#/assessment 同口径。
   ⚠ 底一浅，下面所有「按彩底白字写死」的子件（.pb-t / .pb-nav / .pb-btn / .pb-home /
   .pb-theme / .planbar::after）必须整组反相成深字 + 半透明紫底，否则白字糊在浅底上全部失效；
   暗色分支见下方「[2026-09-26] 暗色：planbar 整组还原」。 */
.planbar{box-sizing:border-box;border-radius:18px;overflow:hidden;
  /* [2026-09-26 P0-1] 浅顶栏配方（照抄 desktop.css 数学页 #/stuck 的 .top-nav v30）：
     160° 三停点（淡紫 → 近白 → 青白）+ backdrop 毛玻璃 + 一道几乎看不见的下缘阴影。
     ⚠ 必须带 rgba 的 .80~.88 与 backdrop：纯不透明浅底在浅色页面上会像一块死白板。 */
  background:linear-gradient(160deg,rgba(231,224,251,.88) 0%,rgba(246,244,252,.80) 45%,rgba(215,242,240,.80) 100%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 6px 24px -18px rgba(60,52,140,.50);margin:0 0 20px}
.planbar::after{content:"";display:block;height:1px;background:linear-gradient(90deg,transparent,rgba(109,94,252,.28),transparent)}
.pb-in{max-width:1180px;margin:0 auto;box-sizing:border-box;padding:12px 18px;
  display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.pb-brand{display:flex;align-items:center;gap:10px;flex:none;min-width:0}
.pb-mascot{width:38px;height:38px;object-fit:contain;flex:none;filter:drop-shadow(0 5px 10px rgba(20,10,60,.35))}
.pb-t{min-width:0}
.pb-t b{display:block;font-size:16.5px;font-weight:800;line-height:1.25;color:#1A1B2E;
  font-family:var(--font-display);letter-spacing:var(--tr-tight,-.01em);
  text-shadow:none}
.pb-t small{display:block;font-size:10.5px;color:rgba(26,27,46,.62);letter-spacing:.3px;line-height:1.3}
.pb-nav{display:flex;align-items:center;gap:3px;flex:1;justify-content:center;min-width:0}
.pb-nav button{background:transparent;color:rgba(26,27,46,.62);border:0;box-shadow:none;
  font-family:inherit;font-size:13px;font-weight:600;padding:8px 16px;border-radius:999px;
  cursor:pointer;white-space:nowrap;transition:background .18s,color .18s,transform .18s}
.pb-nav button:hover{background:rgba(109,94,252,.10);color:#1A1B2E;transform:translateY(-1px)}
/* 浅底上「白胶囊 + 蓝字」会糊成一片 ⇒ 换成与学习地图同一支品牌渐变实底 + 白字 */
.pb-nav button.on,.pb-nav button.on:hover{color:#ffffff;
  background:linear-gradient(120deg,#6D5EFC 0%,#28C2C8 100%);
  box-shadow:0 8px 18px -10px rgba(60,52,140,.55)}
.pb-right{display:flex;align-items:center;gap:8px;flex:none}
/* [2026-09-26 P0-1] 次操作在浅底上改「淡紫胶囊 + 深墨字 + 紫描边」；
   整条顶栏唯一的**实心白块**留给 .pb-home（主页 ↗），靠它把视线从浅底里拎出来 */
.pb-btn{display:inline-flex;align-items:center;gap:5px;cursor:pointer;font-family:inherit;
  font-size:12.5px;font-weight:800;color:#1A1B2E;padding:7px 14px;border-radius:999px;white-space:nowrap;
  background:rgba(109,94,252,.10);border:1px solid rgba(109,94,252,.22);
  transition:background .18s,color .18s,transform .18s}
.pb-btn:hover{background:rgba(109,94,252,.18);color:#5B3BDB;transform:translateY(-1px)}
.pb-home{display:inline-flex;align-items:center;gap:5px;text-decoration:none;font-size:12.5px;font-weight:800;
  color:#1A1B2E;padding:8px 16px;border-radius:999px;
  background:rgba(255,255,255,.86);border:1px solid rgba(109,94,252,.22);white-space:nowrap;
  box-shadow:0 8px 18px -12px rgba(60,52,140,.45);transition:transform .18s,background .18s,color .18s}
.pb-home:hover{color:#5B3BDB;background:#fff;text-decoration:none;transform:translateY(-1px)}
/* [2026-09-26 P0-1] 深浅色切换钮：**图标不用文字**（低龄用户不读字），
   与学情测评 .jb-theme 同口径，仅换成 pb- 前缀。尺寸 38×32 / 图标 18×18。 */
.pb-theme{display:inline-flex;align-items:center;justify-content:center;height:32px;width:38px;padding:0;
  border-radius:99px;border:1px solid rgba(109,94,252,.22);background:rgba(109,94,252,.10);
  color:#1A1B2E;cursor:pointer;font-family:inherit;transition:background .15s}
.pb-theme:hover{background:rgba(109,94,252,.18)}
.pb-theme-ico{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px}
.pb-theme-ico svg{display:block;width:18px;height:18px}
@media(max-width:760px){
  .pb-in{padding:10px 14px;gap:10px}
  .pb-t small{display:none}
  .pb-nav{order:3;flex:1 0 100%;justify-content:space-between;gap:0}
  .pb-nav button{padding:7px 10px;font-size:12.5px}
  .pb-right{margin-left:auto}
}


/* [2026-09-16] #/plan：学习计划栏升为本页唯一顶栏 —— 全宽 / 高 75 / 吸顶；SPA 全局 .top-nav 让位。
   ⚠ 吸顶一律 position:fixed 不用 sticky：≤780px 时 html,body 有 overflow-x:hidden
   → html 变成滚动容器、sticky 直接失效；fixed + 等高等占位 .pb-pad 才是稳的。
   占位高度由 app.js syncPlanBarPad() 实测同步（窄屏菜单换第二行时栏高不是固定值）。 */
body[data-plan] .app-top-nav .top-nav{display:none}
/* ⚠ 必须用 #main 提权，不能用 !important：.main > :not(..):not(..):not(..) 的
   特异度是 (0,4,0)（三个 :not() 各算一个类），body[data-plan] .planbar 只有 (0,2,1)，
   会被它的 max-width:1180px 压住 → 栏宽被夹成 1180 居中，看着仍像卡片而非通栏。 */
/* ⚠ 这条的 box-shadow 特异度是 (1,2,1)（带 #main），会压过 .planbar 的浅色阴影 ⇒
   浅底顶栏必须在这里也跟着改紫调，否则浅底上顶着一道蓝影，与学习地图不同口径。
   ⚠ 暗色分支要覆盖它，也必须挂在**同一串选择器**上（见下方暗色块）。 */
body[data-plan] #main > .planbar{position:fixed;top:0;left:0;right:0;z-index:70;
  width:100%;max-width:none;height:64px;margin:0;border-radius:0;
  box-shadow:0 6px 24px -18px rgba(60,52,140,.50)}
body[data-plan] .planbar::after{display:none}
body[data-plan] .planbar .pb-in{max-width:1180px;height:64px;padding:0 24px;flex-wrap:nowrap}
body[data-plan] #main > .pb-pad{display:block;width:100%;max-width:none;height:64px;margin:0}
/* [2026-09-17 PM 反馈] 顶栏是 fixed，占位块刚好让出 75px → 内容首块紧贴栏底「挨在一起」。
   这里补 20px 呼吸位（不改占位块高度，避免 syncPlanBarPad() 的实测口径失真）。 */
body[data-plan] .main{padding-top:20px}
@media(max-width:780px){
  /* 窄屏菜单换第二行 → 栏高交给内容，下限仍是 75，占位高度由 JS 实测同步 */
  body[data-plan] #main > .planbar{height:auto;min-height:64px}
  /* ⚠ 必须显式写回 flex-wrap:wrap：上面桌面规则给了 nowrap（同特异度、只看先后），
     不覆盖的话窄屏三块内容全挤一行 → .planbar 的 overflow:hidden 会把「工作台」裁掉。 */
  body[data-plan] .planbar .pb-in{height:auto;min-height:64px;padding:10px 14px;flex-wrap:wrap}
}
/* ==========================================================================
   [2026-09-26 P0-1] 暗色：planbar 整组还原回「彩底 + 白字」。
   上面 .pb-* 的浅色口径全按深墨字写，压在暗色底上会看不见 ⇒ 逐条还原。
   ⚠ 两条特异度必须顶住旧规则：
      ① html[data-theme=dark] .planbar (0,2,2) 压 .planbar (0,1,0)；
      ② 吸顶态的 box-shadow 由 body[data-plan] #main > .planbar 给（带 #main ⇒ 1,2,1）。
   ⚠⚠ 那条「压缩到同一串选择器」的写法**必须同时带 html[data-theme=dark] 前缀**：
      只写 body[data-plan] #main > .planbar 的话，它会变成**通吃规则** —— 浅色态也命中，
      且因为写在浅色吸顶规则之后（同特异度、后写者赢），浅色顶栏会永远顶着一道黑影。
   ========================================================================== */
html[data-theme="dark"] .planbar{
  background:
    radial-gradient(120% 200% at 10% -60%, rgba(255,255,255,.12), transparent 58%),
    linear-gradient(100deg,#3A2A7A 0%,#5B3BDB 48%,#1B5E75 100%);
  box-shadow:0 12px 30px -16px rgba(0,0,0,.70);
}
html[data-theme="dark"] .planbar::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent)}
html[data-theme="dark"] .pb-t b{color:#fff;text-shadow:0 1px 2px rgba(30,15,80,.30)}
html[data-theme="dark"] .pb-t small{color:rgba(255,255,255,.80)}
html[data-theme="dark"] .pb-nav button{color:rgba(255,255,255,.88)}
html[data-theme="dark"] .pb-nav button:hover{background:rgba(255,255,255,.18);color:#fff}
html[data-theme="dark"] .pb-nav button.on,
html[data-theme="dark"] .pb-nav button.on:hover{color:#9B7BFF;background:#fff;
  box-shadow:0 10px 20px -12px rgba(20,10,60,.70)}
html[data-theme="dark"] .pb-btn{color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.24)}
html[data-theme="dark"] .pb-btn:hover{color:#fff;background:rgba(255,255,255,.22)}
html[data-theme="dark"] .pb-theme{color:#fff;background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.24)}
html[data-theme="dark"] .pb-theme:hover{color:#fff;background:rgba(255,255,255,.20)}
html[data-theme="dark"] .pb-home,
html[data-theme="dark"] .pb-home:hover{color:#9B7BFF;background:#fff;border-color:transparent}
html[data-theme="dark"] body[data-plan] #main > .planbar{box-shadow:0 12px 30px -16px rgba(0,0,0,.70)}
/* ⚠ 上面这条**必须带 html[data-theme=dark] 前缀**：#main 带来的 id 特异度让它
   能压住浅色吸顶规则，但一旦漏了主题前缀，它就会在浅色态下也命中（后写者赢）。 */


/* ==========================================================================
   [2026-09-17] #/plan 概览「学情测评诊断（分科）」表 —— 分科诊断的唯一呈现面。
   形态：桌面 = 4 列表格；≤780px = 「一科一卡」纵向堆叠。
   为什么不能只做表格：4 列在 375px 上必然被裁（实测最后一列"薄弱点"整列看不见），
   而窄屏横向滚动对低龄用户不可发现 —— 改成堆叠卡，信息一条不丢。
   ⚠ 本表所有样式必须写在这里：JS 侧若输出内联 style，会压过下面的窄屏 media query
     （内联优先级高于任何选择器），窄屏布局就会静默失效。
   ========================================================================== */
.astab-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.astab{border-collapse:collapse;width:100%;min-width:560px;background:#fff}
.astab th{text-align:left;font-weight:700;font-size:12px;color:#4B4F63;background:#F4F5FB;
  border:1px solid #E4E6F2;padding:8px 11px;white-space:nowrap}
.astab td{border:1px solid #E4E6F2;padding:9px 11px;vertical-align:top;
  font-size:12.5px;line-height:1.55;color:#3A3F52}
.astab .as-v{display:block}
.astab .as-subj{display:block;font-size:13px;font-weight:800;color:#1F2430}
.astab .as-score{display:block;font-size:14.5px;font-weight:800;color:#2A5FBE;line-height:1.3}
.astab .as-sub{display:block;font-size:11.5px;color:#8A8FA3;margin-top:2px}
.astab .as-lv{color:#5B6070}
.astab .as-none{color:#8A8FA3}
.astab .as-good{color:#0F6E56}
.astab .as-kp{display:inline-block;background:#FBEEF4;color:#C93F77;margin:0 4px 3px 0;
  padding:3px 9px;border-radius:12px;font-size:11.5px;line-height:1.5}
.astab .as-more{color:#8A8FA3;font-size:11.5px}
.as-empty{padding:14px 16px;border-radius:12px;background:rgba(109,94,252,.06);
  border:1px dashed rgba(109,94,252,.30);font-size:13px;color:#5B6070;line-height:1.9}
@media(max-width:780px){
  .astab-wrap{overflow-x:visible}
  .astab{min-width:0;background:transparent}
  .astab thead{display:none}
  .astab tbody,.astab tr,.astab td{display:block;width:auto}
  .astab tr{border:1px solid #E4E6F2;border-radius:12px;margin:0 0 10px;
    background:#fff;padding:7px 0;overflow:hidden}
  .astab td{border:0;padding:6px 13px;display:flex;gap:10px;align-items:flex-start}
  .astab td::before{content:attr(data-l);flex:none;width:60px;color:#8A8FA3;font-size:11.5px;line-height:1.6}
  .astab .as-v{flex:1;min-width:0}
  /* 首格（学科）当小标题用：不显示字段名，加一条虚线分隔 */
  .astab td:first-child{padding:2px 13px 7px;border-bottom:1px dashed #EDEFF7;margin-bottom:5px}
  .astab td:first-child::before{display:none}
  .astab td:first-child .as-subj{display:inline}
  .astab td:first-child .as-sub{display:inline;margin:0 0 0 7px}
}

/* =========================================================================
 * 2026-09-17 · 首页一屏仪表盘（hm-dash）+ 顶栏第 4 套深紫皮肤
 *   · 触发：body[data-tone="mirror"]（ROUTE_TONE.home = 'mirror'）
 *   · 全部以 body[data-tone="mirror"] 限定作用域，不污染其它页
 *   · 不覆盖 --bg/--surface/--ink 全站 token；首页色板自成 --hm-* 命名空间
 * =======================================================================*/

/* ---- 0. 令牌（首页专属，跟随 B 案「首页强制深紫」）---- */
body[data-tone="mirror"]{
  --tb-h:64px;
  --hm-bg:#0E0A1D;
  --hm-card:rgba(255,255,255,.045);
  --hm-card-hi:rgba(255,255,255,.075);
  --hm-brd:rgba(255,255,255,.09);
  --hm-ink:#F5F2FF;
  --hm-sub:#B6ABDC;
  --hm-dim:#8A80B4;
  --hm-brand:#6D5EFC;
  --hm-brand2:#A78BFA;
  --hm-teal:#28C2C8;
  --hm-r-l:20px;
  --hm-r-m:15px;
  --hm-r-s:11px;
}

/* ---- 1. 顶栏第 4 套皮肤（深紫玻璃 + 母题发光底边）---- */
/* 注意：原第 1 套 body:not([data-subject]) .app-top-nav .top-nav-row 特异度同为 (0,3,1)，
   本区块写在文件末尾，靠后者胜出 —— 但只限 data-tone="mirror" 的首页，不影响其它页。 */
body[data-tone="mirror"] .app-top-nav .top-nav{
  position:sticky;top:0;z-index:60;color:#F5F2FF;
  background:#1A1635;   /* [2026-10-15 PM 拍板] 底色统一为标准深色 #1A1635（原为 #0E0A1D 玻璃渐变）。
     该皮肤曾被文件末尾「全站浅色白」块盖成白底 ⇒ 见下方 #topbar-unify 的首页排除守卫。 */
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  box-shadow:none;border-radius:0;border-bottom:0}
body[data-tone="mirror"] .app-top-nav .top-nav::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,#6D5EFC 0%,#A78BFA 48%,#28C2C8 100%);
  box-shadow:0 0 14px rgba(139,124,255,.55)}
/* 单行 64px · 通栏（不用 !important，靠 body[data-tone] 提权） */
body[data-tone="mirror"] .app-top-nav .top-nav-row{
  max-width:none;width:100%;padding:0 24px;
  min-height:var(--tb-h);height:var(--tb-h);
  display:flex;align-items:center;gap:14px;flex-wrap:nowrap}
body[data-tone="mirror"] .app-top-nav .brand{padding:0;margin:0;gap:10px;flex:none}
body[data-tone="mirror"] .app-top-nav .brand .brand-txt b{color:#F5F2FF;font-size:17px}
body[data-tone="mirror"] .app-top-nav .brand .brand-txt span{color:#B6ABDC;font-size:11px;margin-top:2px}
body[data-tone="mirror"] .tb-mascot{width:34px;height:34px;object-fit:contain}
/* 导航 pill（暗底上下划线看不清 → 改渐变填充 + 内描边） */
body[data-tone="mirror"] .app-top-nav .menu-nav{gap:4px;overflow-x:auto}
body[data-tone="mirror"] .app-top-nav .menu-nav > a,
body[data-tone="mirror"] .app-top-nav .menu-nav .nav-toggle{color:#B6ABDC}
body[data-tone="mirror"] .app-top-nav .menu-nav > a:hover,
body[data-tone="mirror"] .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(255,255,255,.07);color:#fff;transform:none}
body[data-tone="mirror"] .app-top-nav .menu-nav > a.on,
body[data-tone="mirror"] .app-top-nav .menu-nav .nav-toggle.on,
body[data-tone="mirror"] .app-top-nav .menu-nav .nav-toggle.open{
  background:linear-gradient(120deg,rgba(109,94,252,.34) 0%,rgba(40,194,200,.24) 100%);
  color:#fff;font-weight:700;
  box-shadow:inset 0 0 0 1px rgba(167,139,250,.48),0 6px 18px -10px rgba(109,94,252,.75)}
body[data-tone="mirror"] .app-top-nav .menu-nav > a.on svg{stroke:#fff}
/* 折叠面板跟着变深（原来是浅紫卡片，在深紫顶栏下会像一块白斑） */
body[data-tone="mirror"] .app-top-nav .nav-group-body{
  background:linear-gradient(180deg,rgba(20,13,44,.99),rgba(14,10,29,.99));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 18px 44px -14px rgba(0,0,0,.66)}
body[data-tone="mirror"] .app-top-nav .nav-group-body a{color:#B6ABDC}
body[data-tone="mirror"] .app-top-nav .nav-group-body a:hover{background:rgba(255,255,255,.07);color:#fff}
/* 状态区：小伴胶囊 + 隐藏主题按钮（不是"点了没反应"，是压根不给入口） */
body[data-tone="mirror"] .app-top-nav .status-row{margin:0 0 0 auto;gap:9px;flex:none}
body[data-tone="mirror"] .app-top-nav .status-pill{
  display:inline-flex;align-items:center;gap:6px;
  color:#CDBBF5;background:rgba(109,94,252,.16);
  border:1px solid rgba(167,139,250,.30);font-size:11.5px;padding:5px 12px;border-radius:99px;font-weight:600}
body[data-tone="mirror"] .app-top-nav .status-pill .dot{background:#28C2C8;box-shadow:0 0 7px rgba(40,194,200,.85)}
body[data-tone="mirror"] .app-top-nav .coach-toggle{
  color:#CDBBF5;background:rgba(109,94,252,.16);border:1px solid rgba(167,139,250,.30)}
body[data-tone="mirror"] .app-top-nav .coach-toggle svg{stroke:currentColor}
body[data-tone="mirror"] .app-top-nav .theme-btn{display:none}


/* ---- 2. 主内容区：深底「通栏」（消除左右白边）+ 一屏铺满 ---- */
/* ⚠ 通栏这一步必须带 !important，原因（实测）：
   desktop.css:218 的
     .app-layout > .main{margin-left:auto !important;margin-right:auto !important;
                         max-width:1180px !important;width:100% !important}
   把内容区钉死在 1180px 居中。旧版只写 `body[data-tone="mirror"] .main{max-width:none}`
   （无 !important）→ 永远赢不了 —— 深紫底只铺中间 1180px，两侧露出 body 默认暖米白 #FFF6F0，
   就是用户看到的「左右一片白色空白」。带 !important 的声明只能靠 !important 才压得住。 */
body[data-tone="mirror"] .app-layout > .main{
  max-width:none !important;margin-left:0 !important;margin-right:0 !important;width:100% !important;
  padding:18px 26px 20px;
  background:transparent;            /* 底色交给 html/body 铺满，避免两层渐变叠出接缝 */
  min-height:calc(100vh - var(--tb-h));
  display:flex;flex-direction:column}
/* 深紫底铺到「根」上＝全宽；fixed 避免长页滚动时渐变断层 */
html:has(body[data-tone="mirror"]),
html[data-boot="mirror"],
body[data-tone="mirror"]{
  background-color:#0B0817;
  background-image:
    radial-gradient(1200px 700px at 76% -120px,rgba(124,92,245,.34),transparent 62%),
    radial-gradient(980px 560px at 4% 120px,rgba(40,194,200,.13),transparent 60%),
    linear-gradient(180deg,#181036 0%,#0E0A1D 46%,#0B0817 100%);
  background-repeat:no-repeat;
  background-attachment:fixed}
body[data-tone="mirror"] #main > .hm-dash{max-width:1400px;margin:0 auto;width:100%;flex:1 1 auto}

/* ---- 3. 栅格（一屏铺满：hero 行与学习行 flex 分摊余量）---- */
.hm-dash{display:flex;flex-direction:column;gap:16px}
.hm-dash .hm-row1{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px;flex:1 1 auto;min-height:214px}
.hm-dash .hm-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;flex:none}
/* [2026-09-20] 原为「左三站卡 + 右 268px CTA 卡」两列；CTA 卡改造为 today-list 第 1 张后，
   本区只剩 learn-box 一个子元素 → 改单列，把 268px 的横向空间还给四张并排卡。 */
.hm-dash .hm-learn{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;flex:1 1 auto;min-height:168px}
.hm-dash .hm-foot-row{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px;flex:none}

/* 通用面板：半透 + 1px 边 + 顶部高光 */
.hm-dash .hm-today,.hm-dash .hm-mc,.hm-dash .learn-box,.hm-dash .hm-cta,.hm-dash .foot-box{
  background:var(--hm-card);
  border:1px solid var(--hm-brd);
  border-radius:var(--hm-r-l);
  box-shadow:0 16px 40px -26px rgba(0,0,0,.85);
  position:relative;overflow:hidden}
.hm-dash .hm-today::before,.hm-dash .hm-mc::before,.hm-dash .learn-box::before,
.hm-dash .hm-cta::before,.hm-dash .foot-box::before{
  content:"";position:absolute;left:14px;right:14px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);pointer-events:none}
.hm-dash .card-title{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:800;color:#fff;letter-spacing:.2px}
.hm-dash .card-title .ico{
  width:18px;height:18px;border-radius:6px;display:grid;place-items:center;flex:none;
  font-size:11px;background:rgba(255,255,255,.10);color:var(--hm-brand2)}

/* ============ ROW1 左 · 学习镜像（紫渐变满铺，对齐 demo）============ */
.hm-hero{
  display:grid;grid-template-columns:250px minmax(0,1fr);align-items:center;gap:8px;
  padding:22px 26px;min-height:214px;position:relative;overflow:hidden;
  border-radius:var(--hm-r-l);border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(120% 160% at 88% 120%,rgba(255,255,255,.20),transparent 55%),
    radial-gradient(90% 130% at 4% -30%,rgba(255,255,255,.16),transparent 60%),
    linear-gradient(112deg,#4B39CF 0%,#7C5CF5 46%,#A56BE8 100%);
  box-shadow:0 0 0 1px rgba(167,139,250,.18),0 24px 60px -28px rgba(109,94,252,.85)}
.hm-hero .rings{display:flex;gap:14px}
.hm-hero .ring{width:104px;text-align:center;position:relative;flex:none}
.hm-hero .ring svg{display:block;width:104px;height:104px;filter:drop-shadow(0 4px 14px rgba(0,0,0,.35))}
.hm-hero .ring .val{position:absolute;top:30px;left:0;right:0;font-size:26px;font-weight:900;color:#fff;letter-spacing:-.5px;line-height:1}
.hm-hero .ring .cap{position:absolute;top:61px;left:0;right:0;font-size:10.5px;color:rgba(255,255,255,.88);letter-spacing:.2px}
.hm-hero .hero-copy{position:relative;padding-left:150px;min-width:0;
  display:flex;flex-direction:column;align-items:flex-start}
.hm-hero .hero-glow{
  position:absolute;left:-8px;top:50%;transform:translateY(-50%);
  width:150px;height:150px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.42),rgba(196,181,253,.20) 42%,transparent 70%)}
.hm-hero .hero-mascot{
  position:absolute;left:2px;top:50%;transform:translateY(-50%);
  width:132px;height:132px;object-fit:contain;
  filter:drop-shadow(0 10px 26px rgba(10,4,40,.6));
  animation:hmBreathe 3.4s ease-in-out infinite;will-change:translate,scale}
@keyframes hmBreathe{
  0%,100%{translate:0 0;scale:1}
  50%{translate:0 -5px;scale:1.022}}
.hm-hero h1{margin:0 0 8px;font-size:31px;font-weight:900;letter-spacing:.5px;color:#fff;
  text-shadow:0 3px 18px rgba(20,8,60,.5);line-height:1.15}
.hm-hero p{margin:0;font-size:13.5px;color:rgba(255,255,255,.92);line-height:1.6}
/* 小伴气泡（白底深字，带小三角） */
/* 气泡进文档流（相对定位）：早期版本用 absolute+top:0 配 hero-copy 的 padding-top 占位，
   结果矮屏把 padding-top 压到 44px < 气泡高度 49px，「你的学习镜像」被气泡压住一半。
   进流后高度自洽，任何压缩档都不会重叠。 */
.hm-hero .hero-greet{
  position:relative;z-index:3;max-width:420px;margin-bottom:11px;
  padding:8px 12px 9px;border-radius:13px;
  background:rgba(255,255,255,.97);color:#1B1436;
  box-shadow:0 10px 26px rgba(8,2,32,.42);
  animation:hmGreetIn .5s ease .25s both}
@keyframes hmGreetIn{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
.hm-hero .hero-greet::before{
  content:"";position:absolute;left:-5px;top:16px;width:11px;height:11px;
  background:inherit;border-radius:2px;rotate:45deg}
.hm-hero .hg-hi{font-size:11.5px;line-height:1.35;font-weight:600;color:rgba(27,20,54,.52);margin-bottom:2px}
.hm-hero .hg-txt{font-size:12.5px;line-height:1.45;font-weight:700}
/* 今日完成（hero 右下区，随文案流排布，避免 absolute 在矮屏溢出） */
.hm-hero .hero-finish{margin-top:14px;font-size:12.5px;color:rgba(255,255,255,.95);font-weight:600;display:flex;align-items:baseline;gap:3px}
.hm-hero .hero-finish b{font-size:17px;font-weight:900;color:#fff;line-height:1}
.hm-hero .hero-finish span{font-size:11.5px;color:rgba(255,255,255,.86)}
.hm-hero .hero-finish-bar{height:6px;border-radius:99px;background:rgba(255,255,255,.22);overflow:hidden;margin:7px 0 4px;max-width:280px}
.hm-hero .hero-finish-bar > i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#fff,#8AF0EA);
  transition:width .5s ease;box-shadow:0 0 12px rgba(255,255,255,.6)}
/* v12XpText：refreshGameUI() 会往这里写「N/G 颗」，与上面 hero-finish 同口径 → 视觉重复。
   保留节点（契约 id，JS 写入锚点）但视觉隐藏，用无障碍剪裁而非 display:none 以便断言可读。 */
.hm-hero .hero-finish-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hm-hero .hero-finish-txt em{font-style:normal;font-weight:800;color:#fff}

/* ============ ROW1 右 · 今日任务（checks + 进度 + 打卡行）============ */
.hm-today{padding:16px 17px 14px;display:flex;flex-direction:column}
.hm-today .today-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;flex:none}
.hm-today .today-hd .go{color:var(--hm-dim);font-size:17px;line-height:1}
.hm-today .today-say{font-size:11px;color:var(--hm-dim);font-weight:600;margin-bottom:12px;flex:none}
.hm-today .checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;flex:1 1 auto;min-height:0}
.hm-today .checks li{display:flex;align-items:flex-start;gap:9px;font-size:12px;color:var(--hm-sub);line-height:1.5}
.hm-today .checks li b{color:#fff;font-weight:800}
.hm-today .checks .box{
  flex:none;width:17px;height:17px;border-radius:5px;margin-top:1px;display:grid;place-items:center;
  border:1.5px solid rgba(255,255,255,.16);font-size:10px;color:transparent}
.hm-today .checks li.done{color:#fff}
.hm-today .checks li.done .box{
  background:linear-gradient(135deg,var(--hm-brand),var(--hm-brand2));border-color:transparent;color:#fff}
/* [2026-09-25 #216] 「待修 N 个知识点」整行可点 —— 负 margin 抵消 padding，
   hover 底色不撑开布局（gap 由父级 .checks 控制，这里不许引入新盒模型位移）。 */
.hm-today .checks li[data-act]{cursor:pointer;padding:3px 6px;margin:-3px -6px;border-radius:7px;
  transition:background .16s ease}
.hm-today .checks li[data-act]:hover{background:rgba(255,255,255,.07)}
.hm-today .checks li[data-act]:hover b{color:var(--hm-brand2,#a78bfa)}
.hm-today .today-bar{margin-top:auto;padding-top:12px;flex:none}
.hm-today .today-bar .lbl{display:flex;justify-content:space-between;font-size:11px;color:var(--hm-dim);margin-bottom:6px}
.hm-today .track{height:7px;border-radius:99px;background:rgba(255,255,255,.10);overflow:hidden}
.hm-today .track > i{display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,var(--hm-brand2),var(--hm-teal));box-shadow:0 0 14px rgba(167,139,250,.8)}
/* 打卡行（v12StreakCard 落点：整行可点，保留 v12StreakNum / v12StreakDesc 绑定） */
.hm-today .today-checkin{
  margin-top:10px;flex:none;cursor:pointer;
  display:flex;align-items:baseline;gap:5px;padding:9px 11px;border-radius:var(--hm-r-s);
  background:rgba(245,166,91,.10);border:1px solid rgba(245,166,91,.24);transition:.16s}
.hm-today .today-checkin:hover{background:rgba(245,166,91,.18)}
.hm-today .today-checkin .tc-ic{font-size:12px;line-height:1}
.hm-today .today-checkin b{font-size:14px;font-weight:900;color:#fff;line-height:1}
.hm-today .today-checkin .tc-u{font-size:11px;color:var(--hm-sub);font-weight:700}
.hm-today .today-checkin .tc-desc{margin-left:auto;font-size:10px;color:var(--hm-dim);font-weight:600;text-align:right}

/* ============ ROW2 · 四张指标卡（demo 形态：每卡 3 行小指标）============ */
.hm-mc{display:flex;flex-direction:column;padding:15px 16px 14px;min-width:0}
.hm-mc .card-title{margin-bottom:11px}
.hm-mc .mc-rows{display:flex;flex-direction:column;gap:9px}
.hm-mc .mc-r{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:12.5px}
.hm-mc .mc-r .k{color:var(--hm-sub);display:flex;align-items:center;gap:6px;min-width:0}
.hm-mc .mc-r .k::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--hm-brand2);flex:none}
.hm-mc .mc-r .v{font-weight:800;color:#fff;font-size:15px;letter-spacing:.2px;flex:none}
.hm-mc .mc-r .v.sm{font-size:12.5px;font-weight:700}
.hm-mc .mc-adv{font-size:12px;color:var(--hm-sub);line-height:1.7}
.hm-mc .mc-adv b{color:#fff}
.hm-mc .mc-empty{font-size:11.5px;color:var(--hm-dim);line-height:1.65}
/* [2026-10-16] 薄弱点行可点（-> 新开一页 · 学习地图）+ 三态 + 完成脚注（首页恒深紫 mirror 档） */
.hm-mc .mc-rows a.mc-r{text-decoration:none;color:inherit;cursor:pointer;border-radius:8px;padding:3px 5px;margin:0 -5px;transition:background .15s ease}
.hm-mc .mc-rows a.mc-r:hover{background:rgba(109,94,252,.20)}
.hm-mc .mc-rows a.mc-r .v .ext{font-style:normal;opacity:.7;margin-left:3px;font-size:11px}
.hm-mc .mc-r.st-due .v.sm{color:#FFC46B}
.hm-mc .mc-r.st-ok .v.sm{color:#7FE7BE}
.hm-mc .mc-foot{margin-top:10px;padding-top:8px;border-top:1px dashed rgba(255,255,255,.14);font-size:11.5px;color:var(--hm-dim)}
.hm-mc .mc-foot:empty{display:none}
.hm-mc .mc-foot b{color:var(--hm-brand2)}

/* ============ ROW2 第 4 张 · 知识开门门卡（一行 4 列，[批102]）============
 * [批102 2026-09-28] 用户两条反馈：①门卡跨两列换行后右侧留空「不好看」⇒ 回到一行四张、
 *   门卡固定在最后一位（每张 ≈338px）；②「视频没什么吸引力」⇒ 换片，并让视频铺满整张卡面。
 * 母题沿用 #/eyes 的 .page-head.tone-door（深靛门框 + 暖金门缝光 + 门槛光滩），但换尺度：
 * 那里是 84x112 的竖拱门洞，这里是 ≈338x136 的横卡 —— 只借「门开着、光往里洒」的感觉，
 * 不搬那一块的色值（换肤式复制恰恰是雷同的根源）。
 * 结构：舞台铺满整卡作背景层（星尘 + 门缝暖光 + 懒加载 video），文案压在左侧暗色渐变上。
 *   静态态读作「一扇关着的门」+ 门缝光呼吸；点开后视频铺满整卡 —— 门内光景占满视野，
 *   不再是 150x104 的小窗。视频再亮也压得住文案（左侧 96% 不透明的深靛渐变）。
 * 降级：video 缺失或播放失败时，门缝光与星尘常驻；点击不被拦截，落回整卡 data-href 进 #/eyes
 *   —— 绝不出现「点了没反应」的哑出口。 */
/* [批102e] 卡体锁死成片比例 —— cover 裁切的**唯一开关**，别处改不了。
   算式：卡面比例偏离成片 2.4915 时，cover 必在**横向或纵向**裁掉一边；
   实测（.workbuddy/_b102e_evidence.cjs）1024 档（卡宽 478，比例 3.12）纵向裁掉门底 4%，
   540/480/420 整行档（比例 3.19~4.15）纵向裁得更多 ⇒ 门同样看不全。
   ⇒ aspect-ratio 锁 1176/472，video 框（stage inset:0）比例随之恒等 ⇒ **任何视口零裁切**。
   ⚠ padding 必须归零并内移到 .door-body：padding 会让 video 框比卡体「更扁」，
     即便 aspect-ratio 锁死也会重新引入纵向裁切（394/(159-27)=2.99 而非 2.49）。
   ⚠ overflow 必须留 visible：grid item 的「自动最小尺寸」只在 overflow:visible 下生效。
      带 overflow:hidden 时卡高会被 aspect-ratio 压到 118.4/110.4（1280/1200 档），
      而文案需要 153.4 ⇒ CTA 被裁（取证实测溢出 +1.9px / +15px）。去掉后才回到内容撑高。 */
.hm-dash .hm-mc-door{
  position:relative;overflow:hidden;
  background:#17122E;border:1px solid rgba(255,196,110,.28);
  padding:0;cursor:pointer;
}
/* [批102e] 锁成片比例的**区间限定**：只在「卡够宽、文案装得下」的两段生效。
   · 2 栏宽卡档（700~1080）与 ≤640 整行档：卡宽 310~486 / 356~516，
     锁 1176/472 后卡高 124~207，文案（≤124）装得下 ⇒ cover 零裁切，门横竖都完整。
   · 4 栏档（≥1081）与 641~699：**不能**锁 —— 卡宽只有 275~338 / 300~330，
     锁了卡高会掉到 110~136 < 文案所需的 ~124，CTA 被 overflow:hidden 吃掉
     （取证实测 1200 档溢出 +15px、1280 档 +1.9px）。这两段维持「文案撑高」，
     实测裁切 5.8%~17.7%，门横位 54.6%~76.4% 仍完整可见。 */
@media (min-width:700px) and (max-width:1080px){
  .hm-dash .hm-mc-door{aspect-ratio:1176 / 472}
}
.hm-dash .hm-mc-door .door-body{padding:13px 15px 12px}
.hm-dash .hm-mc-door::before{background:linear-gradient(90deg,transparent,rgba(255,214,150,.30),transparent)}
/* 舞台＝整卡背景层：门缝周围的暖光晕（星点另画在 .door-frame 上，免得被门扇盖住） */
.hm-dash .door-stage{
  position:absolute;inset:0;border:0;border-radius:0;cursor:pointer;
  background:
    radial-gradient(46% 94% at 65.5% 52%,rgba(255,196,110,.26),transparent 72%),
    #17122E;
}
/* 星尘：落在门缝光周围 ⇒ 读作「门里透出星光」 */
.hm-dash .door-frame{position:absolute;inset:0;
  background:
    radial-gradient(1.5px 1.5px at 58% 46%,rgba(255,239,206,.88),transparent 100%),
    radial-gradient(1.3px 1.3px at 63% 55%,rgba(255,226,180,.70),transparent 100%),
    radial-gradient(1.4px 1.4px at 60% 65%,rgba(255,239,206,.60),transparent 100%),
    radial-gradient(1.2px 1.2px at 64% 74%,rgba(255,226,180,.52),transparent 100%),
    radial-gradient(1.4px 1.4px at 58% 84%,rgba(255,239,206,.46),transparent 100%)}
/* [批102f] 封面门本体：v6 定稿原片第 0 帧（门关着）裁成卡面比例的静态图，铺在视频层下
   （z-index:0，video 是 z-index:1，点播淡入自然盖住）。封面在场 ⇒ 静态态就是「一扇真的门」。
   图内自带门缝紫光与门槛光滩，CSS 画的门缝光线/光滩会跟它叠出双影 ⇒ 封面在场时隐藏两者；
   浏览器不支持 :has 时两笔仍显示（同色系暖光，叠上去不刺眼），优雅降级。
   门缝光呼吸动画选择器不受影响（display:none 的元素不动画，视频缺失时封面图本身就是降级门）。 */
.hm-dash .door-stage .door-cover{position:absolute;inset:0;z-index:0;width:100%;height:100%;
  object-fit:cover;background:#17122E}
.hm-dash .door-stage:has(.door-cover) .door-frame::before,
.hm-dash .door-stage:has(.door-cover) .door-frame::after{display:none}
.hm-dash .door-frame::before{content:"";position:absolute;left:65.5%;top:39.4%;bottom:10.6%;width:5px;
  transform:translateX(-50%);border-radius:3px;
  background:linear-gradient(180deg,#FFEBC4,#FFC978 46%,rgba(255,163,74,.55));
  box-shadow:0 0 16px rgba(255,190,110,.62),0 0 36px rgba(255,172,86,.32)}
/* 门槛光滩：光洒到地上 */
.hm-dash .door-frame::after{content:"";position:absolute;left:52%;right:21.4%;bottom:6.4%;height:8px;
  border-radius:4px;background:radial-gradient(60% 100% at 50% 0,rgba(255,214,150,.62),transparent 72%)}
/* 文案层：压在左侧暗色渐变上，视频再亮也读得清 */
.hm-dash .door-body{position:relative;z-index:2;height:100%;display:flex;align-items:flex-start;min-width:0}
/* [批102b] 遮罩只压左侧文案区：0-24% 近乎不透明保证读字，58% 之后基本透明 ——
   门主体（批102e 起为横 54.6%-76.4%）必须亮出来，否则视频再好看也被压成一块暗噪点。
   批102e：遮罩由 0-60% 收到 **0-50%**，文案限宽同步 52%→46% —— 给门让出更宽的亮区。 */
/* [批102e] padding 内移到 body 后，遮罩改为**贴满 body**（原 -15/-13 会溢出到卡外被裁）。 */
.hm-dash .door-body::before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;
  pointer-events:none;
  background:linear-gradient(94deg,rgba(23,18,46,.95) 0%,rgba(23,18,46,.90) 18%,rgba(23,18,46,.62) 32%,rgba(23,18,46,.18) 43%,rgba(23,18,46,0) 50%)}
/* [2026-10-08] 兜底入口：门已开但新标签被弹窗拦截器挡了 → 就地给一个点了必开的按钮（手势内不再被拦） */
.hm-dash .door-stage .door-enter{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);
  z-index:5;padding:8px 18px;border:0;border-radius:999px;cursor:pointer;
  font-size:13px;font-weight:700;color:#fff;background:linear-gradient(135deg,#8B5CF6,#7C3AED);
  box-shadow:0 6px 18px rgba(124,58,237,.42);white-space:nowrap}
.hm-dash .door-stage .door-enter:hover{filter:brightness(1.08);background:linear-gradient(135deg,#8B5CF6,#7C3AED)}
[data-theme="dark"] .hm-dash .door-stage .door-enter{background:linear-gradient(135deg,#A78BFA,#7C3AED);color:#fff}
/* [批102b] 文案限宽 60%：右侧留给门，文字不压到亮区才读得清 */
.hm-dash .door-copy{position:relative;flex:0 1 auto;max-width:46%;min-width:0;display:flex;flex-direction:column;gap:7px}
.hm-dash .door-copy h3{
  margin:0;font-size:17px;font-weight:800;color:#fff;letter-spacing:.4px;line-height:1.25;
  text-shadow:0 2px 18px rgba(255,200,120,.22)}
.hm-dash .door-sub{margin:0;font-size:12px;line-height:1.5;color:rgba(255,255,255,.78)}
.hm-dash .door-cta{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;
  padding:5px 12px;border-radius:999px;font-size:12px;font-weight:800;
  color:#3A2470;background:linear-gradient(180deg,#FFE3B0,#FFB65C);
  box-shadow:0 8px 20px -10px rgba(255,182,92,.70);cursor:pointer;border:0}
.hm-dash .door-cta:hover{filter:brightness(1.06)}
.hm-dash .door-cta:active{transform:translateY(1px)}
.hm-dash .door-cta .tri{width:0;height:0;border-left:7px solid #3A2470;
  border-top:4.5px solid transparent;border-bottom:4.5px solid transparent;margin-left:1px}
/* [2026-10-14 PM 拍板] 门卡「作业检查」小字样式（.door-hwline/.door-hw）已删 —— 该入口升为顶栏一级项，
   主页知识开门大卡恢复只有「推开看看」一个出口。 */
/* 视频覆盖层：懒加载，点播才出现；铺满整卡 —— 播放时整张卡就是门内光景 */
/* [批102c] 取景一律回「成片阶段」解决，前端只负责「铺满 + 不露底」，不做任何缩放/位移。
   [批102e 实测纠错 · 务必读] 旧注释断言「卡面 338x136 ≈ 2.478」是**错的**：
   19 档视口实测（.workbuddy/_b102e_measure.cjs）卡面比例在 **0.98~2.20** 之间波动，
   **从未到过 2.478**（最宽档 1600 也只有 2.204）。原因是卡高由文案换行 + grid 行高共同决定。
   ⇒ cover 每档都在**左右各裁**（1600 裁 5.8% / 1200 裁 14.0% / 480 裁 18.6% / 420 裁 30.4%）。
   ⇒ 取景只能由**成片的安全区**负责：批102e 起全部叙事主体收进横 20%~80%，
     左右各 20% 只放可牺牲的发光装饰。改成片构图必须守住这条。
   ⚠ 别再往这里加 transform：上一版 scale(1.7) translateX(14%) 是给 16:9 片源调的「凑门位」写法，
     换片后把公仔放大到出框、底部五色方块全丢（.workbuddy/w102c2_t6_s1.7_x14.png 实证）。
     要挪主体位置，改 .workbuddy/_b102b_assemble.py 的 CUT_A/CUT_B 纵向裁剪带，重出成片。 */
.hm-dash .door-stage video{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .28s linear;background:#17122E}
.hm-dash .door-stage.is-playing video{opacity:1}
/* [批101 教训] is-playing 时**不隐藏** .door-frame —— 一旦视频缺失/播放失败会跟着一起没，
   降级态就只剩一块黑板。留着它，降级仍有「门」。 */
/* 降级态：拿不到视频时门缝光「呼吸」，给一点动静但不开口讲内容 */
@media (prefers-reduced-motion:no-preference){
  .hm-dash .door-stage:not(.is-playing) .door-frame::before{animation:doorBreathe 2.6s ease-in-out infinite}
}
@keyframes doorBreathe{0%,100%{opacity:.72;transform:translateX(-50%) scaleY(1)}50%{opacity:1;transform:translateX(-50%) scaleY(1.06)}}

/* ============ ROW3 · 今天学什么（三站并排彩卡）+ CTA ============ */
.hm-dash .learn-box{padding:16px 18px 18px;display:flex;flex-direction:column}
/* [2026-09-25 #217 T2] 原 align-items:baseline 是给「三站跟着走，不用自己挑」这种短
   附注设计的。计划句换成学情派生的行动句（如「今天该复习的有 3 个，先攻「XX」，再做
   综合题。」）后必须与标题分行，否则长句会把标题挤成两行、note 读不完。 */
.hm-dash .learn-hd{display:flex;flex-direction:column;align-items:flex-start;gap:5px;margin-bottom:13px;flex:none}
/* 计划句由「附注」升级为「指引」⇒ 字号与亮度一起提一级（dim → sub）。 */
.hm-dash .learn-note{font-size:12px;color:var(--hm-sub);font-weight:600;line-height:1.6}
/* [2026-09-18] 闭环引导标题：强化「一套闭环·三站接力」，避免理解成三个独立工具 */
.hm-dash .learn-loop{margin-bottom:11px;flex:none}
.hm-dash .learn-loop .ll-t{font-size:14px;font-weight:900;color:#fff;letter-spacing:.2px;line-height:1.35}
.hm-dash .learn-loop .ll-s{font-size:11px;color:var(--hm-sub);font-weight:600;margin-top:3px}
.hm-dash .learn-loop .ll-s::before{content:'';display:inline-block;width:14px;height:2px;
  border-radius:2px;background:linear-gradient(90deg,#8B7CF6,#28C2C8);margin-right:7px;vertical-align:middle}
/* ⚠ 四张卡的 li className 会被 homeFlowInit() 整体改写成「v12-fstep」/「v12-fstep is-ready」，
   所以配色**只能**走 :nth-child()，不能挂在 li 自己的额外 class 上（会被洗掉）。
   同时必须显式声明 flex-direction：page.css 的 .v12-fstep 带 flex-direction:column，
   这里正好也要竖排卡片，写死避免"谁声明谁生效"的暗雷。
   [2026-09-18] 底色降饱和（深色背景下不刺眼）—— 靠底色区分卡片。
   [2026-09-20] 由 3 列改 4 列（新增「思伴聊屋」前置卡）；行动入口由实心胶囊改轻量文字链。
   配色顺序：① 思伴聊屋·粉 → ② 随堂充电·紫 → ③ 找坑修复·橙 → ④ 闯关进阶·青。 */
/* [2026-09-20] 形状区分：第 1 张「思伴聊屋」（找小伴聊）＝正方形 —— 它不属于后面那套
   「一套学习闭环」三站接力，是**开场前**的一步，形状上要一眼分得开。
   做法：把行高定死成 --hm-sq，第 1 张宽 = 行高 → 真正的正方形；后 3 张仍 1fr 等分，
   宽 ≈ 2 倍于高 → 长方形，且三张连成一整块。
   ⚠ --hm-sq 必须 ≥ 第 1 张卡「图标+标题+副标题+描述+行动」五项竖排所需的高度，否则
   overflow:hidden 会把描述裁掉 —— 故按视口高度分档取值（下方两个矮屏 media 会覆写）。 */
.hm-dash .today-grid{
  display:grid;grid-template-columns:var(--hm-sq) minmax(0,1fr);
  --hm-sq:194px;--hm-sep:26px;
  column-gap:var(--hm-sep);align-items:stretch;flex:0 0 auto;min-height:0}
/* 思伴聊屋：左侧独立高面板（粉色），高度 = 右列高度 = 标题 + 三站卡总和（align-items:stretch 撑高） */
.hm-dash .today-grid .gym-panel{
  position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;
  padding:16px 15px 15px;border-radius:var(--hm-r-m);
  background:linear-gradient(150deg,#F2D3E5 0%,#E7B4D3 100%);
  border:1.5px solid #EDEAFB;color:#1B1436;
  cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,filter .16s ease}
.hm-dash .today-grid .gym-panel:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(20,12,48,.22);filter:saturate(1.06)}
.hm-dash .today-grid .gym-panel:active{transform:translateY(0);box-shadow:0 4px 12px rgba(20,12,48,.18)}
.hm-dash .today-grid .gym-panel:focus-visible{outline:3px solid #7F4AE0;outline-offset:2px}
.hm-dash .today-list{list-style:none;margin:0;padding:0;display:grid;
  --hm-sq:194px;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-auto-rows:var(--hm-sq);column-gap:13px;row-gap:0;flex:0 0 auto;min-height:0}
.hm-dash .today-list li{
  display:flex;flex-direction:column;align-items:flex-start;gap:0;
  padding:14px 15px 13px;border-radius:var(--hm-r-m);
  border:1.5px solid #EDEAFB;box-shadow:none;
  color:#1B1436;position:relative;overflow:hidden;min-height:0;
  cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,filter .16s ease}
.hm-dash .today-list li:nth-child(1){background:linear-gradient(150deg,#CFC7F5 0%,#B0A4F0 100%)}
.hm-dash .today-list li:nth-child(2){background:linear-gradient(150deg,#F3DCBE 0%,#EDC69F 100%)}
.hm-dash .today-list li:nth-child(3){background:linear-gradient(150deg,#BFE5E7 0%,#9DD5DA 100%)}
/* [2026-09-20] 三站恢复为**各自独立的卡片**：13px 列间距 + 统一圆角 + 统一描边（中和 is-now 粉漏光）；
   hover 单卡上浮提亮（不再是「整块不动」的拼块读感）。 */
.hm-dash .today-list li:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(20,12,48,.22);filter:saturate(1.06)}
.hm-dash .today-list li:active{transform:translateY(0);box-shadow:0 3px 10px rgba(20,12,48,.18)}
.hm-dash .today-list li:focus-visible{outline:3px solid #7F4AE0;outline-offset:2px}
/* 思伴聊屋与三站卡共用内部文字样式（同一套 .v12-fstep-tag/.fs-ic/h3/.fs-sub/.fs-desc/.fs-btn 体系） */
.hm-dash .today-list li .v12-fstep-tag,
.hm-dash .gym-panel .v12-fstep-tag{
  position:absolute;right:12px;top:12px;font-size:10px;font-weight:800;letter-spacing:.2px;
  padding:3px 8px;border-radius:99px;background:rgba(255,255,255,.62);color:rgba(27,20,54,.72)}
.hm-dash .today-list li .v12-fstep-tag.ready,
.hm-dash .gym-panel .v12-fstep-tag.ready{background:#fff;color:#5B45CF}
.hm-dash .today-list li .v12-fstep-tag.lock,
.hm-dash .gym-panel .v12-fstep-tag.lock{background:rgba(27,20,54,.16);color:rgba(27,20,54,.66)}
.hm-dash .today-list .fs-ic,
.hm-dash .gym-panel .fs-ic{font-size:25px;line-height:1;margin-bottom:9px;
  display:flex;align-items:center;color:#1B1436}
.hm-dash .today-list .fs-ic svg,
.hm-dash .gym-panel .fs-ic svg{width:1em;height:1em;display:block}
.hm-dash .today-list h3,
.hm-dash .gym-panel h3{margin:0 0 4px;font-size:14.5px;font-weight:900;color:#1B1436;line-height:1.2}
.hm-dash .today-list .fs-sub,
.hm-dash .gym-panel .fs-sub{margin:0 0 4px;font-size:10.5px;font-weight:800;line-height:1.3;
  color:rgba(27,20,54,.60);letter-spacing:.2px}
.hm-dash .today-list .fs-desc,
.hm-dash .gym-panel .fs-desc{
  margin:0 0 11px;font-size:13px;line-height:1.55;color:rgba(27,20,54,.74);font-weight:600;
  flex:0 0 auto}
.hm-dash .today-list .fs-desc b,
.hm-dash .gym-panel .fs-desc b{color:#1B1436;font-weight:900}
.hm-dash .today-list .fs-btn,
.hm-dash .gym-panel .fs-btn{
  margin-top:auto;flex:none;align-self:flex-end;
  font-size:11.5px;font-weight:800;letter-spacing:.2px;white-space:nowrap;
  color:#2E2350;text-decoration:none;background:none;box-shadow:none;border-radius:0;
  padding:0 0 2px;border-bottom:1.5px solid rgba(46,35,80,.26);
  transition:color .16s,border-color .16s,transform .16s}
.hm-dash .today-list .fs-btn:hover,
.hm-dash .gym-panel .fs-btn:hover{color:#5B45CF;border-bottom-color:#5B45CF;transform:translateX(2px)}
/* 停用：原「开始今日学习」CTA 卡（.hm-cta）已改造为 today-grid 左列「思伴聊屋」，以下规则暂无人引用 */
.hm-dash .hm-cta{display:flex;flex-direction:column;justify-content:center;padding:17px 18px}
.hm-dash .hm-cta .cta-title{font-size:15px;font-weight:900;color:#fff;line-height:1.3}
.hm-dash .hm-cta .cta-hint{margin:8px 0 14px;font-size:11px;line-height:1.6;color:var(--hm-sub)}
.hm-dash .hm-cta .cta-hint b{color:#fff}
.hm-dash .hm-cta .cta-main{
  display:block;text-align:center;text-decoration:none;font-size:12.5px;font-weight:800;color:#fff;
  padding:10px 12px;border-radius:11px;margin-bottom:9px;
  background:linear-gradient(120deg,#6D5EFC 0%,#A78BFA 55%,#28C2C8 100%);
  box-shadow:0 10px 24px -12px rgba(109,94,252,.95)}
.hm-dash .hm-cta .cta-sub{text-align:center;font-size:10.5px;color:var(--hm-dim);text-decoration:none;font-weight:600}
.hm-dash .hm-cta .cta-sub:hover{color:var(--hm-sub)}

/* ============ ROW4 · 按学科继续 + 最近 7 天 ============ */
.foot-box{padding:13px 15px;display:flex;flex-direction:column}
.fb-h{font-size:13.5px;font-weight:800;color:#fff;margin-bottom:9px;flex:none}
.fb-pills{display:flex;flex-wrap:wrap;gap:7px}
/* [批125] 主页 9 学科 · 复用技能波浪带 IXL 游戏卡（.v12-c-card 真源在 page.css），仅容器级微调 */
/* [批126] 右卡与左卡同高：grid 默认 stretch，柱状图区 flex:1 吃掉剩余高度 */
.hm-dash .fb-week{height:100%}
.hm-dash .fb-week .fb-bars{flex:1 1 0;min-height:44px}
/* [批126b] 「今天该复习」角标：右上学科色小签（--cc 与卡面同源） */
.fb-subj .v12-c-card .c-due-tag{position:absolute;top:8px;right:8px;z-index:2;
  font-size:9.5px;font-weight:800;color:#fff;padding:3px 8px;border-radius:99px;
  background:var(--cc);box-shadow:0 2px 8px rgba(0,0,0,.18);letter-spacing:.02em}
/* [批128] 柱状图：0 值柱做半透明底槽；近 7 天零记录时空态文案（不拿矮柱冒充「练了但少」） */
/* [批129] 柱顶标数字 + 卡顶汇总行 */
.fb-week .fb-bars i{position:relative}
.fb-week .fb-bars i b{position:absolute;left:0;right:0;top:-14px;text-align:center;
  font-size:9.5px;font-weight:800;color:var(--hm-sub)}
.fb-week .fb-bars i.z b{color:var(--hm-dim);opacity:.65}
.fb-week .fb-sum{font-size:10.5px;color:var(--hm-dim);margin:-3px 0 9px}

.fb-week .fb-bars i.z{opacity:.22}
.fb-week--empty .fb-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;text-align:center;font-size:11px;color:var(--hm-sub);line-height:1.5}
.fb-week--empty .fb-empty span{font-size:10px;color:var(--hm-dim)}
/* [批127] 学科卡拖拽换位：grab 光标 + 拿起态 + 目标虚线 */

.fb-subj .v12-c-card{cursor:grab}
.fb-subj .v12-c-card:active{cursor:grabbing}
.fb-subj .v12-c-card.scard-drag{opacity:.45;transform:rotate(3deg) scale(1.04)}
.fb-subj .v12-c-card.scard-over{outline:2px dashed var(--cc);outline-offset:-2px}

.fb-subj .v12-carousel{margin-bottom:0;gap:10px}
.fb-subj .v12-c-track{padding:4px 2px 8px;scrollbar-width:none;-ms-overflow-style:none}
.fb-subj .v12-c-track::-webkit-scrollbar{display:none}
.fb-pills .sp{
  display:inline-flex;align-items:center;gap:5px;text-decoration:none;
  font-size:11.5px;font-weight:700;color:var(--hm-sub);padding:5px 10px;border-radius:99px;
  background:rgba(255,255,255,.05);border:1px solid var(--hm-brd);transition:.15s}
.fb-pills .sp i{font-style:normal;font-size:12px}
/* 回退在前：不支持 color-mix 的浏览器用 rgba 打底，支持者由下一条覆盖 */
.fb-pills .sp:hover{color:#fff;background:rgba(255,255,255,.10);border-color:var(--spc)}
.fb-pills .sp:hover{background:color-mix(in srgb,var(--spc) 26%,transparent)}
.fb-week .fb-bars{display:flex;align-items:flex-end;gap:8px;height:64px;margin-bottom:6px}
.fb-week .fb-bars i{flex:1;border-radius:6px 6px 3px 3px;min-height:6px;
  background:linear-gradient(180deg,var(--hm-brand2),rgba(167,139,250,.22))}
.fb-week .fb-x{display:flex;justify-content:space-between;font-size:10px;color:var(--hm-dim)}




/* ============ 收起右下角悬浮公仔（首页 hero 已有公仔，避免重复遮挡）============
   同款先例：web/error-book/index.html:243 `body:not(.eb-mascot-tucked) #mascotV5Wrap{display:none!important}`。
   注意要连 #xbGreet（挂在公仔上的问候气泡，right:34px;bottom:132px）一起收 ——
   只收公仔会剩一个悬空气泡。app.js 给它写的是 `style.display=''`（无 !important），压不过这里。 */
body[data-tone="mirror"] #mascotV5Wrap,
body[data-tone="mirror"] #xbGreet{display:none!important}

/* ---- 页脚 ---- */
body[data-tone="mirror"] .v12-foot{
  text-align:center;font-size:10.5px;color:var(--hm-dim);padding:12px 0 4px;opacity:.75}

/* ---- 响应式 ---- */
@media (max-width:1360px){
  .hm-dash .hm-row1{grid-template-columns:minmax(0,1fr) 300px}
  .hm-dash .hm-foot-row{grid-template-columns:minmax(0,1fr) 300px}
  .hm-hero{grid-template-columns:222px minmax(0,1fr);padding:18px 20px}
  .hm-hero .ring,.hm-hero .ring svg{width:94px;height:94px}
  .hm-hero .ring .val{top:26px;font-size:23px}
  .hm-hero .ring .cap{top:55px;font-size:10px}
  .hm-hero h1{font-size:27px}
  .hm-hero .hero-copy{padding-left:126px}
  .hm-hero .hero-mascot{width:112px;height:112px}
  .hm-hero .hero-glow{width:130px;height:130px}
  .hm-hero .hero-greet{left:120px}
}
@media (max-width:1080px){
  .hm-dash .hm-row1{grid-template-columns:1fr;min-height:0}
  .hm-dash .hm-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hm-dash .hm-learn{grid-template-columns:1fr;min-height:0}
  /* [2026-09-20] ≤1080：today-grid 退单列（思伴聊屋高面板堆到三站卡上方）；
     三站已是各自独立的卡片（base 即含 13px 列间距 + 圆角），这里只需放宽行高、加行间距。 */
  .hm-dash .today-grid{grid-template-columns:1fr;column-gap:0;align-items:start}
  .hm-dash .gym-panel{width:auto}
  .hm-dash .today-list{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:auto;row-gap:13px}
  .hm-dash .hm-foot-row{grid-template-columns:1fr}
  .hm-hero{grid-template-columns:200px minmax(0,1fr)}
  .hm-hero h1{font-size:24px}
  .hm-hero .hero-mascot{width:96px;height:96px}
  .hm-hero .hero-copy{padding-left:108px}
  body[data-tone="mirror"] .main{min-height:0}
}
@media (max-width:820px){
  /* 窄屏：hero 转竖排，公仔与气泡改流式（绝对定位在窄屏会与标题打架） */
  .hm-hero{grid-template-columns:1fr;gap:12px;padding:16px 16px 18px}
  .hm-hero .rings{justify-content:flex-start;gap:12px}
  .hm-hero .hero-copy{padding:0}
  .hm-hero .hero-mascot{position:static;transform:none;width:84px;height:84px;margin-bottom:10px}
  .hm-hero .hero-glow{display:none}
  /* left:auto 必须显式写回：宽档（≤1360）与矮屏档（≤850）里给 .hero-greet 留了
     绝对定位时代的 left:120px/100px 偏移，而媒体查询无下界 → 375 视口同样命中，
     气泡被右推 100px+ 顶出 .hm-hero 的 overflow:hidden，句子被裁半截。
     窄屏气泡已改流式排布，这里把偏移归零。 */
  .hm-hero .hero-greet{max-width:100%;left:auto;margin-bottom:12px;animation:none}
  .hm-hero .hero-greet::before{display:none}
  .hm-hero h1{font-size:24px}
  .hm-hero p{font-size:12.5px}
  .hm-dash .today-list{grid-template-columns:1fr;gap:11px}
  .hm-dash .today-list .fs-desc{flex:0 0 auto}
  .hm-dash .today-list .fs-btn{margin-top:auto}
}
@media (max-width:640px){
  body[data-tone="mirror"] .app-layout > .main{padding:13px 13px 16px}
  body[data-tone="mirror"] .app-top-nav .top-nav-row{padding:0 13px;gap:9px}
  body[data-tone="mirror"] .app-top-nav .status-pill{display:none}
  .hm-dash{gap:11px}
  .hm-dash .hm-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
  /* [批102e] 门卡在 ≤640 **独占整行** —— 卡面比例才是 cover 裁切的开关，宽卡会救回门。
     实测（.workbuddy/_b102e_evidence.cjs，19 档视口）：2 栏布局下门卡只占半栏，
     视口 420 卡面比例掉到 1.0922、380 掉到 0.8734 ⇒ cover 按高适配 ⇒ **左右各裁 28.1% / 32.4%**，
     而叙事主体全部收在安全区 20%~80% ⇒ 门的右缘正好落在裁掉的那一段（用户反馈「门都没看全」）。
     独占整行后卡宽回到 396/356、卡高 176 ⇒ 比例 2.02~2.25，裁切降到 5% 以内，安全区够用。
     ⚠ 第 3 张普通卡必须一起设成整行，否则 4 张卡里第 4 张跨列会在第 2 行留一个空格。 */
  .hm-dash .hm-metrics > .hm-mc:nth-child(3),
  .hm-dash .hm-metrics > .hm-mc-door{grid-column:1 / -1}
  /* ≤640 整行后卡宽 356~516 ⇒ 同样锁成片比例（见上方 @media 说明） */
  .hm-dash .hm-mc-door{aspect-ratio:1176 / 472}
  .hm-hero .ring,.hm-hero .ring svg{width:78px;height:78px}
  .hm-hero .ring .val{top:21px;font-size:19px}
  .hm-hero .ring .cap{top:45px;font-size:9px}
  .hm-hero h1{font-size:21px}
  .hm-mc{padding:12px 13px}
  .hm-mc .mc-r{font-size:11.5px}
  .hm-mc .mc-r .v{font-size:13.5px}
  .hm-mc .mc-adv{font-size:11px}
  .foot-box{padding:11px 13px}
  .fb-week .fb-bars{height:52px}
  .hm-dash .learn-box{padding:13px 14px 15px}
  .hm-dash .hm-cta{padding:14px 15px}
}
@media (prefers-reduced-motion:reduce){
  .hm-hero .hero-mascot{animation:none}
  .hm-hero .hero-greet{animation:none}
}

/* ---- 矮屏压缩（1440x900 / 1280x800 等：把余量挤出来，仍然一屏）----
   宽度分档管布局、高度分档管压缩 —— 两套正交，别混在一个 media 里。
   阈值取 960 而不是 860：实测 1440x900 会溢出 53px（hero 气泡位 + 今日完成进度条把 row1 抬高），
   夹在 860 阈值之外吃不到任何压缩。压缩出来的余量会被 .hm-dash / .hm-row1 的 flex:1 自动分摊回卡片高度。 */
@media (max-height:960px) and (min-width:821px){
  body[data-tone="mirror"] .app-layout > .main{padding:10px 20px 8px}
  body[data-tone="mirror"] .v12-foot{padding:6px 0 2px}
  .hm-dash{gap:11px}
  .hm-dash .hm-row1{min-height:186px}
  .hm-dash .hm-learn{min-height:150px}
  .hm-hero{padding:16px 20px;min-height:186px}
  .hm-hero .ring,.hm-hero .ring svg{width:88px;height:88px}
  .hm-hero .ring .val{top:24px;font-size:22px}
  .hm-hero .ring .cap{top:52px;font-size:9.5px}
  .hm-hero h1{font-size:25px;margin-bottom:5px}
  .hm-hero .hero-copy{padding-left:112px}
  .hm-hero .hero-mascot{width:104px;height:104px}
  .hm-hero .hero-glow{width:120px;height:120px}
  .hm-hero .hero-greet{left:108px;padding:6px 10px 7px}
  .hm-hero .hg-txt{font-size:11.5px}
  .hm-hero .hero-finish{margin-top:9px}
  .hm-hero .hero-finish-bar{margin:5px 0 3px}
  .hm-today{padding:12px 14px 11px}
  .hm-today .checks{gap:7px}
  .hm-mc{padding:11px 13px 10px}
  .hm-mc .card-title{margin-bottom:8px}
  .hm-mc .mc-rows{gap:6px}
  .hm-dash .today-list li{padding:11px 12px 10px}
  /* [2026-09-20] 矮屏字型已整体压小 → 正方形边长同步下调（够放五项内容即可，不浪费纵向空间）*/
  .hm-dash .today-list{--hm-sq:176px}
  .hm-dash .today-list .fs-ic{font-size:20px;margin-bottom:6px}
  .hm-dash .today-list h3{font-size:13px}
  .hm-dash .today-list .fs-sub{font-size:9.5px}
  .hm-dash .today-list .fs-btn{margin-top:auto}
  .hm-dash .hm-cta{padding:13px 15px}
  .hm-dash .hm-cta .cta-hint{margin:6px 0 10px}
  .foot-box{padding:10px 13px}
  .fb-week .fb-bars{height:48px}
}

/* ---- 矮屏二次压缩（≤850：1080p 以下的窄高比本，再挤一档）---- */
@media (max-height:850px) and (min-width:821px){
  body[data-tone="mirror"] .app-layout > .main{padding:8px 18px 6px}
  .hm-dash{gap:9px}
  .hm-hero{padding:14px 18px;min-height:170px}
  .hm-hero .hero-copy{padding-left:104px}
  .hm-hero .hero-mascot{width:96px;height:96px}
  .hm-hero .hero-glow{width:112px;height:112px}
  .hm-hero .hero-greet{left:100px}
  .hm-hero h1{font-size:23px;margin-bottom:4px}
  .hm-hero p{font-size:12px}
  .hm-hero .ring,.hm-hero .ring svg{width:80px;height:80px}
  .hm-hero .ring .val{top:21px;font-size:20px}
  .hm-hero .ring .cap{top:47px;font-size:9px}
  .hm-hero .hero-finish{margin-top:7px}
  .hm-hero .hero-finish-bar{margin:4px 0 3px;height:5px}
  .hm-today{padding:11px 13px 10px}
  .hm-today .checks{gap:6px}
  .hm-today .today-checkin{margin-top:7px;padding:7px 10px}
  .hm-mc{padding:10px 12px 9px}
  .hm-mc .card-title{margin-bottom:7px}
  .hm-mc .mc-rows{gap:5px}
  .hm-dash .learn-box{padding:12px 14px 13px}
  .hm-dash .learn-hd{margin-bottom:9px}
  .hm-dash .today-list li{padding:10px 11px 9px}
  /* [2026-09-20] 二次压缩档：字型再小一档 → 正方形边长再降一档 */
  .hm-dash .today-list{--hm-sq:162px}
  .hm-dash .today-list .fs-ic{font-size:16px;margin-bottom:5px}
  .hm-dash .today-list h3{font-size:12.5px}
  .hm-dash .today-list .fs-sub{font-size:9px;margin-bottom:3px}
  .hm-dash .today-list .fs-desc{font-size:12px;margin-bottom:8px}
  .hm-dash .today-list .fs-btn{margin-top:auto}
  .hm-dash .hm-cta{padding:12px 14px}
  .hm-dash .hm-cta .cta-hint{margin:5px 0 9px;font-size:10.5px}
  .foot-box{padding:9px 12px}
  .fb-week .fb-bars{height:40px}
}

/* ============================================================================
 * [2026-09-18] 学习地图 · 全站统一三栏外壳（左 AI 伴学栏 + 中业务区 + 右学习看板）
 * 架构：左 290px AI 栏（贴浏览器左边）｜ 中 业务区 ｜ 右 学习看板（窄屏隐藏）。
 * [2026-09-19 全站统一UI规范（方案2细化）] 本页做页面级令牌注入（仅 .myquest-shell 作用域）：
 *   文字层级 #221838/#4A3B6B/#665E85/#998FB8、主紫 #7F4AE0、次浅紫 #F0EBFF、
 *   纯白顶栏 + #EEEEEE 底分割线、AI气泡 #F0EBFF / 用户气泡 #7F4AE0。
 * 红线：AI 面板配色只在**本页作用域**覆盖 --asp-* 令牌；组件「内部不写死色值、只读令牌」原则不变，
 *   其它复用页（错题本/随堂充电/找坑修复/闯关进阶）一律沿用组件默认令牌，不受本页影响。
 *   移除右下角全局悬浮公仔（消除双 IP 冲突），仅保留左栏小伴；离开本页自动恢复。
 * ========================================================================== */
/* 全局唯一「录入新错题」入口（顶栏右侧 · 品牌紫主按钮） */
.nav-eb-btn{
  flex:none;
  display:inline-flex;align-items:center;gap:6px;
  background:#7F4AE0;color:#fff;border:0;border-radius:8px;
  padding:7px 14px;font-size:13px;font-weight:700;font-family:inherit;
  cursor:pointer;white-space:nowrap;
  box-shadow:0 4px 14px -6px rgba(127,74,224,.6);
  transition:transform .12s ease, filter .15s ease;
}
.nav-eb-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.nav-eb-btn:active{transform:translateY(0)}


/* 全站统一三栏布局的页面：左栏贴浏览器左边（中和 .main 的居中/左边距规则） */
@media (min-width:781px){
  body:has(.myquest-shell) .main{
    margin-left:0 !important;
    margin-right:0 !important;
    max-width:none !important;
    width:100% !important;
    padding-left:0 !important;
    padding-right:0 !important;
    padding-top:0 !important;
    padding-bottom:80px !important;
  }
  body:has(.myquest-shell) .main > .myquest-shell{
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
}
/* 移除右下角全局悬浮公仔（双 IP 冲突），仅保留左栏小伴；离开本页自动恢复 */
body:has(.myquest-shell) #mascotV5Wrap, body:has(.myquest-shell) #xbGreet{display:none!important}

/* [2026-09-19 P0/规范] 学习地图页顶栏：压缩到 56px、纯白#FFFFFF 底 + #EEEEEE 底分割线
   （全站统一UI规范；仅本页作用域，不碰全局顶栏） */
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .top-nav{
  background:#FFFFFF;color:#221838;
  box-shadow:0 1px 0 #EEEEEE;
}
body:has(.myquest-shell) .app-top-nav .top-nav-row{
  padding:9px 24px!important;min-height:64px!important;
}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .brand .brand-txt b{color:#221838}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .brand .brand-txt span{color:#998FB8}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .status-pill{color:#4A3B6B;background:#F0EBFF;border:1px solid #E4DAFB}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .status-pill .dot{background:#7F4AE0;box-shadow:0 0 6px rgba(127,74,224,.5)}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .theme-btn{background:#F0EBFF;border:1px solid #E4DAFB;color:#4A3B6B}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav > a{color:#665E85}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav > a:hover{background:#F0EBFF;color:#221838;transform:translateY(-1px)}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav > a.on{
  background:transparent;color:#7F4AE0;font-weight:700;box-shadow:none;border-radius:0;position:relative;
}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav > a.on::before{display:none}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav > a.on::after{
  content:'';position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:#7F4AE0;
}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav .nav-toggle{color:#665E85}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav .nav-toggle:hover{background:#F0EBFF;color:#221838}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav .nav-toggle.open,
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav .nav-toggle.on{
  background:transparent;color:#7F4AE0;box-shadow:none;
}
/* 当前分组含激活子项时，父级 tab 也高亮（紫字 + 下划线） */
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle{
  color:#7F4AE0;font-weight:700;position:relative;
}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle::after{
  content:'';position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:#7F4AE0;
}

/* [更多按钮浅色档] 按钮在 <nav> 外，吃不到 .menu-nav 的浅色覆写 —— 白字落白底事故修复 */
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .nav-more-btn{color:#665E85}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .nav-more-btn:hover{background:#F0EBFF;color:#221838}
html:not([data-theme="dark"]) body:has(.myquest-shell) .app-top-nav .menu-nav .nav-toggle .nt-ar{color:#7F4AE0}

/* 响应式：右看板在 <1100px 收起；<900px 双栏改为上下堆叠 */
@media (max-width:1100px){
  .myquest-shell > .mq-board{display:none}
}
@media (max-width:900px){
  .myquest-shell{flex-direction:column}
  .myquest-shell > .mq-ai{position:static;width:100%;flex:none;height:auto;max-height:62vh}
  .myquest-shell > .mq-ai .ai-side-panel{height:62vh}
  .myquest-shell > .mq-main{padding-left:0;padding-right:0;margin-top:14px}
}

/* ============================================================================
 * [2026-09-19] 学习地图 · 深色主题「暗但清晰」层级（按用户实测反馈落地）
 *   从底层到上层：页底 #151229 → 标题区 #1A1635 → 侧栏容器 #221C3D
 *                 → 数据卡/业务卡 #2D2748 → 按钮 #8F5AF0 亮紫 / #E07B3A 橙
 *   主文字 #FFFFFF · 辅助 #B8AEE0 · 更弱 #8579B3 · 描边/分隔 #3A3164 / #5B4EA6
 *   容器底色由 [data-theme="dark"] .myquest-shell 的 --mq-*-bg 令牌给出，此处补细节。
 * ========================================================================== */
/* [R43 2026-09-28] 按科目切换条：练一练 / 学习地图共用 */
html:not([data-theme="dark"]) .myquest-shell .mq-subj-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 4px}
html:not([data-theme="dark"]) .myquest-shell .mq-subj-tab{font:inherit;font-size:13px;padding:0 16px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid var(--line,#e7eaf2);background:var(--card,#fff);color:var(--muted,#6b7080);cursor:pointer;transition:.15s;white-space:nowrap}
html:not([data-theme="dark"]) .myquest-shell .mq-subj-tab:hover{border-color:rgba(109,94,252,.5);color:var(--ink,#1f2430)}
html:not([data-theme="dark"]) .myquest-shell .mq-subj-tab.on{background:linear-gradient(135deg,#6D5EFC,#28C2C8);border-color:transparent;color:#fff;font-weight:600;box-shadow:0 6px 16px -8px rgba(109,94,252,.6)}
[data-theme="dark"] .myquest-shell .mq-subj-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 4px}
[data-theme="dark"] .myquest-shell .mq-subj-tab{font:inherit;font-size:13px;padding:0 16px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid #3A3164;background:#2D2748;color:#B8AEE0;cursor:pointer;transition:.15s;white-space:nowrap}
[data-theme="dark"] .myquest-shell .mq-subj-tab:hover{border-color:#8F5AF0;color:#FFFFFF}
[data-theme="dark"] .myquest-shell .mq-subj-tab.on{background:linear-gradient(135deg,#7A55E8,#28C2C8);border-color:transparent;color:#fff;font-weight:600;box-shadow:0 6px 16px -8px rgba(143,90,240,.6)}

[data-theme="dark"] .myquest-shell > .mq-ai .ai-side-panel{
  --asp-bg:#221C3D;--asp-surface:#2A2348;--asp-surface-2:#332C52;
  --asp-line:#3A3164;--asp-track:#3A3164;
  /* [2026-09-19] #8F5AF0 压白字只有 3.27:1 → 填充紫压深一档（4.86:1）；文字/图标亮紫走组件 --asp-brand-ink */
  --asp-brand-solid:#7A55E8;--asp-ink:#FFFFFF;--asp-muted:#B8AEE0;
}
[data-theme="dark"] .myquest-shell > .mq-ai .ai-side-panel .asp-tagline{color:#B8AEE0}
[data-theme="dark"] .myquest-shell > .mq-ai .ai-side-panel .asp-msg--xb{background:#2A2348;border:1px solid #3A3164}
[data-theme="dark"] .myquest-shell > .mq-ai .ai-side-panel .asp-split{background:#2A2348}
[data-theme="dark"] .myquest-shell > .mq-ai .ai-side-panel .asp-scene{background:#2A2348;border-color:#3A3164}
[data-theme="dark"] .myquest-shell > .mq-ai .ai-side-panel .asp-voice[disabled]{background:#3A3164;border-color:#3A3164}
/* —— 面板收起时的唤起手柄 .asp-recall：它是 .ai-side-panel 的**兄弟**节点（挂在内层挂载点），
   而深色 --asp-* 令牌全都设在 .ai-side-panel 自身上 → 兄弟节点拿不到、回退浅色字面量
   (#F9F7FF/#EFEAF8)，深色页会冒出一枚浅色小方块。此处按外壳作用域单独补齐。
   （组件级同名缺陷在 ai-side-panel.css，属并行线在途 WIP，不在本批范围。） */
[data-theme="dark"] .myquest-shell > .mq-ai > .asp-recall{
  background:#221C3D;border-color:#3A3164;color:#C9B6FF;
  box-shadow:0 6px 18px rgba(0,0,0,.45);
}
[data-theme="dark"] .myquest-shell > .mq-ai > .asp-recall:hover{
  background:#2A2348;color:#FFFFFF;box-shadow:0 8px 22px rgba(143,90,240,.35);
}
[data-theme="dark"] .myquest-shell > .mq-ai > .asp-recall:focus-visible{outline:2px solid #8F5AF0}
/* —— 顶栏：本页浅色走规范「纯白 + #EEEEEE」，深色走 #1A1635（与标题区同层）+ #443A7A 底分割线。
   不沿用品牌紫实色顶栏 #8B6FE8 —— 它会在深色页成为全页最亮元素，压过用户要求的
   「按钮最亮」，破坏 暗但清晰 的层级顺序。 */
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .top-nav{
  background:#1A1635;color:#FFFFFF;
  box-shadow:0 1px 0 #443A7A;
}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .brand .brand-txt b{color:#FFFFFF}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .brand .brand-txt span{color:#8579B3}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .status-pill{color:#B8AEE0;background:rgba(143,90,240,.16);border:1px solid rgba(143,90,240,.34)}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .status-pill .dot{background:#8F5AF0;box-shadow:0 0 6px rgba(143,90,240,.60)}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .theme-btn{background:rgba(143,90,240,.16);border:1px solid rgba(143,90,240,.34);color:#B8AEE0}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav > a{color:#B8AEE0}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav > a:hover{background:rgba(143,90,240,.18);color:#FFFFFF;transform:translateY(-1px)}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav > a.on{
  background:transparent;color:#C9B6FF;font-weight:700;box-shadow:none;border-radius:0;position:relative;
}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav > a.on::before{display:none}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav > a.on::after{
  content:'';position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:#8F5AF0;
}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav .nav-toggle{color:#B8AEE0}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(143,90,240,.18);color:#FFFFFF}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav .nav-toggle.open,
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav .nav-toggle.on{background:transparent;color:#C9B6FF;box-shadow:none}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle{color:#C9B6FF;font-weight:700;position:relative}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle::after{
  content:'';position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:#8F5AF0;
}
[data-theme="dark"] body:has(.myquest-shell) .app-top-nav .menu-nav .nav-toggle .nt-ar{color:#8F5AF0}
/* 顶栏唯一入口「录入新错题」：深色下用亮紫主按钮 */
[data-theme="dark"] .nav-eb-btn{background:#8F5AF0;box-shadow:0 4px 14px -6px rgba(143,90,240,.70)}
/* —— 标题区：背景 #1A1635（次深）+ 底部 1px #443A7A 分隔线 + 与卡片间距 24px —— */
[data-theme="dark"] .myquest-shell .page-head{margin-bottom:24px}
[data-theme="dark"] .myquest-shell .page-head.tone-map{
  background:
    radial-gradient(62% 126% at 97% 42%,rgba(143,90,240,.20),transparent 64%),
    radial-gradient(72% 124% at 0% 108%,rgba(40,194,200,.12),transparent 60%),
    linear-gradient(118deg,#1A1635 0%,#181430 100%);
  border:1px solid #2E2752;
  border-bottom:1px solid #443A7A;
  box-shadow:0 12px 30px -18px rgba(0,0,0,.65);
}
[data-theme="dark"] .myquest-shell .page-head.tone-map::before{
  background:repeating-radial-gradient(circle at 98% 46%,transparent 0 20px,rgba(143,90,240,.20) 20px 21.4px);
}
[data-theme="dark"] .myquest-shell .page-head.tone-map .redtag{background:rgba(143,90,240,.16);color:#C9B6FF;border-color:rgba(143,90,240,.38)}
[data-theme="dark"] .myquest-shell .page-head.tone-map .ph-hero{
  background:radial-gradient(circle at 32% 26%,#332A5C,#221C3D);
  box-shadow:0 10px 26px rgba(0,0,0,.45),inset 0 0 0 1px rgba(143,90,240,.34),0 0 0 8px rgba(143,90,240,.06);
  color:#B8AEE0;
}
/* —— 按钮三档（用户指定）：未检测=亮紫 / 已掌握=深灰紫+浅紫字 / 薄弱=橙 —— */
[data-theme="dark"] .myquest-shell .btn.sm.pri,
[data-theme="dark"] .myquest-shell .btn.pri{
  background:#8F5AF0;color:#FFFFFF;border-color:#8F5AF0;
  box-shadow:0 6px 18px -8px rgba(143,90,240,.75);
}
[data-theme="dark"] .myquest-shell .btn.sm.pri:hover,
[data-theme="dark"] .myquest-shell .btn.pri:hover{background:#9E6BFF;border-color:#9E6BFF;filter:none}
[data-theme="dark"] .myquest-shell .btn.sm.warn{background:#E07B3A;color:#FFFFFF;border-color:#E07B3A}
[data-theme="dark"] .myquest-shell .btn.sm.warn:hover{background:#EE8A47;border-color:#EE8A47;filter:none}
[data-theme="dark"] .myquest-shell .btn.sm[disabled]{background:#3F3663;color:#B8AEE0;border:1px solid #4A4070;opacity:1}
[data-theme="dark"] .myquest-shell .btn.sm.ghost{background:transparent;border:1px solid #5B4EA6;color:#B8AEE0}
[data-theme="dark"] .myquest-shell .btn.sm.ghost:hover{background:rgba(143,90,240,.18);border-color:#8F5AF0;color:#FFFFFF}
/* —— 主 CTA / 学科 chip / 状态徽标 —— */
[data-theme="dark"] .myquest-shell .stk-hero{background:linear-gradient(135deg,rgba(143,90,240,.18),rgba(40,194,200,.10));border-color:rgba(143,90,240,.40)}
[data-theme="dark"] .myquest-shell .stk-hero-title b{color:#C9B6FF}
[data-theme="dark"] .myquest-shell .stk-chip{background:#332C52;color:#B8AEE0}
[data-theme="dark"] .myquest-shell .stk-chip b{color:#C9B6FF}
[data-theme="dark"] .myquest-shell .stk-badge.done{color:#5AE0A0;background:rgba(52,199,123,.16)}
[data-theme="dark"] .myquest-shell .stk-badge.due{color:#F0A868;background:rgba(224,123,58,.18)}
[data-theme="dark"] .myquest-shell .stk-badge.wait{color:#B8AEE0;background:#332C52}
[data-theme="dark"] .myquest-shell .mq-kp-dot.idle{background:#8579B3}
[data-theme="dark"] .myquest-shell .mq-kp-dot.weak{background:#E07B3A}
[data-theme="dark"] .myquest-shell .mq-board-item .dot.due{background:#E07B3A}
[data-theme="dark"] .myquest-shell .mq-board-item .dot.weak{background:#F2839F}
/* —— 前置基础卡（规范：卡底 #2D2748 / 标题白 / 正文 #B8AEE0 / 每项间 1px #3A3164 分隔） —— */
[data-theme="dark"] .myquest-shell .prereq-pending{background:#2D2748;border:1px solid #5B4EA6;border-radius:16px}
[data-theme="dark"] .myquest-shell .prereq-pending .pp-kicker{color:#FFFFFF;background:rgba(224,123,58,.22);border-color:rgba(224,123,58,.48)}
[data-theme="dark"] .myquest-shell .prereq-pending .pp-sub,
[data-theme="dark"] .myquest-shell .prereq-pending .pp-note{color:#B8AEE0}
[data-theme="dark"] .myquest-shell .prereq-pending .pp-list{gap:0}
[data-theme="dark"] .myquest-shell .prereq-pending .pp-item{
  --kp-bg:transparent!important;--kp-color:#B8AEE0!important;
  background:transparent;border:0;border-left:3px solid #E07B3A;border-radius:0;
  padding:10px 8px 10px 12px;
}
[data-theme="dark"] .myquest-shell .prereq-pending .pp-item + .pp-item{border-top:1px solid #3A3164}
[data-theme="dark"] .myquest-shell .prereq-pending .gx-kp-name{color:#FFFFFF}
[data-theme="dark"] .myquest-shell .prereq-pending .gx-kp-ic{background:rgba(224,123,58,.16);border-color:rgba(224,123,58,.42);color:#E07B3A}
[data-theme="dark"] .myquest-shell .prereq-pending .gx-kp-cta{color:#FFFFFF;background:#8F5AF0;border-color:#8F5AF0}
[data-theme="dark"] .myquest-shell .prereq-pending .gx-kp-cta:hover{background:#9E6BFF;box-shadow:0 4px 12px -4px rgba(143,90,240,.60)}
/* —— 学科闯关路径（.mq-subj / .arc-*）：样式真源在 page.css，卡片壳走 var(--card)/var(--line)
   已随令牌变暗，但里面仍有一批**硬编码浅色**（白节点、浅绿 chip、深绿百分比、深紫链接），
   在深底上不是刺眼就是看不清 → 一并在本页深色作用域内覆盖。 —— */
[data-theme="dark"] .myquest-shell .arc-stage{background:#2D2748;border-color:#3A3164}
[data-theme="dark"] .myquest-shell .arc-stage.stage-locked{background:linear-gradient(0deg,#282242,#241E3C)}
[data-theme="dark"] .myquest-shell .arc-stage-pct{color:#5AE0A0}
[data-theme="dark"] .myquest-shell .arc-node{background:#332C52;border-color:#5B4EA6;color:#FFFFFF}
[data-theme="dark"] .myquest-shell .arc-node.new{background:linear-gradient(135deg,#332C52,#2D2748)}
[data-theme="dark"] .myquest-shell .arc-node:hover{border-color:#8F5AF0;box-shadow:0 10px 22px -12px rgba(143,90,240,.60)}
[data-theme="dark"] .myquest-shell .arc-node .arc-dot{background:#8579B3}
[data-theme="dark"] .myquest-shell .arc-node .arc-node-state{color:#C9B6FF;background:rgba(143,90,240,.20)}
[data-theme="dark"] .myquest-shell .arc-node.learned .arc-node-state{color:#8AB6FF;background:rgba(59,130,246,.20)}
[data-theme="dark"] .myquest-shell .arc-node.done .arc-node-state{color:#5AE0A0;background:rgba(52,199,123,.16)}
[data-theme="dark"] .myquest-shell .arc-stage-ic,
[data-theme="dark"] .myquest-shell .mq-subj-ic{border-color:rgba(143,90,240,.30)}
[data-theme="dark"] .myquest-shell .arc-locked-hint{background:#221C3D;border-color:#3A3164;color:#B8AEE0}
[data-theme="dark"] .myquest-shell .mq-subj{background:#2D2748;border-color:#3A3164}
[data-theme="dark"] .myquest-shell .mq-subj-chip{background:rgba(143,90,240,.20);color:#C9B6FF}
[data-theme="dark"] .myquest-shell .mq-subj-chip.on{background:rgba(52,199,123,.16);color:#5AE0A0}
[data-theme="dark"] .myquest-shell .mq-subj-chip.grey{background:#332C52;color:#B8AEE0}
[data-theme="dark"] .myquest-shell .mq-subj-go{color:#C9B6FF}
[data-theme="dark"] .myquest-shell .mq-empty-note{background:rgba(224,123,58,.14);border-color:rgba(224,123,58,.40);color:#F0B27A}
[data-theme="dark"] .myquest-shell .mq-empty-note a{color:#FFC38A}
/* 「其余 N 个科目」折叠条：app.js 里写的是内联 background:#fff / color:#5b53d6，
   内联样式优先于样式表 → 这里必须 !important；同时 app.js 已改为读令牌（双保险）。 */
[data-theme="dark"] .myquest-shell .mq-more > summary{
  background:#2D2748!important;color:#C9B6FF!important;border-color:#5B4EA6!important;
}
[data-theme="dark"] .myquest-shell .mq-more > summary span[style]{color:#8579B3!important}

/* —— P1：学习地图知识点卡片状态点 + 按钮态 —— */
.mq-kp-dot{
  flex:0 0 auto;width:9px;height:9px;border-radius:50%;
  display:inline-block;margin-right:6px;vertical-align:middle;
}
.mq-kp-dot.idle{ background:#B9B2C8; }   /* 未检测（灰） */
.mq-kp-dot.ok{ background:#34C77B; }      /* 已掌握（绿） */
.mq-kp-dot.weak{ background:#D9357A; }    /* 薄弱/今天该复习（橙红） */
.btn.sm.warn{
  background:#FFF1E2;color:#C9760E;border:1px solid #F2D2AE;
  font-weight:700;cursor:pointer;font-family:inherit;
}
.btn.sm.warn:hover{filter:brightness(1.03);border-color:#C9760E}
.btn.sm[disabled]{ opacity:.55;cursor:default;background:var(--surface-2,#FBEFF4);color:var(--muted,#6f6880);border:1px solid var(--hair,rgba(40,30,38,.08)) }

/* —— P1：标题涟漪光感（仅作用域，不侵入全局 page-h1） —— */
.myquest-shell .page-h1{
  position:relative;
  background:linear-gradient(100deg,var(--ink,rgba(40,30,38,.95)) 40%,var(--accent,#D9357A) 50%,var(--ink,rgba(40,30,38,.95)) 60%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  animation:mqTitleShimmer 5.5s ease-in-out infinite;
}
.myquest-shell .page-h1.mq-title-active{animation-duration:2.6s}
@keyframes mqTitleShimmer{
  0%,100%{background-position:140% 0}
  50%{background-position:-40% 0}
}
@media (prefers-reduced-motion: reduce){
  .myquest-shell .page-h1{animation:none;background:none;-webkit-text-fill-color:var(--ink);color:var(--ink)}
}
/* [批103d] 深底页头豁免浅底扫光：tone-door 页头是「深紫底 + 白字」，上面那条
   background-clip:text 会把字填成 var(--ink)（浅主题=#221838 深色），
   深底上整条标题只剩中间一道紫光 —— 真机实证「知识开门」四个字几乎不可见。
   [批103e] tone-door 已有浅色版（见上方母题块）：这条强制白字只在深色主题下成立，
   浅色主题交给上面那条 `html:not([data-theme="dark"]) .myquest-shell …` 的墨字分支
   （它多一个 html:not([…]) 选择器，特异性更高，能压过这里的 text-fill-color:#fff）。 */
.myquest-shell .page-head.tone-door .page-h1{
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  -webkit-text-fill-color:#fff;color:#fff;animation:none;
}

/* [2026-09-18] 录入新错题 · 原地唤起「知识开门」紧凑深色面板（不跳页） */
.eb-capture-overlay{
  position:fixed;inset:0;z-index:200;
  display:none;align-items:center;justify-content:center;
  background:rgba(20,16,40,.62);
  padding:24px;
}
.eb-capture-modal{
  width:min(560px, 94vw);
  height:min(78vh, 720px);
  display:flex;flex-direction:column;
  background:#1B1633;border-radius:16px;overflow:hidden;
  box-shadow:0 30px 80px -20px rgba(10,6,30,.7);
  border:1px solid rgba(127,74,224,.35);
}
.eb-capture-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;
  background:linear-gradient(135deg,#7F4AE0,#28C2C8);color:#fff;
  font-size:14px;font-weight:700;flex:none;
}
.eb-capture-x{
  border:0;background:rgba(255,255,255,.18);color:#fff;
  border-radius:8px;width:30px;height:30px;font-size:15px;cursor:pointer;line-height:1;
}
.eb-capture-x:hover{background:rgba(255,255,255,.3)}
.eb-capture-iframe{flex:1 1 auto;width:100%;border:0;background:#fff}

/* ============================================================================
 * [2026-09-19 全站统一UI规范（方案2最终细化）] 思维健身房 #/screen · 豆包爱学式**全屏对话**
 * 架构（**全站唯一特例**）：① 顶部导航（56px）→ ② 会话头部 → ③ 全屏对话画布（唯一滚动区）
 *                      → ④ 底部固定输入区（快捷按钮在上 / 输入行在下 / 语音开关在输入框右侧）。
 * **不挂** 全局 290px AI 公共侧边栏（web/common/ai-side-panel/）、**不渲染**右侧看板、
 * **不要** 顶部一排数据大卡片。其它页（错题本 / 学习地图 / 随堂充电 / 闯关进阶 / 知识开门）
 * 严格执行原双栏·三栏 + 复用左侧 AI 公共组件，本页作用域一律限定 .gym-page / body:has(.gym-page)。
 * 复用范围：只复用组件样式表的**类名**（asp-input / asp-mic / asp-send / asp-chip）+ 本页注入 --asp-* 令牌，
 *   不挂载组件实例 → 本页与左栏 AI 组件零耦合；会话键也各走一套（本页 czs_screen_state_v1，
 *   左栏 czs_ai_session_*）→ 两套历史互不继承、互不污染（页面级会话隔离）。
 * 双主题：**布局完全不变**，只换色值（暗色 =「暗但清晰」层级：页底 #151229 → 头部/输入区 #1A1635
 *   → 气泡卡 #2D2748；主文字 #FFFFFF / 辅助 #B8AEE0 / 描边 #3A3164；填充紫 #7A55E8 / 文字紫 #C9B6FF）。
 * 备注 顶栏（56px 纯白 + #EEEEEE 底分割线）本页与学习地图页各有一份页面级规则，
 *   后续若要收敛，应统一提升为一条全局顶栏规则（单处维护）。
 * ========================================================================== */
/* ---------- 一、布局（主题无关）：高度锁视口，画布是唯一滚动区 ---------- */
.gym-page{
  --gym-top:58px;
  /* 对话内容列（对标豆包爱学：内容居中受约束，不做全宽拉伸）。
     --gym-gutter = max(最小留白, 自动居中留白)：容器宽于 --gym-col 时自动居中，
     窄于时退化为最小留白。head / canvas / composer 三者共用
     → 标题、气泡、输入框落在同一条视觉列上。 */
  --gym-col:880px;
  --gym-col-pad:28px;
  --gym-gutter:max(var(--gym-col-pad), calc((100% - var(--gym-col)) / 2));
  --gym-sb:8px;               /* 画布纵向滚动条宽度：须与 .gym-canvas::-webkit-scrollbar 实际宽度一致 */
  --gym-ink:#221838;          /* 正文 */
  --gym-ink-2:#4A3B6B;        /* 次级正文 */
  --gym-muted:#665E85;        /* 辅助文字（小号元信息 / 占位符） */
  --gym-brand:#7F4AE0;        /* 品牌文字·图标·描边 */
  --gym-brand-fill:#7F4AE0;   /* 品牌填充（压白字） */
  --gym-brand-soft:#F0EBFF;   /* 次浅紫底（规范：次按钮 / AI 气泡） */
  --gym-brand-line:#E4DAFB;
  --gym-line:#EAE4F6;
  --gym-surface:#FFFFFF;
  --gym-bg:#FCFAFF;
  display:flex;
  flex-direction:column;
  height:calc(100vh - var(--gym-top,58px));
  min-height:420px;
  background:var(--gym-bg);
  color:var(--gym-ink);
  overflow:hidden;
}
/* ② 会话头部：标题 + 描述 + 轻量主题标签 + 右上角元信息小字 */
/* [2026-09-22 PM 顶栏] 原三行（标题 / 副名 / 主题条）升顶栏后，此处只剩引导语 + 元信息一行 ⇒ 收紧纵向留白 */
.gym-head{flex:0 0 auto;padding:10px var(--gym-gutter);background:var(--gym-surface);border-bottom:1px solid var(--gym-line)}
.gym-head-row{display:flex;align-items:center;gap:16px}
.gym-head-main{flex:1 1 auto;min-width:0}
.gym-h1{margin:0;font-size:21px;line-height:1.3;font-weight:800;letter-spacing:.2px;color:var(--gym-ink)}
.gym-sub{margin:6px 0 0;font-size:13px;line-height:1.6;color:var(--gym-muted)}
.gym-desc{margin:0;flex:1 1 auto;min-width:0;padding:8px 12px;border-radius:10px;background:rgba(127,74,224,.07);border:1px solid rgba(127,74,224,.12);font-size:13px;line-height:1.7;color:var(--gym-muted)}
.gym-lec-card{margin:14px 0 2px;border-radius:18px;border:1px solid rgba(109,94,252,.20);background:linear-gradient(180deg,rgba(109,94,252,.055),rgba(40,194,200,.030));box-shadow:0 10px 30px rgba(80,70,160,.10)}
.gym-lec-head{display:flex;align-items:center;gap:8px;padding:9px 13px;border-radius:17px 17px 0 0;background:linear-gradient(90deg,rgba(109,94,252,.13),rgba(40,194,200,.10));border-bottom:1px solid rgba(109,94,252,.14)}
.gym-lec-card.is-collapsed .gym-lec-head{border-bottom:none;border-radius:17px}
.gym-lec-kicker{flex:0 0 auto;font-size:12.5px;font-weight:700;color:#6D5EFC;letter-spacing:.2px}
.gym-lec-title{flex:1 1 auto;min-width:0;font-size:13.5px;font-weight:600;color:#2A2B45;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gym-lec-meta{flex:0 0 auto;font-size:12px;color:#8A8AA3}
.gym-lec-toggle{flex:0 0 auto;font-size:12px;color:#6D5EFC;background:rgba(109,94,252,.09);border:1px solid rgba(109,94,252,.20);border-radius:999px;padding:3px 11px;cursor:pointer}
.gym-lec-toggle:hover{background:rgba(109,94,252,.16)}
.gym-lec-body{padding:12px 13px 14px}
.gym-lec-card.is-collapsed .gym-lec-body{display:none}
/* 元信息（会话轮数｜专注时长｜素养积分）= 右上角**小号辅助文字**；规范禁止大卡片 */
.gym-meta{flex:0 0 auto;display:flex;align-items:center;gap:6px;padding-top:0;font-size:12px;line-height:1.5;color:var(--gym-muted);white-space:nowrap}
.gym-meta b{color:var(--gym-brand);font-weight:700}
.gym-meta i{font-style:normal;color:var(--gym-line)}
/* [2026-09-25 #216] 思伴聊屋·今日任务摘要：有可去目标才给可点的手感，空态保持纯文本。
   注意：此处不是 <button>，不受 page.css:58 那条 button:hover 背景刷深的影响。 */
.gym-today.is-click{cursor:pointer;border-bottom:1px dashed var(--gym-line)}
.gym-today.is-click:hover{border-bottom-color:var(--gym-brand);color:var(--gym-brand)}
/* [2026-09-25 #219] 思伴聊屋·今日学习计划卡（与首页 row3 同推导，见 app.js _gymPlanCardHtml）。
   ⚠ 卡内可点元素一律是 <a> 而不是 <button> —— page.css:58 那条全局 button:hover 会把它刷成深紫，
   且本卡在 .gym-canvas 里，desktop.css 先加载，故 hover 必须自己接管。 */
.gp-hd{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.gp-hd .card-title{font-size:13.5px;font-weight:700}
.gp-snap{flex:0 0 auto;font-size:12px;color:var(--gym-muted);white-space:nowrap}
.gp-say{margin:6px 0 0;font-size:13px;line-height:1.7;color:var(--gym-ink)}
.gp-sts{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.gp-st{flex:1 1 0;min-width:92px;display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  padding:8px 10px;border-radius:11px;text-decoration:none;
  border:1px solid var(--gym-brand-line);background:var(--gym-brand-soft);color:var(--gym-brand)}
.gp-st b{font-size:13px;font-weight:700}
.gp-st span{font-size:12px;opacity:.85}
.gp-st:hover{background:var(--gym-brand);color:#fff;border-color:var(--gym-brand)}
.gp-st:hover span{opacity:.92}
/* 主题切换 = 一排轻量标签（原「主题框」大块已废弃） */
.gym-topic-row{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.gym-topic-label{font-size:12px;color:var(--gym-muted);white-space:nowrap}
.gym-topic-input{flex:0 1 168px;min-width:116px;height:30px;padding:0 10px;border:1px solid var(--gym-line);border-radius:8px;background:var(--gym-surface);color:var(--gym-ink);font-size:12.5px;font-family:inherit}
.gym-topic-input:focus{outline:none;border-color:var(--gym-brand);box-shadow:0 0 0 3px rgba(127,74,224,.14)}
.gym-topic-btn{height:30px;padding:0 12px;border-radius:8px;cursor:pointer;background:var(--gym-brand-soft);color:var(--gym-brand);border:1px solid var(--gym-brand-line);font-size:12.5px;font-weight:700;font-family:inherit}
/* 🔴 本按钮旧 hover {background:#E7DDFF}（比底色再压一档紫）却沿用品牌紫字 ⇒ 实测 4.09:1，
   低于 WCAG AA 4.5。它是主题行的**动作按钮**（同行 .gym-topic-chip 是被动建议标签），
   故与「发送」同语言：hover 走填充紫压白字。 */
.gym-topic-btn:hover,
.gym-topic-btn:active{
  background:var(--gym-brand-fill);color:#FFFFFF;border-color:var(--gym-brand-fill);
}
.gym-topic-chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.gym-topic-chip{height:26px;padding:0 10px;border-radius:999px;cursor:pointer;background:transparent;color:var(--gym-muted);border:1px solid var(--gym-line);font-size:12px;font-family:inherit}
.gym-topic-chip:hover{background:var(--gym-brand-soft);color:var(--gym-brand);border-color:var(--gym-brand-line)}
.gym-topic-chip.is-on{background:var(--gym-brand-soft);color:var(--gym-brand);border-color:#D9C9F7;font-weight:700}
/* ③ 全屏对话画布（唯一滚动区） */
.gym-canvas{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;overscroll-behavior:contain;padding:20px calc(var(--gym-gutter) - var(--gym-sb)) 28px var(--gym-gutter);display:flex;flex-direction:column;gap:12px}
/* 🔴 scrollbar-gutter:stable 消「滚动条出现/消失」的横向抖动，但滚动条槽是从**内容盒右端**
   切走的（实测 880 → 865，用户气泡右边缘内缩 15px）；而 padding 的 % 按父容器宽度解析、
   不受该槽影响 ⇒ 两者不同源必然错位。故：① 滚动条压到固定 8px（--gym-sb 同值）；
   ② padding-right 反向减 8px 补偿 → 内容列恒 880、左右留白恒等、且不再抖动。 */
.gym-canvas::-webkit-scrollbar{width:var(--gym-sb);height:var(--gym-sb)}
.gym-canvas::-webkit-scrollbar-track{background:transparent;border:0}
.gym-canvas::-webkit-scrollbar-thumb{background:#D9C9F7;border-radius:999px}
.gym-canvas::-webkit-scrollbar-thumb:hover{background:#C4A9F0}
.gym-canvas::-webkit-scrollbar-button{display:none;width:0;height:0}
/* 开场系统消息：居中细条，不是对话气泡 */
.gym-sys{display:flex;align-items:flex-start;gap:8px;max-width:640px;margin:2px auto 6px;padding:10px 14px;border-radius:12px;background:var(--gym-brand-soft);border:1px dashed #D9C9F7;font-size:12.5px;line-height:1.7;color:var(--gym-ink-2)}
.gym-sys-ico{flex:0 0 auto;line-height:1.7}
/* 气泡：全宽画布下 AI 靠左 / 自己靠右（base 已给 align-self）；限宽保证行长可读 */
/* [R54 2026-09-30] max-width 百分比相对 auto 宽 .gym-bub-body 循环解析 → 短消息被压窄折行；限宽交给 .gym-bub-row(相对固定宽 canvas, 无循环), 气泡本身用绝对值 */
.gym-canvas .bubble-xl,.gym-canvas .hint-xl,.gym-canvas .viz-bubble{max-width:760px}
.gym-canvas .viz-iframe{height:clamp(430px,56vh,600px)}
.gym-canvas .bubble-attach{max-width:100%}
/* AI 交互按钮**内嵌在气泡内部**（豆包式：不做独立外部分块）——紫字描边，悬停转填充 */
.gym-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;padding-top:10px;border-top:1px solid rgba(127,74,224,.16)}
.gym-act{padding:6px 14px;border-radius:999px;cursor:pointer;background:var(--gym-surface);color:var(--gym-brand);border:1px solid #D9C9F7;font-size:12.5px;font-weight:700;font-family:inherit;transition:background .14s ease,color .14s ease}
.gym-act:hover{background:var(--gym-brand-fill);color:#FFFFFF;border-color:var(--gym-brand-fill)}
/* 材料卡（「小伴看到的这一页」）：学习材料摆在画布顶部，不再挤进 290px 侧栏 */
.gym-canvas .xb-scan-card{max-width:100%;align-self:flex-start}
/* ④ 底部固定输入区 */
.gym-composer{
  flex:0 0 auto;position:relative;padding:10px var(--gym-gutter) 14px;background:var(--gym-surface);
  border-top:1px solid var(--gym-line);box-shadow:0 -8px 22px -18px rgba(34,24,56,.35);
  /* 规范令牌注入（只改令牌、不改组件内部规则）→ 复用 .asp-* 类名即得全站统一观感 */
  --asp-bg:#FFFFFF;--asp-surface:#FFFFFF;--asp-surface-2:#F0EBFF;
  --asp-ink:#221838;--asp-muted:#665E85;--asp-line:#EAE4F6;--asp-track:#EAE4F6;
  --asp-brand-solid:#7F4AE0;--asp-brand-ink:#7F4AE0;--asp-on-brand:#FFFFFF;
}
/* 场景快捷按钮：从左侧面板迁到**输入框上方**（UI 仍是全站次按钮规范：浅紫底 #F0EBFF + 紫字） */
/* [2026-09-25 #216] 加载态禁用：与公共侧边栏 .asp-chips.is-busy 同口径
   （置灰 + 吃掉点击，保位不隐藏——隐藏会让底部高度跳变，画布跟着抖）。
   pointer-events:none 同时压掉 .gym-quick .asp-chip:hover 变体，无需单写 :hover。 */
.gym-quick.is-busy{opacity:.55;pointer-events:none}
.gym-quick{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
/* [2026-09-26 PM] 「今天学习计划」是**入口型**按钮（点开一张卡），其余是「把这句话发出去」。
   加 📅 前缀做个区分；文案本体保持纯文字，读屏与断言都拿得到「今天学习计划」。 */
.asp-chip-plan::before{content:'📅';margin-right:5px;font-size:12px}
/* 🔴 hover 必须**显式接管**：全站 page.css 有一条无作用域的 `button:hover{background:var(--accent-d)}`
   （特异性 0,1,1 > 本类选择器 0,1,0）⇒ 它会抢走本页按钮的 hover 背景：浅色 --accent-d=#6C51C4
   浓紫底配品牌紫字（实测对比度 1.56）、暗色 --accent-d=#B3A6FF 配 #C9B6FF（1.18）—— 用户报
   「光标移到这 4 个按钮上文字看不清」。做法沿用 page.css 既有范式（显式 :hover 覆盖全局规则），
   取**填充紫压白字** = var(--gym-brand-fill)（浅 #7F4AE0 5.31 / 暗 #7A55E8 4.89），
   与本页气泡内嵌按钮 .gym-act:hover 同语言。 */
.gym-quick .asp-chip:hover,
.gym-quick .asp-chip:active{
  background:var(--gym-brand-fill);color:#FFFFFF;border-color:var(--gym-brand-fill);
  box-shadow:0 6px 16px -10px rgba(127,74,224,.7);
}
/* 输入行：小伴朗读开关 = **输入框右侧独立小图标**（与 🎤 语音输入语义不同，两者并存） */
.gym-composer .asp-input-row{gap:8px;align-items:center}
.gym-composer .asp-input{min-height:40px;font-size:14px;border-radius:20px;padding:0 16px}
.gym-composer .asp-mic{width:38px;height:38px;font-size:15px;border-radius:999px}
.gym-composer .asp-send{min-height:40px;padding:0 20px;border-radius:999px}
/* 🔴 发送键同因同源，且暗色下是**真缺陷**：全局 button:hover 把紫底压成 #967DF3 配白字
   = 3.22:1（低于 4.5，不可读）；浅色为 #774DD5 配白字 5.52:1 尚可，但观感像「按下」而非「悬停」。
   显式接管：底色保持填充紫（5.31 / 4.89），改用阴影 + 微抬升做 hover 反馈。 */
.gym-composer .asp-send:hover,
.gym-composer .asp-send:active{
  background:var(--gym-brand-fill);border-color:var(--gym-brand-fill);filter:none;
  box-shadow:0 6px 16px -10px rgba(127,74,224,.8);transform:translateY(-1px);
}
.gym-composer .gym-voice{
  flex:0 0 38px;width:38px;height:38px;padding:0;border-radius:10px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--gym-surface);color:var(--gym-muted);border:1px solid var(--gym-line);
  font-size:16px;line-height:1;font-family:inherit;
  transition:background .16s ease,color .16s ease,box-shadow .16s ease;
}
.gym-composer .gym-voice:hover{background:var(--gym-brand-soft);color:var(--gym-brand);border-color:var(--gym-brand-line)}
/* 小伴朗读开：实心紫 + 外圈光晕 → 与「只看文字」态一眼可辨 */
.gym-composer .gym-voice.is-on,
.gym-composer .gym-voice[aria-pressed="true"]{
  background:var(--gym-brand-fill);color:#FFFFFF;border-color:var(--gym-brand-fill);
  box-shadow:0 0 0 4px rgba(127,74,224,.16);
}
/* 语音输入录音态：沿用原 .rec 状态机（视觉贴合组件 .asp-mic） */
.gym-composer .asp-mic.rec{flex:0 0 auto;width:auto;padding:0 12px;background:var(--gym-brand-fill);color:#FFFFFF;border-color:var(--gym-brand-fill)}
/* [2026-09-20 语音输入简化] 语音模式（.is-rec）：
   录音时收起其它工具钮，只留「✕ 取消 / 🔴 结束」，发送键变「说完发送」——
   与豆包爱学的 X / ↑ 同构：进入语音态后按钮行不再拥挤，且「一步发出去」变显式选项。 */
.gym-composer .asp-mic.gym-mic-cancel{display:none}
.gym-composer.is-rec .asp-mic:not(.gym-mic-main):not(.gym-mic-cancel),
.gym-composer.is-rec .gym-voice{display:none}
.gym-composer.is-rec .asp-mic.gym-mic-cancel{
  display:inline-flex;background:var(--gym-surface);color:var(--gym-muted);border-color:var(--gym-line);
}
.gym-composer.is-rec .asp-mic.gym-mic-cancel:hover{background:#FDECEF;color:#C93F77;border-color:#F5C6D2}
/* 录音中：输入框描边转品牌紫 + 柔光圈 → 与「打字态」一眼可辨（语音态的主视觉锚点） */
.gym-composer.is-rec .asp-input{border-color:var(--gym-brand-fill);box-shadow:0 0 0 3px rgba(127,74,224,.12);color:var(--gym-ink)}
.gym-composer.is-rec .asp-mic.rec{animation:gymRecPulse 1.3s ease-in-out infinite}
.gym-composer.is-rec .asp-send{min-width:104px;white-space:nowrap}
@keyframes gymRecPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(127,74,224,.38)}
  50%{box-shadow:0 0 0 7px rgba(127,74,224,0)}
}
/* ===== [2026-09-20] 录音态实时彩色声波（用户要求「豆包那种带颜色带波纹的」）=====
   刻意避开「改几个色值换肤」的路子：波纹是**真实音量驱动**的几何变化（高度+透明度），
   颜色取品牌紫 #7F4AE0 → 公仔青 #28C2C8 的竖向渐变（与站内公仔渐变同源）。
   静音时竖条躺平、半透明；说话时从右往左涌起并带钟形包络 —— 孩子一眼看出「它在听我」。 */
.gym-composer .gym-livewave{
  display:flex;align-items:center;gap:14px;padding:2px 4px 10px;
  animation:gymWaveIn .2s cubic-bezier(.2,.8,.3,1) both;
}
.gym-composer .gym-livewave-tag{
  display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;
  font-size:12.5px;font-weight:600;color:var(--gym-ink-2);white-space:nowrap;letter-spacing:.2px;
}
.gym-composer .gym-livewave-tag b{
  width:8px;height:8px;border-radius:999px;background:var(--gym-brand-fill);
  animation:gymWaveDot 1.5s ease-out infinite;
}
.gym-composer .gym-livewave-bars{
  flex:1 1 auto;min-width:0;height:40px;
  display:flex;align-items:center;justify-content:center;gap:2px;
}
.gym-composer .gym-livewave-bars i{
  display:block;flex:1 1 0;min-width:2px;max-width:6px;height:4px;border-radius:999px;opacity:.32;
  background:linear-gradient(180deg,#7F4AE0 0%,#6B63E8 45%,#28C2C8 100%);
  transition:height .09s linear,opacity .09s linear;
}
@keyframes gymWaveIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes gymWaveDot{
  0%{box-shadow:0 0 0 0 rgba(127,74,224,.45)}
  70%{box-shadow:0 0 0 9px rgba(127,74,224,0)}
  100%{box-shadow:0 0 0 0 rgba(127,74,224,0)}
}
/* 「识别中…」：发送键禁用态要有明确视觉（不是灰得看不清，而是「正在办，稍等」） */
.gym-composer .asp-send[disabled],
.gym-composer .asp-send[aria-busy="true"]{
  opacity:.72;cursor:progress;background:var(--gym-brand-fill);color:#FFFFFF;
}
.gym-composer .asp-mic[disabled]{opacity:.55;cursor:progress}
/* 录音时收起快捷按钮，把舞台让给声波（豆包语音态同理：进语音即聚焦） */
.gym-composer.is-rec .gym-quick{display:none}
/* 小屏：波形要占宽度，标签只留「正在听」三字（完整句留给宽屏） */
@media (max-width:640px){
  .gym-composer .gym-livewave{gap:8px}
  .gym-composer .gym-livewave-tip{display:none}
}
[data-theme="dark"] .gym-composer .gym-livewave-tag{color:#C9BFE8}
[data-theme="dark"] .gym-composer .gym-livewave-bars i{
  background:linear-gradient(180deg,#B3A6FF 0%,#8E86F0 45%,#4FD8DE 100%);
  opacity:.28;
}
[data-theme="dark"] .gym-composer.is-rec .asp-mic.gym-mic-cancel{background:#221C3D;border-color:#3A3164;color:#B8AEE0}
[data-theme="dark"] .gym-composer.is-rec .asp-input{
  background:#221C3D;color:#EFE9FF;border-color:#7A55E8;box-shadow:0 0 0 3px rgba(122,85,232,.22);
}
.gym-composer .attach-preview{margin-bottom:8px}
/* [R36] 与三站/错题本同款气泡：小伴头像 + 名字 + 白气泡 */
.gym-bub-row{display:flex;gap:10px;align-items:flex-start;max-width:min(760px,88%);margin:4px 0}
.gym-bub-row.me{align-self:flex-end;flex-direction:row-reverse}
.gym-bub-ava{width:30px;height:30px;border-radius:50%;background:#f5f2fc;flex:0 0 auto}
.gym-bub-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.gym-bub-name{font-size:11px;color:#6f6880}
.gym-canvas .bubble-xl.xb{border-radius:14px;border-top-left-radius:4px;background:#fff;border:1px solid #e1d8f4;color:#221838;box-shadow:0 2px 10px rgba(109,94,252,.11),0 1px 2px rgba(109,94,252,.06)}
.gym-canvas .bubble-xl.me{border-radius:14px;border-top-right-radius:4px;background:#7F4AE0;color:#FFFFFF;box-shadow:0 2px 8px rgba(127,74,224,.25)}
.gym-canvas .hint-xl{background:#F5F0FF;border:1px dashed #C9B6F2;color:#4A3B6B}
.gym-canvas .hint-xl .ht{color:#7F4AE0}
.gym-canvas .bubble-xl .send-btn{background:#7F4AE0;color:#FFFFFF}
/* [点火包 2026-10-08] 思伴聊屋 · 热身保底卡（warmup）+ 软带入提示（nudge） */
.gym-canvas .bubble-xl.xb.propose-warmup{background:#FFFDF5;border:1px solid #F3E7B8;box-shadow:0 2px 10px rgba(214,170,40,.10),0 1px 2px rgba(214,170,40,.06)}
.propose-warmup-kicker{display:block;width:fit-content;font-size:11px;font-weight:600;color:#9A6A00;background:#FBF1CE;border:1px solid #F0E2AE;border-radius:999px;padding:1px 9px;margin-bottom:7px}
.propose-nudge-hint{margin-top:8px;font-size:12px;color:#8A8398;line-height:1.5}
.propose-decline{color:#7F4AE0;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.propose-decline:hover{color:#6330C0}
/* 顶栏：与学习地图页同一规范（56px 纯白底 + #EEEEEE 底分割线；仅本页作用域，不碰全局顶栏） */
body:has(.gym-page) .app-top-nav .top-nav, body:has(#calibWrap) .app-top-nav .top-nav{background:#FFFFFF;color:#221838;box-shadow:0 1px 0 #EEEEEE}
body:has(.gym-page) .app-top-nav .top-nav-row, body:has(#calibWrap) .app-top-nav .top-nav-row{padding:9px 24px!important;min-height:56px!important}
body:has(.gym-page) .app-top-nav .brand .brand-txt b, body:has(#calibWrap) .app-top-nav .brand .brand-txt b{color:#221838}
body:has(.gym-page) .app-top-nav .brand .brand-txt span, body:has(#calibWrap) .app-top-nav .brand .brand-txt span{color:#998FB8}
body:has(.gym-page) .app-top-nav .status-pill, body:has(#calibWrap) .app-top-nav .status-pill{color:#4A3B6B;background:#F0EBFF;border:1px solid #E4DAFB}
body:has(.gym-page) .app-top-nav .status-pill .dot, body:has(#calibWrap) .app-top-nav .status-pill .dot{background:#7F4AE0;box-shadow:0 0 6px rgba(127,74,224,.5)}
body:has(.gym-page) .app-top-nav .theme-btn, body:has(#calibWrap) .app-top-nav .theme-btn{background:#F0EBFF;border:1px solid #E4DAFB;color:#4A3B6B}
body:has(.gym-page) .app-top-nav .menu-nav > a, body:has(#calibWrap) .app-top-nav .menu-nav > a{color:#665E85}
body:has(.gym-page) .app-top-nav .menu-nav > a:hover, body:has(#calibWrap) .app-top-nav .menu-nav > a:hover{background:#F0EBFF;color:#221838;transform:translateY(-1px)}
body:has(.gym-page) .app-top-nav .menu-nav > a.on, body:has(#calibWrap) .app-top-nav .menu-nav > a.on{
  background:transparent;color:#7F4AE0;font-weight:700;box-shadow:none;border-radius:0;position:relative;
}
body:has(.gym-page) .app-top-nav .menu-nav > a.on::before, body:has(#calibWrap) .app-top-nav .menu-nav > a.on::before{display:none}
body:has(.gym-page) .app-top-nav .menu-nav > a.on::after, body:has(#calibWrap) .app-top-nav .menu-nav > a.on::after{
  content:'';position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:#7F4AE0;
}
body:has(.gym-page) .app-top-nav .menu-nav .nav-toggle, body:has(#calibWrap) .app-top-nav .menu-nav .nav-toggle{color:#665E85}
body:has(.gym-page) .app-top-nav .menu-nav .nav-toggle:hover, body:has(#calibWrap) .app-top-nav .menu-nav .nav-toggle:hover{background:#F0EBFF;color:#221838}
body:has(.gym-page) .app-top-nav .menu-nav .nav-toggle.open, body:has(#calibWrap) .app-top-nav .menu-nav .nav-toggle.open,
body:has(.gym-page) .app-top-nav .menu-nav .nav-toggle.on, body:has(#calibWrap) .app-top-nav .menu-nav .nav-toggle.on{background:transparent;color:#7F4AE0;box-shadow:none}
body:has(.gym-page) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle, body:has(#calibWrap) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle{
  color:#7F4AE0;font-weight:700;position:relative;
}
body:has(.gym-page) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle::after, body:has(#calibWrap) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle::after{
  content:'';position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:#7F4AE0;
}

body:has(.gym-page) .app-top-nav .nav-more-btn, body:has(#calibWrap) .app-top-nav .nav-more-btn{color:#665E85}
body:has(.gym-page) .app-top-nav .nav-more-btn:hover, body:has(#calibWrap) .app-top-nav .nav-more-btn:hover{background:#F0EBFF;color:#221838}
body:has(.gym-page) .app-top-nav .menu-nav .nav-toggle .nt-ar, body:has(#calibWrap) .app-top-nav .menu-nav .nav-toggle .nt-ar{color:#7F4AE0}
/* ---------- 一·补、[2026-09-22 PM] 本页顶栏改为「思伴聊屋」专条 ----------
   PM 口径：把全站顶栏那一排菜单换成「思伴聊屋这一条」——公仔保留、高度不变（56px）、
   名称「思伴聊屋 / 找小伴聊聊」、菜单换成主题条（🎯主题 + 输入 + 切换 + 建议芯片），
   末尾加「回主页」按钮。
   实现：继续用**全站同一条 .top-nav**（粘性/高度/本页白底等既有页面级规则全部复用 → 天然等高，
   --gym-top 那份 JS 量取逻辑也不必动），只在本页隐藏 brand / menu-nav / status-row 三块，
   显示 app.html 里的 #gymTopbar。
   ⚠️ 主题条用的是 .gym-topic-* 类，其配色走 --gym-* 变量，而变量声明在 .gym-page 上；
   #gymTopbar 位于 .gym-page 之外 ⇒ 必须在这里把同一组变量**再声明一份**（明/暗两套），
   否则边框/文字回落 UA 默认（黑框黑字）。 */
.gym-topbar{display:none}
body:has(.gym-page) .app-top-nav .top-nav-row > .brand,
body:has(.gym-page) .app-top-nav .top-nav-row > .menu-nav,
body:has(.gym-page) .app-top-nav .top-nav-row > .status-row{display:none!important}
body:has(.gym-page) .gym-topbar{
  --gym-ink:#221838;--gym-muted:#665E85;--gym-brand:#7F4AE0;--gym-brand-fill:#7F4AE0;
  --gym-brand-soft:#F0EBFF;--gym-brand-line:#E4DAFB;--gym-line:#EAE4F6;--gym-surface:#FFFFFF;
  display:flex;align-items:center;gap:14px;width:100%;min-width:0;
}
/* [2026-10-15] 「回主页」独立按钮取消：点品牌区（公仔+「思伴聊屋」）即回主页。
   a 标签承载 ⇒ 补无下划线 + cursor + hover 呼吸反馈（不夺主题条焦点）。 */
.gym-brand{display:flex;align-items:center;gap:9px;flex:none;text-decoration:none;cursor:pointer}
.gym-brand:hover .gym-brand-txt b{color:#7F4AE0}
.gym-brand:active .gym-brand-txt b{opacity:.75}
.gym-brand-mascot{width:32px;height:32px;object-fit:contain;flex:none;
  filter:drop-shadow(0 4px 10px rgba(109,94,252,.30));animation:tbFloat 5s ease-in-out infinite}
body:has(.gym-page) .gym-brand-txt b{display:block;font-size:15px;font-weight:800;letter-spacing:-.2px;color:#221838;line-height:1.25}
body:has(.gym-page) .gym-brand-txt span{display:block;font-size:11px;color:#998FB8;margin-top:1px;line-height:1.3}
/* 主题条：顶栏内单行、不换行；放不下就横滑（与 ≤640 的既有口径一致，滚动条隐藏） */
body:has(.gym-page) .gym-topbar .gym-topic-row{
  flex:1 1 auto;min-width:0;margin-top:0;flex-wrap:nowrap;
  padding-left:14px;padding-right:10px;border-left:1px solid var(--gym-line);
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;
}
body:has(.gym-page) .gym-topbar .gym-topic-row::-webkit-scrollbar{display:none}
body:has(.gym-page) .gym-topbar .gym-topic-chips{flex-wrap:nowrap}
body:has(.gym-page) .gym-topbar .gym-topic-chip{flex:0 0 auto;padding:0 9px}
body:has(.gym-page) .gym-topbar .gym-topic-label{flex:0 0 auto}
/* [2026-10-15] 顶栏输入框 148→104：给 chips 腾宽 —— 148px 时窗口稍窄就把
   「阅读写作」之后的 chips 全部裁出可视区（滚动条又隐藏 ⇒ 观感=被右侧压住）。 */
body:has(.gym-page) .gym-topbar .gym-topic-input{flex:0 0 104px;height:28px}
body:has(.gym-page) .gym-topbar .gym-topic-btn{flex:0 0 auto;height:28px}
.gym-topbar-acts{display:flex;align-items:center;gap:8px;flex:none;margin-left:auto}
/* [伙伴阁 P0-A T4 入口1] 聊屋右上角头像控件：**短按**＝按目录顺序循环切换角色
   （toast 报新角色名），**长按（≥550ms）**＝进伙伴阁（#/partner）。不新增独立按钮
   —— 头像即角色态（P0-A mascot 占位，P0-B 换原创立绘），名字实时跟随 character.js。
   配色走 .gym-topbar 作用域内已声明的 --gym-* 变量（明/暗两套，见上方两块）。 */
.gym-char-avatar{display:flex;align-items:center;gap:8px;flex:none;height:34px;padding:0 13px 0 5px;
  border:1px solid var(--gym-brand-line,#E4DAFB);border-radius:999px;background:var(--gym-brand-soft,#F0EBFF);
  cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation;
  transition:border-color .14s ease,transform .12s ease}
.gym-char-avatar:hover{border-color:var(--gym-brand,#7F4AE0)}
.gym-char-avatar:active{transform:scale(.96)}
.gym-char-avatar img{width:26px;height:26px;border-radius:50%;object-fit:contain;flex:none;background:#FFFFFF}
.gym-char-avatar-name{font-size:12px;font-weight:700;color:var(--gym-brand,#7F4AE0);white-space:nowrap;
  max-width:80px;overflow:hidden;text-overflow:ellipsis}
/* 中窄窗先收名字只留圆头像（与副名同款让位策略），窄屏再收内边距 */
@media (max-width:1200px){
  .gym-char-avatar-name{display:none}
  .gym-char-avatar{padding:0 6px}
}
@media (max-width:640px){
  .gym-char-avatar{padding:0 4px}
  .gym-char-avatar img{width:24px;height:24px}
}
/* 暗色：变量组与 [data-theme="dark"] .gym-page 同源（#151229 页底 / #1A1635 头尾 / #C9B6FF 亮紫字） */
[data-theme="dark"] body:has(.gym-page) .gym-topbar{
  --gym-ink:#FFFFFF;--gym-muted:#B8AEE0;--gym-brand:#C9B6FF;--gym-brand-fill:#7A55E8;
  --gym-brand-soft:rgba(143,90,240,.14);--gym-brand-line:rgba(143,90,240,.34);
  --gym-line:#3A3164;--gym-surface:#1A1635;
}
[data-theme="dark"] body:has(.gym-page) .gym-brand-txt b{color:#FFFFFF}
[data-theme="dark"] body:has(.gym-page) .gym-brand-txt span{color:#8579B3}
[data-theme="dark"] .gym-brand:hover .gym-brand-txt b{color:#C9B6FF}
/* [2026-10-15] 顶栏 chips 微缩 + 提前收副名：中窄窗（≤1200）就隐藏「找小伴聊聊」，
   原断点 900 太晚 —— 1000~1200 宽窗口 chips 已被裁，副名是最先该让位的软信息。 */
@media (max-width:1200px){
  body:has(.gym-page) .gym-brand-txt span{display:none}
}
@media (max-width:900px){
  /* 窄屏：输入框再让位，主名与两个动作按钮不丢 */
  body:has(.gym-page) .gym-topbar{gap:10px}
  body:has(.gym-page) .gym-topbar .gym-topic-row{padding-left:10px}
  body:has(.gym-page) .gym-topbar .gym-topic-input{flex:0 0 88px}
}
/* ---------- 二、页面级中和：.main 不留白 → 整页无外层滚动条（画布独占滚动） ---------- */
body:has(.gym-page) .main{
  margin-left:0!important;margin-right:0!important;
  max-width:none!important;width:100%!important;
  padding:0!important;overflow:visible;
}
body:has(.gym-page) .main > .gym-page{max-width:none!important;margin-left:0!important;margin-right:0!important}
/* 本页自带会话画布 → 移除右下角全局悬浮公仔（消除双 IP 冲突）；离开本页自动恢复 */
body:has(.gym-page) #mascotV5Wrap, body:has(.gym-page) #xbGreet,
body:has(#calibWrap) #mascotV5Wrap, body:has(#calibWrap) #xbGreet{display:none!important}
/* 本页隐藏全局「能量星」引导浮泡（#energyTip：fixed, z=2147483600，钉在 x=18）。
   实测：本页无左侧栏，该浮泡会压住居中的对话列左侧 78px（气泡 x=280 起）。
   仍属**页面级中和**，不改全局规则；离开本页自动恢复。 */
body:has(.gym-page) #energyTip{display:none!important}
/* ---------- 三、暗色主题：**布局零改动**，只换色值（「暗但清晰」层级，与学习地图同口径） ---------- */
[data-theme="dark"] .gym-page{
  --gym-ink:#FFFFFF;--gym-ink-2:#E4DDFB;--gym-muted:#B8AEE0;
  --gym-brand:#C9B6FF;        /* 文字·图标亮紫：压 #221C3D 为 5.45:1 */
  --gym-brand-fill:#7A55E8;   /* 填充紫：#8F5AF0 压白字仅 3.27:1 → 深一档为 4.86:1 */
  --gym-brand-soft:rgba(143,90,240,.14);
  --gym-brand-line:rgba(143,90,240,.34);
  --gym-line:#3A3164;--gym-surface:#1A1635;--gym-bg:#151229;
}
[data-theme="dark"] .gym-h1{color:#FFFFFF}
[data-theme="dark"] .gym-sub,
[data-theme="dark"] .gym-meta,
[data-theme="dark"] .gym-topic-label{color:#B8AEE0}
[data-theme="dark"] .gym-desc{background:rgba(201,182,255,.08);border-color:rgba(201,182,255,.16);color:#C9C2EC}
[data-theme="dark"] .gym-lec-card{background:linear-gradient(180deg,rgba(201,182,255,.07),rgba(40,194,200,.045));border-color:rgba(201,182,255,.20);box-shadow:0 10px 30px rgba(0,0,0,.28)}
[data-theme="dark"] .gym-lec-head{background:linear-gradient(90deg,rgba(201,182,255,.14),rgba(40,194,200,.10));border-bottom-color:rgba(201,182,255,.18)}
[data-theme="dark"] .gym-lec-card.is-collapsed .gym-lec-head{border-bottom:none}
[data-theme="dark"] .gym-lec-title{color:#EDE9FF}
[data-theme="dark"] .gym-lec-kicker,[data-theme="dark"] .gym-lec-toggle{color:#C9B6FF}
[data-theme="dark"] .gym-lec-meta{color:#9C97B8}
[data-theme="dark"] .gym-meta i{color:#3A3164}
[data-theme="dark"] .gym-topic-btn:hover{background:rgba(143,90,240,.26)}
/* 暗色旧规则的能力盖也同样淘汰：rgba(143,90,240,.26) 配 #C9B6FF 虽 6.98 可读，但两主题
   hover 语言不一致 ⇒ 一并统一为填充紫压白字（4.89）。 */
body[data-theme="dark"] .gym-page .gym-topic-btn:hover,
body[data-theme="dark"] .gym-page .gym-topic-btn:active{
  background:var(--gym-brand-fill);color:#FFFFFF;border-color:var(--gym-brand-fill);
}
[data-theme="dark"] .gym-topic-chip.is-on{border-color:#5B4EA6}
[data-theme="dark"] .gym-topic-input{background:#221C3D;border-color:#3A3164;color:#FFFFFF}
[data-theme="dark"] .gym-topic-input::placeholder{color:#8579B3}
[data-theme="dark"] .gym-sys{background:rgba(143,90,240,.14);border-color:#5B4EA6;color:#E4DDFB}
[data-theme="dark"] .gym-bub-ava{background:#211c33}
[data-theme="dark"] .gym-bub-name{color:#a79fc4}
[data-theme="dark"] .gym-canvas .bubble-xl.xb{background:#211c33;border:1px solid #352d52;color:#ECE8F7}
[data-theme="dark"] .gym-canvas .bubble-xl.me{background:#7A55E8;color:#FFFFFF;box-shadow:0 2px 8px rgba(0,0,0,.4)}
[data-theme="dark"] .gym-canvas .hint-xl{background:#2D2748;border:1px dashed #5B4EA6;color:#E4DDFB}
[data-theme="dark"] .gym-canvas .hint-xl .ht{color:#C9B6FF}
[data-theme="dark"] .gym-canvas .bubble-xl .send-btn{background:#7A55E8;color:#FFFFFF}
/* [点火包 2026-10-08] 热身卡 / 软带入提示 · 深色档 */
[data-theme="dark"] .gym-canvas .bubble-xl.xb.propose-warmup{background:#2A2618;border:1px solid #4A4226;box-shadow:0 2px 10px rgba(0,0,0,.35)}
[data-theme="dark"] .propose-warmup-kicker{color:#E7C873;background:#33301E;border-color:#4A4226}
[data-theme="dark"] .propose-nudge-hint{color:#A79FC0}
[data-theme="dark"] .propose-decline{color:#B79CF2}
[data-theme="dark"] .propose-decline:hover{color:#CBB6FF}
[data-theme="dark"] .gym-acts{border-top-color:rgba(255,255,255,.12)}
[data-theme="dark"] .gym-act{background:#221C3D;color:#C9B6FF;border-color:#5B4EA6}
[data-theme="dark"] .gym-act:hover{background:#7A55E8;color:#FFFFFF;border-color:#7A55E8}
[data-theme="dark"] .gym-composer{
  border-top-color:#3A3164;box-shadow:0 -8px 22px -18px rgba(0,0,0,.7);
  --asp-bg:#221C3D;--asp-surface:#1A1635;--asp-surface-2:#2A2348;
  --asp-ink:#FFFFFF;--asp-muted:#B8AEE0;--asp-line:#3A3164;--asp-track:#3A3164;
  --asp-brand-solid:#7A55E8;--asp-brand-ink:#C9B6FF;--asp-on-brand:#FFFFFF;
}
[data-theme="dark"] .gym-composer .gym-voice{background:#221C3D;border-color:#3A3164;color:#B8AEE0}
[data-theme="dark"] .gym-composer .gym-voice:hover{background:#2A2348;color:#C9B6FF;border-color:#5B4EA6}
[data-theme="dark"] .gym-composer .gym-voice.is-on,
[data-theme="dark"] .gym-composer .gym-voice[aria-pressed="true"]{
  background:#7A55E8;color:#FFFFFF;border-color:#7A55E8;box-shadow:0 0 0 4px rgba(143,90,240,.20);
}
/* 暗色顶栏：与学习地图同口径（#1A1635 + #443A7A 底分割线）——不沿用品牌紫实色顶栏，
   否则它会是深色页最亮元素，压过「按钮最亮」，破坏 暗但清晰 的层级顺序。 */
[data-theme="dark"] body:has(.gym-page) .app-top-nav .top-nav, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .top-nav{background:#1A1635;color:#FFFFFF;box-shadow:0 1px 0 #443A7A}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .brand .brand-txt b, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .brand .brand-txt b{color:#FFFFFF}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .brand .brand-txt span, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .brand .brand-txt span{color:#8579B3}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .status-pill, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .status-pill{color:#B8AEE0;background:rgba(143,90,240,.16);border:1px solid rgba(143,90,240,.34)}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .status-pill .dot, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .status-pill .dot{background:#8F5AF0;box-shadow:0 0 6px rgba(143,90,240,.60)}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .theme-btn, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .theme-btn{background:rgba(143,90,240,.16);border:1px solid rgba(143,90,240,.34);color:#B8AEE0}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav > a, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav > a{color:#B8AEE0}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav > a:hover, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav > a:hover{background:rgba(143,90,240,.18);color:#FFFFFF;transform:translateY(-1px)}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav > a.on, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav > a.on{
  background:transparent;color:#C9B6FF;font-weight:700;box-shadow:none;border-radius:0;position:relative;
}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav > a.on::before, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav > a.on::before{display:none}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav > a.on::after, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav > a.on::after{
  content:'';position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:#8F5AF0;
}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav .nav-toggle, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav .nav-toggle{color:#B8AEE0}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav .nav-toggle:hover, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(143,90,240,.18);color:#FFFFFF}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav .nav-toggle.open, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav .nav-toggle.open,
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav .nav-toggle.on, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav .nav-toggle.on{background:transparent;color:#C9B6FF;box-shadow:none}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle{
  color:#C9B6FF;font-weight:700;position:relative;
}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle::after, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav:has(.nav-group-body > a.on) button.nav-toggle::after{
  content:'';position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:#8F5AF0;
}
[data-theme="dark"] body:has(.gym-page) .app-top-nav .menu-nav .nav-toggle .nt-ar, [data-theme="dark"] body:has(#calibWrap) .app-top-nav .menu-nav .nav-toggle .nt-ar{color:#8F5AF0}
/* ---------- 三·补、轻 Toast（素养加分等状态变更）：本页专用定位与暗色可读性 ---------- */
/* ① 抬到**会话头部下方**居中：全局 .gh-toast 是 fixed;bottom:48px，在本页会正好盖住底部快捷按钮与输入框。 */
body:has(.gym-page) .gh-toast{bottom:auto;top:198px}
/* ② 暗色可读性：全局 .gh-toast 拿 --ink 当**底色**，而暗色主题下 --ink 变成近白、文字又是 #fff
      → 白字白底（真机实测：只剩一个白色空方块）。此处按「暗但清晰」层级给深卡底。
      **仅本页作用域**；全局同名缺陷属其它任务线在途范围，不在本批改动。 */
[data-theme="dark"] body:has(.gym-page) .gh-toast{
  background:#2D2748;color:#FFFFFF;
  box-shadow:0 0 0 1px #3A3164,0 8px 24px rgba(0,0,0,.55);
}

/* ---------- 四、窄屏（≤900px）：**结构不变**，只压缩留白（不做栏数切换） ---------- */
@media (max-width:900px){
  .gym-page{--gym-col-pad:14px}
  .gym-head{padding:8px var(--gym-gutter) 10px}
  .gym-head-row{flex-direction:column;gap:4px}
  .gym-meta{padding-top:0}
  .gym-canvas{padding:14px var(--gym-gutter) 18px}
  .gym-canvas .bubble-xl,.gym-canvas .hint-xl,.gym-canvas .viz-bubble{max-width:none}
  .gym-composer{padding:10px var(--gym-gutter) 12px}
  .gym-quick .asp-chip{flex:1 1 auto;justify-content:center}
  body:has(.gym-page) .gh-toast{top:258px}
}
/* ---------- 四·补、小屏（≤640px）：头部主题行**不换行**改横滑 ----------
   实测 390px 视口下主题行换行把头部顶到 376px（占屏 45%，画布仅剩 331px）。
   改单行横滑后头部回落到 ~312px 起画布，拿回约 64px。结构不变、无 JS 改动。 */
@media (max-width:640px){
  .gym-topic-row{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;padding-bottom:2px;
    scrollbar-width:none;-ms-overflow-style:none}
  .gym-topic-row::-webkit-scrollbar{display:none}
  .gym-topic-chips{flex-wrap:nowrap}
  .gym-topic-chip{flex:0 0 auto}
  .gym-topic-input{flex:0 0 128px}
  .gym-topic-btn{flex:0 0 auto}
  /* 输入行改两行：输入框独占一行。实测 390px 单行时输入框仅剩 ~100px
     （placeholder「把你的思路写下来…」被截成「把伤」），5 个图标 + 发送把输入位挤没。
     第二行 = 图标组靠左 + 发送靠右（margin-left:auto），不删任何入口、不改结构。 */
  .gym-composer .asp-input-row{flex-wrap:wrap;row-gap:8px}
  .gym-composer .asp-input{flex:1 1 100%}
  .gym-composer .asp-send{margin-left:auto}
}


/* [2026-09-19 全站统一UI规范 · 学习页] #/calibrate（学科小关 / 小伴讲解）顶栏紧凑化。
   与学习地图(L4209)、思维健身房(L4578) 同一规范：56px 紧凑单行。
   本轮**只收缩版式**（padding + min-height），**紫色配色一字不动**（PM 要求「颜色不改变」）。
   来源：L2480 `body:not([data-subject])` 本意只给「学生端主页」增高到 99px，
   却把所有非学科页一并拉到 100px（实测 calibrate / subjects / arcade / groups / report 同病；
   学习地图与思维健身房已逐页覆盖逃生，学习页是漏网的第三个）。
   作用域刻意用 #calibWrap（CalibrateEngine 的根容器）而非 data-tone="study"，
   以免顺带改动 subjects / arcade / groups —— 那几页待统一铺开时再动。 */
body:has(#calibWrap) .app-top-nav .top-nav-row{padding:9px 24px!important;min-height:56px!important}

/* [2026-09-20 PM 改口径] 学习页(#/calibrate) 顶栏配色：紫色 → 与 #/screen（思维健身房）统一的白底 + 1px 底边。
   做法：L4760 起那批 `.gym-page` 顶栏规则（含 L4854 起的暗色变体）的**选择器已把 `body:has(#calibWrap)`
   并列进去**，所以这里不再另写重复规则 —— 白底 / 字色 / 状态胶囊 / 主题键 / 导航高亮 / 下拉箭头
   全部与 #/screen 共用同一份声明，只维护一处。
   注意：本文件 2026-09-19 曾写「紫色配色一字不动」，那是当时 PM 的口径；本轮 PM 明确要求
   「顶栏颜色改成与 #/screen 一样」，故覆盖旧口径，把两个功能页的站点壳语言统一。 */

/* [2026-09-20 PM] 学习页隐藏右下角浮动公仔 #mascotV5Wrap。
   两个理由：① 它在本页会压住选项区（fixed 定位无避让）；② 本页的"小伴"已统一用对话流里的
   文字 wordmark（PM 早前定过"公仔不出现在对话流"），浮动公仔与文字 wordmark 是同页两套隐喻，会打架。
   隐藏先例：本文件 L4799 对思维健身房做过同样处理。 */
body:has(#calibWrap) #mascotV5Wrap{display:none!important}

/* [2026-09-20 修 · 用户实测反馈] #energyTip（「⭐ 能量星是什么？…」，app.html L322）的定位锚点是主页的
   `.v12-xp-bar`（能量星 XP 进度条）。但实测：`.v12-xp-bar` 全站已**没有任何生成点**（只剩 page.css:522 的样式定义），
   而 app.js 的 ensureEnergyTip() 只在**主页**渲染时被调用 ⇒ 在非主页（如 #/calibrate 学习页）它既没人隐藏、
   也没人定位，就带着 app.html 里的 style="display:block" 用 CSS 默认位置 fixed;left:18px;top:200px
   飘在正文上（实测压住第一条小伴气泡），5.5s 后才淡出。
   处理：没有锚点的页面一律不显示。这条规则是**自愈**的——将来主页若重新生成 .v12-xp-bar，它会自动失效。
   （app.js 侧同步把锚点检查提到写 czs_energy_tip_seen 之前，见 ensureEnergyTip。） */
body:not(:has(.v12-xp-bar)) #energyTip{display:none!important}

/* ==========================================================================
 * [2026-09-20 PM · 学习页(#/calibrate) → #/screen（思维健身房）统一：底色 + 底部多模态条]
 *
 * PM 反馈：「有 2 个底色，改成与思维健身房一样的底色」「底栏复用思维健身房」。
 *
 * 底色为什么会是两层：#/calibrate 走 ROUTE_TONE.study → `body[data-tone="study"] .main`
 *   带三层渐变（紫雾 radial + 180deg #F7F5FE→#F1EDFB），而 body 是全局奶油底 #FFF6F0、
 *   `.main` 只有 1180 宽 ⇒ 【左右两条奶油边】+【画布本身比奶油更紫】= 肉眼两个底色。
 *   #/screen 的 .gym-page 只用 --gym-bg(#FCFAFF) 铺满一层，没有第二层。
 *   处理：本页 body 与 .main 一律用 --gym-bg，并把 tone 渐变去掉。选择器带 #calibWrap
 *   → 特异性 (1,1,1) > tone 规则 (0,3,2)，无需 !important。
 *
 * 令牌为什么搬到这里：#calibDock 复用 `.gym-composer / .gym-quick / .asp-chip / .asp-such`
 *   等**类名**，而这些类里写的是 var(--gym-gutter / --gym-surface / --gym-brand-fill …)，
 *   `.gym-composer / .gym-quick / .asp-chip / .asp-input / .asp-mic / .asp-send` 等**类名**，
 *   而这些类里写的是 var(--gym-gutter / --gym-surface / --gym-brand-fill …)，
 *   令牌原本只定义在 `.gym-page` 上。不搬 → var() 解析失败 → 底栏内容贴视口左右边，
 *   而不是收在 880px 居中列里。
 *
 * 双主题：暗色取 .gym-page 暗色令牌同值（页底 #151229 / 面 #1A1635 / 描边 #3A3164）。
 * ========================================================================== */
body:has(#calibWrap){
  --gym-col:880px;
  --gym-col-pad:28px;
  /* 与 .gym-page 同式：% 在 padding 上按视口宽解析（#calibDock 是 fixed 全宽） */
  --gym-gutter:max(var(--gym-col-pad), calc((100% - var(--gym-col)) / 2));
  --gym-ink:#221838;          /* 正文 */
  --gym-ink-2:#4A3B6B;        /* 次级正文 */
  --gym-muted:#665E85;        /* 辅助文字 */
  --gym-brand:#7F4AE0;        /* 品牌文字·图标·描边 */
  --gym-brand-fill:#7F4AE0;   /* 品牌填充（压白字） */
  --gym-brand-soft:#F0EBFF;   /* 次浅紫底 */
  --gym-brand-line:#E4DAFB;
  --gym-line:#EAE4F6;
  --gym-surface:#FFFFFF;
  --gym-bg:#FCFAFF;           /* 页底：与思维健身房一字不差 */
}
html:not([data-theme="dark"]) body:has(#calibWrap){background:var(--gym-bg)}
html:not([data-theme="dark"]) body:has(#calibWrap) .main{
  background:var(--gym-bg);
  background-image:none;      /* 摘掉 tone=study 的紫雾三层渐变 */
}
[data-theme="dark"] body:has(#calibWrap){
  --gym-ink:#FFFFFF;--gym-ink-2:#E4DDFB;--gym-muted:#B8AEE0;
  --gym-brand:#C9B6FF;        /* 亮紫文字：压 #221C3D 为 5.45:1 */
  --gym-brand-fill:#7A55E8;   /* 填充紫：#8F5AF0 压白字仅 3.27:1 → 深一档 4.86:1 */
  --gym-brand-soft:rgba(143,90,240,.14);
  --gym-brand-line:rgba(143,90,240,.34);
  --gym-line:#3A3164;--gym-surface:#1A1635;--gym-bg:#151229;
  background:var(--gym-bg);
}
[data-theme="dark"] body:has(#calibWrap) .main{background:var(--gym-bg);background-image:none}


/* ===== [批90] 追加段起点 ===== */

/* =========================================================================
   [批90 · 2026-09-26 PM 拍板] 顶栏头像 + 个人菜单 + 主导航【更多】折叠
   三条硬约束：
     ① 头像永远固定在右上角 —— 不参与主导航横滚，也永远不被收进【更多】；
     ② 只有左侧业务导航会折叠，低频项进【更多】，二级项一条不丢；
     ③ 每条改背景的规则都同时给字色（暗档另给一套），避免白底白字 / 深底深字。
   ========================================================================= */

/* ---- 右上角头像（默认小伴 IP；学生填过名字就显示名字首字）---- */
.nav-avatar-wrap{position:relative;flex:none;margin-left:2px}
.nav-avatar{
  width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#ffffff;border:2px solid rgba(255,255,255,.92);
  box-shadow:0 2px 10px -2px rgba(24,8,60,.45);
  cursor:pointer;padding:0;overflow:hidden;font-family:inherit;
  transition:transform .15s ease, box-shadow .15s ease;
}
.nav-avatar:hover{transform:translateY(-1px);box-shadow:0 6px 16px -4px rgba(24,8,60,.55)}
.nav-avatar:focus-visible{outline:2px solid #ffffff;outline-offset:2px}
.nav-avatar-img{width:100%;height:100%;object-fit:contain;display:block}
.nav-avatar-txt{font-size:17px;font-weight:800;color:#6D5EFC;line-height:1;letter-spacing:0}
.nav-avatar-img[hidden],.nav-avatar-txt[hidden]{display:none}

/* ---- 个人菜单面板 ---- */
.nav-avatar-menu{
  position:absolute;top:calc(100% + 8px);right:0;z-index:120;
  width:268px;max-height:78vh;overflow:auto;
  background:#ffffff;color:#241F38;
  border:1px solid rgba(120,110,150,.14);border-radius:16px;
  box-shadow:0 20px 46px -12px rgba(40,10,80,.32);
  padding:12px;
}
.nav-avatar-menu[hidden]{display:none}
.nam-head{display:flex;align-items:center;gap:10px;padding:4px 6px 12px;margin-bottom:6px;border-bottom:1px solid #EFEAF8}
.nam-av{width:40px;height:40px;border-radius:50%;flex:none;overflow:hidden;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#EFEBFF,#E4F7F8)}
.nam-av img{width:100%;height:100%;object-fit:contain}
.nam-av span{font-size:16px;font-weight:800;color:#6D5EFC}
.nam-av-sm{width:24px;height:24px;flex:none}
.nam-av-sm span{font-size:12px}
.nam-meta{display:flex;flex-direction:column;min-width:0}
.nam-meta b{font-size:14px;line-height:1.3;color:#241F38}
.nam-meta span{font-size:11.5px;line-height:1.4;color:#7A6F95}
.nam-sec{padding:2px 0}
.nam-sec + .nam-sec{margin-top:6px;padding-top:8px;border-top:1px solid #F2EEFA}
.nam-cap{padding:4px 8px 6px;font-size:11px;font-weight:700;letter-spacing:.4px;color:#9A8FB5}
.nam-row{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:9px 10px;border:0;border-radius:10px;background:transparent;
  font-family:inherit;font-size:13.5px;color:#3B3358;text-align:left;
  cursor:pointer;text-decoration:none;transition:background .12s,color .12s;
}
.nam-row:hover{background:#F5F1FF;color:#5B3FBF}
.nam-row.is-cur{background:#F0EBFF;color:#5B3FBF;font-weight:700}
.nam-ic{width:16px;height:16px;flex:none;display:inline-flex;color:#8B6FE8}
.nam-ic svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nam-lb{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nam-val{flex:none;font-size:11.5px;color:#8A7FA8}
.nam-chev{width:7px;height:7px;flex:none;margin-left:2px;border-right:1.6px solid #B9AED6;border-bottom:1.6px solid #B9AED6;transform:rotate(-45deg)}
.nam-confirm{
  display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:8px;padding:10px;
  background:#FFF7E9;border:1px solid #F3DFB8;border-radius:10px;color:#8A5A12;font-size:12px;line-height:1.5;
}
.nam-confirm[hidden]{display:none}
.nam-cf-yes,.nam-cf-no{font-family:inherit;font-size:12px;font-weight:700;border-radius:8px;padding:5px 12px;cursor:pointer;border:1px solid transparent}
.nam-cf-yes{background:#7F4AE0;color:#ffffff}
.nam-cf-no{background:#ffffff;color:#8A5A12;border-color:#E6CFA3}

/* ---- 【更多】：量宽后把放不下的一级项收进来 ---- */
.nav-more-btn{
  position:relative;display:inline-flex;align-items:center;gap:6px;flex:none;
  color:rgba(255,255,255,.90);background:transparent;border:0;cursor:pointer;
  padding:0 14px;min-height:44px;border-radius:99px;font-size:13.5px;font-weight:600;font-family:inherit;
  white-space:nowrap;transition:background .15s ease;
}
.nav-more-btn[hidden]{display:none}
.nav-more-btn:hover{background:rgba(255,255,255,.16)}
/* 【更多】整块待在 <nav> 之外（见 app.html 同名注释）：
   实测 #navMoreBtn 留在 nav 流内时，420 宽下它自己吃掉 57px（nav 总共才 207px），
   把「学习地图 / 测评 / 错题本」等项全挤进了【更多】；面板跟着出来，
   也顺带不再受 .menu-nav 那个 overflow 滚动容器的影响。
   wrap 必须 flex:0 0 auto 且不留内边距 —— 按钮 hidden 时整块宽度归 0。
   order 不能省：宽屏下 .menu-nav 是 order:3，wrap 若停在默认 order:0，
   会被排到品牌后面，面板整体甩到视口外（实测 760 宽 left=-83）。 */
.nav-more-wrap{position:relative;display:flex;align-items:center;flex:0 0 auto;min-width:0;order:9}
/* 头像基础序必须排最后 ⇒ 永远占住右上角；【更多】(order:9)只能靠在它左边。
   （真机实撞：先是给了 wrap order:10，结果【更多】按钮挤到头像右边，
     1440 宽下头像右缘从 1416 退到 1345 —— 右上角被抢。） */
.app-top-nav .top-nav-row > .nav-avatar-wrap{order:10}
      /* 头像基础序必须排最后 ⇒ 永远占住右上角；【更多】(order:9)只能靠在它左边。
         （真机实撞：先是给了 wrap order:10，结果【更多】按钮挤到头像右边，
           1440 宽下头像右缘从 1416 退到 1345 —— 右上角被抢。） */
.nav-more-body{right:0;left:auto;min-width:208px}
/* 特异性必须顶到 (0,3,1) 以上：上面 .app-top-nav .nav-group-body 里那条 (0,2,0) 的
   left:0 会把本条的 left:auto 压掉 —— left 与 right 同时生效 ⇒ 面板被拉成整屏宽、
   文字居中（真机实撞）。.menu-nav a 那条 text-align:center 同理，要显式拉回左对齐。 */
.app-top-nav .nav-group-body.nav-more-body{
  left:auto;right:0;margin-left:0;
  min-width:208px;max-width:min(300px,calc(100vw - 24px));
  text-align:left;
}
.app-top-nav .nav-more-body > a.nmb-l1{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 10px;margin:0 0 2px;border-radius:10px;
  font-size:13.5px;font-weight:700;color:#2E2650;text-decoration:none;
  text-align:left;white-space:nowrap;
}
.app-top-nav .nav-more-body > a.nmb-l1:hover{background:#F5F1FF;color:#5B3FBF}
.app-top-nav .nav-more-body > a.nmb-l2{
  display:block;padding:7px 10px 7px 22px;margin:0;border-radius:9px;
  font-size:12.5px;font-weight:500;color:#6B6188;text-decoration:none;
  text-align:left;white-space:nowrap;
}
.app-top-nav .nav-more-body > a.nmb-l2:hover{background:#F5F1FF;color:#5B3FBF}

/* 被收进【更多】的一级项（连同它的二级菜单一起）*/
.nav-folded{display:none!important}

/* ---- 一级项可点：点文字进落地页，点箭头才展开二级 ----
   .nt-ar 本体只有 6×6，这里用伪元素把可点区撑到约 20×22，
   点到伪元素时 e.target 仍是 .nt-ar ⇒ 手风琴照常工作。 */
.app-top-nav .menu-nav .nav-toggle.nav-split{padding-right:6px}
.app-top-nav .menu-nav .nav-toggle.nav-split .nt-ar{position:relative;display:inline-block;margin-left:6px}
.app-top-nav .menu-nav .nav-toggle.nav-split .nt-ar::after{
  content:"";position:absolute;top:-9px;bottom:-9px;left:-7px;right:-7px;border-radius:8px;
}
.app-top-nav .menu-nav .nav-toggle.nav-split .nt-ar:hover::after{background:rgba(255,255,255,.20)}

/* ---- 思伴聊屋（#/screen）专用顶栏条：给它让出头像的位置 ----
   该页会把 brand / menu-nav / status-row 整条隐藏、显示 .gym-topbar；
   .gym-topbar 原本 width:100% 会把头像挤出可视区 ⇒ 这里改成「占满剩余空间」。 */
body:has(.gym-page) .app-top-nav .top-nav-row > .gym-topbar{flex:1 1 auto;width:auto;min-width:0}

/* ---- 窄屏：头像仍固定在右上角，绝不参与换行后的折叠 ---- */
@media (max-width:760px){
  .nav-avatar-wrap{margin-left:auto;order:9}
  .nav-avatar-menu{width:min(268px,calc(100vw - 24px))}
}

/* ========================= 暗档 ========================= */
html[data-theme="dark"] .nav-avatar{background:#241E44;border-color:rgba(255,255,255,.24)}
html[data-theme="dark"] .nav-avatar-txt{color:#C9B6FF}
html[data-theme="dark"] .nav-avatar-menu{background:#1A1635;color:#EDE9FF;border-color:rgba(255,255,255,.10);box-shadow:0 20px 46px -12px rgba(0,0,0,.66)}
html[data-theme="dark"] .nam-head{border-bottom-color:rgba(255,255,255,.10)}
html[data-theme="dark"] .nam-av{background:linear-gradient(135deg,rgba(143,90,240,.22),rgba(40,194,200,.18))}
html[data-theme="dark"] .nam-av span{color:#C9B6FF}
html[data-theme="dark"] .nam-meta b{color:#EDE9FF}
html[data-theme="dark"] .nam-meta span{color:#A99FC8}
html[data-theme="dark"] .nam-sec + .nam-sec{border-top-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .nam-cap{color:#8E84B0}
html[data-theme="dark"] .nam-row{color:#D9D2F5}
html[data-theme="dark"] .nam-row:hover{background:rgba(143,90,240,.16);color:#CDBBF5}
html[data-theme="dark"] .nam-row.is-cur{background:rgba(143,90,240,.22);color:#CDBBF5}
html[data-theme="dark"] .nam-ic{color:#8F5AF0}
html[data-theme="dark"] .nam-val{color:#9A8FC0}
html[data-theme="dark"] .nam-chev{border-right-color:#5C5280;border-bottom-color:#5C5280}
html[data-theme="dark"] .nam-confirm{background:rgba(255,214,140,.10);border-color:rgba(255,214,140,.28);color:#F0D9A8}
html[data-theme="dark"] .nam-cf-no{background:transparent;color:#F0D9A8;border-color:rgba(255,214,140,.30)}
html[data-theme="dark"] .app-top-nav .nav-more-body > a.nmb-l1{color:#D9D2F5}
html[data-theme="dark"] .app-top-nav .nav-more-body > a.nmb-l1:hover{background:rgba(143,90,240,.16);color:#CDBBF5}
html[data-theme="dark"] .app-top-nav .nav-more-body > a.nmb-l2{color:#A99FC8}
html[data-theme="dark"] .app-top-nav .nav-more-body > a.nmb-l2:hover{background:rgba(143,90,240,.16);color:#CDBBF5}

/* ---- 窄屏给主导航让位（批90 补）----
   实测：不动这些的话，960 宽就只剩 3 个一级项、760 宽只剩 1 个 —— 折叠太狠，
   「首页 / 学习地图 / 测评 / 错题本」这些高频项反而被收进【更多】里。
   让位顺序有讲究：先收装饰（小伴待命 pill / 品牌文字 / 按钮文字），
   业务导航与头像一个都不让。 */
@media (max-width:1100px){
  .app-top-nav .top-nav-row > .status-row .status-pill{display:none}
  .app-top-nav .top-nav-row > .status-row .nav-eb-btn{font-size:0;padding:7px 10px}
  .app-top-nav .top-nav-row > .status-row .nav-eb-btn::before{content:"\1F4F8";font-size:14px;line-height:1}
}
@media (max-width:980px){
  .app-top-nav .top-nav-row > .brand .brand-txt{display:none}
}
@media (max-width:860px){
  .app-top-nav .top-nav-row > .status-row .coach-toggle .ct-txt{display:none}
  .app-top-nav .top-nav-row{padding-left:14px;padding-right:14px;gap:8px}
}
/* ---- ≤560：顶栏换行，导航独占一整行（批90 补）----
   实测（420 宽）：不换行时导航条只剩 141px，10 个一级项只有「首页」露在外面，
   其余 9 项全被塞进【更多】 —— 用户点名要的「学习地图 / 测评 / 错题本」反而没了。
   换行后导航拿满整行（394px）⇒ 420 可见 5 项；📸录入新错题 / 陪学 / 主题
   一个都不用藏。（隐藏 status-row 的方案实测 420 只能到 3 项，还要砍三个能力。）

   为什么不能只补 flex-wrap：换行意图本来就写在上面 ≤760 那条里，但
   body[data-tone=mirror] .app-top-nav .top-nav-row（L3666，特异性更高、且带
   height:var(--tb-h)）把它压成了死代码 —— 只解锁 flex-wrap，固定高度会把换行后的
   内容重新挤回一行。所以 height / min-height 要一起放开。
   同特异性 + 位置更靠后 ⇒ 不需要 !important。 */
@media (max-width:560px){
  body[data-tone] .app-top-nav .top-nav-row{
    flex-wrap:wrap;height:auto;min-height:auto;
    padding-left:14px;padding-right:14px;padding-bottom:8px;gap:8px;row-gap:6px}
  .app-top-nav .top-nav-row > .brand{order:1;flex:0 0 auto}
  .app-top-nav .top-nav-row > .status-row{order:2;flex:0 0 auto}
  /* 【更多】的 order 必须【小于】头像 —— 换行后两者仍在同一行，
     只要 wrap 排在头像右边（哪怕只大 1），头像就会被顶离右上角：
     实测 420 宽下头像右缘 291、而该行右界 406 —— 违反「头像固定右上角」硬要求。
     所以本档序列是 brand 1 → status 2 → 更多 3 → 头像 4（头像拿 margin-left:auto 吃满剩余）。
     本档 nav 是 order:9 + flex-basis:100% ⇒ 独占下一行，不参与本行首尾之争。 */
  .app-top-nav .top-nav-row > .nav-more-wrap{order:3;flex:0 0 auto}
  .app-top-nav .top-nav-row > .nav-avatar-wrap{order:4;flex:0 0 auto;margin-left:auto}
  .app-top-nav .top-nav-row > .menu-nav{order:9;flex:1 1 100%;justify-content:flex-start}
}

/* ============================================================
 * [2026-09-30 深色收尾] 全站漏改清零（真机探针驱动清单，22 路由扫描）
 *   根因：这批卡面把背景钉死在浅色（CSS 硬编码或内联 #fff），
 *   深色下 --ink 变白 → 「白底白字」标题隐形（用户报障：学科小卡名字不显示）。
 *   修法：全部转深色令牌（--surface/--surface-2/--line），文字走 var(--ink) 自动适配。
 *   内联 #fff 的（.mth-tool/.subj-tool-card/.rf-card）用 !important 压制。
 * ============================================================ */
/* ① 全局：首次完善资料卡（每页弹出的白卡） */
html[data-theme="dark"] .name-onboard-card{background:var(--surface);border:1px solid var(--hair-strong);box-shadow:0 18px 44px -20px rgba(0,0,0,.6)}
/* ② 首页 hero 问候条 */
html[data-theme="dark"] .hm-hero .hero-greet{background:var(--surface-2);color:var(--ink)}
/* ③ 数学四板大卡（page.css 硬编码 #fff / #f8f9fc） */
html[data-theme="dark"] .mth-plate{background:var(--surface);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .mth-plate b{color:var(--ink)}
html[data-theme="dark"] .mth-plate small{color:var(--ink-2)}
html[data-theme="dark"] .mth-plate:hover{background:var(--surface-2)}
html[data-theme="dark"] .mth-plate:hover b{color:var(--ink)}
html[data-theme="dark"] .mth-plate:hover small{color:var(--ink-2)}
html[data-theme="dark"] .mth-plate.on{background:linear-gradient(180deg,rgba(139,111,232,.16) 0%,rgba(40,194,200,.08) 100%);border-color:rgba(155,140,255,.42)}
html[data-theme="dark"] .mth-plate.on b{color:var(--ink)}
html[data-theme="dark"] .mth-plate.is-empty{background:var(--surface-2)!important;border-color:var(--hair)}
html[data-theme="dark"] .mth-plate.is-empty b{color:var(--ink-2)}
html[data-theme="dark"] .mth-plate.is-empty small{color:var(--ink-3)}
html[data-theme="dark"] .mth-plate.is-empty .mth-plate-ic{background:var(--surface-3);border-color:var(--hair-strong);color:var(--ink-3)}
/* ④ 数学/化学工具箱卡（内联 #fff，!important 压制；标题 var(--ink) 自动转白 → 名字恢复可见） */
html[data-theme="dark"] .mth-tool,
html[data-theme="dark"] .subj-tool-card{background:var(--surface)!important;border-color:rgba(155,140,255,.26)!important;box-shadow:0 2px 10px -4px rgba(0,0,0,.5)}
/* ⑤ 数学页底部 CTA 白底按钮（page.css :1059 白底紫字） */
html[data-theme="dark"] .mth-cta-go{background:var(--surface-3);color:var(--purple-d)}
/* ⑥ 学科页年级/版本切换条（page.css :827 白底；物理页已有专属深色版不受影响） */
html[data-theme="dark"] .v12-qswitch{background:var(--surface);border:1px solid var(--hair);box-shadow:none}
html[data-theme="dark"] .v12-qswitch .qs-lbl{color:var(--ink-3)}
html[data-theme="dark"] .v12-qswitch .qs-pill{background:var(--surface-2);color:var(--ink-2);border-color:var(--hair-strong)}
html[data-theme="dark"] .v12-qswitch .qs-pill:hover:not(.on){background:var(--surface-3);border-color:var(--purple);color:var(--ink)}
/* ⑦ 地理/历史/政治功能卡（desktop.css 硬编码浅底） */
html[data-theme="dark"] .geo-card{background:var(--surface);border-color:rgba(63,224,200,.25)}
html[data-theme="dark"] .his-card{background:var(--surface);border-color:rgba(217,149,59,.35)}
html[data-theme="dark"] .pol-dom{background:var(--surface);border-color:var(--hair-strong)}
html[data-theme="dark"] .pol-card{background:var(--surface);border-color:var(--hair-strong)}
/* ⑧ 语文 hero 大卡 + 章节目录 + 字词卡（page.css 硬编码白/米白） */
html[data-theme="dark"] .chn-hero-v3{background:var(--surface);border-color:var(--hair-strong);box-shadow:none}
html[data-theme="dark"] .chn-toc-item{background:var(--surface);border-color:var(--hair-strong)}
html[data-theme="dark"] .chn-toc-item:hover{background:var(--surface-2)}
html[data-theme="dark"] .chn-letter-go{background:var(--surface-2);color:var(--cyan-d);border-color:rgba(63,224,200,.35)}
/* ⑨ rflow 复习卡（app.js 注入样式 #fff，!important 压制） */
html[data-theme="dark"] .rf-card{background:var(--surface)!important;border-color:var(--hair-strong)!important;box-shadow:none}
/* ⑩ 设置页学科小卡（「各学科小卡名字没有显示」主现场之一） */
html[data-theme="dark"] .gx-subj-card{background:var(--surface)!important;border-color:var(--hair-strong)}
html[data-theme="dark"] .gx-subj-card:hover{background:var(--surface-2)!important}
/* ⑪ 专项工具输入控件（白底输入框） */
html[data-theme="dark"] .gx-card textarea,
html[data-theme="dark"] .gx-card input,
html[data-theme="dark"] .gx-card .out{background:var(--surface-2);color:var(--ink);border-color:var(--hair-strong)}
/* ⑫ 各科 hero 区 ghost 按钮（白底描边钮在深色 hero 上刺眼） */
html[data-theme="dark"] .chem-acts .btn.ghost,
html[data-theme="dark"] .pol-acts .btn.ghost,
html[data-theme="dark"] .phy-acts .btn.ghost,
html[data-theme="dark"] .mth-acts .btn.ghost{background:rgba(255,255,255,.08);color:var(--ink);border-color:var(--hair-strong)}

/* ⑬ [2026-09-30 深色收尾·残余补齐] 终扫余量（rflow 气泡/按钮、语文 ink/ghost、extras 输入框） */
html[data-theme="dark"] .rf-bubble{background:var(--surface-2)!important;color:var(--ink)!important}
html[data-theme="dark"] .rf-btn.ghost{background:var(--surface-3)!important;color:var(--ink)!important}
html[data-theme="dark"] .chn-v3-ink{background:var(--surface-2);color:var(--ink)}
html[data-theme="dark"] .chn-btn-ghost{background:rgba(255,255,255,.08);color:var(--ink);border-color:var(--hair-strong)}
html[data-theme="dark"] .extras-grid .gx-card input[type="text"],
html[data-theme="dark"] .extras-grid .gx-card input:not([type]){background:var(--surface-2)!important;color:var(--ink)!important;border-color:var(--hair-strong)!important}
/* ⑭ [2026-10-11 批137c] 学习计划「当前分 / 目标分 / 时限(天)」三个数字输入框：
   app.js 内联样式只给了 width/padding/border-radius/border，**没给 background** ⇒
   深色下沿用 UA 默认白底，在深色卡里是三块纯白方块（真机实测 rgb(255,255,255)）。
   内联未声明 background ⇒ 本规则无需 !important 即可生效。 */
html[data-theme="dark"] #spCurrent,
html[data-theme="dark"] #spTarget,
html[data-theme="dark"] #spLimit{background:var(--surface-2);color:var(--ink);border-color:var(--hair-strong)}

/* ===== [2026-09-30 深色收尾·补] 知识点小卡（.gx-kp）家族 =====
   卡底/徽片底走的是**内联** --kp-bg（gameui.js MAS_STYLE 写死 #f8f9fc 近白），
   深色下 --ink 变白 ⇒ 白底白字。这里用显式 background 压过 var(--kp-bg)。
   注意：物理学科页 .subj-phy-page 自带 dark-glass 小卡主题（本文件 :823 起），
   末尾按原 var(--kp-bg) 回断，避免通用深色吃掉物理专属视觉。 */
html[data-theme="dark"] .gx-kp{background:var(--surface-2,#2D2748);border-color:var(--hair-strong,rgba(255,255,255,.14))}
html[data-theme="dark"] .gx-kp:hover{background:var(--surface-3,#3A3164);border-color:rgba(155,140,255,.45);box-shadow:0 6px 18px -8px rgba(0,0,0,.4)}
html[data-theme="dark"] .kp-ic{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.10)}
html[data-theme="dark"] .gx-kp-mas{background:rgba(255,255,255,.06);color:var(--ink-3,#B8AEE0);border-color:rgba(255,255,255,.14)}
html[data-theme="dark"] .subj-phy-page .gx-kp{background:var(--kp-bg);border-color:rgba(40,224,255,.35)}
html[data-theme="dark"] .subj-phy-page .kp-ic{background:rgba(40,224,255,.08);border-color:rgba(40,224,255,.20)}
html[data-theme="dark"] .subj-phy-page .gx-kp-mas{background:rgba(40,224,255,.08);color:#a5e9ff;border-color:rgba(40,224,255,.22)}

/* ===== [2026-09-30 深色收尾·补2] 学科彩卡（#/subjects 总览 与 设置页共用） =====
   深色下卡底已转深（上方 .gx-subj-card 规则），但卡名 .sc-body b 硬编码 #241F38 深墨
   ⇒ 深底深字隐形（PM 报障「学科的名字看不见」）；描述 p 的 #9A93AE 顺手提到令牌。 */
html[data-theme="dark"] .gx-subj-card .sc-body b{color:var(--ink,#FFFFFF)}
html[data-theme="dark"] .gx-subj-card .sc-body p{color:var(--ink-3,#B8AEE0)}

/* ============================================================
 * [R941] 主页顶栏深浅开关：hidden 属性失效的真因修复
 * ------------------------------------------------------------
 * 上一轮给 .status-row 内那枚 theme-switch 加了 hidden，但按钮**照样显示**。
 * 根因：common/theme-switch.css:14 的 `.theme-switch{...display:inline-flex}`，
 *       特异性 (0,1,0) 压过 UA 的 `[hidden]{display:none}`（UA 样式表优先级最低）
 *       ⇒ hidden 属性对带 display 的 class 元素无效。
 *       同款病灶项目里已修过一次（desktop.css 的「创归思之眼」段 2157-2168）。
 * 修法：作用域收在 .status-row 内补 !important 覆盖。
 * ⚠️ 为什么不写全局 `.theme-switch[hidden]{...}`：其它页面那 15+ 枚同款开关里，
 *    若有用 hidden 表达「先藏、JS 就绪再显」的，全局 !important 会把它们永久钉死。
 * ============================================================ */
.status-row [hidden]{display:none !important}

/* ============================================================
 * [R946] 物理主页锁深色：页内不出现任何「切浅色」的死出口
 * ------------------------------------------------------------
 * 用户要求物理主页（#/subject/physics）只保留深色档——深空母题外壳的霓虹
 * HUD / 暗底 / 粉紫渐变在浅色档对比度崩。app.js:render() 进入该页即强制
 * data-theme=dark 并给 body 挂 .phy-darkonly；本规则把页内所有深浅切换钮
 * （顶栏 .status-row 那枚 + 常驻 DOM 的 .gym-topbar-acts 那枚）一并收掉，
 * 避免出现「点了立刻被弹回深色」的死按钮。
 * ⚠️ 作用域必须收在 .phy-darkonly 内：全局隐藏会波及其它 15+ 枚同款开关。
 * ============================================================ */
body.phy-darkonly [data-theme-switch]{display:none !important}

/* ============ [批175 T1/T2/T3] ROW1 右列侧栏容器 + 我的提醒卡 + 今日三件事 + 送达横幅 ============ */
.hm-dash .hm-row1 .hm-side{display:flex;flex-direction:column;gap:16px;min-height:0}
.hm-dash .hm-row1 .hm-side .hm-today{flex:1 1 auto}
.hm-dash .hm-remind{flex:0 0 auto;min-height:0}
.hm-remind [hidden]{display:none!important}
.hm-remind .hr-badge{min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:#F56C6C;color:#fff;font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;line-height:1}
.hm-remind .hr-list{margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:6px;max-height:150px;overflow:auto}
.hm-remind .hr-item{display:flex;align-items:center;gap:8px;font-size:12px;line-height:1.45;border-radius:8px;padding:5px 8px;background:rgba(255,255,255,.05)}
.hm-remind .hr-item .t{flex:1 1 auto;min-width:0;color:var(--hm-sub);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm-remind .hr-item.due{background:rgba(245,108,108,.14)}
.hm-remind .hr-item.due .t{color:#FFB4B4;font-weight:700}
.hm-remind .hr-item.done{opacity:.45}
.hm-remind .hr-item .when{flex:none;font-size:10.5px;color:var(--hm-dim);font-variant-numeric:tabular-nums}
.hm-remind .hr-item .go{flex:none;font-size:11px;font-weight:800;color:var(--hm-brand2,#a78bfa);text-decoration:none}
.hm-remind .hr-item .del{flex:none;border:0;background:none;color:var(--hm-dim);cursor:pointer;font-size:14px;line-height:1;padding:0 2px}
.hm-remind .hr-item .del:hover{color:#FFB4B4}
.hm-remind .hr-empty{font-size:11.5px;color:var(--hm-dim);line-height:1.6}
.hm-remind .hr-form{display:flex;flex-direction:column;gap:7px;margin-bottom:10px}
.hm-remind .hr-in,.hm-remind .hr-when input{width:100%;box-sizing:border-box;padding:7px 9px;border-radius:8px;border:1px solid var(--hm-brd);background:rgba(255,255,255,.07);color:#fff;font-size:12px;color-scheme:dark}
.hm-remind .hr-in::placeholder,.hm-remind .hr-when input::placeholder{color:var(--hm-dim)}
.hm-remind .hr-when{display:flex;gap:7px}
.hm-remind .hr-acts{display:flex;gap:7px}
.hm-remind .hr-btn{flex:1;padding:7px 0;border-radius:8px;border:1px solid var(--hm-brd);background:rgba(255,255,255,.07);color:var(--hm-sub);font-size:12px;font-weight:700;cursor:pointer}
.hm-remind .hr-btn.pri{background:var(--hm-brand2,#a78bfa);border-color:transparent;color:#1B1436}
.hm-remind .hr-new{width:100%;padding:7px 0;border-radius:8px;border:1px dashed rgba(255,255,255,.25);background:none;color:var(--hm-sub);font-size:12px;font-weight:700;cursor:pointer}
.hm-remind .hr-new:hover{background:rgba(255,255,255,.07)}
.hm-remind .hr-note{font-size:10px;color:var(--hm-dim);opacity:.75;margin-top:8px;line-height:1.5}
/* 今日三件事 items（today 到达后接管 checks 区；失败保留 checks 兜底） */
.hm-today .hm-ti-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;flex:1 1 auto;min-height:0}
.hm-today .hm-ti{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--hm-sub);line-height:1.5}
.hm-today .hm-ti .ring-tag{flex:none;font-size:10px;font-weight:800;padding:2px 7px;border-radius:99px;background:rgba(167,139,250,.18);color:var(--hm-brand2,#a78bfa)}
.hm-today .hm-ti .ring-tag.r-memory{background:rgba(138,240,234,.16);color:#8AF0EA}
.hm-today .hm-ti .ring-tag.r-fix{background:rgba(255,180,180,.14);color:#FFB4B4}
.hm-today .hm-ti .ring-tag.r-drill{background:rgba(255,217,160,.14);color:#FFD9A0}
.hm-today .hm-ti .t{flex:1 1 auto;min-width:0}
.hm-today .hm-ti.done .t{opacity:.45;text-decoration:line-through}
.hm-today .hm-ti .go{flex:none;font-size:11px;font-weight:800;color:var(--hm-brand2,#a78bfa);text-decoration:none}
/* [2026-10-16] 今日三件事完成注（服务端真源 done_note）：绿色小胶囊；放在 .t 之外，绕开 .done 的删除线与透明度 */
.hm-today .hm-ti .ti-note{flex:none;font-size:10px;font-weight:800;color:#7FE7BE;background:rgba(31,157,107,.22);padding:2px 7px;border-radius:99px;white-space:nowrap}
.hm-today .hm-ti-empty{font-size:11.5px;color:var(--hm-dim);line-height:1.7}
.hm-today .hm-ti-empty a{color:var(--hm-brand2,#a78bfa);text-decoration:none;font-weight:700}
/* 全局送达横幅（顶栏下方 fixed；[去做]/[知道了]；多条排队逐条展示） */
#czsRemindBanner{position:fixed;left:0;right:0;z-index:9999;display:flex;align-items:center;justify-content:center;gap:14px;padding:9px 16px;background:linear-gradient(90deg,#4B39CF,#7C5CF5);color:#fff;font-size:13px;font-weight:700;box-shadow:0 10px 30px rgba(20,8,60,.4)}
#czsRemindBanner .rb-ic{flex:none}
#czsRemindBanner .rb-txt{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#czsRemindBanner .rb-btn{flex:none;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.12);color:#fff;border-radius:99px;padding:4px 14px;font-size:12px;font-weight:800;cursor:pointer}
#czsRemindBanner .rb-btn.ghost{background:none;border-color:transparent;color:rgba(255,255,255,.8)}

/* ============ [批176] 底部整宽提醒流（小伴主动 + 我的 混排横滚）============ */
/* ============ [2026-10-17 #1135 PM 拍板] 品牌紫移交飞轮；本卡改静蓝（白字体系不变，仅换底色） ============ */
.hm-dash .hm-remind-stream{
  background:
    radial-gradient(120% 160% at 88% 120%,rgba(255,255,255,.14),transparent 55%),
    radial-gradient(90% 130% at 4% -30%,rgba(255,255,255,.10),transparent 60%),
    linear-gradient(112deg,#2E3E7E 0%,#46589E 46%,#6B7CB8 100%);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--hm-r-l);
  box-shadow:0 0 0 1px rgba(120,140,200,.16),0 24px 60px -28px rgba(40,55,110,.75);
  position:relative;overflow:hidden;
  padding:14px 16px 16px;
  display:flex;flex-direction:column;gap:11px}
.hm-dash .hm-remind-stream::before{
  content:"";position:absolute;left:14px;right:14px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);pointer-events:none}
.hm-dash .hm-remind-stream [hidden]{display:none!important}
.hm-dash .hm-remind-stream .rs-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.hm-dash .hm-remind-stream .rs-titles{display:flex;align-items:center;gap:12px;min-width:0}
.hm-dash .hm-remind-stream .rs-legend{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:rgba(255,255,255,.82);font-weight:700}
.hm-dash .hm-remind-stream .rs-legend .lg{width:16px;height:16px;border-radius:5px;display:inline-grid;place-items:center;font-style:normal;font-size:10px;font-weight:800;color:#1B1436}
.hm-dash .hm-remind-stream .rs-legend .lg-me{background:#B0A4F0}
.hm-dash .hm-remind-stream .rs-legend .lg-xb{background:#9DD5DA}
.hm-dash .hm-remind-stream .rs-acts{display:inline-flex;align-items:center;gap:8px;flex:none}
.hm-dash .hm-remind-stream .hr-badge{min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:#F56C6C;color:#fff;font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;line-height:1}
.hm-dash .hm-remind-stream .hr-stream{
  display:flex;gap:10px;overflow-x:auto;padding:2px 1px 8px;scrollbar-width:thin}
.hm-dash .hm-remind-stream .hr-card{
  flex:0 0 auto;min-width:190px;max-width:260px;display:flex;flex-direction:column;gap:5px;
  padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);position:relative}
.hm-dash .hm-remind-stream .hr-card.due{background:rgba(245,108,108,.16);border-color:rgba(245,108,108,.45)}
.hm-dash .hm-remind-stream .hr-card.done{opacity:.45}
.hm-dash .hm-remind-stream .hr-card .hr-tag{
  align-self:flex-start;font-size:10px;font-weight:800;color:#1B1436;border-radius:6px;padding:1px 7px;line-height:1.5}
.hm-dash .hm-remind-stream .hr-card .hr-tag.me{background:#B0A4F0}
.hm-dash .hm-remind-stream .hr-card .hr-tag.xb{background:#9DD5DA}
.hm-dash .hm-remind-stream .hr-card .t{font-size:13px;font-weight:700;color:#fff;line-height:1.4}
.hm-dash .hm-remind-stream .hr-card .when{font-size:10.5px;color:rgba(255,255,255,.75);font-variant-numeric:tabular-nums}
.hm-dash .hm-remind-stream .hr-card .go{position:absolute;right:10px;bottom:9px;font-size:11px;font-weight:800;color:#fff;text-decoration:none;text-shadow:0 1px 3px rgba(0,0,0,.25)}
.hm-dash .hm-remind-stream .hr-card .del{position:absolute;right:10px;top:8px;border:0;background:none;color:rgba(255,255,255,.72);cursor:pointer;font-size:14px;line-height:1;padding:0 2px}
.hm-dash .hm-remind-stream .hr-card.due .del{color:#FFB4B4}
.hm-dash .hm-remind-stream .hr-card .del:hover{color:#FFB4B4}
.hm-dash .hm-remind-stream .hr-empty{font-size:11.5px;color:rgba(255,255,255,.78);line-height:1.6;padding:4px 2px}
.hm-dash .hm-remind-stream .hr-form{display:flex;flex-direction:column;gap:7px;margin-bottom:4px}
.hm-dash .hm-remind-stream .hr-in,.hm-dash .hm-remind-stream .hr-when input{width:100%;box-sizing:border-box;padding:7px 9px;border-radius:8px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.12);color:#fff;font-size:12px;color-scheme:dark}
.hm-dash .hm-remind-stream .hr-in::placeholder,.hm-dash .hm-remind-stream .hr-when input::placeholder{color:rgba(255,255,255,.55)}
.hm-dash .hm-remind-stream .hr-when{display:flex;gap:7px}
.hm-dash .hm-remind-stream .hr-acts{display:flex;gap:7px}
.hm-dash .hm-remind-stream .hr-btn{flex:1;padding:7px 0;border-radius:8px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.12);color:rgba(255,255,255,.92);font-size:12px;font-weight:700;cursor:pointer}
.hm-dash .hm-remind-stream .hr-btn.pri{background:var(--hm-brand2,#a78bfa);border-color:transparent;color:#1B1436}
.hm-dash .hm-remind-stream .hr-new{width:auto;padding:6px 12px;border-radius:8px;border:1px dashed rgba(255,255,255,.35);background:none;color:rgba(255,255,255,.85);font-size:12px;font-weight:700;cursor:pointer}
.hm-dash .hm-remind-stream .hr-new:hover{background:rgba(255,255,255,.10)}
.hm-dash .hm-remind-stream .hr-note{font-size:10px;color:rgba(255,255,255,.65);margin-top:2px;line-height:1.5}

/* [2026-10-17 #1122] 首页底部重排：双引擎卡 + 素养工坊卡并为一行（对齐海报「别人家没有的两件事」）。
   提醒中心回落为整宽大卡置底（恢复 #1110-6 之前的版式），与上方双卡留 16px 间距；窄屏双卡回落堆叠。 */
.hm-dash .hm-bottom-row{display:flex;gap:16px;align-items:stretch}
.hm-dash .hm-bottom-row > .hm-duo,
.hm-dash .hm-bottom-row > .hm-ailit{flex:1 1 0;min-width:0;border-radius:var(--hm-r-l)}
/* [2026-10-17 #1135] 品牌飞轮模块插在双卡与提醒中心之间。区块间距统一由 .hm-dash 的
   flex gap:16px 供给（PM 实测下方间距是上方两倍＝旧 margin-top:16px 与 gap 叠加，已退役）。 */
@media (max-width:860px){
  .hm-dash .hm-bottom-row{flex-direction:column;gap:11px}
}

/* [2026-10-17 #1122/#1123] 双引擎分析入口卡：与素养工坊卡并排双列；紫调与素养卡暖金调区分；
   整卡点击 → 新标签开错题本思维陷阱分析（error-book/chat.html）。 */
.hm-dash .hm-duo{display:flex;flex-direction:column;margin:0;padding:14px 16px 16px 22px;border-radius:var(--hm-r-l);
  text-decoration:none;color:#3B3466;background:#F7F6FD;border:1px solid rgba(96,82,190,.12);
  box-shadow:0 8px 24px -18px rgba(96,82,190,.30);position:relative;overflow:hidden;min-height:0}
.hm-dash .hm-duo .duo-leftbar{position:absolute;left:0;top:0;bottom:0;width:4px;background:#6D5CE8}
.hm-dash .hm-duo .duo-header{display:flex;align-items:center;gap:12px;min-height:0}
.hm-dash .hm-duo .duo-title{display:inline-flex;align-items:center;gap:8px;font-size:15.5px;font-weight:900;
  letter-spacing:.3px;color:#3B3466}
.hm-dash .hm-duo .duo-ico{width:22px;height:22px;flex:none;display:grid;place-items:center}
.hm-dash .hm-duo .duo-ico svg{width:100%;height:100%}
.hm-dash .hm-duo .duo-badge{display:inline-block;padding:2px 8px;border-radius:999px;background:#E8552D;color:#fff;
  font-size:10.5px;font-weight:800;letter-spacing:.5px}
.hm-dash .hm-duo .duo-body{display:flex;flex-direction:column;gap:8px;margin-top:10px;flex:1 1 auto;min-width:0}
.hm-dash .hm-duo .duo-sub{display:block;font-size:12.5px;font-weight:800;color:#5B4FE0}
.hm-dash .hm-duo .duo-desc{display:block;font-size:12.5px;color:#5E5678;line-height:1.5}
.hm-dash .hm-duo .duo-chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hm-dash .hm-duo .duo-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;
  background:rgba(109,92,232,.10);color:#4A3FB8;font-size:11.5px;font-weight:800;white-space:nowrap}
.hm-dash .hm-duo .duo-chip.unc{background:rgba(160,150,175,.14);color:#6E6678}
.hm-dash .hm-duo .duo-loading{display:block;font-size:12px;color:#8D85A8}
.hm-dash .hm-duo .duo-empty{display:block;font-size:12px;color:#8D85A8;line-height:1.5}
.hm-dash .hm-duo .duo-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto;padding-top:12px;min-height:0}
.hm-dash .hm-duo .duo-stat{font-size:11.5px;color:#948CB2;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm-dash .hm-duo .duo-cta{font-size:13.5px;font-weight:800;background:var(--brand);color:#fff;
  padding:9px 16px;border-radius:999px;white-space:nowrap;box-shadow:0 6px 16px -8px rgba(139,111,232,.45);flex:none}

/* [2026-10-17 #1110-7] 素养工坊入口卡：标题置顶左上角（像提醒中心），CTA 置底右下角。
   [2026-10-17 #1135 PM 拍板] 与双引擎卡配对统一：同底色/边框/阴影/正文色，仅左侧条与图标保留暖金identity。 */
.hm-dash .hm-ailit{display:flex;flex-direction:column;margin:0;padding:14px 16px 16px 22px;border-radius:var(--hm-r-l);
  text-decoration:none;color:#3B3466;background:#F7F6FD;border:1px solid rgba(96,82,190,.12);
  box-shadow:0 8px 24px -18px rgba(96,82,190,.30);position:relative;overflow:hidden;min-height:0}
.hm-dash .hm-ailit .ailit-leftbar{position:absolute;left:0;top:0;bottom:0;width:4px;background:#D4A24C}
.hm-dash .hm-ailit .ailit-header{display:flex;align-items:center;gap:12px;min-height:0}
.hm-dash .hm-ailit .ailit-title{display:inline-flex;align-items:center;gap:8px;font-size:15.5px;font-weight:900;
  letter-spacing:.3px;color:#3B3466}
.hm-dash .hm-ailit .ailit-ico{width:22px;height:22px;flex:none;display:grid;place-items:center}
.hm-dash .hm-ailit .ailit-ico svg{width:100%;height:100%}
.hm-dash .hm-ailit .ailit-badge{display:inline-block;padding:2px 8px;border-radius:999px;background:#E8552D;color:#fff;
  font-size:10.5px;font-weight:800;letter-spacing:.5px}
.hm-dash .hm-ailit .ailit-body{display:flex;flex-direction:column;gap:8px;margin-top:10px;flex:1 1 auto;min-width:0}
.hm-dash .hm-ailit .ailit-desc{display:block;font-size:12.5px;color:#5E5678;line-height:1.5}
.hm-dash .hm-ailit .ailit-loading{display:block;font-size:12px;color:#8D85A8}
.hm-dash .hm-ailit .ailit-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto;padding-top:12px;min-height:0}
/* [2026-10-17 #1122] 素养卡 foot 左侧卖点短句（海报口径），CTA 仍右置 */
.hm-dash .hm-ailit .ailit-foot-note{font-size:11.5px;color:#948CB2;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm-dash .hm-ailit .ailit-cta{font-size:13.5px;font-weight:800;background:var(--brand);color:#fff;
  padding:9px 16px;border-radius:999px;white-space:nowrap;box-shadow:0 6px 16px -8px rgba(139,111,232,.45);flex:none}

/* ===== [#topbar-unify 2026-10-15] 全站顶栏统一 =====
/* 浅色档：白底 #FFFFFF + 深字 #221838（覆盖 base / math / data-mathtop 全部变体）
   ⚠️ 首页除外（2026-10-15 PM 拍板「只改主页」）：`body[data-tone="mirror"]` 的首页有自己
   第 4 套深紫顶栏皮肤（见上方 2026-09-17 段，底色 #1A1635）。本块写在文件更靠后、特异度又相同
   ⇒ 会把它整片盖成白底（实测：首页顶栏 background 被算成 rgb(255,255,255)、.brand-txt b 被
   算成 rgb(34,24,56)），与深紫首页割裂。故这 10 条一律加 `body:not([data-tone="mirror"])`
   排除首页，首页交回那段皮肤；其余页面（含学科页变体）的「浅色白」口径不变。
   data-tone 由 app.js 按路由写/删（ROUTE_TONE.home='mirror'），且 app.html 首帧即按 hash 抢跑
   落好 ⇒ 排除后不会出现「先白后紫」的闪色。 */
html:not([data-theme="dark"]) body:not([data-tone="mirror"]) .app-top-nav .top-nav{background:#FFFFFF;color:#221838}
html:not([data-theme="dark"]) body:not([data-tone="mirror"]) .app-top-nav .brand .brand-txt b{color:#221838}
html:not([data-theme="dark"]) body:not([data-tone="mirror"]) .app-top-nav .brand .brand-txt span{color:rgba(34,24,56,.6)}
html:not([data-theme="dark"]) body:not([data-tone="mirror"]) .app-top-nav .status-pill{color:#6D5EFC;background:#F0EBFF;border-color:rgba(109,94,252,.25)}
html:not([data-theme="dark"]) body:not([data-tone="mirror"]) .app-top-nav .status-pill .dot{background:#6D5EFC}
html:not([data-theme="dark"]) body:not([data-tone="mirror"]) .app-top-nav .theme-btn{background:#F0EBFF;border-color:rgba(109,94,252,.25);color:#6D5EFC}
html:not([data-theme="dark"]) body:not([data-tone="mirror"]) .app-top-nav .menu-nav > a{color:rgba(34,24,56,.72)}
html:not([data-theme="dark"]) body:not([data-tone="mirror"]) .app-top-nav .menu-nav > a:hover{background:rgba(109,94,252,.10);color:#6D5EFC}
html:not([data-theme="dark"]) body:not([data-tone="mirror"]) .app-top-nav .menu-nav .nav-toggle{color:rgba(34,24,56,.72)}
html:not([data-theme="dark"]) body:not([data-tone="mirror"]) .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(109,94,252,.10);color:#6D5EFC}
/* 深色档：标准黑 #1A1635 + 白字（math / data-mathtop 变体补全，base 已由 subpage-top-nav.css 覆盖） */
html[data-theme="dark"] .app-top-nav .top-nav{background:#1A1635;color:#FFFFFF}
html[data-theme="dark"] body[data-subject="math"] .app-top-nav .top-nav{background:#1A1635;color:#FFFFFF}
html[data-theme="dark"] body[data-subject="math"] .app-top-nav .brand .brand-txt b{color:#FFFFFF}
html[data-theme="dark"] body[data-subject="math"] .app-top-nav .brand .brand-txt span{color:rgba(255,255,255,.7)}
html[data-theme="dark"] body[data-subject="math"] .app-top-nav .status-pill{color:#C9B6FF;background:rgba(155,123,255,.16);border-color:rgba(155,123,255,.3)}
html[data-theme="dark"] body[data-subject="math"] .app-top-nav .status-pill .dot{background:#C9B6FF}
html[data-theme="dark"] body[data-subject="math"] .app-top-nav .theme-btn{background:rgba(155,123,255,.16);border-color:rgba(155,123,255,.3);color:#C9B6FF}
html[data-theme="dark"] body[data-subject="math"] .app-top-nav .menu-nav > a{color:rgba(255,255,255,.82)}
html[data-theme="dark"] body[data-subject="math"] .app-top-nav .menu-nav > a:hover{background:rgba(255,255,255,.14);color:#FFFFFF}
html[data-theme="dark"] body[data-subject="math"] .app-top-nav .menu-nav .nav-toggle{color:rgba(255,255,255,.82)}
html[data-theme="dark"] body[data-subject="math"] .app-top-nav .menu-nav .nav-toggle:hover{background:rgba(255,255,255,.14);color:#FFFFFF}
html[data-theme="dark"] body[data-mathtop] .app-top-nav .top-nav{background:#1A1635;color:#FFFFFF}

/* ===== [2026-10-17 #1135] 首页品牌模块：口号 + 飞轮示意图（官网 #flywheel section 同源） =====
   纯展示零按钮 —— 不放第三个出口，避免分散上方双卡与下方提醒中心的点击。
   PM 拍板：①紫色品牌底从提醒中心移交本模块；②飞轮纯品牌展示，不落数据；③底色与 ROW1 学习镜像 hero 同款三层材质（白光晕×2 + 112deg 三段渐变），尾段用 PM 色卡紫 #A979EC（hero 尾段 #A56BE8 同族），保证上下两条紫块视觉一致。
   四通道浅彩底卡在紫渐变底上形成反差；≤640px 降级。 */
.hm-dash .hm-flywheel{
  background:
    radial-gradient(120% 160% at 88% 120%,rgba(255,255,255,.20),transparent 55%),
    radial-gradient(90% 130% at 4% -30%,rgba(255,255,255,.16),transparent 60%),
    linear-gradient(112deg,#4B39CF 0%,#7C5CF5 46%,#A979EC 100%);
  border:1px solid rgba(255,255,255,.16);border-radius:var(--hm-r-l);
  box-shadow:0 0 0 1px rgba(167,139,250,.18),0 24px 60px -28px rgba(109,94,252,.85);
  padding:14px 14px 12px}
.hm-dash .fw-head{text-align:center;max-width:760px;margin:0 auto 10px}
.hm-dash .fw-eyebrow{display:inline-block;font-size:10px;font-weight:800;letter-spacing:1.5px;color:rgba(255,255,255,.85);margin-bottom:3px}
.hm-dash .fw-slogan{font-size:clamp(19px,2.3vw,25px);font-weight:900;letter-spacing:.5px;color:#FFFFFF;line-height:1.35;margin:0}
.hm-dash .fw-sub{margin:5px 0 0;font-size:12px;color:rgba(255,255,255,.82);line-height:1.55}
.hm-dash .fw-row{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px;align-items:stretch}
.hm-dash .fw-ch{background:var(--tint);border-radius:8px;overflow:hidden;border:1px solid rgba(40,30,38,.06);position:relative;
  padding:12px 18px 12px 10px;display:grid;grid-template-columns:118px 1fr;column-gap:16px;align-items:center}
.hm-dash .fw-ch::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--deep)}
.hm-dash .fw-ch-top{grid-column:1;grid-row:1/span 2;text-align:center;padding:2px 0;position:relative}
.hm-dash .fw-ch-top::after{content:'';position:absolute;top:4px;bottom:4px;right:-9px;border-right:1px dashed rgba(40,30,38,.14)}
.hm-dash .fw-ico{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--deep);color:#fff;font-size:13px;font-weight:800;line-height:1}
.hm-dash .fw-name{display:block;font-size:14px;font-weight:900;letter-spacing:1.5px;margin-top:3px;color:var(--deep)}
.hm-dash .fw-en{display:block;font-size:8px;font-weight:800;letter-spacing:2px;color:#998FAC;margin-top:1px}
.hm-dash .fw-tag{grid-column:2;grid-row:1;margin:0;text-align:left;font-size:13px;font-weight:800;color:var(--deep)}
.hm-dash .fw-mistakes{grid-column:2;grid-row:2;list-style:none;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 20px;margin:7px 0 0;padding:8px 4px 0 0;border-top:1px dashed rgba(40,30,38,.12)}
.hm-dash .fw-mistakes li{font-size:11px;color:#5E5678;line-height:1.6;margin-bottom:0}
.hm-dash .fw-mistakes li:last-child{margin-bottom:0}
.hm-dash .fw-mistakes li b{display:inline-block;font-size:9px;font-weight:800;color:#fff;background:var(--deep);border-radius:7px;padding:1.5px 5px;margin-right:3px}
.hm-dash .fw-chev{display:none}
.hm-dash .fw-loop{text-align:center;margin:4px 0 0}
.hm-dash .fw-loop-label{display:inline-flex;align-items:center;gap:6px;font-size:9.5px;font-weight:700;color:rgba(255,255,255,.78);letter-spacing:.5px}
@media (max-width:640px){
  .hm-dash .fw-ch{display:block;padding:8px 10px 9px}
  .hm-dash .fw-ch-top{padding:4px 0 2px}
  .hm-dash .fw-ch-top::after{display:none}
  .hm-dash .fw-tag{margin:6px 6px 0;text-align:center;font-size:11.5px;font-weight:700}
  .hm-dash .fw-mistakes{display:block;margin:6px 10px 0;padding:6px 0 0}
}
@media (max-width:460px){
  .hm-dash .fw-row{grid-template-columns:1fr;gap:8px}
  .hm-dash .hm-flywheel{padding:10px 8px 8px}
}
/* —— [#t884i 2026-10-17] 三改：全宽固定底栏 + 扫描图入对话流 + 动作按钮行内化（PM 参考图拍板）—— */
/* 工具钮横排 wrap 居中，提问框 flex-basis:100% 独占第二行 */
.eyes-bar{position:fixed;left:0;right:0;bottom:0;z-index:60;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 12px;
  padding:10px 20px calc(12px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--hair);
  box-shadow:0 -6px 24px rgba(30,20,60,.08)}
.eyes-bar .eyes-actions-hint{flex-basis:100%;text-align:center;font-size:12px;color:var(--ink-3)}
.eyes-bar .ctx-ask{display:flex;gap:10px;flex-basis:100%;max-width:860px;margin:0 auto}
.eyes-bar .ctx-ask input{flex:1 1 auto}
.eyes-bar .eyes-cam-select{max-width:240px}
.eyes-body{padding-bottom:150px}
.eyes-card[data-kind^="detected-"] .eyes-shot{display:none}
.eyes-chat{width:100%;max-width:900px;margin:0 auto}
.eyes-card[data-kind^="detected-"] .eyes-chat{max-height:none;overflow:visible}
.eyes-chat .eyes-msg-bot{align-self:flex-start}
.eyes-chat .eyes-msg-bot:has(> .eyes-msg-img){max-width:min(720px,100%)}
.eyes-msg-img{display:block;width:100%;max-height:300px;object-fit:contain;border-radius:14px;
  border:1px solid var(--hair);background:#F4F2EE;cursor:zoom-in;margin-top:2px}
.eyes-msg-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}
.eyes-msg-btn{border:1px solid rgba(109,94,252,.35);background:#fff;color:#5b4bd6;border-radius:999px;
  padding:6px 14px;font-size:12.5px;font-weight:600;cursor:pointer;line-height:1.3}
.eyes-msg-btn.pri{background:linear-gradient(135deg,#7C5CFC,#6D5EFC);border-color:transparent;color:#fff;
  box-shadow:0 3px 10px rgba(109,94,252,.3)}
.eyes-chat .eyes-ctx{align-self:center;width:min(860px,100%);background:transparent;border:none;
  box-shadow:none;padding:2px 0;margin:2px 0}
[data-theme="dark"] .eyes-bar{background:rgba(30,26,52,.96);border-color:rgba(155,140,255,.25);box-shadow:none}
[data-theme="dark"] .eyes-msg-btn{background:rgba(155,140,255,.14);color:#cfc6ff;border-color:rgba(155,140,255,.4)}
[data-theme="dark"] .eyes-msg-btn.pri{background:linear-gradient(135deg,#6D5EFC,#5847e8);color:#fff;border-color:transparent}
[data-theme="dark"] .eyes-msg-img{background:#1E1B2E}
/* —— [#t884j 2026-10-17] 四改：图像框/对话流分区（PM 参考图拍板）——
   ① 相机工具条撤出视口底栏，回到图像框正下方（识别态整页定高不滚动 ⇒ 视觉固定）；
   ② 对话流独立成栏：底色 #F5F5F7 铺满「图像框 + 左侧栏 + 底栏」之外的屏幕，内部滚动；
   ③ 🎤 语音提问挪到提问框行内（发送按钮旁）；④ 扫描图回到图像框（撤 #t884i 图气泡）。 */
.eyes-actions.eyes-bar{position:static;flex-wrap:wrap;justify-content:flex-start;gap:8px 10px;
  padding:10px 2px 0;background:transparent;border:none;box-shadow:none;
  -webkit-backdrop-filter:none;backdrop-filter:none}
.eyes-actions.eyes-bar .eyes-actions-hint{flex-basis:auto;text-align:left}
.eyes-card .eyes-body{padding-bottom:6px}
.eyes-askbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;justify-content:center;align-items:center;
  padding:10px 20px calc(12px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--hair);
  box-shadow:0 -6px 24px rgba(30,20,60,.08)}
.eyes-askbar .ctx-ask{display:flex;gap:10px;align-items:center;width:min(860px,100%);margin:0;
  background:transparent;padding:0;border:none}
.eyes-askbar .ctx-ask input{flex:1 1 auto;border:1px solid var(--hair);background:#fff;border-radius:999px;
  padding:10px 16px;font-size:14px;color:var(--ink);outline:none}
.eyes-askbar .ctx-ask input:focus{border-color:rgba(109,94,252,.55)}
.eyes-askbar .ctx-ask .eyes-mic{flex:0 0 auto;white-space:nowrap}
/* 识别态分区：左图像框（下挂工具条）+ 右对话流灰底，整页定高、内部滚 */
.eyes-card[data-kind^="detected-"]{background:transparent;border:none;box-shadow:none;padding:0;overflow:visible}
.eyes-card[data-kind^="detected-"] .eyes-head{display:none}
body:has(#eyesCard[data-kind^="detected-"]) .page-head{display:none}
body:has(#eyesCard[data-kind^="detected-"]) main{min-height:0;height:auto}
body:has(#eyesCard[data-kind^="detected-"]) .app-top-nav{min-height:0}
/* ⬇ 压过 body:has(.myquest-shell) .main 的 padding-bottom:80px !important（!important 只能 !important 赢） */
body:has(#eyesCard[data-kind^="detected-"]) .app-layout > .main{padding-bottom:0 !important}
.eyes-shell:has(#eyesCard[data-kind^="detected-"]) > .mq-main{padding-left:12px;padding-right:0}
.eyes-card[data-kind^="detected-"] .eyes-body{
  display:grid;grid-template-columns:minmax(340px,44%) minmax(0,1fr);
  grid-template-rows:minmax(0,1fr) auto;grid-template-areas:"stage chat" "tools chat";
  gap:0 16px;align-items:stretch;height:calc(100vh - var(--mq-top,58px) - 88px);padding-bottom:0}
.eyes-card[data-kind^="detected-"] .eyes-stage{grid-area:stage;min-height:0}
.eyes-card[data-kind^="detected-"] .eyes-actions.eyes-bar{grid-area:tools}
.eyes-card[data-kind^="detected-"] .eyes-chat{grid-area:chat;height:100%;min-height:0;overflow-y:auto;
  background:#F5F5F7;border:none;border-radius:14px 0 0 14px;padding:16px 18px 22px;
  max-width:none;width:100%;margin:0}
.eyes-card[data-kind^="detected-"] .eyes-shot{display:block;max-height:52vh}
[data-theme="dark"] .eyes-card[data-kind^="detected-"] .eyes-chat{background:#221E38}
[data-theme="dark"] .eyes-askbar{background:rgba(30,26,52,.96);border-color:rgba(155,140,255,.25);box-shadow:none}
[data-theme="dark"] .eyes-askbar .ctx-ask input{background:rgba(155,140,255,.1);border-color:rgba(155,140,255,.3)}
/* —— [#t885 2026-10-17] PM 拍板：扫描识别后**仍是三屏**（左小伴 / 中图像+对话 / 右开门记录）——
   背景：#t884j 把对话流做成中屏「右列」（图像左 44% + 对话右列），同时 quest-shell 在非 idle 态
   隐藏右看板 ⇒ 视觉上右屏被对话占掉。PM 口径：右屏还原来的右屏（开门记录），对话回中屏图像下方，
   窄屏只需收右看板，中屏永远单列 —— 处理最简。
   ① .eyes-body 单列三段：图像框 / 工具条 / 对话流（对话吃剩余高度、内部滚动、灰底铺满）；
   ② 对话流四角圆角（不再贴屏幕右缘）；③ 中屏两侧各留 12px 与看板/面板分隔。 */
/* —— [#t889 2026-10-18 PM] 识别态改纵向**弹性四段**（图框 / 已认出条 / 工具条 / 对话流）——
   PM：「上面的图固定后，下面的对话流的窗口高度很小，改成图框不固定」。
   旧账：图框是 42vh 的硬轨道（还叠了一条 max-height:55vh 的内联），吃掉 403px；
        对话流只剩 260px，其中 167px 又被「已认出」块占掉 ⇒ 真正能看消息的地方不到 100px。
   新口径：① 图框不再占固定份额——按图片比例自适应，限高 clamp(140px,26vh,300px)，随窗口收缩；
          ② 对话流 flex:1 吃剩余全部高度（内部滚）；
          ③ 「已认出 …」从对话流里搬出来贴在图框下面（order:2），与图框挨着；
          ④ 顺序全由 flex order 决定：图框 1 → 已认出 2 → 工具条 3 → 对话流 4。 */
.eyes-card[data-kind^="detected-"] .eyes-body{
  display:flex;flex-direction:column;gap:8px;align-items:stretch;
  flex:1 1 auto;height:auto;min-height:0;padding-bottom:0}
.eyes-card[data-kind^="detected-"] .eyes-stage{order:1;flex:0 0 auto;min-height:0;max-height:none;aspect-ratio:auto;
  height:clamp(230px,44vh,560px)}
.eyes-card[data-kind^="detected-"] .eyes-shot{max-height:clamp(140px,26vh,300px);height:auto;object-fit:contain}
.eyes-card[data-kind^="detected-"] .eyes-ctx{order:2;flex:0 0 auto;width:100%}
.eyes-card[data-kind^="detected-"] .eyes-actions.eyes-bar{order:3;flex:0 0 auto}
.eyes-card[data-kind^="detected-"] .eyes-chat{order:4;flex:1 1 auto;height:auto;min-height:0;max-height:none;
  overflow-y:auto;background:#F5F5F7;border:none;border-radius:14px;padding:14px 18px 18px;
  max-width:none;width:100%;margin:0}
.eyes-card[data-kind^="detected-"] .eyes-chat .eyes-ctx{width:100%}
.eyes-shell:has(#eyesCard[data-kind^="detected-"]) > .mq-main{padding-left:12px;padding-right:12px;
  display:flex;flex-direction:column;min-height:0;overflow:hidden;
  height:calc(100vh - var(--mq-top,58px) - 96px);padding-top:12px;padding-bottom:12px}
.eyes-card[data-kind^="detected-"]{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
[data-theme="dark"] .eyes-card[data-kind^="detected-"] .eyes-chat{background:#221E38;border-radius:14px}
/* t885 续：右看板回到三屏后 ——
   ① 眼睛页 3 个 stat（认出纸面/存入错题本/小伴开口陪讲）在 320px 看板里改**竖排列表**：
      共享的 2 列会让第 3 个折到下一行留空，3 列又会把「存入错题本」折字；
   ② 识别态有全宽底栏，看板高度让出 96px，避免底部被底栏压住。 */
.myquest-shell.eyes-shell > .mq-board .mq-board-stats{grid-template-columns:minmax(0,1fr);gap:6px;margin-bottom:12px}
.myquest-shell.eyes-shell > .mq-board .mq-board-stat{display:flex;align-items:baseline;gap:9px;padding:8px 12px}
.myquest-shell.eyes-shell > .mq-board .mq-board-stat b{font-size:19px;line-height:1;min-width:20px}
.myquest-shell.eyes-shell > .mq-board .mq-board-stat span{margin-top:0;font-size:11.5px}
.eyes-shell:has(#eyesCard[data-kind^="detected-"]) > .mq-board{height:calc(100vh - var(--mq-top,58px) - 96px)}
/* t885 续2：窄屏（≤1100，右看板已收、mirror 顶上）—— 图像框与对话流按 45:55 分剩余高度，
   否则 42vh 的固定上限会把对话流压成一条缝；mirror 的 3 张统计卡同步紧凑化。 */
@media (max-width:1100px){

  .myquest-shell.eyes-shell .mq-main-stats{margin-bottom:8px}
  .myquest-shell.eyes-shell .mq-main-stats > .mq-board-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .myquest-shell.eyes-shell .mq-main-stats .mq-board-stat{padding:6px 8px}
  .myquest-shell.eyes-shell .mq-main-stats .mq-board-stat b{font-size:16px}
  .myquest-shell.eyes-shell .mq-main-stats .mq-board-stat span{font-size:10.5px;margin-top:1px}
}


/* ===== [#t887 2026-10-18] 知识开门 · 三处收口（PM：「还剩三处该动」）=====
   ① 一个页面只留一个输入口：左屏小伴面板不再摆第二个输入框（问在中屏，那里能看到刚拍的这一页）；
   ② 工具条从 6 颗散钮收到「主位 2 颗 + 更多 ▾」，次级工具收进原生 details（能力一个不删）；
   ③ 卡片语言收敛为两套：**内容卡 14px / 胶囊 999px**（8/10/12/13/16px 等零散值一律归一）。
   附带：idle 态图像框限高 —— 原来 16:9 定比在 1881×960 下把整条工具条顶出视口（scrollH 1236 > 960）。*/

/* —— ① 左屏：不给第二个输入框，只留一行指路 —— */
.myquest-shell.eyes-shell > .mq-ai .ai-side-panel .asp-input-row{display:none}
.eyes-ai-foot-hint{font-size:12px;line-height:1.5;color:var(--ink-3);text-align:center;
  background:rgba(109,94,252,.06);border:1px dashed rgba(109,94,252,.24);
  border-radius:999px;padding:7px 12px;margin:0 0 8px}
[data-theme="dark"] .eyes-ai-foot-hint{color:#B8AEE0;background:rgba(155,140,255,.1);border-color:rgba(155,140,255,.3)}

/* —— ② 工具条「更多 ▾」（原生 details，零 JS 依赖）—— */
.eyes-actions.eyes-bar .eyes-more{position:relative;display:inline-flex;margin:0}
.eyes-more>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:5px;
  font-size:13px;font-weight:600;line-height:1.2;color:var(--ink-2);background:#fff;
  border:1px solid var(--hair);border-radius:999px;padding:8px 14px;user-select:none}
.eyes-more>summary::-webkit-details-marker{display:none}
.eyes-more>summary::after{content:'\25BE';font-size:10px;opacity:.65}
.eyes-more[open]>summary::after{content:'\25B4'}
.eyes-more>summary:hover{border-color:rgba(109,94,252,.45);color:var(--purple-d)}
.eyes-more[open]>summary{border-color:rgba(109,94,252,.5);color:var(--purple-d);background:#F7F5FF}
/* 弹出层照「内容卡」语言：14px 圆角 + 1px 边 + 投影；内部按钮保持胶囊 */
.eyes-more-body{display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  position:absolute;left:0;bottom:calc(100% + 8px);z-index:40;min-width:200px;max-width:min(420px,72vw);
  padding:10px;background:#fff;border:1px solid var(--hair);border-radius:14px;
  box-shadow:0 14px 36px -12px rgba(30,20,60,.32)}
.eyes-more-body .btn{flex:0 0 auto;min-width:0;font-size:13px;padding:7px 12px}
.eyes-more-body .eyes-tools-more{display:flex;flex-direction:column;gap:8px;min-width:100%}
/* 注意：这里不能用 display:contents —— 那会让 span 没有盒模型，getBoundingClientRect 恒 0，
   探针与「是否真的看得见」这类判断都会失真（#t884k 就靠这个宽高判可见）。 */
.eyes-more-body .eyes-cam-select{max-width:100%;font-size:13px}
[data-theme="dark"] .eyes-more>summary{background:rgba(155,140,255,.12);border-color:rgba(155,140,255,.35);color:#D9D2FF}
[data-theme="dark"] .eyes-more>summary:hover{border-color:rgba(155,140,255,.6)}
[data-theme="dark"] .eyes-more[open]>summary{background:rgba(155,140,255,.2);border-color:rgba(155,140,255,.6);color:#EFEAFF}
[data-theme="dark"] .eyes-more-body{background:#2A2348;border-color:#3A3164;box-shadow:0 14px 36px -12px rgba(0,0,0,.62)}

/* —— ③ 卡片语言守卫：这两套之外不许再出现第三种圆角 —— */
/* 内容卡（14px）：识别判断条 / 左屏题号卡 / 空态提示卡 / 讲座抽屉 / 下拉层 */
.eyes-card .ctx-quality,
.eyes-card .eyes-panel-questions,
.eyes-card .eyes-proposal-inject{border-radius:14px}
/* 胶囊（999px）：一行动作 / 标签 / 置信度 / 输入框 */
.eyes-card .ctx-conf,
.eyes-card .eyes-q-chip,
.eyes-card .ctx-ask,
.eyes-card .ctx-tell input{border-radius:999px}

/* —— 附带：idle / shot 态图像框限高，工具条与提问底栏一定留在首屏 —— */
.eyes-card:not([data-kind^="detected-"]) .eyes-stage{max-height:min(52vh,460px)}
@media (max-width:1100px){
  .eyes-card:not([data-kind^="detected-"]) .eyes-stage{max-height:min(46vh,360px)}
}


/* —— [#t887 续] 「更多」与相邻按钮等高；弹出层等宽竖排（参差药丸看着像没做完）—— */
/* 「更多」与邻居同款（实量 .btn = padding 10px 18px / font 14px / 高 39）——
   工具条是 align-items:center 的 flex，align-self:stretch 会被拉到 49px 反而不齐，所以直接对齐 padding。 */
.eyes-actions.eyes-bar .eyes-more{align-self:center}
.eyes-actions.eyes-bar .eyes-more>summary{padding:10px 18px;font-size:14px;line-height:1.35;box-sizing:border-box}
.eyes-more-body{flex-direction:column;align-items:stretch;width:184px;min-width:0;max-width:min(240px,72vw)}
.eyes-more-body .btn{width:100%;text-align:left}
.eyes-more-body .eyes-tools-more{display:flex;flex-direction:column;gap:8px;min-width:100%}
/* 注意：这里不能用 display:contents —— 那会让 span 没有盒模型，getBoundingClientRect 恒 0，
   探针与「是否真的看得见」这类判断都会失真（#t884k 就靠这个宽高判可见）。 */
/* idle 态：图像框再收一档 + 撤掉页面底部 80px 空垫（那一垫是给固定底栏留的，idle 没有底栏），
   目的是让「唤醒 / 拍照·上传」这条工具条在 1881×960 首屏完整可见，不用滚一屏才找到。 */
.eyes-card:not([data-kind^="detected-"]) .eyes-stage{max-height:min(46vh,420px)}
body:has(.eyes-shell) .app-layout > .main{padding-bottom:0 !important}

/* —— [#t888 2026-10-18] 眼睛页「提问」进度气泡：只用结构属性 + 继承色，浅/深色都不必再写一套 —— */
.eyes-prog{display:flex;align-items:flex-start;gap:8px;line-height:1.6}
.eyes-prog-t{flex:1 1 auto;min-width:0}
.eyes-prog-dots{display:inline-flex;gap:3px;padding-top:8px;flex:0 0 auto}
.eyes-prog-dots i{width:5px;height:5px;border-radius:50%;background:#6D5EFC;animation:eyesProgDot 1.2s ease-in-out infinite}
.eyes-prog-dots i:nth-child(2){animation-delay:.18s}
.eyes-prog-dots i:nth-child(3){animation-delay:.36s}
@keyframes eyesProgDot{0%,80%,100%{opacity:.22;transform:translateY(0)}40%{opacity:1;transform:translateY(-2px)}}
.eyes-prog.is-done .eyes-prog-t::before{content:"✅ ";}
.eyes-prog.is-fail .eyes-prog-t::before{content:"⚠️ ";}
.eyes-prog-note{margin-top:5px;font-size:12.5px;line-height:1.55;opacity:.62}
@media (prefers-reduced-motion:reduce){.eyes-prog-dots i{animation:none;opacity:.8}}

/* ===== [#t889 续 2026-10-18] 识别态再省一档高度，全部让给对话流 =====
   ① 图框限高 26vh → 21vh（图只是参照物，要看细节有「🔍 放大查看」）；
   ② 段间距 8 → 6；「已认出 …」条内边距与题号清单的外边距收紧，题号标题与胶囊同行（省 ~45px）；
   ③ 图框可收起（.eyes-stage-folded）：收成 42px 一条，高度全给对话流 ——
      PM 原话「改成图框不固定」，这就是「不固定」的手动出口（默认仍是展开的参照图）。 */
.eyes-card[data-kind^="detected-"] .eyes-body{gap:6px}
.eyes-card[data-kind^="detected-"] .eyes-shot{max-height:clamp(130px,21vh,300px)}
.eyes-ctx .ctx-tip{padding:7px 14px;margin-bottom:8px}
.eyes-card .ctx-quality{margin:0 0 6px}
.eyes-card .ctx-questions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.eyes-card .ctx-questions-list{display:flex;flex-wrap:wrap;align-items:center}
/* 收起按钮：只在识别态出现，贴在图框右下角 */
.eyes-stage-fold{display:none;position:absolute;right:10px;bottom:8px;z-index:4;
  border:1px solid rgba(109,94,252,.35);background:rgba(255,255,255,.94);color:#5a4bd6;
  font-size:12px;line-height:1;padding:6px 12px;border-radius:999px;cursor:pointer;
  box-shadow:0 2px 10px rgba(30,20,60,.12)}
.eyes-card[data-kind^="detected-"] .eyes-stage-fold{display:inline-block}
.eyes-card.eyes-stage-folded .eyes-stage{height:clamp(120px,22vh,300px);max-height:clamp(120px,22vh,300px);min-height:120px;overflow:hidden;border-radius:14px}
.eyes-card.eyes-stage-folded .eyes-shot{opacity:1}
.eyes-card.eyes-stage-folded .eyes-sweep,
.eyes-card.eyes-stage-folded .eyes-sel,
.eyes-card.eyes-stage-folded .eyes-readbar,
.eyes-card.eyes-stage-folded .eyes-detect{display:none!important}
[data-theme="dark"] .eyes-stage-fold{background:rgba(42,35,72,.94);border-color:rgba(155,140,255,.4);color:#D9D2FF}


/* ===== [#t889 续] 窄屏（≤1100）图框再让一档 =====
   ⚠ 必须写在**文件末尾**：基础规则 .eyes-shot{max-height:clamp(130px,21vh,300px)} 也在末尾，
   同特异性下后写者胜 —— 写在中段的 @media 里会被它盖掉（实测 1100×820 图框仍是 174px）。 */
@media (max-width:1100px){
  .eyes-card[data-kind^="detected-"] .eyes-shot{max-height:clamp(96px,17vh,180px);height:auto}
  .eyes-card[data-kind^="detected-"] .eyes-body{gap:5px}
  .eyes-ctx .ctx-tip{padding:6px 12px;margin-bottom:6px}
  .eyes-card .ctx-quality{margin:0 0 4px}
}

/* ===== [#t893 2026-10-18] 图框可滚动（右侧上下拉条）· 必须写在文件末尾 =====
   ① 识别态图片按容器宽等比放大（width:100% / height:auto），竖向溢出交给 .eyes-shot-scroll 出滚动条
      —— 这样「文章能看清」而「对话流仍是大屏」两件事同时成立；
   ② 必须压过本文件末尾两处 max-height 限高（6289 段与 ≤1100 段）：用 `.eyes-shot-scroll .eyes-shot`
      多一层祖先提高特异性 + !important，无论写在哪都稳；
   ③ 选区期间（card[data-eyes-sel=1]）隐藏滚动层，让画布/冻结帧独占图框。 */
.eyes-card[data-kind^="detected-"] .eyes-shot-scroll .eyes-shot{max-height:none!important;height:auto!important;
  width:100%;object-fit:contain}
.eyes-card[data-eyes-sel="1"] .eyes-shot-scroll{display:none!important}
[data-theme="dark"] .eyes-shot-scroll::-webkit-scrollbar-thumb{background:rgba(155,140,255,.55)}

/* ===== [#t894 2026-10-18] 图框两档口径：展开 = 正常可读 / 收起 = 当前小尺寸 =====
   ① 收起态：图片按 contain 塞进 22vh 条内，不裁不放大；
   ② 展开态：沿用 t893 的整宽 + 右侧滚动条。
   ⚠ 必须写在文件末尾：t893 那条 height/max-height 带 !important，同特异性下后写者胜。 */
.eyes-card.eyes-stage-folded .eyes-shot-scroll .eyes-shot{max-height:100%!important;height:100%!important;
  width:100%;object-fit:contain}