/* ============================================================
   v3 §1 / M5：数黑体（Alimama ShuHeiTi Bold）自托管子集 24KB
   生成：python3 scripts/subset_font.py ｜ 缺字兜底 = swap 落系统黑体
   ============================================================ */
@font-face{
  font-family:"Alimama ShuHeiTi";
  src:url("fonts/AlimamaShuHeiTi-Bold-subset.woff2") format("woff2");
  font-display:swap;
}

/* ===========================================================================
   高考志愿填报工具 · 样式表
   ---------------------------------------------------------------------------
   设计取向：可信度优先。一个公益工具如果看起来像商业机构的推销页，
   考生反而会怀疑数据的可信度。所以这里的每一个视觉决定都服从同一条原则：
   **让数据自己说话，界面不要抢戏。**

   三条硬规则：
   1. 颜色分三档，各司其职，不许混用——
      · 主数据色（品牌蓝）：投档分、位次等**核心事实**
      · 状态色（冲/稳/保 + 警示）：**判断结果**
      · 中性灰阶：**辅助信息**（选科、计划数、专业数）
   2. 数字用等宽数字（tabular-nums）并加大字重，因为考生读的是数字不是文字。
   3. 层次靠留白与字重建立，不靠边框与阴影堆叠——边框一多就廉价。
   =========================================================================== */

/* ===========================================================================
   §6.3 收编后：非主题 token（单份定义，不随主题翻转）
   ---------------------------------------------------------------------------
   颜色 / 投影已全部并入文末的两张 --c-* 主题表；
   这里只留与主题无关的尺度与字体变量。
   迁移映射见 docs/迁移映射-旧token收编-2026-11-04.md。
   =========================================================================== */
:root{
  /* 圆角（生效值取自原 V2.0 视觉层） */
  --r-xs:4px;
  --r-sm:10px;
  --r:16px;
  --r-lg:24px;
  /* 字体 */
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--top-h,150px) + 12px);
  --top-h:150px}
body{
  margin:0;background:var(--c-bg);color:var(--c-text);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:14px;line-height:1.7;letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;
  font-variant-numeric:tabular-nums;
}
button,input,select{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer;border:none;background:none}
a{color:var(--c-accent-deep);text-decoration:none}
::selection{background:var(--c-wash-1);color:var(--c-accent-deep)}

/* ===========================================================================
   顶栏
   ---------------------------------------------------------------------------
   分两层：
   · 第一行：品牌 + 主导航
   · 第二行：批次与科类切换（**这是全站最强的上下文开关**，
         换批次等于换了一个池子，之前挤在第一行右侧导致批次名只能缩写成
     「本提前 / 专提前」，考生根本不知道那是什么）
   =========================================================================== */
.top{
  /* 抖动根治（2026-11-08 第二刀）：sticky 在文档流里，锁顶时胶囊从两行
     塌成一行 = 下方全部内容瞬间上提 ~60px——这就是「那一瞬间」的抖动
     本体，过渡属性怎么调都没用。改 fixed（脱离文档流）+ 定高占位符
     （.top-space，app.js 按未锁定态实测高度写入），锁顶收缩只发生在
     悬浮层内部，文档流零位移。transparent 层 pointer-events:none
     穿透，点击落在胶囊上（auto）。 */
  position:fixed;top:0;left:0;right:0;z-index:50;
  pointer-events:none;
  background:transparent;border-bottom:none;
}
.top-space{height:var(--top-h,150px)}
.top-capsule{pointer-events:auto}
/* 悬浮胶囊本体：两行内容收进一颗居中胶囊 */
.top-capsule{
  /* v3 M8 修正：胶囊必须留在文档流对齐（原 absolute/fixed 会盖住内容）。
     M9（2026-11-03）：去 backdrop-filter / will-change / scale——滚动时胶囊
     带毛玻璃做宽高过渡，逐帧重采样会产生用户实测的「伸缩虚影」；
     底色已近不透明，毛玻璃没有可见收益，只留纯色过渡。 */
  position:relative;
  width:min(1120px,calc(100% - 24px));
  margin:10px auto 12px;
  border:1px solid var(--c-border);border-radius:22px;
  background:var(--c-surface);   /* M8 修复③：近不透明——半透明玻璃让滚过的标题透出来像「挡一脸」 */
  /* 悬浮影已删（2026-11-08 用户点名删两侧阴影） */
  transition:background .35s var(--ease-soft),
    border-radius .35s var(--ease-soft);
  /* 抖动重影修复（2026-11-08 用户视频实测，桌面多浏览器、移动端无感）：
     旧过渡含 width/margin——锁顶收束时文字容器逐帧重排（reflow），
     桌面 Chromium 上即逐帧重栅格化 = 抖动 + 重影（M9 修过 blur/scale
     的同族残余；移动端宽度几乎不变所以无感）。布局属性改为单帧落定，
     只保留绘制类属性（影/底色/圆角）的柔化——收束手感仍在，重排不再发生。 */
}
html.top-locked .top-capsule{
  /* v3 M8⑥ → M9：用户再次点名「长度还是长」——锁顶改回紧凑胶囊
     （min(880px,100%-24px) 居中，页面从两侧穿过，这正是对标站的样子）。
     不用 scale：缩放文字层必然出现亚像素重栅格化的虚影，宽度的收束本身就是
     「缩放动作」。圆角收成满胶囊（999px），顶隙 8px。
     M10b（2026-11-04）：阴影整个拿掉、底色回实色——半透明层会让滚过的字
     透出来，视觉上就是「脏阴影」；对标站的原生导航栏也是贴脸平板，不带影。 */
  width:min(880px,calc(100% - 24px));
  margin:8px auto 0;
  border-radius:999px;
  background:var(--c-surface);
  box-shadow:none;
}
html.top-locked .top-capsule .top-bar{display:none}
html.top-locked .top-capsule .top-row{height:54px;max-width:1140px;margin:0 auto}
html.top-locked .top-capsule .brand-t i{display:none}
html.top-locked .top-capsule .track-sw{display:none}
html[data-theme="dark"] .top-capsule{background:var(--c-top-capsule)}
html[data-theme="dark"] .top-capsule .top-bar{border-top-color:var(--c-top-capsule-line)}
.top-capsule .top-row{max-width:none}
.top-capsule .top-bar{border-top:1px solid var(--c-border-soft);border-radius:0 0 22px 22px;background:transparent}
.top-capsule .top-bar-in{max-width:none}
@media (max-width:880px){
  /* 窄屏：满宽胶囊，缩放幅度更小（内容密度高） */
  .top-capsule{width:calc(100% - 16px);margin:8px auto 10px;border-radius:18px}
  html.top-locked .top-capsule{width:calc(100% - 12px);margin:6px auto 0;border-radius:14px}
}
/* 第一行 */
.top-row{
  max-width:1240px;margin:0 auto;padding:0 26px;height:60px;
  display:flex;align-items:center;gap:26px;
}
.brand{display:flex;align-items:center;gap:11px;flex-shrink:0}
/* L2：skip link——body 第一个可聚焦元素，常态移出屏幕不干扰视觉，
   聚焦时从顶部滑入（键盘用户 Tab 第一停、读屏最先读到）。 */
.skip-link{position:fixed;top:-56px;left:12px;z-index:120;padding:9px 18px;
  border-radius:10px;background:var(--c-accent-deep);color:var(--c-surface);
  font-size:13.5px;font-weight:600;text-decoration:none;transition:top .16s ease}
.skip-link:focus{top:10px;outline:2px solid var(--c-surface);outline-offset:2px}
/* 屏读专用：视觉上不占位，但语义树里在。用于「视图名」这类标题——
   列表视图的视觉头是位次摘要卡，没有可见标题位，但读屏用户需要知道
   当前在哪一屏（切视图后焦点落回 #main，先读到的就是它）。 */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
/* 品牌标：定稿 logo 是满幅方图（无内建圆角），圆角由这里给——
   28% 对应旧版内联 SVG 的 rx=9/32，页头 32px 与页脚 25px 同比例。 */
.logo{width:32px;height:32px;flex-shrink:0;display:block;border-radius:28%;object-fit:cover}
.brand-t{display:flex;flex-direction:column;line-height:1.28}
.brand-t b{font-size:17px;font-weight:700;letter-spacing:-.015em}
.brand-t i{font-style:normal;font-size:11px;color:var(--c-faint);letter-spacing:.045em}

/* 导航：科类之后。科类已用 margin-left:auto 推到右边，
   导航紧跟在它后面，不再抢 auto 外边距。 */
.nav{display:flex;gap:2px;margin-left:10px}
.nav button{
  padding:8px 14px;border-radius:var(--r-xs);font-size:13.5px;color:var(--c-muted);font-weight:500;
  display:flex;align-items:center;gap:7px;transition:background .16s,color .16s;
}
.nav button:hover{background:var(--c-border-soft);color:var(--c-text)}
.nav button.on{background:var(--c-accent-deep);color:var(--c-surface);font-weight:600}
.nav .ic{display:none;width:17px;height:17px}

/* 第二行：批次与科类 */
.top-bar{
  border-top:1px solid var(--c-border-soft);background:var(--c-glass-3);
}
.top-bar-in{
  max-width:1240px;margin:0 auto;padding:7px 26px;
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
}
.tb-label{font-size:11px;color:var(--c-faint);letter-spacing:.08em;flex-shrink:0}

/* 批次：四个，按官方录取顺序排（提前批在前）。
   顺序本身有信息量——被提前批录取的考生不再参加后续批次投档，
   所以「本科提前批 → 本科批 → 高职（专科）提前批 → 高职（专科）批」
   就是实际录取的先后次序。
   提前批两个按钮带一个圆点标记，与另外两个不是一类东西。 */
.batch-sw{display:flex;gap:6px;flex-wrap:wrap}
.batch-sw button{
  padding:6px 13px;border-radius:999px;font-size:13px;font-weight:500;
  color:var(--c-muted);background:var(--c-surface);border:1px solid var(--c-border);
  transition:.16s;white-space:nowrap;display:flex;align-items:center;gap:6px;
}
.batch-sw button:hover{border-color:var(--c-wash-2);color:var(--c-accent-deep)}
.batch-sw button.on{
  background:var(--c-accent-deep);border-color:var(--c-accent-deep);color:var(--c-surface);font-weight:600;
  /* active 由底色承担，不再加辉光 */
}
/* 提前批的点：不是文字标签，是图形标记 */
.batch-sw button i{
  width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.45;flex-shrink:0;
}
.batch-sw button.on i{opacity:.95;background:var(--c-accent)}
/* 全称 / 短名：默认全称，窄屏换短名 */
.bn-short{display:none}
/* 品牌名不再双名（2026-11-12 用户点名全称）——.brand-t 里的 bn-short
   span 永不显示；批次按钮的短名机制不受影响（那套走 480px 断点）。 */
.brand-t .bn-short{display:none!important}

/* 科类切换：在第一行、导航之前。
   margin-left:auto 把它推到导航左边，两者各自占位不重叠。 */
.track-sw{display:flex;gap:2px;background:var(--c-border-soft);border-radius:999px;padding:3px;
  flex-shrink:0;margin-left:auto}
.track-sw button{padding:5px 15px;border-radius:999px;font-size:13px;color:var(--c-muted);
  font-weight:500;transition:.16s;white-space:nowrap}
.track-sw button.on{background:var(--c-surface);color:var(--c-text);font-weight:600;
}

/* 主题三态开关（双主题 M0）：自动 / 浅色 / 深色。
   放在批次行右端：第一行在窄屏已经被「品牌 + 科类」占满，第二行右侧本来就空着，
   而它属于「环境设置」而不是「数据筛选」，跟批次放同一行但靠右，语义上不打架。
   margin-left:auto 把它顶到最右；批次按钮多的时候会先换行/横滚，不会挤掉它。 */
/* 选中态由 <html data-theme-pref> 决定，而不是 JS 加的 class：
   首帧时 body 还没解析、theme.js 的交互也还没接上，靠属性选择器就能画对，
   不会出现「先高亮『自动』再跳到用户真正选的那档」。
   权重 0,2,1 —— 高于 .theme-sw button:hover 的 0,2,1? 同权重，靠顺序：本组在后。 */
/* v3 §3 / M6：明暗功能胶囊（滑动开关）。
     旋钮位置与光晕随主题翻转；图标 sun/moon 表达「点击将切换到」的方向。
     尺寸 50×26：≥24px 达 WCAG 2.5.8；点击热区外扩到 44px（::after 透明垫）。 */
.theme-capsule{position:relative; width:50px; height:26px; border-radius:999px; flex:none;
  margin-left:auto;   /* v3 M8②：明暗开关固定第一行最右（用户第二次点名） */
  background:linear-gradient(120deg,var(--c-capsule-light));
  border:1px solid var(--c-border); transition:background .35s; overflow:visible}
.theme-capsule::after{content:""; position:absolute; inset:-9px; border-radius:999px}
.theme-capsule .tc-knob{position:absolute; top:2px; left:2px; width:20px; height:20px; border-radius:50%;
  background:#fff; box-shadow:0 2px 6px rgba(0,0,0,.28); display:grid; place-items:center;
  transition:transform .32s var(--ease-soft)}
.theme-capsule .tc-knob svg{width:12px; height:12px}
.theme-capsule .tc-sun{color:var(--c-capsule-sun)} .theme-capsule .tc-moon{color:var(--c-capsule-moon); display:none}
html[data-theme="dark"] .theme-capsule{background:linear-gradient(120deg,var(--c-capsule-light))}
html[data-theme="dark"] .theme-capsule .tc-knob{transform:translateX(24px)}
html[data-theme="dark"] .theme-capsule .tc-sun{display:none}
html[data-theme="dark"] .theme-capsule .tc-moon{display:block}
html[data-theme-pref="system"] .theme-sw [data-theme-pref="system"],
html[data-theme-pref="light"] .theme-sw [data-theme-pref="light"],
html[data-theme-pref="dark"] .theme-sw [data-theme-pref="dark"]{
  background:var(--c-surface);color:var(--c-text);font-weight:600}
/* 窄屏只留图标：整组约 100px，批次栏还能横向滚动 */
@media (max-width:900px){
  .theme-sw button{padding:5px 9px;gap:0}
  .theme-sw span{display:none}
}
@media (max-width:640px){
  .theme-sw{padding:2px}
  .theme-sw button{padding:5px 8px}
}

/* ===========================================================================
   容器
   =========================================================================== */
.wrap{max-width:1240px;margin:0 auto;padding:30px 26px 100px}
.view{display:none}
.view.on{display:block}
.card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);box-shadow:var(--c-sh-2)}

/* ===========================================================================
   首页主视觉
   ---------------------------------------------------------------------------
   原来是一个大渐变横幅 + 下面一张独立的查询卡，两块分离。
   改成**一整块深色面板把查询框包进去**——首屏只让考生做一件事，
   不需要先读完一段话再去找输入框。
   =========================================================================== */
.hero{
  position:relative;overflow:hidden;border-radius:var(--r-lg);margin:0 0 26px;
  background:var(--c-bg);
  color:var(--c-text);padding:32px 38px 26px;
  box-shadow:0 24px 50px -30px rgba(6,51,74,.62);
}
.hero::before{
  content:"";position:absolute;right:-90px;top:-140px;width:460px;height:460px;border-radius:50%;
  background:radial-gradient(circle,rgba(143,208,230,.26) 0%,rgba(143,208,230,0) 68%);
}
.hero::after{
  content:"";position:absolute;left:-60px;bottom:-190px;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(26,134,174,.24) 0%,rgba(26,134,174,0) 66%);
}
.eyebrow{
  margin:0 0 12px;font-size:11.5px;font-weight:700;letter-spacing:.16em;color:var(--c-accent);
}
.hero h1 em{font-style:normal}
.hero-meta{position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;
  font-size:12.5px;margin-top:18px}
.hero-link{
  color:var(--c-accent);font-weight:500;border-bottom:1px solid rgba(159,211,230,.42);
  padding-bottom:2px;transition:.16s;
}
.hero-link:hover{color:var(--c-text);border-bottom-color:var(--c-text)}

/* ===========================================================================
   查询卡（在深色面板内）
   =========================================================================== */
.qcard{
  position:relative;z-index:3;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.17);
  border-radius:var(--r);padding:16px;
  max-width:620px;
}
.qtab{display:flex;gap:3px;background:rgba(255,255,255,.10);border-radius:10px;padding:3px;margin-bottom:12px}
.qtab button{flex:1;padding:8px;border-radius:7px;font-size:13.5px;color:rgba(255,255,255,.86);
  font-weight:500;transition:.16s}
.qtab button.on{background:var(--c-surface);color:var(--c-accent-ink);font-weight:600}
.qrow{display:flex;gap:10px;align-items:stretch}
.qin{
  flex:1;display:flex;align-items:center;gap:8px;min-width:0;
  border:1.5px solid transparent;border-radius:10px;padding:0 15px;background:var(--c-surface);
  transition:border-color .16s,box-shadow .16s;
}
.qin:focus-within{border-color:var(--c-accent);box-shadow:0 0 0 3px rgba(143,208,230,.22)}
.qin input{
  flex:1;border:none;outline:none;background:none;min-width:0;width:100%;
  font-size:25px;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-.02em;
  padding:13px 0;color:var(--c-text);
}
.qin input::placeholder{font-weight:400;color:var(--c-muted);font-size:15px;letter-spacing:0}
.qin .unit{font-size:13px;color:var(--c-muted);flex-shrink:0}
.btn-primary{
  padding:0 28px;border-radius:10px;color:var(--c-surface);font-size:15px;font-weight:600;white-space:nowrap;
  background:var(--c-accent-deep);
  box-shadow:0 1px 2px rgba(6,51,74,.18);
  transition:filter .16s,transform .1s;
}
.btn-primary:hover{filter:brightness(1.09)}
.btn-primary:active{transform:translateY(1px)}
.qhint{margin-top:12px;font-size:12px;color:rgba(255,255,255,.86);display:flex;flex-wrap:wrap;
  gap:4px 16px}
.qhint b{color:rgba(255,255,255,.85);font-weight:600}

/* 选填条件：折叠面板，不能抢了主查询的视线 */
.optx{margin-top:14px;border-top:1px solid rgba(255,255,255,.14);padding-top:12px}
.optx summary{font-size:12.5px;color:rgba(255,255,255,.86);cursor:pointer;list-style:none;
  display:flex;align-items:center;gap:7px;font-weight:500}
.optx summary::-webkit-details-marker{display:none}
.optx summary::before{content:"+";font-size:14px;color:var(--c-accent);width:12px;font-weight:600}
.optx[open] summary::before{content:"−"}
.optx summary:hover{color:var(--c-text)}
.optbody{padding:14px 0 2px;display:flex;flex-direction:column;gap:13px}
.optrow{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.optlabel{font-size:12px;color:rgba(255,255,255,.86);padding-top:7px;min-width:76px}
.optlabel span{display:block;font-size:11px;color:var(--c-muted);line-height:1.45}
.subjrow{display:flex;gap:7px;flex-wrap:wrap}
.subj{padding:7px 15px;border-radius:8px;border:1px solid rgba(255,255,255,.22);
  font-size:12.5px;color:rgba(255,255,255,.82);font-weight:500;transition:.16s}
.subj:hover{border-color:rgba(255,255,255,.45);color:var(--c-text)}
.subj.on{background:var(--c-accent);border-color:var(--c-accent);color:var(--c-accent-ink);font-weight:600}
.tierow{display:flex;gap:8px;flex-wrap:wrap}
.tierow label{display:flex;flex-direction:column;gap:3px;font-size:11px;color:rgba(255,255,255,.72)}
.tierow .ti{width:74px;padding:7px 9px;border:1px solid rgba(255,255,255,.22);border-radius:7px;
  font-size:12.5px;font-variant-numeric:tabular-nums;color:var(--c-text);background:var(--c-field-on-dark);transition:.16s}
.tierow .ti:focus{outline:none;border-color:var(--c-accent);box-shadow:0 0 0 3px rgba(143,208,230,.22)}
.optnote{font-size:11.5px;color:rgba(255,255,255,.86);line-height:1.68}

/* ===========================================================================
   关键数字条
   ---------------------------------------------------------------------------
   四个数平铺，原来每个格子只有「数字 + 小字」，层级平。
   改成：主数字（考生自己的位次）用主数据色并加大，其余降一级。
   =========================================================================== */
.summary{
  display:grid;grid-template-columns:repeat(4,1fr);
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);
  overflow:hidden;margin:0 0 24px;box-shadow:var(--c-sh-2);
}
.summary>div{padding:16px 20px;border-left:1px solid var(--c-border-soft);position:relative}
/* 首个格（自己的位次/分数）是主角 */
.summary>div:first-child{border-left:none;background:var(--c-wash-1-soft)}
.summary .v{font-size:26px;font-weight:650;font-variant-numeric:tabular-nums;
  letter-spacing:-.03em;line-height:1.15;color:var(--c-text)}
.summary>div:first-child .v{color:var(--c-accent-deep);font-size:29px}
.summary .k{font-size:11.5px;color:var(--c-faint);margin-top:5px;line-height:1.5}
.summary .v small{font-size:13px;font-weight:500;color:var(--c-muted);margin-left:2px;letter-spacing:0}

/* ===========================================================================
   小节标题
   =========================================================================== */
.sec-title{
  font-size:11.5px;font-weight:700;letter-spacing:.13em;color:var(--c-accent-deep);
  margin:0 0 14px;display:flex;align-items:center;gap:9px;
}
.sec-title::after{content:"";flex:1;height:1px;background:var(--c-border-soft)}

/* ===========================================================================
   小节卡片
   =========================================================================== */
.card-sec{padding:20px 24px}
.card-sec + .card-sec{margin-top:12px}
.card-sec .body{font-size:13.5px;color:var(--c-text-2);line-height:1.86}
.card-sec .body p{margin:0 0 9px}
.card-sec .body p:last-child{margin-bottom:0}
.card-sec .body ul,.card-sec .body ol{margin:0 0 10px;padding-left:20px}
.card-sec .body ul:last-child,.card-sec .body ol:last-child{margin-bottom:0}
.card-sec .body li{margin:0 0 6px}
.card-sec .body li:last-child{margin-bottom:0}
.card-sec .body .quiet{color:var(--c-muted)}
.card-sec .body code{
  font-size:12px;background:var(--c-border-soft);border-radius:4px;padding:1px 5px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.card-sec.slim{font-size:12.5px}
.card-sec.slim .body{font-size:12.5px;color:var(--c-muted);line-height:1.86}
/* 卡片底部的补充说明：比正文更轻，但要能读 */
.foot-note{font-size:12px;color:var(--c-faint);margin:14px 0 0;line-height:1.75;max-width:660px}

/* ===========================================================================
   怎么用
   =========================================================================== */
/* 竖排三步：横排三列时这张卡比右侧控制线卡矮 283px（检查器 ragged-row
   实测），补的不能是废话——每步配一行用真实数据算出来的例子。 */
.howto{display:flex;flex-direction:column;gap:20px;margin-top:16px}
.howto .step{display:flex;gap:14px;align-items:flex-start}
.howto .step>div:last-child{flex:1;min-width:0}
.howto .step .n{margin-bottom:0;flex:0 0 auto}
.howto .ex{margin-top:6px;font-size:12.5px;color:var(--c-accent-deep);font-variant-numeric:tabular-nums}
.howto .n{
  width:26px;height:26px;border-radius:8px;background:var(--c-wash-1);color:var(--c-accent-deep);
  font-size:13px;font-weight:700;display:grid;place-items:center;margin-bottom:11px;
}
.howto p{margin:0;font-size:12.5px;color:var(--c-muted);line-height:1.75}

/* ===========================================================================
   控制线表
   =========================================================================== */
.lines{width:100%;max-width:380px;border-collapse:collapse;font-size:13.5px}
.lines th{text-align:left;font-weight:500;color:var(--c-faint);font-size:11.5px;padding:0 0 9px}
.lines th+th{text-align:right;padding-left:28px}
.lines td{padding:9px 0;border-top:1px solid var(--c-border-soft);
  font-variant-numeric:tabular-nums;color:var(--c-text-2)}
.lines td+td{text-align:right;padding-left:28px;font-weight:650;color:var(--c-text)}
.lines tr:last-child td{color:var(--c-accent-deep);font-weight:700}

/* ===========================================================================
   提示条
   =========================================================================== */
.notice{border:1px solid var(--c-border);border-left:3px solid var(--c-faint);border-radius:var(--r-sm);
  background:var(--c-surface);padding:15px 18px;margin:0 0 20px;box-shadow:var(--c-sh-1)}
.notice b{display:block;font-size:13.5px;font-weight:650;margin-bottom:5px}
.notice p{font-size:12.5px;color:var(--c-text-2);line-height:1.8;margin:0}
.notice.warn{border-left-color:var(--c-warn-chip);background:var(--c-warn-soft)}
.notice.warn b{color:var(--c-warn-strong)}
.notice.bad{border-left-color:var(--c-bad);background:var(--c-bad-soft)}
.notice.bad b{color:var(--c-bad)}
.notice.info{border-left-color:var(--c-accent-deep)}
.notice.info b{color:var(--c-accent-deep)}
.note{padding:14px 17px;font-size:12.5px;color:var(--c-muted);line-height:1.78}
.note b{color:var(--c-text);font-weight:600}
.note.tight{padding:12px 15px}
.note.warn{border-left:3px solid var(--c-warn-chip);background:var(--c-warn-soft);border-radius:var(--r-xs)}
.note.warn b{color:var(--c-warn-strong)}
.note.bad{border-left:3px solid var(--c-bad);background:var(--c-bad-soft);border-radius:var(--r-xs)}
.note.bad b{color:var(--c-bad)}
.note.ok{border-left:3px solid var(--c-wen);background:var(--c-wen-soft);border-radius:var(--r-xs)}
.note.ok b{color:var(--c-wen)}

/* ===========================================================================
   位次摘要条
   =========================================================================== */
.rankbar{display:flex;gap:24px;flex-wrap:wrap;align-items:center}
.rankbar .st{flex-shrink:0}
.rankbar .st i{display:block;font-style:normal;font-size:11.5px;color:var(--c-faint);margin-bottom:1px}
.rankbar .st b{font-size:20px;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.rankbar .st b small{font-size:12px;font-weight:500;color:var(--c-muted);margin-left:2px;letter-spacing:0}
.rankbar .txt{font-size:12.5px;color:var(--c-muted);line-height:1.78;max-width:40em}
.rankbar .txt b{color:var(--c-text);font-weight:600}
/* 列表头卡：位次摘要 + 同分说明 */
.rankcard{padding:15px 19px;margin-bottom:14px}
.rankcard-note{
  margin-top:12px;padding-top:11px;border-top:1px solid var(--c-border-soft);
  font-size:12px;color:var(--c-muted);line-height:1.75;
}
.rankcard-note b{color:var(--c-text);font-weight:650}

/* 详情弹层「你的位置」头部一行 */
.posrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.posrow .posmeta{font-size:12.5px;color:var(--c-muted);font-variant-numeric:tabular-nums}

/* ===========================================================================
   筛选条
   =========================================================================== */
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:20px 0 15px}
.filters input[type=search],.filters select{
  border:1px solid var(--c-border);border-radius:var(--r-sm);padding:8px 12px;background:var(--c-surface);
  font-size:13px;outline:none;transition:border-color .16s,box-shadow .16s;
}
.filters input[type=search]{flex:1;min-width:190px;max-width:320px}
.filters input:focus,.filters select:focus{border-color:var(--c-accent-deep);box-shadow:0 0 0 3px var(--c-wash-1)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{
  padding:6px 13px;border-radius:999px;border:1px solid var(--c-border);background:var(--c-surface);
  font-size:12.5px;color:var(--c-muted);font-weight:500;transition:.16s;white-space:nowrap;
}
.chip:hover{border-color:var(--c-faint);color:var(--c-text)}
.chip.on{background:var(--c-accent-deep);color:var(--c-surface);border-color:var(--c-accent-deep)}
/* 梯度 chip 各自带语义色：选中时用该档的实色，而不是统一的品牌蓝。
   考生在列表里看到的色条、徽章、这里的 chip 是同一套颜色。 */
.chip.chong.on{background:var(--c-chong);border-color:var(--c-chong);color:var(--c-surface)}
.chip.wen.on{background:var(--c-wen);border-color:var(--c-wen);color:var(--c-surface)}
.chip.bao.on{background:var(--c-bao);border-color:var(--c-bao);color:var(--c-surface)}
.chip.chong:not(.on){color:var(--c-chong);border-color:var(--c-chong-line);background:var(--c-chong-soft)}
.chip.wen:not(.on){color:var(--c-wen);border-color:var(--c-wen-line);background:var(--c-wen-soft)}
.chip.bao:not(.on){color:var(--c-bao);border-color:var(--c-bao-line);background:var(--c-bao-soft)}
.fcount{margin-left:auto;font-size:12.5px;color:var(--c-faint);font-variant-numeric:tabular-nums}

/* 梯度入口卡 */
.bandcard{padding:19px 22px}
.bandcard-txt{font-size:13px;color:var(--c-muted);margin:0 0 14px;line-height:1.8}
.bandcard-txt b{color:var(--c-text);font-weight:650}

/* ===========================================================================
   组列表
   ---------------------------------------------------------------------------
   改版重点。原来的卡片是「两列网格 + 一条 3px 色条」，
   分数（考生最该先看的数）是右列一行普通文本，扫视时抓不住。

   新结构：**三列**——
   · 左：院校名 + 组号 + 徽章（标题区）
   · 中：选科 / 计划 / 专业（辅助信息，压低）
   · 右：投档分（主视觉，最大号）+ 位次 + 与自己位次的关系
   左侧色条加粗到 4px，并给整张卡片加一层极淡的梯度底色，
   让「冲/稳/保」在列表里一眼可辨，不必读文字。
   =========================================================================== */
.glist{display:flex;flex-direction:column;gap:10px}
.gitem{
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);position:relative;overflow:hidden;
  padding:15px 20px 15px 22px;display:grid;grid-template-columns:1fr auto;gap:8px 20px;
  transition:border-color .16s,box-shadow .18s,transform .16s;
}
/* 左侧色条标梯度 + 整卡淡底色。两者一起，扫视时靠色就能分档。
   底色只铺左侧一小段（色条两侧），不能横穿院校名——文字压在色块上会显脏。
   渐变终点刻意收在 92px：色条 4px + 一点过渡，够暗示色系又不压字。 */
.gitem::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:transparent}
.gitem.b-chong::before{background:var(--c-chong)}
.gitem.b-wen::before{background:var(--c-wen)}
.gitem.b-bao::before{background:var(--c-bao)}
/* 渐变中间那个 35% 透明度要用变量：原来写死 rgba(251,238,233,.35) 这类
   浅色，暗色模式下会在卡片左侧糊出一块亮斑。 */
.gitem.b-chong{background:linear-gradient(90deg,var(--c-chong-soft) 0,var(--c-chong-fade) 92px,var(--c-surface) 190px)}
.gitem.b-wen{background:linear-gradient(90deg,var(--c-wen-soft) 0,var(--c-wen-fade) 92px,var(--c-surface) 190px)}
.gitem.b-bao{background:linear-gradient(90deg,var(--c-bao-soft) 0,var(--c-bao-fade) 92px,var(--c-surface) 190px)}
.gitem:hover{border-color:var(--c-border-strong);box-shadow:0 6px 20px -10px rgba(16,24,32,.24);transform:translateY(-1px)}

.gitem .l{min-width:0}
.gname{font-size:15px;font-weight:650;margin:0 0 5px;letter-spacing:-.012em;
  display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.gname .code{font-size:11.5px;color:var(--c-faint);font-variant-numeric:tabular-nums;font-weight:400}
.gmeta{font-size:12.5px;color:var(--c-muted);display:flex;flex-wrap:wrap;gap:3px 0;align-items:baseline}
.gmeta span{padding-right:12px;margin-right:12px;border-right:1px solid var(--c-border-soft)}
.gmeta span:last-child{border-right:none;padding-right:0;margin-right:0}
.gmeta em{font-style:normal;color:var(--c-faint);margin-right:3px}
.gtags{display:flex;gap:5px;flex-wrap:wrap;margin-top:9px}
.tg{font-size:11px;padding:2px 8px;border-radius:var(--r-xs);background:var(--c-surface-3);color:var(--c-muted)}
.tg.warn{background:var(--c-warn-soft);color:var(--c-warn-chip)}

/* 专业行里的硬性限制标签：紧跟在专业名后，比备注更容易被看见。
   用 warn 色但更小、更紧，避免把专业名挤走。 */
.hr-tg{font-size:10.5px;padding:1px 6px;margin-left:5px;vertical-align:1px;
  border-radius:4px;white-space:nowrap}
/* 硬性限制汇总里的标签：比行内标签大一号，因为这是"一票否决"级信息 */
.hrlist{display:flex;gap:6px;flex-wrap:wrap}
.hrlist .tg{font-size:11.5px;padding:3px 9px;font-weight:600}

/* 列表卡上的「硬性限制 N 项」：比普通标签更重，因为这是"不符合就不投档"。
   实测原样式 11px + warn 浅底，扫读时容易漏掉。 */
.hr-flag{font-size:11px;padding:2px 8px;font-weight:600;
  background:var(--c-warn-soft);color:var(--c-warn-chip);border:1px solid var(--c-danger-line)}
.tg.ok{background:var(--c-wen-soft);color:var(--c-wen)}

/* 右列：分数是主视觉 */
.gright{display:flex;flex-direction:column;align-items:flex-end;gap:3px;justify-content:center;
  min-width:132px;text-align:right}
.gscore{
  font-size:27px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.035em;
  line-height:1.1;color:var(--c-text);
}
.gscore small{font-size:12px;font-weight:500;color:var(--c-muted);margin-left:3px;letter-spacing:0}
.grank{font-size:12px;color:var(--c-muted);font-variant-numeric:tabular-nums}
/* 与自己位次的关系：这是考生真正要判断的一行 */
.gapline{font-size:11.5px;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.gapline.higher{color:var(--c-chong)}
.gapline.lower{color:var(--c-wen)}

/* 梯度徽章：实心，比原来的浅底更抓眼 */
.badge{font-size:11.5px;padding:2px 9px;border-radius:var(--r-xs);font-weight:650;letter-spacing:.05em;
  color:var(--c-surface);flex-shrink:0}
.badge.chong{background:var(--c-chong)}
.badge.wen{background:var(--c-wen)}
.badge.bao{background:var(--c-bao)}
.badge.no{background:var(--c-no-soft);color:var(--c-muted);font-weight:500}

/* 趋势小条 */
/* 三年趋势结论一行。这是**判读信息**（"位次前移 12%"），不是装饰，
   所以 11.5px 偏小——提到 12.5px，并把默认色从 --faint 改到 --muted，
   对比度从 4.52:1 提到 5.6:1。
   颜色语义：前移 = 竞争变激烈（暖赭），后移 = 竞争缓和（墨绿）。
   不用红绿，避免被读成"好/坏"——位次变化本身没有好坏，取决于考生位置。 */
.spark{display:flex;align-items:center;gap:4px;font-size:12.5px;color:var(--c-muted);
  font-variant-numeric:tabular-nums;line-height:1.5}
.spark i{display:block;width:3px;border-radius:1px;background:var(--c-bar-track)}
.spark.up{color:var(--c-chong)}
.spark.dn{color:var(--c-wen)}

/* ===========================================================================
   问答答案卡（任务二）
   ---------------------------------------------------------------------------
   这张卡不是又一块「信息卡片」——它是**结论**，用户问一句话只期待一个答案。
   所以版式按「先给答案、再给口径、再给明细」三段递减：
     · 主数字最大（30px），一眼看到；
     · 口径行紧随其后且不可省略（科类/批次/年份），因为脱离口径的数字是误导；
     · 明细行压成小字，需要时才读。
   左边一道品牌蓝竖条：它是"这是回答"的视觉标记，和列表里代表冲稳保的
   渐变色条（.gitem::before）刻意区分——避免用户把答案卡的蓝条当成梯度档位。
   =========================================================================== */
#qaCard:empty{display:none}
#qaCard{margin:0 0 16px}
.qa-card{
  background:var(--c-surface);border:1px solid var(--c-border);border-left:4px solid var(--c-accent-deep);
  border-radius:var(--r);padding:17px 21px 18px;box-shadow:var(--c-sh-1);
}
.qa-card.warn{border-left-color:var(--c-warn-chip);background:var(--c-warn-soft)}
.qa-card.warn .qa-tag{background:var(--c-warn-chip);color:var(--c-surface)}
.qa-card.bad{border-left-color:var(--c-bad);background:var(--c-bad-soft)}
.qa-card.bad .qa-tag{background:var(--c-bad);color:var(--c-surface)}
.qa-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:9px}
.qa-tag{
  font-size:11px;padding:2px 9px;border-radius:var(--r-xs);background:var(--c-accent-deep);color:var(--c-surface);
  font-weight:650;letter-spacing:.04em;
}
.qa-school{font-size:15px;font-weight:650;color:var(--c-text);letter-spacing:-.012em}
/* 口径行：灰底小字，但必须一眼可见——数字离开口径就没有意义 */
.qa-caliber{
  display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 6px;margin-bottom:12px;padding:3px 10px;
  border-radius:var(--r-xs);background:var(--c-surface-3);color:var(--c-muted);
  font-size:11.5px;font-variant-numeric:tabular-nums;
}
/* 390px 下「物理类」「本科批」被拆成两行（用户截图）——每个口径段禁拆行 */
.qa-caliber > span{white-space:nowrap}
.qa-caliber b{color:var(--c-text-2);font-weight:600}
/* 单组命中：一个数 + 一行说明 */
.qa-single{display:flex;align-items:baseline;gap:11px;flex-wrap:wrap;margin-bottom:6px}
.qa-main{
  font-size:30px;font-weight:700;letter-spacing:-.035em;line-height:1.1;color:var(--c-text);
  font-variant-numeric:tabular-nums;
}
.qa-main small{font-size:13px;font-weight:500;color:var(--c-muted);margin-left:3px;letter-spacing:0}
.qa-sub{font-size:12.5px;color:var(--c-muted);font-variant-numeric:tabular-nums}
.qa-meta{font-size:12px;color:var(--c-faint);margin-top:8px;line-height:1.75}
.qa-note{
  font-size:12px;color:var(--c-muted);margin-top:9px;padding-top:9px;border-top:1px solid var(--c-border-soft);
  line-height:1.75;
}
.qa-note b{color:var(--c-text-2);font-weight:600}
/* 多组命中：列表 */
.qa-rows{display:flex;flex-direction:column;gap:2px;margin-top:2px}
.qa-row{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:9px 10px;border-radius:var(--r-xs);
}
.qa-row:hover{background:var(--c-surface-3)}
.qa-row-l{min-width:0}
.qa-row-l b{font-size:13.5px;font-weight:600;color:var(--c-text);display:block}
.qa-row-l span{font-size:11.5px;color:var(--c-faint);font-variant-numeric:tabular-nums}
/* 城市小签（2026-11-11）：全国清单里标出地点，权重低于校名（不抢主语） */
.qa-row-l .geo{font-style:normal;font-size:10.5px;font-weight:500;color:var(--c-muted);
  white-space:nowrap;
  background:var(--c-surface-3);border-radius:4px;padding:1px 5px;margin-left:6px;vertical-align:1px}
.qa-row-l span i.badge{margin-right:2px}
.qa-row-r{
  font-size:14px;font-weight:650;color:var(--c-text);text-align:right;flex-shrink:0;
  font-variant-numeric:tabular-nums;white-space:nowrap;
}
.qa-row-r.void{font-size:12.5px;font-weight:500;color:var(--c-faint)}
.qa-row-r em{font-style:normal;font-size:12px;color:var(--c-muted);font-weight:500}
/* 零命中：相近校名建议 */
.qa-sugs{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.qa-sug{
  padding:6px 13px;border-radius:999px;border:1px solid var(--c-border);background:var(--c-surface);
  font-size:12.5px;color:var(--c-text-2);font-weight:500;cursor:pointer;transition:.16s;
}
.qa-sug:hover{border-color:var(--c-accent-deep);color:var(--c-accent-deep)}

/* ===========================================================================
   分页
   =========================================================================== */
.pager{display:flex;justify-content:center;align-items:center;gap:8px;margin:30px 0 0}
.pager button{padding:8px 16px;border-radius:var(--r-sm);border:1px solid var(--c-border);background:var(--c-surface);
  font-size:13px;color:var(--c-muted);font-weight:500;transition:.16s}
.pager button:hover:not(:disabled){border-color:var(--c-accent-deep);color:var(--c-accent-deep)}
.pager button:disabled{opacity:.4;cursor:default}
.pager span{font-size:12.5px;color:var(--c-faint);font-variant-numeric:tabular-nums}

/* ===========================================================================
   详情弹层
   =========================================================================== */
/* 遮罩闲置时必须 visibility:hidden——只靠 opacity:0 挡不住
   「元素遮盖文本」类检查（它强制开启 pointer-events 后逐点命中，
   半透明底也算「盖住」），更实际的是：闲置的 fixed 全屏层会让
   命中测试永远先穿过它。.on 时才真正出现在渲染树。 */
.mask{position:fixed;inset:0;background:rgba(14,20,26,.46);z-index:80;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .2s,visibility 0s .2s}
.mask.on{visibility:visible}
/* A3（2026-11-01，第五轮审计）：基础规则的 visibility 0s .2s 延迟在「显示」方向
   同样生效——开抽屉时遮罩要等 200ms 才可见，opacity 渐入全程隐形再突然出现
   （实测首个 visible @204ms）。transition 取终态规则：.on 里覆盖成 visibility 0s，
   显示方向立即翻转；隐藏方向的延迟仍由基础规则提供（先淡出 0.2s 再隐藏）。 */
.mask.on{opacity:1;pointer-events:auto;transition:opacity .2s,visibility 0s}
.sheet{
  position:fixed;top:0;right:0;bottom:0;width:min(580px,100%);background:var(--c-bg);z-index:81;
  transform:translateX(100%);transition:transform .28s cubic-bezier(.32,.72,0,1),visibility 0s .28s;
  visibility:hidden;pointer-events:none;
  display:flex;flex-direction:column;box-shadow:-12px 0 40px rgba(14,20,26,.18);
}
.sheet.on{transform:none;visibility:visible;pointer-events:auto;transition:transform .28s cubic-bezier(.32,.72,0,1)}
.shead{padding:22px 26px 17px;border-bottom:1px solid var(--c-border);background:var(--c-surface);flex-shrink:0}
.shead .row{display:flex;align-items:flex-start;gap:12px}
.shead h3{margin:0 0 5px;font-size:18px;font-weight:650;line-height:1.35;letter-spacing:-.015em}
.shead .sub{font-size:12.5px;color:var(--c-muted);line-height:1.7}
.sclose{margin-left:auto;width:32px;height:32px;border-radius:var(--r-xs);color:var(--c-muted);
  font-size:20px;line-height:1;flex-shrink:0;display:grid;place-items:center;transition:.16s}
.sclose:hover{background:var(--c-border-soft);color:var(--c-text)}
.sbody{overflow-y:auto;padding:22px 26px 36px;flex:1;-webkit-overflow-scrolling:touch}
/* A3（2026-11-01，第五轮审计）：390px 下四个按钮内容宽之和（340px）超过抽屉
   可用宽（338px），又不许换行，主按钮 flex:1（basis 0）只分到 61px、「加入志愿表」
   被裁 7px。允许换行后末位按钮折到第二行，主按钮改 flex:1 1 auto（见 app.js
   抽屉模板）按内容宽参与布局——桌面宽度一行放得下时视觉不变。 */
.sfoot{padding:14px 26px;border-top:1px solid var(--c-border);background:var(--c-surface);flex-shrink:0;display:flex;flex-wrap:wrap;gap:9px}

.sec{margin-bottom:26px}
.sec h4{font-size:11.5px;font-weight:700;letter-spacing:.12em;color:var(--c-accent-deep);
  margin:0 0 12px;text-transform:uppercase}

/* 趋势图 */
.trend{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);padding:17px 19px}
.trend svg{display:block;width:100%;height:auto}
.tnote{font-size:12px;color:var(--c-muted);margin-top:12px;padding-top:12px;
  border-top:1px solid var(--c-border-soft);line-height:1.7}
.tnote b{color:var(--c-text);font-weight:600}
.tnote .subnote{margin-top:9px;padding-top:9px;border-top:1px solid var(--c-border-soft)}
.tnote .subnote b{color:var(--c-text);font-weight:600;font-variant-numeric:tabular-nums}

/* 专业表 */
.mtable{width:100%;border-collapse:collapse;font-size:12.5px;background:var(--c-surface);
  border:1px solid var(--c-border);border-radius:var(--r);overflow:hidden}
.mtable th{text-align:left;font-weight:600;color:var(--c-faint);font-size:11.5px;
  padding:10px 12px;border-bottom:1px solid var(--c-border);background:var(--c-hover-bg)}
.mtable td{padding:11px 12px;border-bottom:1px solid var(--c-border-soft);vertical-align:top}
.mtable tr:last-child td{border-bottom:none}
.mtable .nm{color:var(--c-text)}
.mtable .pl{text-align:right;font-variant-numeric:tabular-nums;color:var(--c-muted);white-space:nowrap}
.mtable .rm{font-size:11.5px;color:var(--c-faint);line-height:1.6;margin-top:3px}

/* 风险条 */
.risk{display:flex;align-items:center;gap:10px;margin-top:8px}
.risk .bar{flex:1;height:6px;border-radius:3px;background:var(--c-border-soft);overflow:hidden}
.risk .bar i{display:block;height:100%;border-radius:3px}
.risk .lv{font-size:12px;font-weight:600;white-space:nowrap}

/* ===========================================================================
   志愿表体检
   =========================================================================== */
.health{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);padding:17px 20px;margin-bottom:14px;
  box-shadow:var(--c-sh-2)}
.health .htop{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.health .htop b{font-size:13.5px;font-weight:650}
.health .hsum{font-size:12.5px;color:var(--c-muted)}
.health .lv-bad{color:var(--c-bad)}
.health .lv-ok{color:var(--c-wen)}
.health .hlist{margin-top:11px;display:flex;flex-direction:column;gap:1px}
.hitem{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--c-border-soft);
  font-size:12.5px;line-height:1.64}
.hitem:first-child{border-top:none}
.hitem .dot{width:16px;flex-shrink:0;text-align:center;font-size:12px;line-height:1.72;font-weight:700}
.hitem .ht{flex:1;color:var(--c-text-2)}
.hitem .ht b{font-weight:600;color:var(--c-text)}
.hitem.warn .dot{color:var(--c-warn-chip)}
.hitem.bad .dot{color:var(--c-bad)}
.hitem.info .dot{color:var(--c-accent-deep)}
.hitem.ok .dot{color:var(--c-wen)}
.hitem .jump{display:flex;gap:4px;flex-wrap:wrap;flex-shrink:0}
.hitem .jump button{font-size:11px;padding:2px 8px;border-radius:var(--r-xs);border:1px solid var(--c-border);
  color:var(--c-muted);background:var(--c-surface);font-variant-numeric:tabular-nums;transition:.16s}
.hitem .jump button:hover{border-color:var(--c-accent-deep);color:var(--c-accent-deep)}
.hitem .jump-more{font-size:11px;color:var(--c-faint);align-self:center}
.slot.flag{border-color:var(--c-danger-line);background:var(--c-warn-cell)}
.slot.flash{animation:fl 1.1s ease-out}
@keyframes fl{0%{background:var(--c-warn-flash);border-color:var(--c-warn-chip)}100%{background:var(--c-surface)}}

/* 选科不符：只灰化，不隐藏——考生有权知道这个组为什么不能填 */
.tag-bad{background:var(--c-bad-cell);color:var(--c-bad)}

/* ===========================================================================
   志愿表
   =========================================================================== */
.planbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.planbar h1,.planbar h2{margin:0;font-size:20px;font-weight:650;letter-spacing:-.02em}
.planbar .cnt{font-size:13px;color:var(--c-muted);font-variant-numeric:tabular-nums}
.planbar .cnt b{color:var(--c-text);font-size:16px;font-weight:650}
.planbar .sp{flex:1}
/* 梯度构成统计。注意作用域限定在 .planbar：gitem 也用 b-chong/b-wen/b-bao
   做左侧色条标记，若不限定，gitem 整条文字会被染成冲/稳/保的颜色。 */
.planbar .b-chong{color:var(--c-chong);font-weight:600}
.planbar .b-wen{color:var(--c-wen);font-weight:600}
.planbar .b-bao{color:var(--c-bao);font-weight:600}
.planbar .b-no{color:var(--c-faint)}
.planstat{display:flex;gap:12px;font-size:12.5px;font-variant-numeric:tabular-nums}
.btn-ghost{padding:8px 16px;border-radius:var(--r-sm);border:1px solid var(--c-border);background:var(--c-surface);
  font-size:13px;color:var(--c-muted);font-weight:500;transition:.16s}
.btn-ghost:hover{border-color:var(--c-accent-deep);color:var(--c-accent-deep)}
.btn-ghost.danger:hover{border-color:var(--c-danger-line);color:var(--c-bad);background:var(--c-warn-cell)}

/* 志愿表的主操作：四个按钮此前视觉权重完全相同，用户看不出"该点哪个"。
   自动填充是这一步唯一能产出结果的入口（其余是撤销/清空/导出），
   所以给它实心主色，其余保持描边。不改尺寸，避免整行跳动。 */
#planFill{border-color:var(--c-accent-deep);color:var(--c-surface);background:var(--c-accent-deep);font-weight:600}
#planFill:hover{background:var(--c-accent-deep);border-color:var(--c-accent-deep);color:var(--c-surface)}

/* 禁用态要看得出来。之前 disabled 只是不可点、视觉不变，
   用户会以为能点、点了没反应。
   opacity .45 仍偏轻（实测把「可用的浅色按钮」和「禁用按钮」混在一起分不清），
   再叠一层虚线边框 + 去掉底色，让"不可用"有形状差异而不只是浓淡差异。 */
.btn-ghost:disabled{opacity:.5;cursor:not-allowed;border-style:dashed;background:transparent}
.btn-ghost:disabled:hover{border-color:var(--c-border);color:var(--c-muted);background:transparent}

.slots{display:flex;flex-direction:column;gap:6px}
.bandline{font-size:11.5px;color:var(--c-faint);letter-spacing:.06em;margin:0 0 5px}
.bandline.gap{margin-top:14px}
.plan-more{font-size:12px;color:var(--c-faint);padding:12px 2px 0;line-height:1.7}
.slot{display:grid;grid-template-columns:34px 1fr auto;gap:13px;align-items:center;
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);padding:11px 15px;min-height:52px;
  transition:border-color .16s,box-shadow .16s}
.slot:hover{border-color:var(--c-border-strong);box-shadow:0 3px 12px rgba(16,24,32,.06)}
.slot.empty{border-style:dashed;background:transparent;color:var(--c-faint)}
.slot.empty:hover{box-shadow:none;border-color:var(--c-border)}
.slot .idx{font-size:12px;color:var(--c-muted);font-variant-numeric:tabular-nums;text-align:center;
  font-weight:700;background:var(--c-border-soft);border-radius:var(--r-xs);height:26px;
  display:grid;place-items:center}
.slot.empty .idx{background:transparent;font-weight:500;color:var(--c-faint)}
.slot .main{min-width:0}
.slot .t1{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slot .t1 .gc{color:var(--c-faint);font-weight:400}
.slot .t1 .sp6{margin-left:6px}
.slot .t1 .sp4{margin-left:4px}
.slot.empty .t1{font-weight:400;font-size:13px}
.slot .t2{font-size:11.5px;color:var(--c-faint);margin-top:2px}
.slot .acts{display:flex;gap:3px;align-items:center}
.slot .acts button{width:28px;height:28px;border-radius:var(--r-xs);color:var(--c-faint);font-size:13px;
  display:grid;place-items:center;transition:.16s}
.slot .acts button:hover{background:var(--c-border-soft);color:var(--c-text)}

/* 空态 */
.empty{padding:64px 20px;text-align:center;color:var(--c-faint)}
.empty .t{font-size:15px;color:var(--c-muted);font-weight:500;margin-bottom:6px}
.empty .d{font-size:13px}
.plan-empty{padding:58px 24px;text-align:center}
.plan-empty .t{font-size:16px;color:var(--c-text);font-weight:600;margin-bottom:10px;letter-spacing:-.01em}
.plan-empty .d{font-size:13px;color:var(--c-muted);max-width:32em;margin:0 auto 22px;line-height:1.8}
.plan-empty .btn-primary{padding:11px 24px}

/* 加载 */
.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:96px 20px;gap:15px;color:var(--c-muted);font-size:13.5px}
.spin{width:28px;height:28px;border:2.5px solid var(--c-wash-2);border-top-color:var(--c-accent-deep);
  border-radius:50%;animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.progress{width:220px;height:3px;background:var(--c-border-soft);border-radius:2px;overflow:hidden}
.progress i{display:block;height:100%;background:var(--c-accent-deep);transition:width .3s;width:0}

/* A2（2026-11-01）修首屏 CLS 0.2578（审计 0.2347）。机制经真实浏览器逐帧采样
   （scripts/tests/cls_timeline.mjs 一次性诊断）确认，病根有三层，
   第一版「给 main 加 min-height 占位」只治了第三层、CLS 分毫未动：
   ① #boot 在文档流内且不满高：首帧页脚被顶到 ~460px 处（视口内）；
   ② 降遮罩瞬间 view-home 显示，页脚被推到 ~2356px——视口内元素挪了 1900px，
      记一次 CLS（boot 不是覆盖层，页面背后的位移照样计量）；
   ③ min-height:100svh 只撑大 main 这个盒子，页脚在盒内仍紧跟 #boot 排布
      （实测 boot 期页脚仍在 461px），位移分毫未变。
   修复 = 两个动作配合：
   a) #boot 改为 fixed 覆盖层——boot 期完全不参与文档流。副产物：批次/科类切换
      重新升起 boot 时，页面不再被「抽走内容又塞回来」（旧实现每次切换页脚跳
      ~306↔原位，切换路径的 CLS 债一并清掉）。
   b) 首次 boot 期用 html.preboot 给页脚 margin-top:100svh 推到折叠之下——fixed
      只解决 boot 自己不占位，背后还剩 header+页脚 的短流，页脚仍在视口内；
      用 margin-top 而非 flex/min-height：页脚只需要「在折叠下」，不必贴盒底，
      且从折叠外进入视口不记 CLS（位移计量只算上一帧可见的元素）。
      preboot 只由首屏降遮罩处移除（app.js bootUp 不复活它），切换路径因此零位移。
   约束：降遮罩必须走 .off 类 + 移除 preboot，内联 display 会同时绕开两者、CLS 复发
   （scripts/tests/cls_probe.mjs 可回归实测）。svh 而非 vh：手机地址栏收放会改变
   视口高，vh 占位的高度本身就会漂移。 */
#boot{position:fixed;inset:0;z-index:90;background:var(--c-bg)}
#boot.off{display:none}
/* 禁 JS 覆盖层（2026-11-05）：<noscript> 只在 JS 关闭时渲染，天然顶掉 #boot
   那个永久的「正在加载」。z-index 高于 #boot(90)，用页面底与正文色，
   双主题下都成立。 */
.boot-nojs{position:fixed;inset:0;z-index:95;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:12px;padding:32px;
  background:var(--c-bg);color:var(--c-text);text-align:center}
.boot-nojs strong{font-size:18px;letter-spacing:-.01em;font-weight:650}
.boot-nojs p{margin:0;max-width:34em;font-size:14px;line-height:1.85;color:var(--c-muted)}
html.preboot footer.foot{margin-top:100vh;margin-top:100svh}

/* 提示条 */
.toast{position:fixed;left:50%;bottom:34px;transform:translate(-50%,16px);z-index:200;
  background:var(--c-text);color:var(--c-surface);font-size:13px;padding:11px 20px;border-radius:var(--r-sm);
  opacity:0;pointer-events:none;transition:.22s;max-width:86vw;text-align:center;
  box-shadow:0 12px 30px -12px rgba(16,24,32,.5)}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* toast 原先固定在 bottom:34px，会压住对比托盘与窄屏底部 Tab 栏
   （实测截图里提示条正好盖在对比表下方的说明文字上）。
   这两个东西出现时把提示上移，避免叠在一起。 */
/* 托盘实际高度约 56px，加上原 34px 间距 → 90px 才不压表格末行。
   实测 70px 时 toast 底边(837) 与说明文字顶边(834) 仍重叠 3px。 */
/* toast 原先固定在 bottom:34px，会压住三样东西：
   ① 对比托盘（实测盖在对比表下方说明文字上）
   ② 窄屏底部 Tab 栏（高 58px）
   ③ 抽屉固定底栏（视觉核对时发现它压在列表卡片上）
   统一规则：有底部浮层时上移到浮层之上，而不是只认对比托盘。 */
body.has-cmp .toast{bottom:92px}
body.has-sheet .toast{bottom:78px}
@media (max-width:640px){
  body.has-cmp .toast{bottom:158px}
  body.has-sheet .toast{bottom:74px}
  body:not(.has-cmp):not(.has-sheet) .toast{bottom:74px}
}

/* 截图/自动化核对用：?noanim=1 关掉全部过渡，避免抓到动画中途的状态 */
body.noanim *,body.noanim *::before,body.noanim *::after{
  transition:none!important;animation:none!important}

/* ===========================================================================
   数据来源与纠错
   =========================================================================== */
.pagehead{padding:6px 0 22px;border-bottom:1px solid var(--c-border);margin-bottom:24px}
.pagehead h1,.pagehead h2{font-size:25px;font-weight:650;letter-spacing:-.025em;margin:0 0 10px}
.pagehead p{margin:0;color:var(--c-muted);font-size:13.5px;line-height:1.85;max-width:780px}

/* 法务文档（隐私政策 / 服务条款，2026-11-02 合规补齐）。
   长文阅读排版：窄栏 + 大行高 + 明确的小节层级。颜色全走语义变量，
   深色层自动适配（不另写深色规则——那正是「两套来源」的老毛病）。
   h2/h3 不复用 .pagehead 的字号：法务页是文档不是页头，25px 会喧宾夺主。 */
.legal{max-width:760px;margin:40px auto 0;padding:28px 26px;
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);box-shadow:var(--c-sh-1)}
.legal + .legal{margin-top:20px}
.legal h2{font-size:18px;font-weight:650;letter-spacing:-.01em;margin:0 0 4px;color:var(--c-text)}
.legal .legal-meta{font-size:12px;color:var(--c-faint);margin:0 0 14px}
.legal h3{font-size:14px;font-weight:600;color:var(--c-text-2);margin:16px 0 6px}
.legal p{margin:0;color:var(--c-muted);font-size:13.5px;line-height:1.85}

.srcyear{
  display:flex;align-items:baseline;gap:11px;
  margin:32px 0 13px;font-size:16.5px;font-weight:650;letter-spacing:-.01em;
}
.srcyear span{font-size:12px;color:var(--c-faint);font-weight:400}
.srcyear::after{content:"";flex:1;height:1px;background:var(--c-border)}

.srclist{display:flex;flex-direction:column;gap:10px}
.srcitem, .moeitem{
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);
  padding:16px 19px;box-shadow:var(--c-sh-1);transition:border-color .16s;
}
.srcitem:hover, .moeitem:hover{border-color:var(--c-border-strong)}
.srchead{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:10px}
.srcbatch{
  font-size:11.5px;padding:3px 10px;border-radius:999px;
  background:var(--c-wash-1);color:var(--c-accent-deep);font-weight:600;white-space:nowrap;
}
.srcbatch.alt{background:var(--c-border-soft);color:var(--c-muted)}
.srcfile{
  font-size:13px;color:var(--c-text-2);background:var(--c-border-soft);
  padding:3px 8px;border-radius:var(--r-xs);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.srcsize{margin-left:auto;font-size:11.5px;color:var(--c-faint);font-variant-numeric:tabular-nums}
.srctitle{font-size:13.5px;font-weight:600;line-height:1.62;margin-bottom:5px}
.srcmeta{font-size:13px;color:var(--c-faint);margin-bottom:5px}
.srcparsed{font-size:13px;color:var(--c-muted);line-height:1.75}
.srcnote{
  font-size:12px;color:var(--c-warn-chip);background:var(--c-warn-soft);
  border-radius:var(--r-xs);padding:9px 11px;margin-top:8px;line-height:1.72;
  /* P3.3：长 URL / 长串没有断词点，360px 下把整页撑出 55px 横向滚动 */
  overflow-wrap:anywhere;word-break:break-word;
}
.srclinks{display:flex;gap:16px;margin-top:10px;font-size:13px}
.srclinks a{overflow-wrap:anywhere;word-break:break-word;
  border-bottom:1px solid var(--c-border);padding-bottom:1px;font-weight:500}
.srclinks a:hover{border-bottom-color:var(--c-accent-deep)}
.srcsha{
  display:flex;gap:9px;align-items:baseline;margin-top:10px;
  padding-top:9px;border-top:1px dashed var(--c-border);
}
.srcsha span{font-size:11px;color:var(--c-faint);flex-shrink:0}
.srcsha code{
  font-size:11px;color:var(--c-muted);overflow-wrap:anywhere;word-break:break-all;line-height:1.64;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* ===========================================================================
   页脚
   =========================================================================== */
.foot{margin-top:64px;padding-top:26px;border-top:1px solid var(--c-border);
  font-size:12px;color:var(--c-faint);line-height:1.85}
.foot-brand{display:flex;align-items:center;gap:9px;margin-bottom:12px}
.foot-brand .logo{width:25px;height:25px}
.foot-brand b{color:var(--c-text);font-weight:650;font-size:13.5px}
.foot p{margin:0 0 8px;max-width:860px}
/* M9（2026-11-03）：三卖点从「一行彩字」升级为三枚徽章胶囊——用户点名要亮眼，
   就按徽章该有的体量给：软薄荷底 + 描边 + 深墨字 + 对勾，深浅两态同构。 */
.foot-hero{font-size:14px;color:var(--c-text)}
.foot-hero b{color:var(--c-accent-deep);font-weight:600}
.footlink{display:inline-block;margin-top:8px;border-bottom:1px solid var(--c-border);padding-bottom:1px;
  /* 页脚底是页面底灰 #F5F6FA：brand-2 #2E6BFF 只有 4.24:1，而这行是 12px 正文。
     换成品牌主色 #004CFF → 5.68:1。hover 才提亮到 brand-2，反正那时已不是唯一线索。 */
  color:var(--c-accent-deep);font-weight:500}
.footlink:hover{border-bottom-color:var(--c-accent-deep);color:var(--c-accent-deep)}
/* 备案号：法规要求「可见但低调」，用弱化色而非品牌色——它是合规信息不是入口。
   深浅色都走 var(--c-faint)，对比度由主题变量保证。 */
.beian{margin-top:10px;font-size:12px}
.beian a{color:var(--c-faint);text-decoration:none}
.beian a:hover{color:var(--c-accent-deep);border-bottom:1px solid var(--c-border)}

/* ===========================================================================
   组间对比
   ---------------------------------------------------------------------------
   设计要点：
   1. 表格横向可滚，但**首列（指标名）固定**——滚到右边时还得知道这一行是什么，
      否则两列数字并排就没意义了。
   2. 高亮用极浅的底色而不是粗边框/彩色文字：它表达的是"这一格数字更有利"，
      不是"推荐这个组"。视觉上必须弱于梯度徽章，不能抢判断权。
   3. 窄屏（<640）仍保持三列横排不折行 —— 折行后对比关系就断了，
      宁可让用户横向滚动。
   =========================================================================== */

.cmpscroll{overflow-x:auto;background:var(--c-surface);border:1px solid var(--c-border);
  border-radius:var(--r);margin:16px 0;-webkit-overflow-scrolling:touch}
.cmpscroll::-webkit-scrollbar{height:8px}
.cmpscroll::-webkit-scrollbar-thumb{background:var(--c-scroll-thumb);border-radius:4px}

.cmptable{border-collapse:separate;border-spacing:0;width:100%;min-width:520px;
  font-size:13px;margin:0}
.cmptable th,.cmptable td{padding:11px 14px;border-bottom:1px solid var(--c-border-soft);
  text-align:left;vertical-align:top}
.cmptable tr:last-child th,.cmptable tr:last-child td{border-bottom:none}

/* 表头：校名 + 组号 + 移出 */
.cmptable thead th{background:var(--c-surface-2);border-bottom:1px solid var(--c-border);
  vertical-align:top;position:relative;min-width:150px}
.cmpsch{font-size:13.5px;font-weight:650;line-height:1.4;color:var(--c-text);
  letter-spacing:-.01em;padding-right:34px}
.cmpgc{font-size:11.5px;color:var(--c-faint);font-family:var(--mono);margin-top:2px}
.cmprm{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:6px;
  font-size:11px;color:var(--c-faint);background:transparent;border:1px solid transparent;
  padding:0;line-height:1;display:grid;place-items:center}
.cmprm:hover{background:var(--c-bad-soft);color:var(--c-bad);border-color:var(--c-danger-line)}

/* 指标名列：固定在左侧，横向滚动时保持可见 */
.cmptable .cmk{position:sticky;left:0;z-index:2;background:var(--c-surface);
  font-size:12px;font-weight:600;color:var(--c-muted);white-space:nowrap;
  min-width:112px;border-right:1px solid var(--c-border-soft)}
.cmptable thead .cmk{background:var(--c-surface-2);z-index:3}

/* "数字更有利"的格子：极浅底色，弱于任何状态色 */
.cmptable td.best{background:var(--c-best-cell)}
.cmptable td.best::after{content:"";position:absolute}

.quietx{color:var(--c-faint)}

/* 窄列里的长文本（如「仅两年可比」「由往年大组拆出」）默认单行会把
   右列裁掉半句——实测手机端「三年位次」行只显示到「仅两年可」。
   允许换行，两行封顶。 */
.cmptable td{overflow-wrap:anywhere;word-break:break-word}

.cmpnote{font-size:12.5px;color:var(--c-faint);line-height:1.75;margin:0 0 18px;
  max-width:720px}
.cmpnote b{color:var(--c-muted);font-weight:600}

.cmpacts{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}

/* 底部托盘 */
.cmpbar{position:fixed;left:0;right:0;bottom:0;z-index:60;
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:10px 20px calc(10px + env(safe-area-inset-bottom,0px));
  background:var(--c-glass);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-top:1px solid var(--c-border);box-shadow:0 -2px 16px rgba(16,24,32,.07)}
.cmpbar[hidden]{display:none}
.cmpbar-n{font-size:13px;color:var(--c-muted);flex-shrink:0}
.cmpbar-n b{color:var(--c-accent-deep);font-size:15px;font-weight:700}
.cmpbar .sp{flex:1}
.cmpbar-list{display:flex;gap:7px;flex-wrap:nowrap;overflow-x:auto;min-width:0;
  scrollbar-width:none;padding:2px 0}
.cmpbar-list::-webkit-scrollbar{display:none}
.cmpchip{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;
  padding:4px 6px 4px 10px;border-radius:999px;border:1px solid var(--c-border);
  background:var(--c-surface);font-size:12px;color:var(--c-text-2);white-space:nowrap;max-width:190px}
.cmpchip button{width:18px;height:18px;border-radius:50%;font-size:12px;line-height:1;
  color:var(--c-faint);display:grid;place-items:center;flex-shrink:0}
.cmpchip button:hover{background:var(--c-bad-soft);color:var(--c-bad)}

@media (max-width:640px){
  /* 窄屏托盘分两行：第一行 chips（横滑），第二行按钮。
     单行放不下 3 枚 chip + 按钮，实测会只露出 1 枚、其余被压住 ——
     而 chips 是"我在比哪几个"的唯一提示，也是列表页唯一的移除入口。
     P3.7：原先这里有两份 .cmpbar 规则，前一份（flex-wrap:nowrap + gap:8px）
     已被后一份完全覆盖、padding 也相同，属于迭代残留，已删除。 */
  .cmpbar{padding:7px 12px calc(7px + env(safe-area-inset-bottom,0px));
    gap:6px;flex-wrap:wrap;align-items:center}
  .cmpbar-n{display:none}
  .cmpbar-list{order:0;flex:1 1 100%;width:100%;flex-wrap:nowrap;
    overflow-x:auto;padding:0 0 2px;display:flex;gap:6px}
  .cmpchip{max-width:150px;font-size:11.5px;padding:3px 6px 3px 9px;
    flex-shrink:0;display:inline-flex}
  .cmpbar .sp{display:none}
  .cmpbar .btn-ghost,.cmpbar .btn-primary{padding:6px 12px;font-size:12.5px;
    flex:0 0 auto;order:1}
  #cmpClear{display:none}                 /* 清空在对比页里也有，窄屏省位 */
  body.has-cmp{padding-bottom:158px}
  /* 对比表尾部留白：托盘约 96px（两行）+ Tab 栏 58px，
     不给出空间最后一行会被压在托盘下面。 */
  #view-compare{padding-bottom:120px}

  /* 窄屏改为**每校一卡**的纵向布局（见 JS 里 narrow 分支）。
     横排三列在 390px 下每列只有 ~90px：校名要截断、数值要换行，
     而且一次只能看到 2 列 —— 而「对比」的全部价值就是同时看见。 */
  .cmpcards{display:flex;flex-direction:column;gap:12px}
  .cmpcard{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);
    overflow:hidden}
  .cmpcard-hd{display:flex;align-items:baseline;gap:8px;padding:12px 14px;
    background:var(--c-surface-2);border-bottom:1px solid var(--c-border-soft)}
  .cmpcard-hd b{font-size:14px;font-weight:650;letter-spacing:-.01em}
  .cmpcard-hd .g{font-size:11.5px;color:var(--c-faint);font-family:var(--mono)}
  .cmpcard-hd .rm{margin-left:auto;font-size:11.5px;color:var(--c-faint);
    border:1px solid var(--c-border);border-radius:6px;padding:2px 8px}
  .cmpcard-row{display:flex;align-items:baseline;justify-content:space-between;
    gap:12px;padding:8px 14px;border-bottom:1px solid var(--c-border-soft);font-size:13px}
  .cmpcard-row:last-child{border-bottom:none}
  .cmpcard-row .k{color:var(--c-faint);font-size:12px;flex-shrink:0}
  .cmpcard-row.best{background:var(--c-best-cell)}

  .cmpsch{font-size:13px}
  .cmptable th,.cmptable td{padding:10px 11px}
}


/* ===========================================================================
   暗色模式（双主题 M0，2026-11-02 起由属性选择器驱动）
   ---------------------------------------------------------------------------
   只覆盖变量，不改任何选择器 —— 全站色值已在上面的 :root 里收敛。
   35 项变量 + 22 项别名，一处定义，整站生效。

   几处刻意的取舍：
   1. **不是简单反色**。深底上纯白字会发光刺眼，正文用 #dfe4e9 而非 #fff。
   2. **品牌蓝要提亮**。原 --brand #0b4a66 在深底上几乎看不见，
      提亮到 #4fa8c9 才够对比；但按钮底色仍用深一档，避免大面积高饱和。
   3. **冲/稳/保三种状态色都要重算**。原来是为浅底选的深色，
      深底上必须提亮，否则红绿混在一起分不清。
   4. 打印样式不参与（@media print 里仍是固定色，打印需要白纸黑字）。

   **为什么从系统媒体查询改成 [data-theme="dark"]**：
   系统偏好没法被页面覆盖——用户手动选「浅色」时，媒体查询照样按系统深色生效，
   于是「手动切换」这个功能根本无从实现。改成属性选择器后，
   `assets/theme.js` 在首帧前把「用户选择 + 系统偏好」解析成 <html data-theme>，
   CSS 只认这一个属性：单一来源，手动与自动走同一条路径。
   代价：没有 JS 时一律浅色（本站所有功能本就依赖 JS，不额外维护第二套逻辑）。

   **为什么是 `:where(:root[data-theme="dark"]) 选择器` 而不是 `html[data-theme] 选择器`**：
   `:where()` 的权重是 0，加上前缀后与原选择器同权重，
   于是「深色规则 vs 浅色规则」的先后关系仍然只由文件顺序决定——
   与媒体块时代的层叠结果逐字节一致，不需要重新验一遍所有覆盖关系。
   只有 `:root` 那一块用 `:root[data-theme="dark"]`（权重 0,2,0 > :root 的 0,1,0），
   否则变量根本覆盖不掉浅色默认值。

   验收：verify_compliance 的「深色对比度」组按属性选择器重新解析（块数下限改成
   规则数下限，写法一变就整块逃检的坑见 G32），smoke_web 的 darkMode 断言走
   CDP 模拟系统深色 + theme.js 的 matchMedia 监听。
   =========================================================================== */


:where(:root[data-theme="dark"]) .cmpscroll::-webkit-scrollbar-thumb{background:var(--c-scroll-thumb)}
/* 白字压在品牌色上时，深底模式下品牌色已提亮，需要深字。
   .nav button.on 不在此列：V2.4 起导航选中态是「透明底 + 品牌字 + 底部横线」，
   底色不是品牌色，字色跟随 --c-accent-deep（深色下即亮绿）。 */
:where(:root[data-theme="dark"]) .batch-sw button.on,:where(:root[data-theme="dark"]) .chip.on,:where(:root[data-theme="dark"]) .btn-primary{color:#05261A}
:where(:root[data-theme="dark"]) .badge{color:#05261A}

/* 小节标题（.sec h4）用的是 --brand，深底上 6.08:1 勉强够，
   但它同时是 11.5px 小字 + 大写字距，实际偏暗。
   单独提亮一档，让"硬性报考限制 / 你的位置 / 同分判定"这些锚点更立得住。 */
:where(:root[data-theme="dark"]) .sec h4{color:var(--c-accent)}
:where(:root[data-theme="dark"]) .sec-title{color:var(--c-accent)}

/* 硬性限制块：深底上 warn-soft 与卡片底色亮度接近，
   整块读起来像普通横幅而不是警示。加一道明确的左边框把它拉出来。 */
:where(:root[data-theme="dark"]) .note.warn{border-left-width:3px;background:#2e2416}
:where(:root[data-theme="dark"]) .note.bad{border-left-width:3px;background:#311b19}

/* 列表选中/悬停态：浅色下靠极淡绿区分，深底上完全看不出。 */
:where(:root[data-theme="dark"]) .gitem:hover{border-color:var(--c-border-strong);box-shadow:var(--c-sh-2)}

/* 科类切换器的选中态：浅色下靠"白底浮起"表达选中，
   深底上 --surface(#1f262d) 反而比容器底 --line-soft(#222b33) 更暗，
   看起来像"没选中"甚至凹陷。改为更亮一档。 */
:where(:root[data-theme="dark"]) .track-sw{background:var(--c-border)}
:where(:root[data-theme="dark"]) .track-sw button.on{background:#39434d;color:#fff;
}

/* 「我有分数 / 我有位次」在 hero 深色渐变里。浅色模式下是白底浮起，
   暗色模式下 --surface 变成深色，反而糊在渐变上。保持浅底即可 ——
   hero 本身在两种模式下都是深色，这块不用跟着变。 */
:where(:root[data-theme="dark"]) .qtab button.on{background:#eef3f6;color:#0a3d54}

/* 表单控件（搜索框、下拉）默认是浏览器浅色样式，暗色下会突兀 */
:where(:root[data-theme="dark"]) .filters input[type=search],:where(:root[data-theme="dark"]) .filters select,
:where(:root[data-theme="dark"]) .qin input,:where(:root[data-theme="dark"]) [type=search],:where(:root[data-theme="dark"]) [type=text],:where(:root[data-theme="dark"]) select{
  background:var(--c-surface);color:var(--c-text);border-color:var(--c-border)}



/* ===========================================================================
   响应式
   =========================================================================== */
@media (max-width:900px){
  .top-row{padding:0 16px;height:56px;gap:14px}
  .top-bar-in{padding:6px 16px}
  .brand-t i{display:none}
  .nav button{padding:7px 11px;font-size:13px}
  .wrap{padding:22px 16px 84px}
  .hero{padding:28px 24px 26px;border-radius:var(--r)}
  .hero h1{font-size:27px}
  .lede{font-size:14px}
  .summary{grid-template-columns:1fr 1fr}
  .summary>div:nth-child(3){border-left:none}
  .summary>div:nth-child(n+3){border-top:1px solid var(--c-border-soft)}
  .summary .v{font-size:23px}
  .summary>div:first-child .v{font-size:25px}
  .howto{grid-template-columns:1fr;gap:20px}
  .gitem{grid-template-columns:1fr;gap:11px;padding-left:20px}
  .gright{flex-direction:row;align-items:baseline;justify-content:flex-start;gap:14px;
    min-width:0;text-align:left}
  .gscore{font-size:23px}
  .qcard{padding:14px}
  .qin input{font-size:22px;padding:12px 0}
  .btn-primary{padding:0 20px;font-size:14px}
  .sheet{width:100%}
  .fcount{margin-left:0;width:100%}
  .pagehead h1,.pagehead h2{font-size:22px}
}

/* 收藏星标（列表卡片右上角）。
   位置：绝对定位在卡片右上角，不挤左侧信息与右侧分数。
   默认是极淡的空心感（低透明度），收藏后实心 + 品牌色 ——
   不能用黄色（那是"评分"的语义），这是"我的备选池"。 */
.favbtn{position:absolute;top:10px;right:12px;width:30px;height:30px;
  font-size:15px;line-height:1;display:grid;place-items:center;
  color:var(--c-muted);opacity:.8;border-radius:8px;transition:.16s;z-index:2}
/* 未收藏也要能被一眼看到：opacity .55 在浅底上太淡（实测 104,114,125 @ .55），
   会被当成装饰而不是按钮。改为 .8 + muted 灰。 */
.favbtn:hover{opacity:1;background:var(--c-wash-1);color:var(--c-accent-deep)}
.favbtn.on{opacity:1;color:var(--c-accent-deep)}
.favbtn:focus-visible{outline:2px solid var(--c-accent-deep);outline-offset:1px}

/* P3.3：列表卡片可键盘聚焦（原来是纯 div + click 委托，Tab 只能到收藏星标）。
   焦点环要清晰，但不要盖住卡片左侧的梯度色条。 */
.gitem:focus-visible{outline:2px solid var(--c-accent-deep);outline-offset:2px}
.gitem[role="button"]{cursor:pointer}

/* 尊重系统「减少动效」偏好：过渡/平滑滚动全部关掉 */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  html{scroll-behavior:auto!important}
}

/* 窄屏：导航下沉为底部 Tab 栏，顶栏只留品牌 + 批次 + 科类 */
@media (max-width:640px){
  body{padding-bottom:58px}
  /* P3.3：对比托盘（z60，根级）会盖住底部导航（.nav 在 .top 的 z50 层叠上下文里）。
     实测 elementFromPoint(nav 中心) 返回 cmpBar，有对比项时点不到「查位次/志愿表」。
     把托盘抬到 Tab 栏之上，两者不再抢 bottom:0。 */
  .cmpbar{bottom:calc(58px + env(safe-area-inset-bottom,0px))}
  /* 顶栏的 backdrop-filter 会成为 fixed 子元素的包含块，
     导致底部 Tab 栏定位错乱，这里必须关掉 */
  .top{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--c-surface)}
  .top-row{padding:0 14px;height:52px;justify-content:space-between;gap:10px}
  .brand b{font-size:15.5px}
  .logo{width:27px;height:27px}
  .nav{
    position:fixed;left:0;right:0;bottom:0;z-index:70;
    background:var(--c-glass);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
    border-top:1px solid var(--c-border);display:flex;height:58px;
    padding:0 6px calc(env(safe-area-inset-bottom,0px));
    box-shadow:0 -2px 16px rgba(16,24,32,.07);
  }
  .nav button{
    flex:1;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:3px;font-size:10.5px;color:var(--c-muted);padding:0;font-weight:500;position:relative;
  }
  .nav .ic{display:block;width:20px;height:20px}
  .nav button.on{background:none;color:var(--c-accent-deep);font-weight:600}
  .nav button.on::after{
    content:"";position:absolute;top:0;width:26px;height:2.5px;
    border-radius:0 0 2px 2px;background:var(--c-accent-deep);
  }
  /* 窄屏：导航下沉成底部 Tab，第一行右侧空出来，**科类挪到第一行**
     （HTML 里科类本来就在导航之前，这里只是确认它不被隐藏），
     批次独占第二行并横向可滚——这样四个批次都完整可见可点。
     之前让批次和科类抢同一行，「专科」被科类切换压住一半：
     看得见但点不准，而且横向滚动在手机上很难被用户发现。 */
  .top-bar-in{padding:5px 12px 6px;gap:8px;flex-wrap:nowrap}
  .batch-sw{gap:5px;flex:1 1 auto;min-width:0;flex-wrap:nowrap;overflow-x:auto;
    scrollbar-width:none;padding-right:4px}
  .batch-sw::-webkit-scrollbar{display:none}
  .batch-sw button{padding:5px 10px;font-size:12.5px}
  /* 品牌名（2026-11-12 用户点名）：移动端也用全称「黑龙江高考志愿填报」。
     旧短名「志愿填报」是顶栏旧架构（品牌与批次挤同一行）时代的产物；
     fixed+胶囊 + 批次独立成行后实测 390px 放得下（372 < 390），短名退役。 */
  .track-sw{flex-shrink:0}
  .track-sw button{padding:5px 11px;font-size:12.5px}
  .tb-label{display:none}
  /* 输入区在窄屏改为上下堆叠：横排放不下，placeholder 会被按钮挤掉
     （曾出现「输入高考总分，如 分」——数字 528 被切掉了）。 */
  .qrow{flex-direction:column}
  .qin{width:100%}
  .btn-primary{width:100%;padding:11px 0}
  .filters{gap:6px}
  .filters input[type=search]{max-width:none;min-width:0;flex:1 1 100%}
  .filters select{flex:1}
  .chip{font-size:12px;padding:5px 11px}
  .planbar h1,.planbar h2{font-size:17px}
  .planbar .btn-ghost{font-size:12.5px;padding:7px 11px}
  .hero{padding:24px 18px 22px}
  .hero h1{font-size:24px}
  .gitem{padding:13px 16px 13px 18px}
  .gname{font-size:14.5px}
  /* 志愿表的 ↑ ↓ × 只有 28px，低于 44px 触控标准：手指点不准，
     而这三个键是调整顺序的唯一入口（误点 × 还会删掉一格）。 */
  .slot .acts{gap:2px;align-self:center}
  .slot .acts button{width:40px;height:40px;font-size:15px}
  .slot .acts button[data-act="del"]{color:var(--c-bad)}
  .sclose{width:40px;height:40px;font-size:23px}
  /* 窄屏下操作键占掉 120px，组名只剩 ~142px，实测需要 177px。
     原来靠 nowrap+ellipsis，会把「东北师范大学 021 组」砍成「东北师范大学 …」——
     组号是识别志愿的关键，砍掉等于这条志愿看不出是哪一组。
     窄屏改为允许换行，最多两行。 */
  .slot .t1{white-space:normal;overflow:visible;text-overflow:clip;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
    overflow:hidden;line-height:1.45}
  .slot{grid-template-columns:28px 1fr auto;gap:10px;padding:10px 12px;align-items:start}
  .pagehead h1,.pagehead h2{font-size:20px}
}

/* 小屏顶栏换行时，批次与科类仍然要能被看到、能点到 */
@media (max-width:520px){
  .top-row{flex-wrap:wrap;height:auto;padding:8px 12px;gap:8px 10px}
  /* 品牌 + 科类一行，批次另起一行。
     科类在 HTML 里位于导航之前、.top-row 内，导航在窄屏下沉成底部 Tab，
     所以第一行右边正好留给科类。 */
  .track-sw{margin-left:auto}
}

@media print{
  .top,.nav,.pager,.filters,.sfoot,.planbar{display:none!important}
  .slot .acts{display:none!important}
  .mask,.sheet,.toast{display:none!important}
  /* P3.3：打印不参与主题。暗色下 --surface/--ink 是深底浅字，
     浏览器默认不打印背景 → 白纸配浅灰字（实测几乎不可读）。
     这里强制白纸黑字，并把徽章改成深字描边（背景不打印，白字会消失）。 */
  body{background:#fff!important;color:#111!important;padding-bottom:0}
  .card,.slot,.summary,.howto,.trend,.bandcard,.notice{background:#fff!important;color:#111!important;
    box-shadow:none!important;border-color:#cfcfc9!important}
  .slot{break-inside:avoid;border-color:#d8d8d2}
  .slot.empty{display:none!important}
  .slot .t1,.slot .t2,.slot .k,.slot .v{color:#111!important}
  .badge{background:#fff!important;color:#111!important;border:1px solid #666!important;
    -webkit-print-color-adjust:exact;print-color-adjust:exact}
  .print-meta,.print-note{color:#444!important}
  .wrap{padding:0;max-width:none}
  #view-plan::before{
    content:"黑龙江高考志愿填报 · 志愿表";display:block;font-size:15px;font-weight:600;
    margin-bottom:10px;padding-bottom:8px;border-bottom:1.5px solid #1c1c1a;
  }
  .print-meta{display:block!important;font-size:11.5px;color:#444;margin-bottom:14px;
    line-height:1.7;padding-bottom:10px;border-bottom:1px solid var(--c-rule-strong)}
  .print-note{display:block!important;margin-top:18px;padding-top:10px;
    border-top:1px solid var(--c-rule-strong);font-size:10.5px;color:#666;line-height:1.7}
  @page{margin:16mm 14mm}
}

/* ===========================================================================
   打印版志愿方案（P3.8）
   ---------------------------------------------------------------------------
   点「导出 PDF」时生成一套独立文档（#printDoc），而不是直接打印交互页面：
   页面有分页/折叠/按钮，打印要的是连续、固定分页、无交互的正式文档。
   仅 body.printing-doc 时生效，直接 Cmd+P 仍走上面的旧打印样式。
   =========================================================================== */
.plan-name{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--c-muted)}
.plan-name input{width:124px;padding:6px 9px;border:1px solid var(--c-border);border-radius:8px;
  background:var(--c-surface);font-size:12.5px;color:var(--c-text);outline:none;transition:.16s}
.plan-name input:focus{border-color:var(--c-accent-deep);box-shadow:0 0 0 3px var(--c-wash-1)}
.printdoc{display:none}

@media print{
  @page{size:A4;margin:14mm 13mm}
  body.printing-doc .top,
  body.printing-doc .wrap,
  body.printing-doc .nav,
  body.printing-doc .mask,
  body.printing-doc .sheet,
  body.printing-doc .toast,
  body.printing-doc .cmpbar{display:none!important}
  body.printing-doc .printdoc{display:block!important}
  body.printing-doc{background:#fff!important}

  .printdoc{color:#111;font-family:"Songti SC","STSong","SimSun","Noto Serif CJK SC",serif;
    font-size:10.5pt;line-height:1.65;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pd-page{position:relative}
  .pd-cover{min-height:252mm;display:flex;flex-direction:column;break-after:page}
  /* 填报清单页（封面之后第 2 页）：操作顺序 ≠ 阅读顺序——官方系统按 1→45 填，
     所以清单按志愿表全局顺序排，并留一列方框供打印后勾对。 */
  /* 打印时跳过导航链接必须消失：它 position:fixed 在分页媒体里仍会落进每页页脚，
     实测每页末尾都印出「跳到正文」。 */
  .skip-link{display:none!important}
  .pd-fillist{break-before:page}
  .pd-fillist .pd-h2{margin:0 0 1mm;font-size:13pt;padding-bottom:1mm}
  .pd-fillist .pd-lead{margin:0 0 1.4mm;font-size:7.9pt;line-height:1.5}
  .pd-filltable{width:100%;border-collapse:collapse;font-size:7.9pt;line-height:1.15}
  .pd-filltable th{background:#eef2f6;color:#44505c;font-weight:600;text-align:left;
    padding:1.1mm 1.8mm;border-bottom:1.2px solid #cfd8e0}
  .pd-filltable td{padding:.34mm 1.8mm;border-bottom:1px solid #e6ebf0;vertical-align:middle}
  .pd-filltable tr{break-inside:avoid}
  .pd-filltable .pd-c{width:7mm}
  .pd-filltable .pd-i{width:8mm;color:#667085;font-variant-numeric:tabular-nums}
  .pd-filltable .pd-g,.pd-filltable .pd-p{width:15mm;white-space:nowrap}
  .pd-filltable .pd-b{width:8mm;text-align:center;font-weight:600}
  .pd-filltable .pd-s{width:18mm}
  .pd-filltable .pd-v{width:34mm;white-space:nowrap;font-variant-numeric:tabular-nums}
  .pd-filltable .pd-box{display:inline-block;width:3.6mm;height:3.6mm;
    border:1px solid #9aa5ae;border-radius:.6mm}
  .pd-band{break-before:page}
  .pd-head{display:flex;justify-content:space-between;align-items:flex-start;
    border-bottom:2px solid #0b4a66;padding-bottom:3mm}
  .pd-brand{display:flex;gap:3mm;align-items:center}
  .pd-logo{width:11mm;height:11mm;border-radius:2mm;background:#0b4a66;color:#fff;
    display:grid;place-items:center;font-weight:700;font-size:15pt;font-family:"Heiti SC","PingFang SC",sans-serif}
  .pd-brand b{display:block;font-size:13pt;letter-spacing:.04em;font-family:"Heiti SC","PingFang SC",sans-serif}
  .pd-brand i{display:block;font-style:normal;font-size:8pt;color:#666;margin-top:.6mm}
  .pd-no{text-align:right;font-size:8pt;color:#666;line-height:1.5}
  .pd-no b{font-size:9pt;color:#111;letter-spacing:.04em}
  .pd-title-wrap{margin:14mm 0 8mm;text-align:center}
  .pd-kicker{font-size:10pt;letter-spacing:.35em;color:#0b4a66}
  .pd-title{font-family:"Heiti SC","PingFang SC",sans-serif;font-size:27pt;line-height:1.35;
    margin:5mm 0 4mm;letter-spacing:.08em;font-weight:700}
  .pd-subtitle{font-size:11pt;color:#555;letter-spacing:.08em}
  .pd-info{display:grid;grid-template-columns:1fr 1fr;border:1px solid #cfd8de;
    border-radius:2mm;overflow:hidden;margin-bottom:9mm}
  .pd-info-cell{display:flex;gap:4mm;padding:2.8mm 5mm;border-bottom:1px solid #e3e8ec;font-size:10pt}
  .pd-info-cell:nth-child(odd){border-right:1px solid #e3e8ec}
  .pd-info-cell:nth-last-child(-n+2){border-bottom:none}
  .pd-ik{color:#666;min-width:16mm;flex-shrink:0}
  .pd-iv{color:#111;font-weight:600}
  .pd-overview{font-size:10pt;color:#444;line-height:1.8;margin:0 0 7mm;
    padding:3mm 4mm;background:#f6f8fa;border-left:2px solid #0b4a66;border-radius:1mm}
  .pd-overview b{color:#0b4a66}
  .pd-reco-title{font-size:12pt;font-weight:700;font-family:"Heiti SC","PingFang SC",sans-serif;margin-bottom:3.5mm}
  .pd-reco-title small{font-weight:400;font-size:8pt;color:#777;margin-left:3mm}
  .pd-reco-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4mm}
  .pd-reco-col{border:1px solid #d8e0e5;border-radius:2mm;padding:3.5mm 4mm;break-inside:avoid}
  .pd-reco-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:2.5mm;
    font-size:8.5pt;color:#666}
  .pd-rb{font-size:11.5pt;font-weight:700;padding:.8mm 3.5mm;border-radius:1.2mm;color:#fff;
    font-family:"Heiti SC","PingFang SC",sans-serif}
  .pd-chong .pd-rb{background:#c0492a}
  .pd-wen .pd-rb{background:#1f6b46}
  .pd-bao .pd-rb{background:#35538a}
  .pd-no .pd-rb{background:#6b7785}
  .pd-reco-list{list-style:none;margin:0;padding:0}
  .pd-reco-list li{display:flex;flex-wrap:wrap;align-items:baseline;gap:.6mm 2mm;
    padding:1.5mm 0;border-bottom:1px dashed #e2e7ea;font-size:9.5pt}
  .pd-reco-list li:last-child{border-bottom:none}
  .pd-rk{color:#9aa5ae;font-family:monospace;font-size:8.5pt;min-width:4mm}
  .pd-rs{font-weight:600;flex:1 1 auto}
  .pd-rg{color:#666;font-size:8.5pt;flex-shrink:0}
  .pd-rv{flex:1 1 100%;color:#555;font-size:8.5pt;padding-left:6mm}
  .pd-empty{color:#999;font-size:9pt}
  .pd-reco-note{margin-top:1.5mm;font-size:7.5pt;color:#999}
  .pd-cover-note{margin-top:auto;border-top:1px solid #d8e0e5;padding-top:3.5mm;
    font-size:8.5pt;color:#555;line-height:1.7}
  .pd-foot{display:flex;justify-content:space-between;margin-top:4mm;font-size:8pt;color:#888}
  .pd-h2{font-family:"Heiti SC","PingFang SC",sans-serif;font-size:16pt;margin:0 0 2mm;
    padding-bottom:2mm;border-bottom:2px solid #0b4a66;display:flex;align-items:center;gap:3mm}
  .pd-num{display:inline-grid;place-items:center;width:8.5mm;height:8.5mm;background:#0b4a66;
    color:#fff;border-radius:1.5mm;font-size:12pt}
  .pd-h2 small{font-size:8.5pt;color:#666;font-weight:400;margin-left:auto}
  .pd-lead{font-size:9pt;color:#555;margin:0 0 4.5mm}
  .pd-school{border:1px solid #d8e0e5;border-radius:2mm;padding:3mm 4mm;margin-bottom:3.5mm}
  /* 卡片允许跨页：一律 break-inside:avoid 会把长专业表整个推到下一页，
     实测一页只放得下 4 所学校、下半页整片空白。改为「块可拆、表头跟着走」。 */
  .pd-school-hd,.pd-meta{break-after:avoid}
  .pd-table thead{display:table-header-group}
  .pd-table tr{break-inside:avoid}
  .pd-school-hd{display:flex;align-items:center;gap:3mm;margin-bottom:1.2mm}
  .pd-idx{font-family:monospace;color:#9aa5ae;font-size:9pt}
  .pd-sn{flex:1}
  .pd-sn b{font-size:11.5pt;font-family:"Heiti SC","PingFang SC",sans-serif}
  .pd-sn span{font-size:9pt;color:#666;margin-left:2mm}
  .pd-tag{padding:.5mm 2.5mm;border-radius:1mm;color:#fff;font-size:8.5pt;flex-shrink:0}
  .pd-tag.pd-chong{background:#c0492a}
  .pd-tag.pd-wen{background:#1f6b46}
  .pd-tag.pd-bao{background:#35538a}
  .pd-tag.pd-no{background:#6b7785}
  .pd-meta{font-size:8.5pt;color:#555;padding-bottom:1.8mm;border-bottom:1px dashed #e2e7ea;margin-bottom:1.8mm}
  .pd-table{width:100%;border-collapse:collapse;font-size:8.5pt}
  .pd-table th{text-align:left;color:#555;font-weight:600;padding:1.1mm 2mm;
    background:#f2f6f8;border-bottom:1px solid #dbe3e8}
  .pd-table td{padding:1.1mm 2mm;border-bottom:1px solid #eef2f5;vertical-align:top}
  .pd-table tr:last-child td{border-bottom:none}
  .pd-mn{font-weight:600}
  .pd-hr{display:inline-block;margin-left:2mm;padding:.2mm 1.4mm;border:1px solid #e0b4a8;
    color:#a4482c;border-radius:1mm;font-size:7.5pt}
  .pd-mp,.pd-mf{white-space:nowrap;text-align:right}
  .pd-mr{color:#777;font-size:8pt}
  .pd-mempty{color:#999;text-align:center}
}

/* ===========================================================================
   V2 视觉层（P3.8）
   ---------------------------------------------------------------------------
   目标：更「平台感」——更密的栅格、更明确的层次、更少的空转留白。
   参照大模型开放平台那类站点：深色渐变主视觉 + 光晕 + 玻璃质感 + 轻微浮动。
   全部包在 @media screen 里：打印走上面的文档样式，不受影响。
   动效遵守系统「减少动效」偏好（全局 reduced-motion 规则已兜底）。
   =========================================================================== */
@media screen{
  /* ---------- 页面底色：两团极淡的色晕，避免大白底 ---------- */
  body{
    background:
      radial-gradient(1100px 520px at 10% -10%, rgba(26,134,174,.10), transparent 62%),
      radial-gradient(900px 480px at 94% 0%, rgba(53,83,138,.08), transparent 64%),
      var(--c-bg);
    background-attachment:fixed;
  }
  .wrap{max-width:1200px;padding:26px 24px 84px}

  /* ---------- 主视觉 ---------- */
  .hero{
    min-height:472px;padding:44px 44px 38px;margin:0 0 64px;border-radius:22px;
    background:
      radial-gradient(620px 320px at 78% 16%, rgba(143,208,230,.20), transparent 62%),
      radial-gradient(540px 360px at 98% 88%, rgba(26,134,174,.24), transparent 66%),
      var(--c-bg);
    box-shadow:0 36px 72px -44px rgba(6,51,74,.75), inset 0 1px 0 rgba(255,255,255,.08);
    animation:heroIn .7s cubic-bezier(.2,.7,.2,1) both;
  }
  .hero::before,.hero::after{display:none}
  .eyebrow{
    display:inline-flex;align-items:center;gap:8px;padding:5px 13px;border-radius:999px;
    background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
    font-size:11px;letter-spacing:.14em;color:var(--c-muted);margin-bottom:16px;
  }
  .eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c-accent);
    box-shadow:0 0 0 4px rgba(143,208,230,.16)}
  .hero h1{font-size:44px;line-height:1.14;letter-spacing:-.035em;margin:0 0 14px;font-weight:750}
  /* C7：V2 渐变强调字整块死代码——实际渲染被 V2.0 与 V4 两层同选择器的
     animation:none/纯色覆盖，从未生效；heroShine 只驱动这块的背景位移，一并删。 */
  .lede{font-size:15.5px;line-height:1.85;max-width:552px;margin:0 0 22px}
  .qcard{
    max-width:600px;padding:16px 16px 14px;border-radius:16px;
    background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);
    box-shadow:0 8px 22px -16px rgba(3,24,36,.11);
  }
  /* 用主题变量：亮色白底、暗色深底，避免暗色下白底配浅色字 */
  .qin{background:var(--c-surface);border-radius:12px}
  .qin input{font-size:30px;padding:12px 0}
  .btn-primary{
    border-radius:12px;padding:0 30px;font-size:15.5px;position:relative;overflow:hidden;
    background:var(--c-accent-deep);
    box-shadow:0 1px 2px rgba(6,51,74,.18);
  }
  .btn-primary::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.42) 46%,transparent 62%);
    transform:translateX(-120%);transition:transform .55s ease;
  }
  .btn-primary:hover::after{transform:translateX(120%)}
  .hero-meta{max-width:600px;margin-top:18px}

  /* ---------- 关键数字条：上移叠在 hero 上，消灭那段空白 ---------- */
  #homeIntro > .summary{
    margin:-46px 0 18px;position:relative;z-index:4;border-radius:16px;
    border:1px solid var(--c-border);background:var(--c-surface);
    box-shadow:0 6px 16px -10px rgba(16,24,32,.1);overflow:hidden;
  }
  #homeIntro > .summary>div{padding:22px 26px}
  #homeIntro > .summary .v{font-size:32px;font-weight:750}
  #homeIntro > .summary>div:first-child .v{
    font-size:36px;background:linear-gradient(120deg,var(--c-accent-deep),var(--c-accent));
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  }
  #homeIntro > .summary .k{font-size:12px;margin-top:6px}

  /* ---------- 卡片：更紧凑、更有层次 ---------- */
  .card-sec{padding:22px 26px;border-radius:16px;transition:transform .25s ease,box-shadow .25s ease}
  .card-sec:hover{transform:translateY(-2px);box-shadow:var(--c-sh-3)}
  .sec-title{font-size:12px;letter-spacing:.14em;margin-bottom:16px;gap:8px}
  .sec-title::before{content:"";width:3px;height:14px;border-radius:2px;
    background:linear-gradient(180deg,var(--c-accent),var(--c-accent-deep));flex-shrink:0}
  /* 「补充我的条件」在窄屏会折成两行：+ 号跟着第一行走，不要垂直居中 */
  .optx summary{align-items:flex-start}
  .optx summary::before{line-height:1.45}
  .howto{gap:22px}
  .howto .n{width:30px;height:30px;border-radius:10px;font-size:14px;
    background:linear-gradient(135deg,var(--c-wash-1),var(--c-wash-1-soft));color:var(--c-accent-deep);
    box-shadow:inset 0 0 0 1px var(--c-wash-2)}
  .howto p{line-height:1.8}
  .pagehead h1,.pagehead h2{font-size:27px}

  /* ---------- 顶部导航细节 ---------- */
  .nav button{border-radius:9px;transition:background .18s,color .18s}
  .nav button.on{box-shadow:inset 0 -2px 0 var(--c-accent)}

  /* ---------- 入场动画（JS 加 html.anim 后才生效，避免无 JS 时内容不可见） ---------- */
  .view.on{animation:viewIn .4s cubic-bezier(.2,.7,.2,1) both}
  @keyframes viewIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  html.anim .reveal{opacity:0;transform:translateY(16px);
    transition:opacity .62s cubic-bezier(.2,.7,.2,1),transform .62s cubic-bezier(.2,.7,.2,1)}
  html.anim .reveal.in{opacity:1;transform:none}

  @keyframes heroIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}

/* 中窄屏：舞台会压到查询卡，直接收起，主视觉回到单列 */
@media screen and (max-width:1080px){
  .hero{min-height:0;padding:34px 28px 30px;margin-bottom:18px}
  .hero h1{font-size:35px}
  .hero-meta,.qcard{max-width:100%}
}
/* 窄屏：进一步压缩 */
@media screen and (max-width:900px){
  .hero{min-height:0;padding:30px 24px 26px;margin-bottom:18px;border-radius:18px}
  /* 360px 下 31px 会把「再谈志愿」拆成「再谈志/愿」；用 clamp 跟着屏宽缩 */
  .hero h1{font-size:clamp(24px,7vw,31px)}
  .lede{font-size:14.5px}
  #homeIntro > .summary{margin:0 0 14px}
  #homeIntro > .summary>div{padding:16px 18px}
  #homeIntro > .summary .v{font-size:25px}
  #homeIntro > .summary>div:first-child .v{font-size:28px}
  .card-sec{padding:18px 20px}
  .wrap{padding:18px 16px 76px}
}

/* ==========================================================================
   V2.0 视觉升级层（参考 open.bigmodel.cn 实测 token）
   --------------------------------------------------------------------------
   浅灰画布 #F5F6FA · 48px 标题 · 胶囊搜索 · 16px 圆角卡片 · 单一渐变锤点
   说明：叠加在既有样式之后，不改 HTML 结构与业务流程；暗色 token 在本层末尾重定义。
   渐变卡采用 #005A8A → #0077B6（白字 7.42–4.87:1），修正参考站亮青底不达 AA 的问题。
   ========================================================================== */

/* ---- 页面底色：两团极淡光晕 ---- */
body{
  background:
    radial-gradient(900px 480px at 50% -160px, rgba(199,168,255,.34), rgba(199,168,255,0) 62%),
    radial-gradient(720px 420px at 62% -40px, rgba(160,205,255,.34), rgba(160,205,255,0) 66%),
    var(--c-bg);
  background-attachment:fixed;
  color:var(--c-text-2);
}

/* ---- 首屏：浅灰 + 光晕 + 居中标题 ---- */
.hero{
  background:none!important;box-shadow:none;border-radius:0;min-height:0;
  padding:74px 24px 30px;margin:0 0 8px;color:var(--c-text);text-align:center;overflow:hidden;
}
.hero::before{
  content:"";position:absolute;left:50%;top:-180px;transform:translateX(-50%);
  width:900px;height:520px;border-radius:50%;filter:blur(90px);pointer-events:none;
  background:radial-gradient(circle,rgba(199,168,255,.38),rgba(199,168,255,0) 66%);
}
.hero::after{
  content:"";position:absolute;left:58%;top:-40px;transform:translateX(-50%);
  width:720px;height:460px;border-radius:50%;filter:blur(90px);pointer-events:none;
  background:radial-gradient(circle,rgba(160,205,255,.36),rgba(160,205,255,0) 68%);
}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;
  background:rgba(255,255,255,.8);border:1px solid var(--c-border);color:var(--c-muted);
  font-size:12px;letter-spacing:.12em;margin:0 0 18px;
}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c-accent-deep);
  box-shadow:0 0 0 4px rgba(0,76,255,.10)}
.hero h1{font-size:48px;line-height:1.17;letter-spacing:-.01em;font-weight:500;margin:0 0 18px;color:var(--c-text)}
.hero h1 em{color:var(--c-accent-deep);background:none;-webkit-text-fill-color:currentColor;
  -webkit-background-clip:border-box;background-clip:border-box;animation:none}
.lede{margin:0 auto 30px;font-size:17px;line-height:1.75;color:var(--c-muted);max-width:660px}

/* 胶囊搜索卡 */
.qcard{
  max-width:660px;margin:0 auto;padding:14px 14px 10px;border-radius:24px;
  background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.95);
  box-shadow:0 2px 4px rgba(8,8,8,.03),0 14px 34px -18px rgba(8,8,8,.16),0 30px 60px -40px rgba(8,8,8,.18);
}
/* A 面（2026-11-08）：主查询卡层次升级——三层投影让第一交互面「浮起」，
   玻璃底提高不透明度保文字对比；hover 微亮不位移。 */
.qcard:hover{background:rgba(255,255,255,.78)}
.qtab{width:max-content;margin:0 auto 12px;background:var(--c-surface-2);border-radius:999px;padding:4px;gap:2px}
.qtab button{padding:7px 22px;border-radius:999px;font-size:13.5px;color:var(--c-muted);font-weight:500}
.qtab button.on{background:#fff;color:var(--c-accent-deep);font-weight:600}
.qrow{background:var(--c-surface);border-radius:999px;padding:4px 4px 4px 22px;gap:6px;
  box-shadow:inset 0 0 0 1px var(--c-border)}
.qin{border:none;background:transparent;padding:0;border-radius:999px;box-shadow:none}
.qin{border:none;background:transparent;padding:0;border-radius:999px;box-shadow:none}
/* H-04（2026-11-07 审计）：V2.0 段曾把焦点环抹成全透明，input 又不在
   全局 :focus-visible 内——键盘焦点不可见（WCAG 2.4.7）。恢复容器级焦点环。 */
/* H-04（2026-11-07）+ 细节修正（2026-11-08 用户反馈）：焦点指示画在**整个胶囊**
   （.qrow:focus-within）——旧实现画在内层 .qin 上，「胶囊里套椭圆」的半成品观感，
   「分」字被挤到环边。可达性语义不变：容器级可见焦点指示；单位字与右缘留出气口。 */
.qin:focus-within{border-color:transparent;box-shadow:none}
.qrow:focus-within{box-shadow:inset 0 0 0 2px var(--c-accent)}
.qin input{font-size:22px;padding:11px 0;color:var(--c-text)}
.qin input::placeholder{font-size:15px;color:var(--c-muted)}
.qin .unit{color:var(--c-muted);padding-right:12px}
.btn-primary{height:52px;border-radius:999px;padding:0 26px;font-size:15px;font-weight:500;
  background:var(--c-accent-deep);color:#fff;box-shadow:none;overflow:visible}
.btn-primary::after{display:none}
.btn-primary:hover{filter:brightness(1.06)}
.qhint{margin-top:14px;color:var(--c-muted);justify-content:center;font-size:12px}
.qhint b{color:var(--c-text)}
.optx{margin-top:12px;border-top:1px solid var(--c-border);padding-top:12px}
.optx summary{color:var(--c-muted);justify-content:center}
.optx summary::before{color:var(--c-accent-deep)}
.optx summary:hover{color:var(--c-text)}
.optbody{padding:14px 4px 4px}
.optlabel,.optnote,.tierow label{color:var(--c-muted)}
.subj{border-color:var(--c-border);background:var(--c-surface);color:var(--c-muted)}
.subj:hover{border-color:var(--c-accent-deep);color:var(--c-accent-deep)}
.subj.on{background:var(--c-accent-deep);border-color:var(--c-accent-deep);color:#fff}
.tierow .ti{background:var(--c-surface);border-color:var(--c-border);color:var(--c-text)}
.tierow .ti:focus{border-color:var(--c-accent-deep);box-shadow:0 0 0 3px rgba(0,76,255,.12)}
.hero-meta{justify-content:center;color:var(--c-muted);margin-top:18px}
.hero .src{color:var(--c-muted)}
.hero-link{color:var(--c-accent-deep);border-bottom-color:var(--c-wash-2)}
.hero-link:hover{color:var(--c-accent-deep);border-bottom-color:var(--c-accent-deep)}

/* ---- 统计条：白卡 + 首格渐变锤点 ---- */
#homeIntro > .summary{
  margin:30px 0 20px;border-radius:16px;border:1px solid var(--c-border);
  background:var(--c-surface);box-shadow:var(--c-sh-2);overflow:hidden;
}
#homeIntro > .summary>div{padding:24px 26px;border-left:1px solid var(--c-border-soft)}
#homeIntro > .summary>div:first-child{
  border-left:none;background:var(--c-accent-deep);
}
#homeIntro > .summary>div:first-child .v{color:#fff;font-size:34px;
  background:none;-webkit-text-fill-color:#fff}
#homeIntro > .summary>div:first-child .k{color:rgba(255,255,255,.9)}
#homeIntro > .summary .v{font-size:30px;font-weight:600}
#homeIntro > .summary .k{font-size:12px;color:var(--c-muted)}

/* ---- 卡片：白底、16 圆角、轻阴影 ---- */
.card,.card-sec{background:var(--c-surface);border:1px solid var(--c-border);border-radius:16px;box-shadow:var(--c-sh-2)}
.card-sec{padding:24px 28px;transition:none}
.card-sec:hover{transform:none;box-shadow:var(--c-sh-2)}
.sec-title{color:var(--c-text);font-size:20px;letter-spacing:0;font-weight:600;margin-bottom:16px}
.sec-title::before{content:"";width:3px;height:1.05em;background:var(--c-accent-deep);border-radius:2px}
.howto .n{background:var(--c-wash-1);color:var(--c-accent-deep);box-shadow:none;border-radius:999px}
.howto p{color:var(--c-muted)}
.lines th{color:var(--c-muted)}
.lines td{color:var(--c-text-2);border-top-color:var(--c-border-soft)}
.lines tr:last-child td{color:var(--c-accent-deep)}
.foot-note{color:var(--c-muted)}

/* ---- 顶部导航 / 按钮 ---- */
/* v3 M6c：底色职责移交 .top-capsule（原 V2 全宽强制底色退役） */
.top{background:transparent!important;border-bottom:none}
@media (min-width:641px){
  .nav{gap:2px}
  .nav button{border-radius:999px;padding:7px 14px;color:var(--c-muted);font-size:13.5px}
  .nav button:hover{background:var(--c-surface-2);color:var(--c-text)}
  .nav button.on{background:var(--c-accent-deep);color:#fff;box-shadow:none}
  .nav button.on .ic{color:#fff}
}
.btn-ghost{height:40px;border-radius:10px;border:1px solid var(--c-border);background:#fff;
  color:var(--c-text);font-size:13.5px;padding:0 16px}
.btn-ghost:hover{border-color:var(--c-accent-deep);color:var(--c-accent-deep);background:#fff}
.btn-ghost:disabled{background:#fff;border-style:solid;color:var(--c-faint)}
.chip{border-radius:999px;border-color:var(--c-border);background:#fff;color:var(--c-muted);font-size:12.5px}
.chip:hover{border-color:var(--c-accent-deep);color:var(--c-accent-deep)}
.chip.on{background:var(--c-accent-deep);border-color:var(--c-accent-deep);color:#fff}
.filters input[type=search],.filters select{border-radius:999px;border-color:var(--c-border);
  background:#fff;color:var(--c-text);height:40px}
.filters input[type=search]:focus,.filters select:focus{border-color:var(--c-accent-deep);box-shadow:0 0 0 3px rgba(0,76,255,.12)}

/* ---- 列表卡片 ---- */
.gitem{background:#fff!important;border:1px solid var(--c-border);border-radius:16px;
  box-shadow:var(--c-sh-1);padding:16px 20px}
.gitem.b-chong,.gitem.b-wen,.gitem.b-bao{background:#fff!important}
.gitem:hover{transform:translateY(-2px);box-shadow:var(--c-sh-3);border-color:var(--c-border-strong)}
.gitem::before{width:4px;border-radius:4px 0 0 4px}
.badge{border-radius:4px;font-weight:600;padding:2px 8px}
.gname{color:var(--c-text);font-size:15.5px}
.gmeta,.grank{color:var(--c-muted)}
.gscore{color:var(--c-text)}
.spark{color:var(--c-muted)}

/* ---- 抽屉 / 对比 / 志愿表 ---- */
.sheet{border-radius:24px 0 0 24px;box-shadow:-20px 0 60px -40px rgba(8,8,8,.35)}
.shead h3{font-size:26px;font-weight:600;color:var(--c-text)}
.shead .sub{color:var(--c-muted)}
.sec h4{color:var(--c-accent-deep);font-size:12px;letter-spacing:.12em}
.card.note{background:var(--c-surface-2);border:1px solid var(--c-border);box-shadow:none}
.mtable th{background:var(--c-surface-2);color:var(--c-muted);border-bottom-color:var(--c-border)}
.mtable td{border-bottom-color:var(--c-border-soft)}
.slot{border-radius:12px;border-color:var(--c-border);background:#fff}
.slot:hover{border-color:var(--c-border-strong);box-shadow:var(--c-sh-1)}
.planbar h1,.planbar h2{font-size:32px;font-weight:500;color:var(--c-text)}
.planbar .cnt{color:var(--c-muted)}
.cmpscroll{background:#fff;border-color:var(--c-border);border-radius:16px}
.cmptable th,.cmptable td{border-bottom-color:var(--c-border)}
.cmptable thead th{background:var(--c-surface-2)}
.cmptable .cmk{background:#fff;border-right-color:var(--c-border)}
.cmptable thead .cmk{background:var(--c-surface-2)}
.cmpcard{border-radius:16px}
.cmpcard-hd{background:var(--c-surface-2)}
.cmpbar{background:var(--c-glass);border-top-color:var(--c-border);box-shadow:0 -12px 32px -28px rgba(8,8,8,.3)}
.cmpchip{border-radius:999px;background:#fff;color:var(--c-text-2)}
.pagehead h1,.pagehead h2{font-size:32px;font-weight:500;color:var(--c-text)}
.pagehead p{color:var(--c-muted)}
.plan-name input{border-radius:999px;background:#fff;border-color:var(--c-border)}
.plan-name input:focus{border-color:var(--c-accent-deep);box-shadow:0 0 0 3px rgba(0,76,255,.12)}
.toast{border-radius:12px;background:var(--c-text);color:#fff}
.empty,.plan-empty{color:var(--c-muted)}

/* ---- 暗色主题：同一套语义，按明度分层 ---- */

:where(:root[data-theme="dark"]) body{background:
  radial-gradient(900px 480px at 50% -160px, rgba(90,70,160,.22), transparent 62%),
  radial-gradient(720px 420px at 62% -40px, rgba(40,80,150,.22), transparent 66%),
  var(--c-bg)}
:where(:root[data-theme="dark"]) .top{background:rgba(7,11,20,.86)!important}
:where(:root[data-theme="dark"]) .eyebrow{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.10);color:var(--c-muted)}
:where(:root[data-theme="dark"]) .qcard{background:rgba(26,28,32,.72);border-color:rgba(255,255,255,.08)}
:where(:root[data-theme="dark"]) .qrow,:where(:root[data-theme="dark"]) .qtab{background:#23262B}
:where(:root[data-theme="dark"]) .qtab button.on{background:#2F343B;color:#fff}
:where(:root[data-theme="dark"]) .qin input{color:var(--c-text)}
:where(:root[data-theme="dark"]) .subj{background:#23262B;color:var(--c-muted)}
:where(:root[data-theme="dark"]) .tierow .ti{background:#23262B;color:var(--c-text)}
:where(:root[data-theme="dark"]) .card,:where(:root[data-theme="dark"]) .card-sec,:where(:root[data-theme="dark"]) .gitem,:where(:root[data-theme="dark"]) .slot,:where(:root[data-theme="dark"]) .cmpscroll,:where(:root[data-theme="dark"]) .cmpcard,:where(:root[data-theme="dark"]) .cmptable th,:where(:root[data-theme="dark"]) .cmptable td{background:var(--c-surface)!important}
:where(:root[data-theme="dark"]) .gitem.b-chong,:where(:root[data-theme="dark"]) .gitem.b-wen,:where(:root[data-theme="dark"]) .gitem.b-bao{background:var(--c-surface)!important}
:where(:root[data-theme="dark"]) .card.note{background:var(--c-surface-2)}
:where(:root[data-theme="dark"]) .cmptable .cmk{background:var(--c-surface)}
:where(:root[data-theme="dark"]) .cmptable thead .cmk,:where(:root[data-theme="dark"]) .cmptable thead th,:where(:root[data-theme="dark"]) .cmpcard-hd{background:var(--c-surface-2)}
:where(:root[data-theme="dark"]) .btn-ghost{background:var(--c-surface);color:var(--c-text)}
:where(:root[data-theme="dark"]) .btn-ghost:hover{background:var(--c-surface)}
/* A3（2026-11-01，第五轮审计）：亮色段（.btn-ghost:disabled 顶层规则）把禁用态
   写死 background:#fff，深色块此前只覆盖本体和 :hover——「撤销填充」在深色下
   成了白药丸，实测 2.77:1（叠加基础规则的 opacity:.5 后渲染真值 1.59:1）。
   opacity 必须 显式归 1，否则半透明 faint 叠在 card 上仍是低对比。禁用态与
   启用态的区分靠 faint 文字色（对 card 实测 6.29:1）。verify_compliance 的
   must_cover 白名单点名要求这条配对存在。 */
:where(:root[data-theme="dark"]) .btn-ghost:disabled{opacity:1;background:var(--c-surface);color:var(--c-faint)}
:where(:root[data-theme="dark"]) .plan-name input{background:var(--c-surface-2);color:var(--c-text)}
:where(:root[data-theme="dark"]) .filters input[type=search],:where(:root[data-theme="dark"]) .filters select{background:var(--c-surface-2);color:var(--c-text)}
:where(:root[data-theme="dark"]) .cmpchip{background:var(--c-surface-2);color:var(--c-text-2)}
:where(:root[data-theme="dark"]) .toast{background:#F5F6F7;color:#080808}
:where(:root[data-theme="dark"]) #homeIntro > .summary>div:first-child,
:where(:root[data-theme="dark"]) #homeResult .summary>div:first-child{background:var(--c-accent-deeper)}


/* ---- 窄屏适配 ---- */
@media (max-width:900px){
  .hero{padding:44px 18px 22px}
  .hero h1{font-size:34px}
  .hero .lede{font-size:15px;margin-bottom:22px}
  .qcard{border-radius:20px;padding:12px 12px 8px}
  .qin input{font-size:20px}
  #homeIntro > .summary{margin:20px 0 16px;border-radius:16px}
  #homeIntro > .summary>div{padding:18px 20px}
  #homeIntro > .summary>div:first-child{border-radius:16px 16px 0 0}
  #homeIntro > .summary .v{font-size:26px}
  #homeIntro > .summary>div:first-child .v{font-size:29px}
  .card-sec{padding:20px 22px}
  .pagehead h1,.pagehead h2{font-size:28px}
  .planbar h1,.planbar h2{font-size:26px}
}
@media (max-width:640px){
  .hero h1{font-size:32px}
  .qtab button{padding:6px 18px;font-size:13px}
  .btn-primary{height:48px;padding:0 20px}
  .qrow{padding-left:18px}
}

/* 移动端胶囊搜索：保持单行（覆盖旧的纵向堆叠规则） */
@media (max-width:900px){
  .qrow{flex-direction:row;align-items:center;padding:4px 4px 4px 18px;gap:6px}
  .qin{width:auto;flex:1;min-width:0}
  .btn-primary{width:auto;height:44px;padding:0 18px;font-size:14px}
}

/* 移动端：胶囊搜索内的占位符与按钮再收一点，保证整句不被截断 */
@media (max-width:900px){
  .qin input::placeholder{font-size:13.5px}
  .qin input{font-size:19px}
  .btn-primary{padding:0 16px;font-size:13.5px}
}

/* ==========================================================================
   V2.1 首页仪表盘（参考 gaokao.quark.cn 的「考生档案卡」模式）
   卡片：圆角 12 / 1px 边框 rgba(8,8,8,.04) / 阴影 0 8px 12px -8px rgba(8,8,8,.06)
   主卡底：linear-gradient(94deg,#F3FAFF,#F8FDFF)（实测参考站同款）
   ========================================================================== */
.dash{display:grid;grid-template-columns:1.7fr 1fr;gap:16px;margin:28px 0 16px}
.dash .dcard{background:var(--c-surface);border:1px solid rgba(8,8,8,.04);border-radius:16px;
  box-shadow:0 4px 10px -6px rgba(8,8,8,.06);padding:22px 24px}
/* 未查分卡的「冲/稳/保」引导行：填满空状态那条约 100px 的留白
   （原先卡被右栏拉长后，中间空一块看起来是「没做完」，不是「待定」）。
   配色全部走主题变量，深色自动好。 */
.dash-teach{display:flex;flex-direction:column;gap:8px;margin:12px 0 0;
  padding:12px 14px;background:var(--c-surface-2);border:1px solid var(--c-border-soft);border-radius:14px}
.dash-teach .teach-row{display:flex;align-items:center;gap:10px;
  font-size:12.5px;color:var(--c-muted);line-height:1.6}

.dash-profile{background:var(--c-wash-1-soft);display:flex;flex-direction:column}
.dash-profile .dash-actions{margin-top:auto}
.dash-progress{display:flex;flex-direction:column}
.dash-progress .go{margin-top:auto}
.dash-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dash-head b{font-size:21px;font-weight:600;color:var(--c-text);letter-spacing:-.01em}
.dash-head .edit{font-size:12px;color:var(--c-accent-deep);background:var(--c-surface);border:1px solid var(--c-border);
  border-radius:999px;padding:2px 12px;cursor:pointer;font-family:var(--font)}
.dash-head .edit:hover{border-color:var(--c-accent-deep)}
.dash-sub{font-size:13px;color:var(--c-muted);margin:4px 0 16px}
.dash-curve{display:flex;gap:24px;align-items:center;color:var(--c-accent-deep)}
.dash-curve svg{display:block;flex:0 0 300px;height:96px}
.dash-rank{font-size:13px;color:var(--c-muted);line-height:1.8}
.dash-rank b{font-size:20px;font-weight:600;color:var(--c-text);font-variant-numeric:tabular-nums}
.dash-chips{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.dchip{display:flex;align-items:center;gap:8px;border-radius:999px;padding:5px 14px 5px 8px}
.dchip b{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums}
.dchip span{font-size:12px;color:var(--c-text-2)}
.dchip.c{background:var(--c-chong-soft)} .dchip.c b{color:var(--c-chong)}
.dchip.w{background:var(--c-wen-soft)}  .dchip.w b{color:var(--c-wen)}
.dchip.b{background:var(--c-bao-soft)}  .dchip.b b{color:var(--c-bao)}
.dash-actions{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap}
.dash-actions .btn-primary{height:44px;border-radius:999px;padding:0 22px;font-size:14px}
.dash-side{display:flex;flex-direction:column;gap:16px}
.dash-title{font-size:15px;font-weight:600;color:var(--c-text);margin-bottom:14px}
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tool{display:flex;flex-direction:column;align-items:center;gap:7px;padding:10px 4px;border-radius:10px;
  cursor:pointer;background:transparent;border:none;font-family:var(--font);font-size:12.5px;color:var(--c-text-2)}
.tool:hover{background:var(--c-surface-2)}
/* 工具箱图标（v3 M8⑦）：圆形品牌徽章 + hover 弹跳。
   旧版灰描线被用户点名「凑数」——徽章底用 --brand-soft，图标用 accent-deep，
   hover 时徽章上浮 + 图标转正放大，六枚各带 stagger（下方 no-preference 块）。 */
.tool .ico{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;
  background:var(--c-wash-1);color:var(--c-accent-deep);
  transition:transform .25s var(--ease-soft),background .25s}
.tool:hover .ico{transform:translateY(-3px) scale(1.08)}
.tool:hover{background:transparent}
/* M9：浅色层六色马卡龙徽章。此前 t1–t6 的「打回灰样」覆盖规则把 M8 徽章
   静默压掉（0,3,0 > 0,2,0），浅色下六枚全是灰描线——用户两次点名的「凑数」
   实为这条旧规则的优先级覆盖。现按深色层（文件尾同族规则）配对成套：
   靛蓝/橘红/墨绿/紫/青/金，墨色取同族深值，对比 4.5:1 以上。 */
.tool.t1 .ico{background:var(--c-bao-soft);color:var(--c-bao)}
.tool.t2 .ico{background:var(--c-chong-soft);color:var(--c-chong)}
.tool.t3 .ico{background:var(--c-wen-soft);color:var(--c-wen)}
.tool.t4 .ico{background:#F1EDFD;color:#6D28D9}
.tool.t5 .ico{background:#E6F7F9;color:#0E7490}
.tool.t6 .ico{background:var(--c-warn-soft);color:var(--c-warn-chip)}
.dash-progress .bar{height:6px;border-radius:3px;background:var(--c-surface-3);overflow:hidden;margin:10px 0 8px}
.dash-progress .bar i{display:block;height:100%;background:var(--c-accent-deep);border-radius:3px;transition:width .4s ease}
.dash-progress .num{display:flex;justify-content:space-between;font-size:12.5px;color:var(--c-muted)}
.dash-progress .num b{color:var(--c-text);font-size:14px}
.dash-progress .go{width:100%;margin-top:14px}
/* M9：未查分时 dash 卡内的即时查分行——替代被用户划掉的假曲线装饰，
   也免掉「滚回顶部才能输分」的绕路。复用 hero qcard 的胶囊质感。 */
.dash-quickq{display:flex;gap:6px;align-items:stretch;margin:14px 0 4px;
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:999px;padding:4px 4px 4px 20px;
  box-shadow:var(--c-sh-1)}
.dash-quickq input{flex:1;min-width:0;border:none;outline:none;background:none;
  font-size:16px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--c-text);font-family:var(--font)}
.dash-quickq input::placeholder{font-weight:400;color:var(--c-muted);font-size:14px}
.dash-quickq .btn-primary{height:40px;border-radius:999px;padding:0 20px;flex-shrink:0}
@media (max-width:900px){
  .dash{grid-template-columns:1fr;gap:14px;margin:20px 0 12px}
  .dash .dcard{padding:18px 18px}
  .dash-curve{flex-direction:column;align-items:flex-start;gap:10px}
  .dash-curve svg{width:100%;height:auto;flex:none}
  .dash-head b{font-size:18px}
}

/* ==========================================================================
   视觉补充：空态插画 / 分区图标 / 来源文件图标
   ========================================================================== */
.empty,.plan-empty{text-align:center}
.empty svg,.plan-empty svg{display:block;margin:0 auto 16px;opacity:.95}
.empty .t,.plan-empty .t{font-size:16px;font-weight:600;color:var(--c-text)}
.empty .d,.plan-empty .d{color:var(--c-muted);font-size:13.5px;line-height:1.8;max-width:420px;margin:0 auto}
.plan-empty{padding:34px 24px}
.sec h4{display:flex;align-items:center;gap:6px}
.sec .sec-ic{color:var(--c-accent-deep);flex-shrink:0;opacity:.95}
.srchead{gap:8px}
.srcdoc{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;flex-shrink:0}
/* 文件类型图标：此前颜色写在 app.js 的内联 style 里（pdf=橙、表格=绿），
   浅色下两对都过 AA，但内联样式在深色模式下照样生效——深色卡片上挂着两块
   亮粉底，比页面任何一处都刺眼，且 CSS 覆盖不了内联（除非 !important）。
   改成类名，两套底/字都由 CSS 按主题给。 */
/* 检查器 icon-chips：36 个彩色小方块沿列表重复。文件类型已经由旁边的
   「招生计划 / 一分段统计表」文字标签说明，图标本身用中性灰就够——
   颜色留给数据与动作。 */
.srcdoc.doc-pdf,.srcdoc.doc-tab{background:transparent;color:var(--c-muted)}
.foot{position:relative}
.foot::before{content:"";position:absolute;top:0;left:24px;right:24px;height:1px;
  background:linear-gradient(90deg,transparent,var(--c-wash-2),transparent)}


/* ==========================================================================
   无障碍补强（Web Interface Guidelines 审计修复）
   ========================================================================== */
/* 全局键盘焦点：2px 主色 + 2px 外扩，暗色用提亮蓝 */
/* 全局键盘焦点（input/select/textarea 例外：它们有自定义底线/光晕聚焦样式） */
:focus-visible{outline:2px solid var(--c-accent-deep);outline-offset:2px;border-radius:4px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none}

:where(:root[data-theme="dark"]) :focus-visible{outline-color:#78A9FF}

/* 「怎么用」标题从 h5 升为 h3：原 h5 样式迁移到 .howto-h，视觉零变化 */
.howto h3.howto-h{display:flex;align-items:center;gap:7px;font-size:15px;font-weight:600;
  color:var(--c-text);margin:0 0 7px}
.howto h3.howto-h .sec-ic{width:16px;height:16px}

/* ==========================================================================
   V2.2 视觉盛宴层：高档配图 / 宽屏布局 / CSS 动画
   ========================================================================== */
:root{--wrap-max:1280px}
.wrap{max-width:var(--wrap-max);padding-left:28px;padding-right:28px}

/* hv-art 现在只服务 about 页横幅（首页 hero-visual 已按审计 N4 整节删除），
   但配图缓慢呼吸的动效是它的视觉本体，keyframes 一并保留。 */
.hv-art{width:100%;height:100%;min-height:320px;object-fit:cover;display:block;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 20%);
  mask-image:linear-gradient(90deg,transparent 0,#000 20%);
  animation:hvFloat 20s ease-in-out infinite alternate;will-change:transform}
@keyframes hvFloat{from{transform:scale(1.01)}to{transform:scale(1.07)}}

/* ---------- 来源页横幅 ---------- */
.pagehead.about-hero{
  display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center;
  background:var(--c-surface);border:1px solid rgba(8,8,8,.04);border-radius:24px;
  padding:8px 8px 8px 36px;overflow:hidden;box-shadow:0 6px 16px -12px rgba(8,8,8,.09);
}
.pagehead.about-hero .ah-copy{padding:20px 0}
/* 首页 hero-visual 删除后（审计 N4），「3 年 · 36 份文件 · 6,604 组」这行
   数据规模挪到来源页抬头。它是元信息而不是正文，字号/色阶要低一级，
   否则读者会把它当成第一段话。 */
.pagehead.about-hero .ah-meta{font-size:13px;color:var(--c-muted);letter-spacing:.02em;margin:0 0 10px}
.pagehead.about-hero h2{font-size:34px;margin-bottom:10px}
.pagehead.about-hero p{font-size:14.5px;line-height:1.8;margin:0;max-width:520px}
.pagehead.about-hero .hv-art{min-height:260px;border-radius:18px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%);
  mask-image:linear-gradient(90deg,transparent 0,#000 16%)}

/* ---------- 宽屏：首页两栏（怎么用 7 / 控制线 5），整页利用率 ---------- */
@media (min-width:1100px){
  #homeIntro{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;align-items:start}
  #homeIntro > .dash,#homeIntro > .summary,#homeIntro > .card-note{grid-column:1/-1}
  #homeIntro > .card-sec{margin:0!important}
  #homeIntro > .card-howto{grid-column:span 7}
  #homeIntro > .card-lines{grid-column:span 5}
}

/* ---------- 空态插画（图片版） ---------- */
.empty-art{width:200px;max-width:60%;margin:0 auto 18px;display:block;border-radius:16px;
  opacity:.95;filter:saturate(.95)}

/* ---------- CSS 动画：氛围 / 卡片 / 图标 / 进度 ---------- */
/* 首屏光晕缓慢漂移 */
.hero::before{animation:auroraA 22s ease-in-out infinite alternate}
.hero::after{animation:auroraB 26s ease-in-out infinite alternate}
@keyframes auroraA{from{transform:translateX(-50%) translateY(0) scale(1)}
  to{transform:translateX(-46%) translateY(18px) scale(1.08)}}
@keyframes auroraB{from{transform:translateX(-50%) translateY(0) scale(1)}
  to{transform:translateX(-54%) translateY(-14px) scale(1.06)}}

/* 考生卡：缓慢流转的柔光边 */
.dash-profile{position:relative;overflow:hidden}
.dash-profile::after{content:"";position:absolute;inset:-45%;pointer-events:none;z-index:0;opacity:.35;
  background:conic-gradient(from 0deg,transparent 0 68%,rgba(0,76,255,.16) 78%,rgba(41,190,204,.16) 86%,transparent 94%);
  animation:profileSpin 18s linear infinite}
.dash-profile > *{position:relative;z-index:1}
@keyframes profileSpin{to{transform:rotate(360deg)}}

/* 冲稳保 chips：hover 轻抬 */
.dchip{transition:transform .25s ease,box-shadow .25s ease}
.dchip:hover{transform:translateY(-2px);box-shadow:0 8px 18px -14px rgba(8,8,8,.45)}

/* 工具箱图标：hover 轻跳 */
.tool .ico{transition:transform .25s cubic-bezier(.2,.8,.2,1),background .25s}
.tool:hover .ico{transform:translateY(-3px) scale(1.06) rotate(-3deg)}

/* 进度条：流光 */
.dash-progress .bar i{background:linear-gradient(90deg,#004CFF,#29BECC,#004CFF);
  background-size:200% 100%;animation:barFlow 3.2s linear infinite}
@keyframes barFlow{from{background-position:0 0}to{background-position:200% 0}}

/* 卡片 hover 轻抬 */
.card-sec{transition:transform .25s ease,box-shadow .25s ease}
.card-sec:hover{transform:translateY(-2px);box-shadow:var(--c-sh-3)}

/* 列表行入场（前 8 行错峰） */
@keyframes rowIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.gitem{animation:rowIn .45s cubic-bezier(.2,.7,.2,1) both}
.gitem:nth-child(1){animation-delay:.02s}
.gitem:nth-child(2){animation-delay:.06s}
.gitem:nth-child(3){animation-delay:.10s}
.gitem:nth-child(4){animation-delay:.14s}
.gitem:nth-child(5){animation-delay:.18s}
.gitem:nth-child(6){animation-delay:.22s}
.gitem:nth-child(7){animation-delay:.26s}
.gitem:nth-child(8){animation-delay:.30s}

/* 主按钮高光扫过 */
.btn-primary{position:relative;overflow:hidden}
.btn-primary::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.38) 48%,transparent 64%);
  transform:translateX(-130%);transition:transform .6s ease}
.btn-primary:hover::after{transform:translateX(130%)}

/* 载入骨架微光 */
#boot .progress i{background-size:200% 100%;animation:barFlow 1.6s linear infinite}

/* 滚动入场：视觉带 / 页面头 */
html.anim .pagehead.about-hero.reveal{
  opacity:0;transform:translateY(18px);
  transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
html.anim .pagehead.about-hero.reveal.in{opacity:1;transform:none}

/* ---------- 暗色适配 ---------- */

:where(:root[data-theme="dark"]) .pagehead.about-hero{background:var(--c-surface);border-color:var(--c-border)}
:where(:root[data-theme="dark"]) .pagehead.about-hero h2{color:var(--c-text)}
:where(:root[data-theme="dark"]) .pagehead.about-hero p{color:var(--c-muted)}
:where(:root[data-theme="dark"]) .hv-art{filter:brightness(.82) saturate(.9)}
:where(:root[data-theme="dark"]) .empty-art{opacity:.8;filter:brightness(.8) saturate(.9)}
:where(:root[data-theme="dark"]) .dash-profile::after{opacity:.7}


/* ---------- 窄屏 ---------- */
@media (max-width:1099px){
  .pagehead.about-hero{grid-template-columns:1fr;padding:20px}
  .pagehead.about-hero .hv-art{min-height:180px;max-height:220px;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 18%);
    mask-image:linear-gradient(180deg,transparent 0,#000 18%)}
  .wrap{padding-left:20px;padding-right:20px}
}

/* 移动端标题：390/360 下不再断字（V2 的 32px 覆盖了早先 clamp） */
@media screen and (max-width:640px){
  .hero h1{font-size:28px;letter-spacing:-.01em}
}

/* ==========================================================================
   V2.3 全站视觉收尾：列表 / 抽屉 / 对比 / 志愿表 / 微交互
   ========================================================================== */

/* ---------- 找院校：页头卡 + 列表呼吸 ---------- */
#listHead .rankcard{
  position:relative;overflow:hidden;border-radius:16px;
  background:var(--c-wash-1-soft);
  border:1px solid rgba(8,8,8,.04);box-shadow:var(--c-sh-2);
}
#listHead .rankcard::after{content:"";position:absolute;right:-70px;top:-90px;width:260px;height:260px;
  border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(0,76,255,.10),rgba(0,76,255,0) 68%)}
#listHead .rankbar .st b{font-size:24px;font-weight:600;color:var(--c-accent-deep)}
#listHead .rankbar .st i{font-size:11px;letter-spacing:.06em;color:var(--c-muted)}
.rankcard-note{color:var(--c-muted)}

/* 结果卡：渐变摘要卡（对应参考站的视觉锤位） */
#homeResult .bandcard{border-radius:16px;border:1px solid var(--c-border);box-shadow:var(--c-sh-2)}
#homeResult .bandcard .chips .chip{border-radius:999px}
#homeResult .summary>div:first-child{
  background:var(--c-accent-deep);border-radius:14px 0 0 14px}
#homeResult .summary>div:first-child .v,
#homeResult .summary>div:first-child .k{color:#fff}
#homeResult .summary>div:first-child .k{color:rgba(255,255,255,.88)}

/* ---------- 详情抽屉：高档头图 + 分区层次 ---------- */
.sheet{background:var(--c-surface)}
/* 动画只挂在打开态：挂在 .sheet 上 + both 填充会把「滑入后」的最终状态
   （transform:none）永久固定，抽屉没打开也显示在屏幕上（线上实拍抓到） */
.sheet.on{animation:sheetIn .32s cubic-bezier(.2,.7,.2,1) both}
.shead{
  background:
    radial-gradient(420px 140px at 88% 0%, rgba(0,76,255,.10), transparent 70%),
    linear-gradient(94deg,#F3FAFF 12%,#F8FDFF 76%);
  border-bottom:1px solid var(--c-border);
}
.shead h3{letter-spacing:-.01em}
.shead .sub{color:var(--c-muted)}
.sbody{background:var(--c-bg)}
.sbody .sec{background:var(--c-surface);border:1px solid var(--c-border);border-radius:16px;
  padding:20px 22px;margin:0 18px 14px;box-shadow:var(--c-sh-1)}
.sbody .sec h4{margin-top:0}
.mask{background:rgba(8,10,14,.44);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
@keyframes sheetIn{from{transform:translateX(40px);opacity:.4}to{transform:none;opacity:1}}

/* ---------- 对比页：表格行 hover + 更有利高亮 ---------- */
.cmptable tbody tr{transition:background .2s ease}
.cmptable tbody tr:hover{background:var(--c-surface-2)}
.cmpcard{box-shadow:var(--c-sh-2);border:1px solid var(--c-border)}

/* ---------- 志愿表：进度仪式感 ---------- */
.planbar{background:var(--c-surface);border:1px solid var(--c-border);border-radius:16px;
  padding:16px 22px;box-shadow:var(--c-sh-2)}
.slot{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.slot:hover{transform:translateY(-1px)}
@keyframes fillPulse{0%{box-shadow:0 0 0 0 rgba(0,76,255,.18)}100%{box-shadow:0 0 0 10px rgba(0,76,255,0)}}
.slot.just-filled{animation:fillPulse .7s ease-out}

/* ---------- 滚动渐显（IntersectionObserver 驱动，data-reveal） ---------- */
html.anim [data-reveal]{opacity:0;transform:translateY(14px);
  transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}
html.anim [data-reveal].in{opacity:1;transform:none}

/* 暗色 */

:where(:root[data-theme="dark"]) #listHead .rankcard{background:linear-gradient(94deg,#182430 12%,#1A1C20 76%)}
:where(:root[data-theme="dark"]) .shead{background:linear-gradient(94deg,#182430 12%,var(--c-surface) 76%)}


/* ==========================================================================
   V2.4 导航动画 + 重点功能显眼 + 步骤流程感
   ========================================================================== */
/* 导航（参考夸克：纯文字，选中=蓝字+底部短横线，hover=蓝字） */
.nav button{position:relative;background:transparent;border:none;transition:color .2s}
.nav button::after{content:"";position:absolute;left:50%;bottom:-9px;transform:translateX(-50%) scaleX(0);
  width:22px;height:2.5px;border-radius:2px;background:var(--c-accent-deep);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.nav button:hover{color:var(--c-accent-deep)}
.nav button.on{background:none;color:var(--c-accent-deep)}
.nav button.on::after{transform:translateX(-50%) scaleX(1)}
/* 切换视图时图标弹一下 */
.nav button .ic{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
@keyframes navPop{0%{transform:scale(1)}40%{transform:scale(1.25)}100%{transform:scale(1)}}
.nav button.on .ic{animation:navPop .45s cubic-bezier(.2,.8,.2,1)}
.nav button:active .ic{transform:scale(.9)}

/* 志愿表 = 终点目标：标题旁小圆点常驻轻脉冲 */
.nav .hot-dot{position:absolute;top:9px;right:6px;width:6px;height:6px;border-radius:50%;
  background:#FF6B3F;box-shadow:0 0 0 0 rgba(255,107,63,.5);animation:hotPulse 2.6s ease-out infinite}
@keyframes hotPulse{0%{box-shadow:0 0 0 0 rgba(255,107,63,.5)}70%{box-shadow:0 0 0 6px rgba(255,107,63,0)}100%{box-shadow:0 0 0 0 rgba(255,107,63,0)}}

@media (max-width:640px){
  .nav button::after{bottom:-4px}
  .nav .hot-dot{top:6px;right:4px}
}

/* ---------- 查分引导条：还没查分时，首页顶部给出「省份+分数」的显式起点 ---------- */
.guide-bar{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:16px;
  padding:12px 18px;margin:0 0 14px;box-shadow:var(--c-sh-1);
  animation:guideIn .5s cubic-bezier(.2,.7,.2,1) both;
}
@keyframes guideIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.guide-bar .gi{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--c-muted)}
.guide-bar .gi b{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;
  background:var(--c-wash-1);color:var(--c-accent-deep);font-size:11px;font-weight:600}
.guide-bar .gi.done b{background:var(--c-wen-soft);color:var(--c-wen)}
.guide-bar .sep{flex:0 0 22px;height:1px;background:var(--c-border)}
.guide-bar .arrow{color:var(--c-accent-deep);font-size:13px}
.guide-bar .go{margin-left:auto}
@media (max-width:640px){.guide-bar .sep{display:none}.guide-bar{gap:8px}}

/* ==========================================================================
   V2.5 图表
   ========================================================================== */
/* 控制线柱状图 */
.cl-chart{display:block;margin:4px 0 10px}
.cl-legend{display:flex;gap:18px;font-size:12px;color:var(--c-muted);margin-bottom:12px}
.cl-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
/* 图例色块：原先写在 app.js 的内联 style 里（#004CFF / #29BECC）。
   内联色在深色模式下无法被主题覆盖，也进不了静态检查——V6 的亮粉底就是这么来的。
   移到这里后由 CSS 统一管，并由「前端内联色」断言守着不许搬回去。 */
.cl-legend i.wl{background:var(--s-phys)}
.cl-legend i.ls{background:var(--s-hist)}
.cl-missing{font-size:13px;color:var(--c-muted);padding:10px 0 2px;line-height:1.7}
.card-lines .lines{margin-top:4px}

/* 一分段分布图 */
.dash-dist{margin:16px 0 4px;background:var(--c-surface-2);border:1px solid var(--c-border);
  border-radius:12px;padding:14px 12px 6px}
.dist-chart{display:block}
/* 柱状图数值在小屏隐藏（避免重叠），只留柱子 */
@media (max-width:640px){
  .cl-chart text{font-size:11px}
}
/* 图表入场（M2b 重写见文件末「M2b 控制线」段；此位留空说明柱状动效已收编） */
/* 分布图描线：旧 drawLine（1.4s 硬编码 dasharray=2200）已退役——
   M2a 起由 JS 按真实路径长度摆 dasharray + 1.7s 过渡（§3.3），
   见下方 M2a 段的 .dist-chart .dist-line 与 app.js 的 animateDistChart。 */

/* ==========================================================================
   修复：guide-bar 在 12 列网格里只占一列；nav 夸克式覆盖 V2 胶囊层
   ========================================================================== */
#homeIntro > .guide-bar{grid-column:1 / -1;width:100%}
@media (max-width:1099px){#homeIntro > .guide-bar{grid-column:auto}}

/* 夸克式导航（必须晚于 V2 层的胶囊规则才生效） */
@media (min-width:641px){
  .nav{gap:26px}
  .nav button{background:transparent!important;border-radius:0;padding:8px 2px;
    color:var(--c-muted);font-size:14px;font-weight:500}
  .nav button:hover{background:transparent!important;color:var(--c-accent-deep);transform:none;box-shadow:none}
  .nav button.on{background:transparent!important;color:var(--c-accent-deep)!important;box-shadow:none}
  .nav button.on .ic{color:var(--c-accent-deep)}
  /* on 态的 hover 保持蓝字，不再变回胶囊 */
  .nav button.on:hover{background:transparent!important;color:var(--c-accent-deep)!important}
}

/* ==========================================================================
   志愿推荐卡（参考夸克：首页直接给出院校参照）
   ========================================================================== */
.dash-reco{margin-top:20px}
.dash-reco .dash-title small{font-size:12px;color:var(--c-muted);font-weight:400;margin-left:8px}
.reco-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.reco-col{display:flex;flex-direction:column;gap:8px;background:var(--c-surface-2);
  border:1px solid var(--c-border);border-radius:12px;padding:12px}
.reco-col .dchip{align-self:flex-start;padding:3px 12px 3px 7px}
.reco-item{display:flex;flex-direction:column;gap:2px;text-align:left;width:100%;
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:10px;padding:10px 12px;
  cursor:pointer;font-family:var(--font);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.reco-item:hover{transform:translateY(-2px);border-color:var(--c-accent-deep);box-shadow:var(--c-sh-3)}
.reco-item b{font-size:13.5px;font-weight:600;color:var(--c-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reco-item span{font-size:12px;color:var(--c-muted);font-variant-numeric:tabular-nums}
.reco-none{font-size:12px;color:var(--c-faint);text-align:center;padding:8px 0}
@media (max-width:640px){.reco-grid{grid-template-columns:1fr}}

/* ==========================================================================
   V3 版式：左右分栏杂志式 hero（取代居中式）
   左栏 = 文案 + 查询卡；右栏 = 出血配图 + 悬浮数据卡（分层视差）
   ========================================================================== */
.hero.hero-split{
  display:grid;grid-template-columns:1.02fr .98fr;gap:0;align-items:stretch;
  background:none;text-align:left;padding:0;margin:0 0 10px;border-radius:24px;overflow:hidden;
  min-height:560px;position:relative;
  background:linear-gradient(120deg,#FDFEFF 0%,#F4F8FC 58%,#EAF3FB 100%);
  border:1px solid rgba(8,8,8,.04);box-shadow:var(--c-sh-2);
}
/* 光晕 */
.hero-split::before{content:"";position:absolute;left:-140px;top:-160px;width:560px;height:520px;
  border-radius:50%;filter:blur(90px);pointer-events:none;z-index:1;
  background:radial-gradient(circle,rgba(199,168,255,.30),rgba(199,168,255,0) 66%);
  animation:auroraA 22s ease-in-out infinite alternate}
.hero-split::after{content:"";position:absolute;left:34%;bottom:-200px;width:520px;height:480px;
  border-radius:50%;filter:blur(90px);pointer-events:none;z-index:1;
  background:radial-gradient(circle,rgba(160,205,255,.30),rgba(160,205,255,0) 68%);
  animation:auroraB 26s ease-in-out infinite alternate}

.hero-main{position:relative;z-index:3;padding:56px 20px 44px 48px;display:flex;
  flex-direction:column;justify-content:center}
.hero-main .eyebrow{align-self:flex-start;margin-bottom:16px}
.hero-split h1{font-size:54px;line-height:1.13;letter-spacing:-.02em;font-weight:500;
  margin:0 0 16px;color:var(--c-text)}
.hero-split .lede{font-size:15px;line-height:1.8;color:var(--c-muted);margin:0 0 26px;max-width:520px}
.hero-split .qcard{max-width:520px;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.95);
  border-radius:20px;padding:14px 14px 10px;box-shadow:0 26px 60px -44px rgba(8,8,8,.42)}
.hero-split .hero-meta{margin-top:20px;justify-content:flex-start;max-width:none}

/* ---------- 响应式 ---------- */
@media (max-width:1120px){
  .hero-split h1{font-size:44px}
  .hero-main{padding:44px 24px 36px 32px}
}
@media (max-width:980px){
  .hero-split{grid-template-columns:1fr;min-height:0}
  /* 面板不再抢到文案前面：手机首屏先看到标题与输入框，
     产品面板作为「查完能得到什么」的预览放在查询卡之后。 */
  .hero-aside{min-height:260px}
  .hero-main{padding:26px 20px 30px}
  .hero-split h1{font-size:34px}
  .hero-split .lede{font-size:14.5px}
}
@media (max-width:640px){
  .hero-split h1{font-size:30px}
  .hero-aside{min-height:200px}
}

/* ==========================================================================
   V4：深色产品式 hero（Linear Dark Product-First）+ 亮色内容区（极性翻转=深度）
   参考实测规范：Linear 画布 #010102 / 单一强调 #5e6ad2 / 56px 600 -1.8px；
   Vercel：深色带做深度线索、堆叠小阴影而非大投影、网格渐变只在 hero 尺度
   ========================================================================== */
.hero.hero-split{
  /* M1c（2026-11-03，规范 v1.2 D7）：hero 随主题切换——底 = --c-bg 与页面连成
     一体，靠 1px 描线与极光环境层区分区域；不再有「永久深色面板」。 */
  background:var(--c-bg);border:1px solid var(--c-border);border-radius:24px;
  grid-template-columns:1.06fr .94fr;min-height:600px;
}
.hero-split::before{
  background:radial-gradient(circle,var(--aurora-1) 0%,transparent 66%);
  left:-180px;top:-200px;width:680px;height:620px;filter:blur(90px)
}
.hero-split::after{
  background:radial-gradient(circle,var(--aurora-3) 0%,transparent 68%);
  left:30%;bottom:-240px;width:620px;height:560px;filter:blur(100px)
}
.hero-split h1{color:var(--c-text);font-size:34px;font-weight:500;letter-spacing:.01em;line-height:1.28}
/* 规范 §4.2：强调词走 --grad-title 渐变裁字 + 7s 光泽循环（装饰动效的唯一
   无限循环文本动画）。@supports 兜底为品牌实色，不支持裁字时不是透明字。 */
.hero-split h1 em{
  background-image:var(--grad-title);background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent}
@supports not ((-webkit-background-clip:text) or (background-clip:text)){
  .hero-split h1 em{background-image:none;-webkit-text-fill-color:currentColor;color:var(--c-accent);animation:none}
}
.hero-split .lede{color:var(--c-muted);font-size:15.5px;line-height:1.85;min-height:3.7em}
#ledeType::after{content:"▍";color:var(--c-accent);animation:n2Blink 1.1s steps(1) infinite;margin-left:1px}
@keyframes n2Blink{0%,100%{opacity:1}50%{opacity:.2}}
@media (prefers-reduced-motion: reduce){#ledeType::after{content:""}}
/* v3 M8⑩：未查分 dash 卡的迷你曲线描线循环 + 教学行 stagger（用户：左卡太空） */
.dash-curve svg path:last-child{stroke-dasharray:1;stroke-dashoffset:0}
@media (prefers-reduced-motion: no-preference){
  html.anim .dash-curve svg path:last-child{animation:dtSpark 2.2s ease-in-out infinite alternate}
  html.anim .dash-teach .teach-row{animation:dtRowIn .5s var(--ease-soft) both}
  html.anim .dash-teach .teach-row:nth-child(2){animation-delay:.12s}
  html.anim .dash-teach .teach-row:nth-child(3){animation-delay:.24s}
}
@media (prefers-reduced-motion: no-preference){
  html.anim .tools .tool .ico{animation:toolPop .5s var(--ease-soft) both}
  html.anim .tools .tool:nth-child(2) .ico{animation-delay:.06s}
  html.anim .tools .tool:nth-child(3) .ico{animation-delay:.12s}
  html.anim .tools .tool:nth-child(4) .ico{animation-delay:.18s}
  html.anim .tools .tool:nth-child(5) .ico{animation-delay:.24s}
  html.anim .tools .tool:nth-child(6) .ico{animation-delay:.3s}
  @keyframes toolPop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}
}
.hero-main .eyebrow{
  background:var(--c-surface-2);border:1px solid var(--c-border);
  color:var(--c-accent-deep);letter-spacing:.10em;font-size:11.5px}
.hero-main .eyebrow::before{background:var(--c-accent);box-shadow:none}

/* 查询卡：面层 + 描线，无投影（Loomy：层级靠明度台阶） */
.hero-split .qcard{
  background:var(--c-surface);border:1px solid var(--c-border);
  border-radius:16px;box-shadow:none}
.hero-split .qtab{background:var(--c-surface-2)}
.hero-split .qtab button{color:var(--c-muted)}
.hero-split .qtab button.on{background:var(--grad-brand);color:var(--c-text-on-accent);box-shadow:none}
.hero-split .qrow{background:var(--c-surface-2);box-shadow:inset 0 0 0 1px var(--c-border)}
.hero-split .qin{background:transparent}
.hero-split .qin input{color:var(--c-text)}
.hero-split .qin input::placeholder{color:var(--c-muted)}
.hero-split .qin .unit{color:var(--c-muted)}
.hero-split .btn-primary{background:var(--grad-brand);color:var(--c-text-on-accent);border-radius:14px;height:48px;font-weight:500;box-shadow:var(--sh-elev-1)}
.hero-split .btn-primary:hover{filter:brightness(1.06);box-shadow:var(--sh-elev-1),0 14px 30px -12px rgba(99,102,241,.5)}
.hero-split .qhint{color:var(--c-muted)}
.hero-split .qhint b{color:var(--c-text)}
.hero-split .optx{border-top-color:var(--c-border)}
.hero-split .optx summary{color:var(--c-muted)}
.hero-split .optx summary::before{color:var(--c-accent)}
.hero-split .optlabel,.hero-split .optnote,.hero-split .tierow label{color:var(--c-muted)}
.hero-split .subj{background:var(--c-surface-2);border-color:var(--c-border);color:var(--c-text)}
.hero-split .subj:hover{border-color:var(--c-accent);color:var(--c-accent)}
.hero-split .subj.on{background:var(--grad-brand);border-color:transparent;color:var(--c-text-on-accent)}
.hero-split .tierow .ti{background:var(--c-surface-2);border-color:var(--c-border);color:var(--c-text)}
.hero-split .hero-meta .src{color:var(--c-muted)}
.hero-split .hero-link{color:var(--c-accent-deep);border-bottom-color:var(--c-border)}
.hero-split .hero-link:hover{color:var(--c-accent-deep)}

/* 右栏：产品面板（悬浮 + 3D 视差） */
.hero-aside{perspective:1200px;min-height:520px}
.hp-panel{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotateY(-7deg) rotateX(3deg);
  width:min(430px,86%);border-radius:16px;padding:20px 22px;
  background:var(--c-surface);
  border:1px solid var(--c-border);
  box-shadow:var(--sh-elev-2);
  transition:transform .5s cubic-bezier(.2,.8,.2,1);will-change:transform;
  animation:hpIn .9s cubic-bezier(.2,.7,.2,1) .2s both}
@keyframes hpIn{from{opacity:0;transform:translate(-50%,-46%) rotateY(-14deg) rotateX(6deg) scale(.96)}
  to{opacity:1;transform:translate(-50%,-50%) rotateY(-7deg) rotateX(3deg)}}
.hp-top{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--c-muted);letter-spacing:.06em}
.hp-dot{width:6px;height:6px;border-radius:50%;background:var(--c-wen);box-shadow:0 0 0 4px var(--c-wen-tint)}
.hp-chips{display:flex;gap:8px;margin:12px 0 14px}
.hp-chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--c-muted);
  background:var(--c-surface-2);border:1px solid var(--c-border);
  border-radius:999px;padding:4px 11px}
.hp-chip b{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.hp-chip.c b{color:var(--c-chong)}.hp-chip.w b{color:var(--c-wen)}.hp-chip.b b{color:var(--c-bao)}
.hp-spark{display:block;width:100%;height:64px;margin:2px 0 12px}
.hp-foot{display:flex;justify-content:space-between;font-size:11.5px;color:var(--c-muted);
  border-top:1px solid var(--c-border);padding-top:11px}
.hp-float{position:absolute;display:flex;flex-direction:column;gap:1px;
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:12px;padding:10px 14px;
  box-shadow:var(--sh-elev-1);
  transition:transform .5s cubic-bezier(.2,.8,.2,1);
  animation:hpIn2 .9s cubic-bezier(.2,.7,.2,1) both}
.hp-float b{font-size:15px;font-weight:600;color:var(--c-text);letter-spacing:-.02em}
.hp-float span{font-size:10.5px;color:var(--c-muted)}
.hp-float-1{right:6%;top:16%;animation-delay:.5s}
.hp-float-2{left:5%;bottom:18%;animation-delay:.65s}
@keyframes hpIn2{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* 极性翻转：hero 之后回到亮色内容区 */
.hero-split + .guide-bar{margin-top:18px}
@media (max-width:980px){
  .hero.hero-split{grid-template-columns:1fr;min-height:0}
  .hero-aside{min-height:340px}
  .hp-panel{position:relative;left:auto;top:auto;transform:none;margin:22px auto 10px;width:calc(100% - 40px)}
  .hp-float-1{right:16px;top:8%}
  .hp-float-2{display:none}
  .hero-split h1{font-size:36px;letter-spacing:-1px}
}
@media (max-width:640px){
  .hero-split h1{font-size:30px;letter-spacing:-.6px}
  .hp-rank b{font-size:32px}
  .hero-aside{min-height:300px}
}

/* V2 层有 .hero{background:none!important}（smoke 断言 hero 无背景图）。
   M1c 起底色随主题（--c-bg）；背景图仍为 none（环境层走 ::before/::after
   伪元素，不占 background-image，这条 smoke 约束继续成立）。 */
.hero.hero-split{background-color:var(--c-bg)!important;background-image:none}
.hero.hero-split .hero-main{padding-top:76px}

/* 移动端修正（必须晚于 V4 的 min-height 声明）。
   顺序：文案与查询卡在前，产品面板在后——手机首屏先读到标题和输入框，
   面板作为「查完能得到什么」的预览紧随其后。 */
@media (max-width:980px){
  .hero.hero-split{min-height:0!important;display:flex;flex-direction:column}
  .hero-aside{min-height:0!important;padding:6px 16px 12px;perspective:none;
    display:flex;justify-content:center}
  .hp-panel{position:static!important;transform:none!important;margin:0 auto;width:100%;max-width:420px;
    animation:none}
  .hp-float{display:none!important}
  .hero-main{padding:26px 20px 18px}
  .hero-split h1{font-size:34px;letter-spacing:-1px}
}
@media (max-width:640px){
  .hero-split h1{font-size:29px;letter-spacing:-.5px}
  .hero-aside{padding:18px 12px 4px}
  .hp-panel{padding:16px 16px}
  .hp-rank b{font-size:30px}
  .hp-spark{height:52px}
}
@media (max-width:640px){
  .hero-aside{padding:16px 10px 18px}
  .hero-main{padding:2px 16px 26px}
  .hero-split .qin input{font-size:15px}
  .hero-split .qin input::placeholder{font-size:14px}
}

/* ==========================================================================
   V5：交互与动效精修
   --------------------------------------------------------------------------
   这一层只做三件事，不改动任何既有版式与配色：
   1) 动效 token：统一缓动与时长，新增动效只引用变量；
   2) 入场编排：hero 文案分层出现、面板描线、视图内容错峰进入；
   3) 操作反馈：按下缩放、列表悬停抬升、顶栏滚动分层、志愿表构成条。
   新入场动画全部包在 prefers-reduced-motion: no-preference 内——
   开启「减少动态效果」的用户直接看到最终态，不依赖全局兜底规则。
   ========================================================================== */
:root{
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-expo:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);
  --t-press:140ms;
  --t-hover:180ms;
  --t-ui:240ms;
  --t-reveal:680ms;
}

/* ---------- 顶栏分层影已删（2026-11-08 用户点名）：全宽 .top.scrolled
   影与胶囊悬浮影一并移除——「两侧阴影」观感来自这里。 ---------- */


/* ---------- 按下反馈：4% 缩放，不改变布局 ---------- */
.chip:active,.batch-sw button:active,.track-sw button:active,.qtab button:active,
.subj:active,.btn-ghost:active,.pager button:active:not(:disabled),
.slot .acts button:active,.hitem .jump button:active,
.tool:active,.reco-item:active,.dash-head .edit:active,.dash-teach .teach-row:active{transform:scale(.96)}
/* 工具箱与推荐卡需要 transition 才看得出「按下」——否则是瞬移 */
.tool,.reco-item,.dash-head .edit{transition:transform var(--t-press) var(--ease-out),
  background var(--t-hover) var(--ease-soft),border-color var(--t-hover) var(--ease-soft)}
.nav button{transition:background var(--t-hover) var(--ease-soft),
  color var(--t-hover) var(--ease-soft),transform var(--t-press) var(--ease-out)}
.nav button:active{transform:scale(.96)}

/* ---------- 列表卡：悬停抬升（用 translate，避开 rowIn 占用的 transform） ---------- */
.gitem{
  animation:rowIn .42s var(--ease-out) both;
  transition:border-color var(--t-hover) var(--ease-soft),
    box-shadow var(--t-hover) var(--ease-soft),
    translate var(--t-press) var(--ease-out),scale var(--t-press) var(--ease-out);
}
.gitem:hover{translate:0 -2px;transform:none;box-shadow:0 10px 26px -16px rgba(16,24,32,.34)}
.gitem:active{translate:0 0;scale:.995}

:where(:root[data-theme="dark"]) .gitem:hover{box-shadow:0 12px 28px -16px rgba(0,0,0,.75)}


/* ---------- 志愿表：冲 / 稳 / 保构成条（renderPlan 写入宽度） ---------- */
.plan-progress{
  display:flex;height:4px;border-radius:999px;background:var(--c-border-soft);
  overflow:hidden;margin:-8px 0 16px;
}
.plan-progress i{display:block;height:100%;width:0;transition:width .5s var(--ease-out)}
.plan-progress .pp-chong{background:var(--c-chong)}
.plan-progress .pp-wen{background:var(--c-wen)}
.plan-progress .pp-bao{background:var(--c-bao)}
.plan-progress .pp-no{background:var(--c-faint)}

/* ---------- 入场编排 ---------- */
@media (prefers-reduced-motion: no-preference){
  /* hero：整块不再整体位移，交给内部元素分层出现 */
  .hero.hero-split{animation:none}
  .hero-split .hero-main > .eyebrow,
  .hero-split .hero-main > h1,
  .hero-split .hero-main > .lede,
  .hero-split .hero-main > .qcard,
  .hero-split .hero-main > .hero-meta{
    animation:heroRise var(--t-reveal) var(--ease-expo) both;
  }
  .hero-split .hero-main > h1{animation-delay:70ms}
  .hero-split .hero-main > .lede{animation-delay:150ms}
  .hero-split .hero-main > .qcard{animation-delay:230ms}
  .hero-split .hero-main > .hero-meta{animation-delay:330ms}

  /* h1 强调词已改实色（渐变文字是检查器清单第一条），原先给渐变背景
     做缓慢流动的 emShimmer 因此没有作用对象——一并删除，别留空转动画。 */

  /* 面板折线：先描线，再点亮面积。
     初始隐藏态写在 keyframes 里而不是普通声明——?noanim=1 会把 animation
     整体关掉，普通声明会让折线永远停在不可见状态。 */
  .hp-spark .hp-line{animation:sparkDraw 1.1s var(--ease-out) .8s both}
  .hp-spark .hp-area{animation:sparkFill .7s var(--ease-soft) 1.1s both}

  /* 视图：内容分层进入（四个业务视图不再整块位移） */
  #view-list.on,#view-plan.on,#view-compare.on,#view-about.on{animation:none}
  #view-list.on #listHead,
  #view-plan.on .planbar,
  #view-compare.on #cmpBody > *,
  #view-about.on #aboutBody > *{animation:viewRise .5s var(--ease-out) both}
  #view-list.on .filters{animation:viewRise .5s var(--ease-out) 50ms both}
  #view-list.on #pager{animation:viewRise .5s var(--ease-out) 100ms both}
  #view-plan.on #planHealth{animation:viewRise .5s var(--ease-out) 50ms both}
  #view-plan.on #slots{animation:viewRise .5s var(--ease-out) 100ms both}
  #view-compare.on #cmpBody > *:nth-child(2){animation-delay:60ms}
  #view-compare.on #cmpBody > *:nth-child(3){animation-delay:110ms}
  #view-about.on #aboutBody > *:nth-child(2){animation-delay:50ms}
  #view-about.on #aboutBody > *:nth-child(3){animation-delay:90ms}
  #view-about.on #aboutBody > *:nth-child(4){animation-delay:130ms}
  #view-about.on #aboutBody > *:nth-child(5){animation-delay:170ms}

  /* 详情抽屉：内容分节落位 */
  .sheet.on .sbody > .sec{animation:sheetSec .42s var(--ease-out) both}
  .sheet.on .sbody > .sec:nth-child(2){animation-delay:50ms}
  .sheet.on .sbody > .sec:nth-child(3){animation-delay:95ms}
  .sheet.on .sbody > .sec:nth-child(4){animation-delay:140ms}

  /* 空态插画轻微浮动，提示这里还可以操作 */
  .plan-empty .empty-art{animation:artFloat 7s var(--ease-soft) infinite}
}

/* 桌面端：面板与浮卡缓慢呼吸（translate 与 hpIn 的 transform 叠加）。
   必须限定 ≥981px：窄屏在 2523 行明确写了 animation:none。 */
@media (min-width:981px) and (prefers-reduced-motion: no-preference){
  .hp-panel{animation:hpIn .9s var(--ease-out) .2s both,hpBreathe 11s var(--ease-soft) 1.5s infinite}
  .hp-float-1{animation:hpIn2 .9s var(--ease-out) .5s both,hpFloat 7s var(--ease-soft) 1.8s infinite}
  .hp-float-2{animation:hpIn2 .9s var(--ease-out) .65s both,hpFloat 8s var(--ease-soft) 2.4s infinite reverse}
  /* v3 M8⑨：浮卡悬停转正（玩具感回应「可不可以加些动效」） */
  .hp-float{cursor:default;transition:transform .3s var(--ease-soft),box-shadow .3s}
  .hp-float:hover{transform:rotate(0deg) scale(1.05);box-shadow:0 22px 48px -20px rgba(8,20,12,.5)}
  .hp-chip b,.hp-conv b{transition:color .3s}
}

@keyframes heroRise{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}
@keyframes sparkDraw{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
@keyframes sparkFill{from{opacity:0}to{opacity:1}}
@keyframes hpBreathe{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes hpFloat{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes viewRise{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
@keyframes sheetSec{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
@keyframes artFloat{0%,100%{translate:0 0}50%{translate:0 -6px}}

/* ==========================================================================
   V5.1：首页仪表盘空态
   --------------------------------------------------------------------------
   卡片高度由右侧工具栏撑开，内容却只有一半，底部留下一大片空白——
   把卡片改成纵向弹性布局，曲线区吃掉剩余高度，CTA 沉到底部，
   空白变成留白而不是「没加载出来」。
   （键盘焦点：input 不在全局 :focus-visible 内，焦点指示由容器 .qin 的
    :focus-within 环提供——见 V2 段 H-04 修复注释。旧注释声称焦点环由
    全局规则提供，与实现相反，已更正。）
   ========================================================================== */
.dash-empty{display:flex;flex-direction:column}
.dash-empty .dash-curve{flex:1;min-height:150px}
.dash-empty .dash-actions{margin-top:auto;padding-top:18px}

/* ==========================================================================
   V5.2：窄屏三处细节
   ========================================================================== */
/* 1）顶栏不透明。≤640 的基础层（1183 行）已经关掉 backdrop-filter
   （否则它会成为底部 Tab 的包含块），但 V2（1767 行）又用 !important
   把背景改回 86% 半透明——没有模糊兜底，滚动时下面的标题、数字会直接
   透在顶栏上，读起来像重影。这里同权重、更晚出现，收回成实色 --card；
   深色模式（1848 行）一并覆盖，深色 --card 本身就是不透明的深灰。 */
@media (max-width:640px){
  .top{background:var(--c-surface)!important}
}
/* 2）一分段图窄屏版（app.js 的 distChart 在 ≤640 换成 300×170 画布）：
   宽度交给 100%，高度按 viewBox 比例走，不再固定 190px 上下留黑边。 */
@media (max-width:640px){
  .dist-chart{height:auto}
}
/* 3）志愿表格子里的「025 组」不拆行。窄屏 .main 只剩 ~137px，专业组号
   默认 white-space:normal 时会在数字和「组」之间断开，读起来像两个字段。
   整枚组号作为不可拆的整体换行。 */
.slot .t1 .gc{white-space:nowrap}

/* ==========================================================================
   V5.3：志愿推荐卡独立成整行
   ==========================================================================
   推荐卡原先住在考生卡里（.dash-profile 内）。考生卡有分段图，右栏的工具箱
   + 志愿表进度只有 ~455px，两列拉平后右栏底下空出 360px 左右的空白——卡片
   边缘之内、内容之外的一块死区，比任何一处留白都显眼。
   把推荐卡提成 .dash 的第三个子项、跨两列，两列等高（各 ~563px），死区归零；
   推荐本身也从「考生卡里的一段」变成首页的一张独立卡片，视觉层级更清楚。
   单列时靠下面的 order 把它放回考生卡之后（见第 6 条）。
   ========================================================================== */
.dash > .dash-reco{
  margin-top:0;background:var(--c-surface);border:1px solid rgba(8,8,8,.04);
  border-radius:12px;box-shadow:0 8px 12px -8px rgba(8,8,8,.06);padding:22px 24px;
}
.dash > .dash-reco .dash-title{margin-bottom:14px}
@media (min-width:901px){
  .dash > .dash-reco{grid-column:1/-1}
  /* 1fr 的最小值默认是 min-content：名称不可拆、分数·位次又设了 nowrap，
     整行卡在 1024 这种刚过断点的宽度上会把 reco-col 顶出右边界 20px
     （scrollWidth 1044 > 1024）。显式 minmax(0,1fr) 让列可以压缩。 */
  .dash > .dash-reco .reco-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
}
@media (min-width:1100px){
  /* 整行后每列 ~390px，名称与「分数 · 位次」改成同一行的两端对齐，
     否则竖排两段字在宽条里各靠左，右半条全是空的。
     1024 附近列只有 ~310px，塞不下两段文字，仍保持竖排。 */
  .dash > .dash-reco .reco-item{flex-direction:row;align-items:baseline;
    justify-content:space-between;gap:12px}
  .dash > .dash-reco .reco-item b{flex:1 1 auto;min-width:0}
  .dash > .dash-reco .reco-item span{flex:0 0 auto;white-space:nowrap}
}
@media (max-width:900px){
  .dash > .dash-reco{padding:18px 18px}
}
/* 4）右栏最后一张卡补到与考生卡等高。两列拉平后右栏（工具箱 + 志愿表进度）
   自然高度 455px，考生卡 563px，底下仍会露出 108px 的页面底色——卡组的下缘
   参差不齐，看起来像少了一张卡。让进度卡吃掉剩余高度，内容靠上、按钮靠下，
   这是「一栏到底」的常规写法，也不会把空档挪到卡片内部正中。 */
@media (min-width:901px){
  .dash-side > .dash-progress{flex:1 1 auto;display:flex;flex-direction:column}
  .dash-side > .dash-progress .go{margin-top:auto}
}
/* 5）进度卡里的冲 / 稳 / 保构成。宽屏把进度卡拉高到与考生卡等高后，
   卡片下半截只剩一枚按钮；补一行构成读数，空档变成信息。 */
.dash-mix{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 0}
.dash-mix .mx{display:inline-flex;align-items:baseline;gap:5px;border-radius:999px;
  padding:4px 12px 4px 10px;font-size:12px;color:var(--c-text-2)}
.dash-mix .mx b{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.dash-mix .mx.c{background:var(--c-chong-soft)} .dash-mix .mx.c b{color:var(--c-chong)}
.dash-mix .mx.w{background:var(--c-wen-soft)}   .dash-mix .mx.w b{color:var(--c-wen)}
.dash-mix .mx.b{background:var(--c-bao-soft)}   .dash-mix .mx.b b{color:var(--c-bao)}
.dash-mix .mx.n{background:var(--c-surface-3)} .dash-mix .mx.n b{color:var(--c-faint)}
.dash-mixnote{font-size:12.5px;color:var(--c-muted);line-height:1.7;margin-top:10px}
/* 6）单列时推荐卡回到考生卡之后。宽屏它排在最后一整行（在工具箱与进度卡
   下面）；单列时这个顺序会让真正有内容的推荐落在六枚工具图标之后。
   用 order 还原成「考生卡 → 推荐 → 工具箱 / 进度」的阅读顺序。 */
@media (max-width:900px){
  .dash > .dash-profile{order:0}
  .dash > .dash-reco{order:1}
  .dash > .dash-side{order:2}
}

/* ==========================================================================
   V6：深色模式对比度补丁
   ==========================================================================
   上一轮审计在深色下逐条量过对比度，这里集中修三类：
   ① 浅色层写死的白底（.chip）在深色下原样留着 —— 白胶囊压深页，文字 2.47:1；
   ② 品牌色字压在品牌软底上（brand #5B86FF on #1B2740 = 4.46:1，11.5–14px）；
   ③ 硬编码的马卡龙底（工具图标、文件类型图标）在深色卡片上像贴纸。
   所有替换值都按最不利底色算过，注释里写的是实测比值。
   ========================================================================== */

/* ① 筛选胶囊：V2 层（1779）写死 background:#fff，深色块只覆盖了
   .gitem / .slot / .btn-ghost，漏了 .chip。改回表面层，
   并把 hover / 选中态一并按深色重算。 */
:where(:root[data-theme="dark"]) .chip{background:var(--c-surface-2);color:var(--c-muted);border-color:var(--c-border)}
/* hover：brand #5B86FF on #23262B 只有 4.55，换成 brand-3 #9DB7FF → 7.70 */
:where(:root[data-theme="dark"]) .chip:hover{border-color:var(--c-accent-deep);color:var(--c-accent)}
/* 选中态：V2 的 .chip.on（1781）写了 color:#fff，比 1082 行的深字规则更晚，
   于是白字压 #5B86FF 只有 3.33。改用 brand-ink #0B1020 → 5.68 */
:where(:root[data-theme="dark"]) .chip.on{color:var(--c-accent-ink)}
/* 梯度胶囊的选中态走 .chip.chong.on 等（476–478），字色是 var(--c-surface)，
   深色下已是深字（6.65–7.93），不需要再改。 */

/* ② 主按钮：品牌底上的白字在深色下只有 3.33（品牌色提亮了）。
   深色下统一改用 brand-ink；首屏按钮是固定深底 #5E6AD2，
   白字 4.70 够用，单独留白。 */
:where(:root[data-theme="dark"]) .btn-primary{color:var(--c-accent-ink)}
:where(:root[data-theme="dark"]) .hero-split .btn-primary{color:#fff}

/* 品牌软底上的品牌色小字：srcbatch / howto 序号 / 引导条序号 / 收藏钮。
   统一提到 brand-3（7.55:1）。 */
:where(:root[data-theme="dark"]) .srcbatch{color:var(--c-accent)}
:where(:root[data-theme="dark"]) .howto .n{color:var(--c-accent)}
:where(:root[data-theme="dark"]) .guide-bar .gi b{color:var(--c-accent)}
:where(:root[data-theme="dark"]) .favbtn:hover,:where(:root[data-theme="dark"]) .favbtn.on{color:var(--c-accent)}

/* ③ 工具图标：六个马卡龙底在深色卡片上是六块亮片。换成同色系的深底 +
   提亮字色，六对分别是 7.55 / 5.88 / 6.43 / 6.96 / 8.91 / 7.30。 */
:where(:root[data-theme="dark"]) .tool.t1 .ico{background:#1B2740;color:#9DB7FF}
:where(:root[data-theme="dark"]) .tool.t2 .ico{background:#3A2419;color:#F08A60}
:where(:root[data-theme="dark"]) .tool.t3 .ico{background:#163226;color:#5FC48C}
:where(:root[data-theme="dark"]) .tool.t4 .ico{background:#241E36;color:#B49CFF}
:where(:root[data-theme="dark"]) .tool.t5 .ico{background:#12262B;color:#63D3E0}
:where(:root[data-theme="dark"]) .tool.t6 .ico{background:#2C2317;color:#E0A85C}

/* 文件类型图标（来源页）：底色改成色系深底，5.88 / 6.43 */


/* 首屏按钮 hover：原 #828FFF 上白字只有 2.87:1（首屏在两种模式下都是深底，
   所以这条与主题无关）。改成略深的 #545FC9，白字 5.44，仍是明确的悬停反馈。 */
.hero-split .btn-primary:hover{filter:brightness(1.06)}

/* 摘要卡首格（深青渐变）的标签：rgba(255,255,255,.9) 叠在 #0077B6 上只有 3.90，
   而它是 12px 小字。直接给纯白 → 4.87。层级差靠字号（34px vs 12px）拉开，
   不靠降低不透明度。 */
#homeIntro > .summary>div:first-child .k,
#homeResult .summary>div:first-child .k{color:#fff}

/* ===========================================================================
   M1c：hero 环境层（2026-11-03，规范 v1.2 §3.4 / 附录 D7）
   ---------------------------------------------------------------------------
   hero 随主题后，区域感交给环境层：极光两团（--aurora-1/3，伪元素承载，
   漂移动画沿用 .hero::before/::after 的 auroraA/B 22s/26s，浅色自动降到
   规范透明度）+ 标题渐变光泽 obShine。m1 深空皮肤与「永久深色面板」废止；
   环境层完整形态（第三团极光、独立网格层、浅色对比截图比对）在 M4 收口。
   =========================================================================== */
@keyframes obShine{from{background-position:0% 0}to{background-position:100% 0}}

@media (prefers-reduced-motion: no-preference){
  .hero-split h1 em{animation:obShine 7s ease-in-out infinite alternate}
}

/* ---- M1d：面板换算编排（规范 §4.6 / §3.2，2026-11-03）----
   换算行（分数→箭头→位次）、三档圆环（JS tween 驱动 dashoffset）、
   冲稳保占比条（CSS width 过渡 .9s，与规范 §3.2 同曲线）。 */
.hp-conv{display:flex;align-items:baseline;gap:8px;margin:14px 0 2px;font-size:12px;color:var(--c-muted);flex-wrap:wrap}
.hp-conv b{font-size:22px;font-weight:500;color:var(--c-text);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.hp-conv .hp-arrow{color:var(--c-accent);display:inline-flex;align-self:center}
.hp-conv .hp-arrow svg{width:16px;height:16px}
.hp-conv .hp-grad{background:var(--grad-num);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hp-chip svg{flex:none}
.hp-ringp{stroke-dashoffset:81.7}   /* 初始全空态；C=2π×13≈81.7，JS 按 data-off 续动 */
.hp-band{display:flex;height:8px;border-radius:999px;overflow:hidden;background:var(--c-surface-2);margin:12px 0 4px}
.hp-band span{display:block;height:100%;width:0;transition:width .9s cubic-bezier(.3,.7,.3,1)}
#hpBandC{background:var(--grad-band-c)}
#hpBandW{background:var(--grad-band-w)}
#hpBandB{background:var(--grad-band-b)}
.hp-band-lab{font-size:11px;color:var(--c-muted);margin:0 0 12px}
.hp-band-lab b{color:var(--c-text);font-weight:500;font-variant-numeric:tabular-nums}
@keyframes obNudge{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
@media (prefers-reduced-motion: no-preference){
  .hp-conv .hp-arrow svg{animation:obNudge 1.6s ease-in-out infinite}
}

/* ---- M4a：环境层收口（规范 §3.4 / §2.1，2026-11-03）----
   第三团极光 A2（--aurora-2，右缘，27s 漂移）+ 44px 网格线
   （--c-gridline，径向 mask 自顶淡出）。至此三团极光 + 网格线齐装：
   A1/A3 = ::before/::after（22s/26s），A2 = 独立元素。 */
.hero-aurora-2{position:absolute;right:-120px;top:100px;width:380px;height:380px;border-radius:50%;
  background:radial-gradient(circle,var(--aurora-2) 0%,transparent 66%);filter:blur(34px);pointer-events:none}
.hero-gridlines{position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background-image:linear-gradient(var(--c-gridline) 1px,transparent 1px),linear-gradient(90deg,var(--c-gridline) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(ellipse 90% 55% at 50% 0%,#000 25%,transparent 78%);
  mask-image:radial-gradient(ellipse 90% 55% at 50% 0%,#000 25%,transparent 78%)}
@media (prefers-reduced-motion: no-preference){
  .hero-aurora-2{animation:obDrift2 27s ease-in-out infinite alternate}
}
@keyframes obDrift2{from{transform:translate(0,0) scale(1)}to{transform:translate(-70px,80px) scale(1.1)}}

/* ---- M2a：一分段曲线（规范 §4.7 / §3.3，2026-11-03）----
   描线 1.7s cubic-bezier(.4,0,.2,1)、面积淡入 1s ease .5s、marker 组
   （脉冲环 2.2s / 落点 / 垂直虚线 / 描边标签）。旧 .dist-chart 折线样式
   （drawLine/2200 硬编码 dasharray）由下方同名新规则覆盖退役。 */
.dist-chart .dist-line{transition:stroke-dashoffset 1.7s cubic-bezier(.4,0,.2,1)}
.dist-chart .dist-area{opacity:0;transition:opacity 1s ease .5s}
.dist-chart.in .dist-area{opacity:1}
.dist-chart .dist-marker{opacity:0;transition:opacity .5s ease 1.2s}
.dist-chart.in .dist-marker{opacity:1}
.dist-chart .dist-pulse{transform-box:fill-box;transform-origin:center;opacity:.35}
@keyframes obPulse{0%{transform:scale(.5);opacity:.55}80%{transform:scale(2.1);opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion: no-preference){
  .dist-chart .dist-pulse{animation:obPulse 2.2s ease-out infinite}
}
.dist-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.dist-chip{font-size:11px;color:var(--c-muted);border:1px solid var(--c-border);border-radius:999px;padding:2px 10px;background:var(--c-surface-2)}

/* ---- v3 §1 / M5：数黑体应用位（标题 / 大数字 / 站名；正文与表格不用） ---- */
.hero-split h1, .sec-title, .howto-h, .brand-t b, .hp-rank b,
#homeIntro .summary .v, #homeResult .summary .v, .hp-conv b,
.pagehead h2, .cl-barv{
  font-family:var(--n3-disp);
}

/* ---- M2b：控制线柱状 + 明细表（规范 §4.8/§4.9/§3.3，2026-11-03）----
   柱体生长 .95s cubic-bezier(.3,.7,.3,1)，逐柱 stagger 由 app.js 内联
   animation-delay（.05s 起步 +.1s 步进）；数值标签 .75s 延迟浮出且一律
   --c-text；明细表行 stagger i*0.07s；同比 chip 用 --delta-*（方向语义：
   控制线下降=利好=青，与位次 trend 的 up/down 相反处各自标注）。 */
html.anim .cl-chart .cl-bar{transform-origin:bottom;animation:barUp .95s cubic-bezier(.3,.7,.3,1) both}
@keyframes barUp{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.cl-chart .cl-barv{opacity:0}
html.anim .cl-chart .cl-barv{animation:clFade .5s ease .75s both}
@keyframes clFade{to{opacity:1}}
html.anim .lines tr{animation:obRowIn .55s cubic-bezier(.22,.9,.3,1) both}
@keyframes obRowIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
.cl-delta{display:inline-block;font-size:11px;padding:2px 8px;border-radius:7px;white-space:nowrap}
.cl-delta.down{color:var(--delta-down);background:var(--delta-down-tint)}
.cl-delta.up{color:var(--delta-up);background:var(--delta-up-tint)}
.cl-delta.flat{color:var(--delta-flat);background:var(--delta-flat-tint)}

/* ---- M3a：对比双视图开关 + 行内 sparkline（规范 §4.10，2026-11-03）----
   开关 = 胶囊组（aria-pressed 逐钮），断点只定默认值；sparkline 描边
   0.8s 进场，颜色中性 indigo（方向判断交给文字，§4.9 语义互斥）；
   表行/卡片入场 stagger i*0.07s（与控制线表同一曲线）。 */
.ob-vtoggle{display:inline-flex;gap:4px;border:1px solid var(--c-border);border-radius:999px;padding:3px;background:var(--c-surface);margin:0 0 14px;width:max-content}
.ob-vtoggle button{padding:5px 14px;border-radius:999px;font-size:12px;color:var(--c-muted);transition:background .25s,color .25s}
.ob-vtoggle button[aria-pressed="true"]{background:var(--c-accent);color:var(--c-accent-deeper)}
.cmp-sparkwrap{display:inline-flex;align-items:center;gap:8px}
.cmp-spark{flex:none}
.cmp-spark polyline{stroke-dasharray:1;stroke-dashoffset:1}
html.anim .cmp-spark polyline{animation:obSpark .8s ease .15s both}
@keyframes obSpark{to{stroke-dashoffset:0}}
html.anim .cmptable tbody tr{animation:obRowIn .55s cubic-bezier(.22,.9,.3,1) both}
html.anim .cmpcards .cmpcard{animation:obRowIn .55s cubic-bezier(.22,.9,.3,1) both}

/* ---- M3b：45 格阵列总览（规范 §4.11，2026-11-03）----
   颜色即梯度（--grad-band-*：浅色实色语义色 / 深色概念稿渐变，D9），
   15 列格阵（≤560px 折 9 列），逐格 stagger i*0.02s 点亮（弹性曲线 §3.5）；
   阵列只做总览（title 提示「第 N 格·梯度」），编辑仍在列表（原则 2）。 */
.ob-cells{display:grid;grid-template-columns:repeat(15,1fr);gap:6px;max-width:640px;margin:0 0 16px}
@media (max-width:560px){.ob-cells{grid-template-columns:repeat(9,1fr)}}
.ob-cell{aspect-ratio:1;border-radius:6px;background:var(--c-surface-2);opacity:0;transform:scale(.55)}
html.anim .ob-cell{animation:obCell .5s cubic-bezier(.34,1.5,.64,1) both}
@keyframes obCell{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:scale(1)}}
.ob-cell.c{background:var(--grad-band-c)}
.ob-cell.w{background:var(--grad-band-w)}
.ob-cell.b{background:var(--grad-band-b)}

/* ===========================================================================
   M1 重设计 token 层（重设计规范 v1.2 §2.1 / §2.1b，2026-11-03）
   ---------------------------------------------------------------------------
   六板块新组件一律引用 --c-* 语义 token：两套主题同名同值集、只有取值不同，
   同一组件零改动能切换。与存量 token（--bg/--card/--chong…）并存；
   全部视图迁移完成后旧表退役（规范 §6.3）。
   守卫：verify_compliance「重设计 token」组把两张表的每个取值钉死为规范值，
   任何色差即红（N2，§8「零色差」的执法形态）。
   =========================================================================== */
:root{
  /* ---- 基础面 ---- */
  --c-bg:#F5F6FA;
  --c-top-capsule:#FFFFFF;
  --c-top-capsule-line:#EDF2EE;
  --c-capsule-light:120deg,#FFE9B8,#FFD98F 55%,#8FB8FF;
  --c-capsule-sun:#E0A400;
  --c-capsule-moon:#5B8DEF;
  --c-surface:#FFFFFF;
  --c-surface-2:#EEF0F6;
  --c-border:rgba(100,116,139,.18);
  --c-text:#1A2032;
  --c-muted:#5A6478;
  --c-text-on-accent:#FFFFFF;
  --c-stroke-halo:var(--c-bg);            /* 图表标签描边底（paint-order:stroke） */
  /* ---- 品牌 ---- */
  --c-accent:#17CE8C;
  --c-accent-deep:#065F46;   /* v3 M8：#0B7A50 在浅 tint 底 <4.5，提深到全底 AA */
  --c-cyan:#0E7490;
  --grad-brand:linear-gradient(135deg,#065F46,#0C9B67);
  --grad-num:linear-gradient(120deg,#0B7A50,#17CE8C);
  --grad-title:linear-gradient(110deg,#0C9B67,#17CE8C 45%,#0B7A50 80%,#0C9B67);
  --grad-band-c:var(--c-chong);           /* 浅色占比条用实色（规范附录 D9） */
  --grad-band-w:var(--c-wen);
  --grad-band-b:var(--c-bao);
  /* ---- 语义色：冲/稳/保（全站唯一含义，只上数据） ---- */
  --c-chong:#C2410C;
  --c-chong-tint:rgba(194,65,12,.10);
  --c-wen:#047857;
  --c-wen-tint:rgba(4,120,87,.10);
  --c-bao:#1D4ED8;
  --c-bao-tint:rgba(29,78,216,.10);
  /* ---- 趋势色 / 系列色 ---- */
  --trend-ease:#047857;
  --trend-hard:#BE123C;
  --trend-unknown:#475569;
  --delta-down:#0F766E;
  --delta-down-tint:rgba(15,118,110,.10);
  --delta-up:#BE123C;
  --delta-up-tint:rgba(190,18,60,.10);
  --delta-flat:#475569;
  --delta-flat-tint:rgba(71,85,105,.10);
  --s-phys:#0C9B67;
  --grad-bar-phys:linear-gradient(180deg,#17CE8C,#0B7A50);
  --s-hist:#0891B2;
  --grad-bar-hist:linear-gradient(180deg,#22D3EE,#0E7490);
  --grad-curve:linear-gradient(90deg,#0C9B67,#0E7490);
  --c-area:rgba(12,155,103,.12);
  /* ---- 环境层（浅色 = 深色透明度的约 43%，规范附录 D9） ---- */
  --aurora-1:rgba(23,206,140,.18);
  --aurora-2:rgba(45,212,191,.15);
  --aurora-3:rgba(34,211,238,.10);
  --c-gridline:rgba(100,116,139,.06);
  /* ---- 浮起投影 / 焦点环 ---- */
  --sh-elev-1:0 10px 24px -10px rgba(79,70,229,.45);
  --sh-elev-2:0 30px 70px -30px rgba(79,70,229,.25);
  --c-focus:#0E7490;
  /* ---- v3 §2：洗地 / 警告 / 显示字体 ---- */
  --c-wash-1:#E3F6EC;
  --c-wash-2:#BFEEDB;
  --c-wash-ink:#0B1B12;
  --c-warn-chip:#B45309;
  --n3-disp:"Alimama ShuHeiTi","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  /* ---- §6.3 收编层（2026-11-04）----
     旧 token 表里「新表无对应物」的角色，按当前生效值原样收编进本表：
     只改名字不改颜色，视觉零差。映射见 docs/迁移映射-旧token收编-2026-11-04.md。 */
  --c-surface-3:#EAEFF4;
  --c-text-2:#131212;
  --c-faint:#626C76;
  --c-border-soft:#F0F2F5;
  --c-border-strong:#C9CED6;
  --c-accent-deeper:#063F2B;
  --c-accent-ink:#FFFFFF;
  --c-wash-1-soft:#EFFAF4;
  --c-chong-soft:#FEF0E8;
  --c-chong-line:#F5D2BE;
  --c-chong-fade:rgba(251,238,233,.35);
  --c-wen-soft:#E9F7EE;
  --c-wen-line:#C4E8D1;
  --c-wen-fade:rgba(232,244,237,.35);
  --c-bao-soft:#E8EFFE;
  --c-bao-line:#C9D9FF;
  --c-bao-fade:rgba(235,240,248,.35);
  --c-warn-soft:#FDF5E9;
  --c-warn-strong:#8A6114;
  --c-warn-cell:#FDF9F8;
  --c-warn-flash:#FFF4E8;
  --c-bad:#A03232;
  --c-bad-soft:#FDF0F0;
  --c-bad-cell:#F8ECEA;
  --c-danger-line:#E0C0BB;
  --c-best-cell:#F2F8F4;
  --c-no-soft:#F0F2F4;
  --c-glass:rgba(255,255,255,.97);
  --c-glass-2:rgba(255,255,255,.92);
  --c-glass-3:rgba(250,251,252,.72);
  --c-hover-bg:#FAFBFC;
  --c-bar-track:#CFD2CF;
  --c-rule-strong:#DDD;
  --c-scroll-thumb:#CFD6DC;
  --c-field-on-dark:rgba(255,255,255,.94);
  /* 基础投影：随主题翻转，故并入本表（原 --sh-1/2/3） */
  --c-sh-1:0 1px 2px rgba(8,8,8,.04);
  --c-sh-2:0 1px 2px rgba(8,8,8,.05),0 6px 14px -10px rgba(8,8,8,.1);
  --c-sh-3:0 8px 28px -14px rgba(8,8,8,.22);
}
:root[data-theme="dark"]{
  /* ---- 基础面（概念稿基准） ---- */
  --c-bg:#070B14;
  --c-surface:#0D1424;
  --c-surface-2:#121B31;
  --c-border:rgba(148,163,184,.16);
  --c-text:#E8ECF6;
  --c-muted:#93A0B8;
  --c-text-on-accent:#FFFFFF;
  --c-stroke-halo:var(--c-bg);
  /* ---- 品牌 ---- */
  --c-accent:#2BD99B;
  --c-accent-deep:#17B57D;
  --c-cyan:#67E8F9;
  --grad-brand:linear-gradient(135deg,#17B57D,#2BD99B);
  --grad-num:linear-gradient(120deg,#17B57D,#2BD99B);
  --grad-title:linear-gradient(110deg,#2BD99B,#17B57D 45%,#2BD99B 80%,#2BD99B);
  --grad-band-c:linear-gradient(90deg,#FB923C,#FBBF24);
  --grad-band-w:linear-gradient(90deg,#34D399,#6EE7B7);
  --grad-band-b:linear-gradient(90deg,#60A5FA,#7DD3FC);
  /* ---- 语义色：冲/稳/保 ---- */
  --c-chong:#FB923C;
  --c-chong-tint:rgba(251,146,60,.13);
  --c-wen:#34D399;
  --c-wen-tint:rgba(52,211,153,.13);
  --c-bao:#60A5FA;
  --c-bao-tint:rgba(96,165,250,.13);
  /* ---- 趋势色 / 系列色 ---- */
  --trend-ease:#34D399;
  --trend-hard:#FB7185;
  --trend-unknown:#64748B;
  --delta-down:#2DD4BF;
  --delta-down-tint:rgba(45,212,191,.11);
  --delta-up:#FB7185;
  --delta-up-tint:rgba(251,113,133,.11);
  --delta-flat:#93A0B8;
  --delta-flat-tint:rgba(148,163,184,.10);
  --s-phys:#2BD99B;
  --grad-bar-phys:linear-gradient(180deg,#2BD99B,#17B57D);
  --s-hist:#22D3EE;
  --grad-bar-hist:linear-gradient(180deg,#7DD3FC,#0891B2);
  --grad-curve:linear-gradient(90deg,#17B57D,#22D3EE);
  --c-area:rgba(43,217,155,.14);
  /* ---- 环境层（概念稿几何：A1/A2/A3 + 44px 网格线） ---- */
  --aurora-1:rgba(23,206,140,.42);
  --aurora-2:rgba(45,212,191,.34);
  --aurora-3:rgba(34,211,238,.22);
  --c-gridline:rgba(148,163,184,.05);
  /* ---- 浮起投影 / 焦点环 ---- */
  --sh-elev-1:0 10px 24px -10px rgba(99,102,241,.9);
  --sh-elev-2:0 30px 70px -30px rgba(99,102,241,.35);
  --c-focus:#67E8F9;
  --c-top-capsule:#151D19;       /* 锁顶胶囊深色底（C1 收编） */
  --c-top-capsule-line:#242C28;  /* 锁顶胶囊深色描边 */
  --c-capsule-light:120deg,#1B2440,#101628 55%,#0B100D;
  --c-capsule-sun:#E0A400;
  --c-capsule-moon:#5B8DEF;
  --c-wash-1:#102E22;   /* 预算自 color-mix(accent 15%, #0B100D)，兼容 Safari<16.2 */
  --c-wash-2:#154C38;   /* 预算自 color-mix(accent 30%, #0B100D) */
  --c-wash-ink:#E9F1EC;
  --c-warn-chip:#FBBF24;
  --n3-disp:"Alimama ShuHeiTi","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  /* ---- §6.3 收编层（深色，2026-11-04）---- */
  --c-surface-3:#2A2E34;
  --c-text-2:#E6E8EB;
  --c-faint:#969CA4;
  --c-border-soft:#24272C;
  --c-border-strong:#3A3F46;
  --c-accent-deeper:#062E20;
  --c-accent-ink:#0B1020;
  --c-wash-1-soft:#182238;
  --c-chong-soft:#3A2419;
  --c-chong-line:#5C3826;
  --c-chong-fade:rgba(58,36,25,.55);
  --c-wen-soft:#163226;
  --c-wen-line:#2B5441;
  --c-wen-fade:rgba(22,50,38,.55);
  --c-bao-soft:#1B2740;
  --c-bao-line:#33456B;
  --c-bao-fade:rgba(27,39,64,.55);
  --c-warn-soft:#3A2C14;
  --c-warn-strong:#D9A441;
  --c-warn-cell:#2A2118;
  --c-warn-flash:#3A2C14;
  --c-bad:#E07A72;
  --c-bad-soft:#3A1E1C;
  --c-bad-cell:#2E1C1A;
  --c-danger-line:#6B3B36;
  --c-best-cell:#1D3327;
  --c-no-soft:#242C33;
  --c-glass:rgba(20,25,31,.97);
  --c-glass-2:rgba(20,25,31,.92);
  --c-glass-3:rgba(18,23,28,.72);
  --c-hover-bg:#20272E;
  --c-bar-track:#3A444E;
  --c-rule-strong:#3A444E;
  --c-scroll-thumb:#3D4A55;
  --c-field-on-dark:#2A333B;
  /* 基础投影（深色层） */
  --c-sh-1:0 1px 2px rgba(0,0,0,.3);
  --c-sh-2:0 1px 2px rgba(0,0,0,.3),0 6px 14px -10px rgba(0,0,0,.4);
  --c-sh-3:0 8px 28px -14px rgba(0,0,0,.7);
}


/* ===========================================================================
   v3 §4-4 / M7：数据大表（活队列）——「一张表立住脚」
   队列跟随首屏位次（renderDTable）；行入场 stagger；sparkline 描边动画。
   =========================================================================== */
.dtable-sec{margin:22px 0 30px}
.dtable-sec .sec-title{margin-bottom:6px}

/* ── A 面（2026-11-08）：同分双科类位次对比（#xtCmpSec）──
   系列色走图表语义 token（--s-phys/--s-hist，双主题翻转）；
   条形生长的 transition 包在 no-preference 内（动效纪律）。 */
.xt-sec{margin:22px 0 6px}
.xt-bars{margin-top:12px;display:flex;flex-direction:column;gap:10px;max-width:640px}
.xt-row{display:flex;align-items:center;gap:12px}
.xt-lab{width:52px;font-size:12.5px;color:var(--c-muted);flex-shrink:0}
.xt-track{flex:1;height:16px;background:var(--c-surface-2);border-radius:999px;overflow:hidden}
.xt-bar{display:block;height:100%;width:0;border-radius:999px}
.xt-bar.bar-phys{background:var(--s-phys)}
.xt-bar.bar-hist{background:var(--s-hist)}
.xt-num{width:88px;text-align:right;font-weight:600;font-variant-numeric:tabular-nums;font-size:13.5px;color:var(--c-text)}
.xt-note{margin:10px 0 0;font-size:12.5px;color:var(--c-muted)}
@media (prefers-reduced-motion: no-preference){
  .xt-bar{transition:width .7s var(--ease-soft)}
}
.dt-em{color:var(--c-accent-deep);font-style:normal}
.dt-sub{font-size:12.5px;color:var(--c-muted);margin:0 0 14px}
.dt-sub b{color:var(--c-text);font-weight:600;font-variant-numeric:tabular-nums}
.dtable-wrap{border:1px solid var(--c-border);border-radius:18px;background:var(--c-surface);
  overflow-x:auto;box-shadow:var(--c-sh-1)}
table.dtable{width:100%;border-collapse:collapse;font-size:13.5px;min-width:820px}
.dtable th{font-weight:500;color:var(--c-muted);text-align:left;font-size:12px;
  padding:13px 15px;border-bottom:1px solid var(--c-border);white-space:nowrap;letter-spacing:.04em}
.dtable td{padding:13px 15px;border-bottom:1px solid var(--c-border-soft);white-space:nowrap;vertical-align:middle}
.dtable tbody tr:last-child td{border-bottom:0}
.dtable tbody tr{transition:background .18s}
.dtable tbody tr:hover{background:var(--c-wash-1);background:color-mix(in srgb,var(--c-accent) 6%,transparent)}
.dtable .r{text-align:right}
.dt-tag{display:inline-block;font-size:11px;font-weight:600;padding:3px 11px;border-radius:999px}
.dt-tag.c{color:var(--c-chong);background:var(--c-chong-tint)}
.dt-tag.w{color:var(--c-wen);background:var(--c-wen-tint)}
.dt-tag.b{color:var(--c-bao);background:var(--c-bao-tint)}
.dt-sch b{font-weight:600;color:var(--c-text)}
.dt-sch small{display:block;font-size:11.5px;color:var(--c-muted);margin-top:1px}
/* L-06 + H-02（2026-11-07）：.dt-spark/.dt-dchip 七行死规则已删除——
   H-02 真数据大表退役了三年走势列，两类选择器全仓零引用（grep 实证）；
   @keyframes dtSpark 保留（.dash-curve 2392 行仍在用）。 */
@keyframes dtSpark{to{stroke-dashoffset:0}}
html.anim .dtable tbody tr{animation:dtRowIn .55s var(--ease-soft) both}
@keyframes dtRowIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
.dtable-empty{text-align:center;padding:26px;color:var(--c-muted);font-size:13px}
.dtable-chips{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;font-size:12px;color:var(--c-muted)}
.dtable-chips span{display:inline-flex;align-items:center;gap:6px}
.dtable-chips i{width:5px;height:5px;border-radius:50%;background:var(--c-accent)}

/* ===========================================================================
   v3 §4-5 / M7：雷达轨道（数据引力）—— 纯装饰
   臂架贴合圆环（inset 同环）、点钉臂缘 → 天然压线；内环 6px 外环 13px。
   =========================================================================== */
.orbit-sec{margin:30px 0 34px;padding:38px 20px 30px;text-align:center;
  border:1px solid var(--c-border);border-radius:24px;
  background:var(--c-bg);
  background:linear-gradient(180deg,var(--c-bg),color-mix(in srgb,var(--c-accent) 7%,var(--c-bg)));
  overflow:hidden}
.ob-kick{font-size:11.5px;letter-spacing:.24em;color:var(--c-accent-deep);opacity:.75;margin:0 0 4px}
.ob-h2{font-family:var(--n3-disp);font-size:30px;letter-spacing:-.9px;color:var(--c-text)}
.ob-h2 em{font-style:normal;color:var(--c-accent-deep)}
.orbit{position:relative;width:min(560px,94%);aspect-ratio:1;margin:22px auto 0}
.ob-ring{position:absolute;border-radius:50%;border:1px solid var(--c-border);
  background:var(--c-glass-3);
  background:color-mix(in srgb,var(--c-surface) 55%,transparent)}
.ob-ring.r1{inset:33%} .ob-ring.r2{inset:20%} .ob-ring.r3{inset:6%}
.ob-arm{position:absolute;border-radius:50%;pointer-events:none}
.ob-arm.a1{inset:33%} .ob-arm.a2{inset:20%} .ob-arm.a3{inset:6%}
.ob-arm .ob-dot{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);
  width:6px;height:6px;border-radius:50%;opacity:.85;
  box-shadow:0 0 0 3px var(--c-wash-2);box-shadow:0 0 0 3px color-mix(in srgb,var(--c-accent) 16%,transparent)}
.ob-arm.a2 .ob-dot{width:8px;height:8px}
.ob-arm.a3 .ob-dot{width:13px;height:13px;opacity:1;
  box-shadow:0 0 0 5px var(--c-wash-2);box-shadow:0 0 0 5px color-mix(in srgb,var(--c-accent) 22%,transparent)}
.ob-arm.b .ob-dot{top:auto;bottom:0;transform:translate(-50%,50%)}
.ob-dot.d1{background:#FB923C} .ob-dot.d2{background:#34D399}
.ob-dot.d3{background:#60A5FA} .ob-dot.d4{background:#FBBF24}
.ob-dot.d5{background:#F472B6} .ob-dot.d6{background:#22D3EE}
html.anim .ob-arm{animation:obSpin 20s linear infinite}
html.anim .ob-arm.a1{animation-duration:14s}
html.anim .ob-arm.a2{animation-duration:22s}
html.anim .ob-arm.a3{animation-duration:30s}
@keyframes obSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.ob-center{position:absolute;inset:37%;border-radius:50%;display:grid;place-content:center;gap:2px;
  background:var(--c-glass-3);
  background:color-mix(in srgb,var(--c-surface) 84%,transparent);
  box-shadow:0 14px 34px -18px rgba(0,0,0,.35)}
.ob-center p{font-size:11.5px;color:var(--c-accent-deep);letter-spacing:.14em;margin:0}
.ob-center b{font-family:var(--n3-disp);font-size:26px;letter-spacing:-.4px;color:var(--c-text);
  border-bottom:4px solid var(--c-wash-2);border-bottom:4px solid color-mix(in srgb,var(--c-accent) 55%,transparent);padding-bottom:2px}
.ob-chip{position:absolute;background:var(--c-surface);border:1px solid var(--c-border);border-radius:13px;
  padding:9px 15px;box-shadow:var(--c-sh-1);text-align:left}
.ob-chip b{font-family:var(--n3-disp);font-size:15px;color:var(--c-accent-deep)}
.ob-chip span{display:block;font-size:10.5px;color:var(--c-muted)}
.ob-chip.c1{left:2%;top:5%} .ob-chip.c2{right:1%;top:14%}
.ob-chip.c3{right:3%;bottom:10%} .ob-chip.c4{left:3%;bottom:3%}
@media (max-width:880px){
  .ob-chip{display:none}
  .ob-h2{font-size:23px}
}

/* 细节修正（2026-11-08 自查；品牌名 2026-11-12 用户点名改回全称——
   移动端不再切「志愿填报」短名，实测 390px 放得下，见上文批次区注释）：
   ① 术语表禁止拆行（.nw）——「体检」曾被断成孤字「检」；
   ② 打字机静态路径（noanim/手动静态）隐藏光标 ▍——残迹已三处目检在案。 */
.nw{white-space:nowrap}
#ledeType.lede-static::after{content:""}
@media (max-width:640px){
  .top-row{gap:8px}
  .brand-t b{font-size:13.5px}
  .track-sw button{padding:5px 11px}
}

/* ── A 面（2026-11-08）：批次全景（#bpanoSec）──
   单系列条形用 --c-accent + surface-2 轨道（与双科类对比同一图形语言）；
   条形生长包 no-preference；数字 tabular-nums。 */
.bp-sec{margin:26px 0 8px}
.bp-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:12px}
.bp-card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:14px;padding:14px 16px}
.bp-name{font-size:13px;color:var(--c-muted);font-weight:600}
.bp-big{display:flex;align-items:baseline;gap:6px;margin-top:6px}
.bp-big b{font-size:26px;font-weight:700;color:var(--c-text);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.bp-big small{font-size:12px;color:var(--c-muted)}
.bp-sub{margin-top:4px;font-size:12.5px;color:var(--c-muted)}
.bp-line{margin-top:8px;font-size:12px;color:var(--c-muted);border-top:1px dashed var(--c-border-soft);padding-top:8px}
.bp-plan{margin-top:16px;background:var(--c-surface);border:1px solid var(--c-border);border-radius:14px;padding:14px 16px}
.bp-plan-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.bp-plan-h span{font-size:12px;color:var(--c-muted)}
.bp-plan-rows{margin-top:10px;display:flex;flex-direction:column;gap:9px}
.bp-prow{display:flex;align-items:center;gap:12px}
.bp-plab{width:104px;font-size:12px;color:var(--c-muted);flex-shrink:0;text-align:right;white-space:nowrap}
.bp-ptrack{flex:1;height:16px;background:var(--c-surface-2);border-radius:999px;overflow:hidden}
.bp-pbar{display:block;height:100%;width:0;border-radius:999px;background:var(--c-accent)}
.bp-pnum{width:76px;text-align:right;font-weight:600;font-size:13px;color:var(--c-text);font-variant-numeric:tabular-nums}
.bp-note{margin:10px 0 0;font-size:12px;color:var(--c-muted)}
@media (prefers-reduced-motion: no-preference){
  .bp-pbar{transition:width .7s var(--ease-soft)}
}

/* ── A 面（2026-11-08）：对比页三年位次柱状对比（.cmp-trend）──
   柱色随科类走图表系列 token（--s-phys/--s-hist）；柱高进场生长包
   no-preference（transform 缩放，避免逐帧改 height）。 */
.cmp-trend{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:0 0 14px}
.cmp-tcard{background:var(--c-surface);border:1px solid var(--c-border);border-radius:12px;padding:12px 10px 9px}
.cmp-tbars{display:flex;align-items:flex-end;justify-content:center;gap:14px;height:96px}
.cmp-tcol{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:52px}
.cmp-tcol i{display:block;width:22px;border-radius:6px 6px 2px 2px;background:var(--s-phys)}
.cmp-trend.ls .cmp-tcol i{background:var(--s-hist)}
.cmp-tcol small{font-size:11px;color:var(--c-text);font-variant-numeric:tabular-nums}
.cmp-tcol em{font-style:normal;font-size:10.5px;color:var(--c-muted)}
.cmp-tsch{text-align:center;margin-top:7px;font-size:12px;color:var(--c-text);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmp-tsch small{margin-left:4px;color:var(--c-muted);font-weight:400}
.cmp-tnone{font-size:11.5px;color:var(--c-muted);align-self:center}
.cmp-tcard.none .cmp-tbars{align-items:center}
/* 移动端单列（2026-11-09 守夜后 compare-m 截图）：390 视口双列每卡仅 ~165px，
   三柱区需 184px——柱体溢出卡缘顶到右上悬浮置信徽标；单列 ~340px 放得下。 */
@media (max-width:640px){
  .cmp-trend{grid-template-columns:1fr}
}
@media (prefers-reduced-motion: no-preference){
  .cmp-tcol i{transform-origin:bottom;animation:cmpTGrow .55s var(--ease-soft) both}
  @keyframes cmpTGrow{from{transform:scaleY(0)}}
}

/* ── A 面（2026-11-08）：列表页梯度占比条（.propbar）──
   三段 = 冲/稳/保语义 token 原色（全站唯一含义），无动画（数据直读）。 */
.propbar{display:flex;height:10px;border-radius:999px;overflow:hidden;margin-top:14px;background:var(--c-surface-2)}
.propbar i{display:block;height:100%;min-width:0}
.propbar .pc{background:var(--c-chong)}
.propbar .pw{background:var(--c-wen)}
.propbar .pb{background:var(--c-bao)}
.propbar-leg{display:flex;gap:16px;margin-top:7px;font-size:12px;color:var(--c-muted)}
.propbar-leg span{display:inline-flex;align-items:center;gap:5px}
.propbar-leg i{display:inline-block;width:9px;height:9px;border-radius:3px}
.propbar-leg .pc{background:var(--c-chong)}
.propbar-leg .pw{background:var(--c-wen)}
.propbar-leg .pb{background:var(--c-bao)}

/* ── A 面（2026-11-08）：志愿表槽位视觉升级 ──
   档位色左边条（45 格扫一眼即见梯度结构）；hover 面层抬升（无位移）；
   空格进一步弱化。语义色沿用冲/稳/保 token（唯一含义）。 */
.slot{border-left:3px solid var(--c-border-soft)}
.slot.b-chong{border-left-color:var(--c-chong)}
.slot.b-wen{border-left-color:var(--c-wen)}
.slot.b-bao{border-left-color:var(--c-bao)}
.slot.b-chong:hover,.slot.b-wen:hover,.slot.b-bao:hover{border-color:var(--c-border-strong)}
.slot.empty{border-left:3px solid transparent}

/* ── B3（2026-11-08）：趋势置信度证据点/徽标 ──
   三态色：high=稳(绿) mid=警示(黄) none=灰；dot 8px、badge 胶囊。
   颜色全部走既有语义 token（不新增 token，SPEC 不动）。 */
.conf-dot{display:inline-block;width:8px;height:8px;border-radius:50%;
  background:var(--c-faint);margin-right:6px;vertical-align:1px;flex-shrink:0}
.spark[data-conf="high"] .conf-dot{background:var(--c-wen)}
.spark[data-conf="mid"] .conf-dot{background:var(--c-warn-chip)}
.spark[data-conf="none"] .conf-dot{background:var(--c-faint)}
.conf-badge{display:inline-block;margin-left:8px;padding:1px 9px;border-radius:999px;
  font-size:11px;font-weight:600;vertical-align:2px;cursor:help}
.conf-badge.high{background:var(--c-wen-soft);color:var(--c-wen)}
.conf-badge.mid{background:var(--c-warn-soft);color:var(--c-warn-strong)}
.cmp-tcard{position:relative}
.cmp-tcard .conf-badge{position:absolute;top:8px;right:8px}

/* ── 问答一级视图（2026-11-09 用户点名优化）──
   从「右下悬浮圆钮 + 400px 小窗」升级为导航直达的全屏视图：长答案
   （实测护理检索 9551px）在小窗里翻 26 屏，且消息流 flex 子项默认可压缩
   ——答卡被压扁裁剪，overflow-y:auto 永不触发。现在消息流是独立滚动容器
   （min-height:0 + flex-shrink:0 子项），占满视图高度；芯片与输入行固定在
   面板底部。零 AI 零后端——规则式引擎答本地数据，搜不到明说。 */
.qa-view{display:none}
.qa-view.on{display:block}
.qa-panel{display:flex;flex-direction:column;max-width:880px;margin:0 auto;
  /* 100% 父级是自动高度（会按 9551px 内容撑破视口）——只认视口算式 */
  height:calc(100dvh - var(--top-h,150px) - 116px);
  min-height:360px;
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:16px;overflow:hidden}
.qa-panel-hd{display:flex;align-items:center;gap:8px;padding:12px 16px;
  border-bottom:1px solid var(--c-border-soft);background:var(--c-surface-2)}
.qa-panel-hd b{font-size:14px;color:var(--c-text)}
.qa-panel-hd span{font-size:11.5px;color:var(--c-muted);flex:1}
/* 独立滚动容器：min-height:0 让 flex 子项可以收缩出真实溢出；
   子项 flex-shrink:0 让答卡按内容自然高度撑开，而不是被压扁裁剪。 */
.qa-msgs{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  padding:16px;display:flex;flex-direction:column;gap:10px}
.qa-msgs > *{flex-shrink:0}
.qa-msg{max-width:92%;border-radius:12px;padding:8px 12px;font-size:13px;line-height:1.6}
.qa-msg.sys{align-self:flex-start;background:var(--c-surface-2);color:var(--c-muted)}
.qa-msg.q{align-self:flex-end;background:var(--c-wash-1);color:var(--c-wash-ink);max-width:min(72%,520px)}
/* 空态引导：只答本地数据的边界说明 + 真值数字；一问之后收起，不占消息流 */
.qa-intro{align-self:flex-start;max-width:min(92%,620px);padding:14px 16px;
  border:1px dashed var(--c-border-strong);border-radius:12px;background:var(--c-surface-2)}
.qa-intro b{display:block;font-size:14px;color:var(--c-accent-deep);margin-bottom:6px}
.qa-intro p{margin:5px 0 0;font-size:12.5px;line-height:1.7;color:var(--c-muted)}
.qa-msgs.has-asked .qa-intro{display:none}
.qa-msg.a{align-self:stretch;max-width:100%;background:var(--c-surface);
  border:1px solid var(--c-border);padding:0;overflow:hidden}
.qa-msg.a .qa-card{margin:0;border:none;box-shadow:none}
.qa-msg.bad{align-self:stretch;max-width:100%;background:var(--c-bad-soft);color:var(--c-text);
  border:1px solid var(--c-danger-line)}
/* 长答案收敛：默认展示前 8 行 + 「展开全部」，避免一条答案淹没消息流。
   数字仍是主语（条数明说），展开后原样保留所有行，不裁数据。 */
.qa-collapsed .qa-row:nth-of-type(n+9){display:none}
/* ── 院校档案（B 面 A 方案，2026-11-09）：教育部名单直读 ──
   紧凑四行表 + 来源链；数字/字段全部来自 schools_moe.json，零硬编码。 */
.moecard{border:1px solid var(--c-border);border-radius:12px;overflow:hidden;margin-top:4px}
.moerow{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  padding:9px 14px;border-bottom:1px solid var(--c-border-soft);font-size:13px}
.moerow:last-of-type{border-bottom:none}
.moerow span{color:var(--c-muted);font-size:12px;flex:none}
.moerow b{color:var(--c-text);font-weight:600;text-align:right}
.moesrc{padding:8px 14px;background:var(--c-surface-2);font-size:11.5px;color:var(--c-muted);line-height:1.6}
.moesrc a{color:var(--c-accent-deep);text-decoration:none;border-bottom:1px dashed var(--c-border-strong)}
.moesrc a:hover{border-bottom-style:solid}
.moesrc .sec-ic{vertical-align:-2px;margin-left:2px}
.qa-more{display:block;width:100%;border:none;border-top:1px solid var(--c-border-soft);
  background:var(--c-surface-2);color:var(--c-accent-deep);font-size:12.5px;
  padding:9px 12px;cursor:pointer;text-align:center}
.qa-more:hover{background:var(--c-border-soft)}
.qa-chips{display:flex;gap:6px;flex-wrap:wrap;padding:8px 16px;border-top:1px dashed var(--c-border-soft)}
.qa-chips button{border:1px solid var(--c-border);background:var(--c-surface-2);color:var(--c-muted);
  border-radius:999px;padding:4px 10px;font-size:11.5px;cursor:pointer}
.qa-chips button:hover{color:var(--c-text);border-color:var(--c-border-strong)}
.qa-inputrow{display:flex;gap:8px;padding:10px 16px;border-top:1px solid var(--c-border-soft);
  background:var(--c-surface-2)}
.qa-inputrow input{flex:1;min-width:0;border:1px solid var(--c-border);border-radius:10px;
  padding:8px 12px;font-size:13px;background:var(--c-surface);color:var(--c-text)}
.qa-inputrow input:focus-visible{outline:2px solid var(--c-accent);outline-offset:1px}
.qa-inputrow .btn-primary{height:38px;padding:0 16px;font-size:13px}
@media (max-width:640px){
  /* 底部 Tab 58 + 安全区 + 8 余量：输入行不得被 Tab 压住（探针实证曾压 10px） */
  .qa-panel{height:calc(100dvh - var(--top-h,150px) - 132px);min-height:0;
    border:none;border-radius:0}
  /* 副标题改整行换行：390px 下「只答数据库里有的 · 答不了的会明说 ·
     不编造」被 flex:1 挤成「不编造」孤字一行（用户截图点名）。 */
  .qa-panel-hd{flex-wrap:wrap;padding:10px 12px;gap:2px 8px}
  .qa-panel-hd b{flex:0 0 auto}
  .qa-panel-hd span{flex:1 1 100%;font-size:11px;line-height:1.45;white-space:normal}
  .qa-msgs{padding:12px}
  .qa-chips{padding:8px 12px}
  .qa-inputrow{padding:10px 12px}
}
@media (prefers-reduced-motion: no-preference){
  .qa-msg.q,.qa-msg.a{animation:qaMsgIn .22s var(--ease-soft) both}
  @keyframes qaMsgIn{from{opacity:0;transform:translateY(6px)}}
}