/* 研知道新前台 · 外壳样式（2026-10-15 从 site.css 拆出）：颜色 token、样稿提示条、导航、手机底部导航、页脚。
 * 全站每页都用；从 1.0 整页搬进来的页面（非全院校库）只用这一份，不吃 site.css 里的通用组件，免得 .chip / .wrap 等类名冲突。 */
/* 统一尺寸框架（ww 2026-10-18 定）：电脑一套、手机一套，各页只引用这里的变量，不再各写数字。
 * 手机 / 电脑只用一条分界：max-width 760px 是手机（CSS 媒体查询里不能用变量，各文件统一写 760 / 761）。
 * 字号档出处：design.md §2.3 五档 + site.css 头注（ww 2026-10-15 定的「吸引注意 / 正常阅读」两类）；间距档见 design.md §2.5。 */
:root {
  --site-page-width: 1160px; --site-page-gutter: 40px; --site-header-height: 60px; --tap-min: 40px;
  --fs-display: 64px;   /* 首屏大标题（首页、问 AI 首屏） */
  --fs-title: 48px;     /* 页面标题 */
  --fs-section: 30px;   /* 板块标题、关键大数字 */
  --fs-item: 22px;      /* 条目名（某条路 / 某个专业 / 某所学校）、卡片标题 */
  --fs-body: 16px;      /* 正文、按钮、选项 */
  --fs-dense: 14px;     /* 密集表格、手机上的紧凑控件 */
  --fs-meta: 12px;      /* 说明小字、来源，不低于 12 */
  --site-content-width: calc(var(--site-page-width) - var(--site-page-gutter) - var(--site-page-gutter));
  --ink: #21302F; --meta: #5E6F76;
  --accent: #3A6A72; --accent-soft: #D3E3E4; --band: #1E3D42;
  --mark: #C0843C;
  --paper: #F6F3EC; --card: #FFFFFF; --tert: #EDEEE8;
  --border: #D7E2E1; --rule: #233030; --divider: #E6EDEC;
  --nav: #17383d; --nav-text: #bfd1d2; --nav-soft: #86a8aa;
  --serif: "Source Han Serif SC", "Noto Serif SC", "Songti SC", "STSong", serif;
  --sans: "Source Han Sans SC", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --shadow-card: 0 2px 8px rgba(60,50,40,0.04);
  --shadow-cta: 0 6px 20px rgba(58,106,114,0.22);
}
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* 样稿提示条：只在样稿里有，正式版没有 */


/* 导航（第二版）：电脑端 品牌 | 院校库▾ | 怎么选 | 过考率 | 问 AI；标签只用两三个字 */
.nav { position: relative; z-index: 50; background: var(--nav); color: var(--paper); }
.nav-in { max-width: var(--site-page-width); margin: 0 auto; padding: 0 var(--site-page-gutter); display: flex; align-items: stretch; justify-content: space-between; min-height: var(--site-header-height); }
.nav-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--card); font-family: var(--serif); font-weight: 600; font-size: var(--fs-body); letter-spacing: .2em; white-space: nowrap; }
.nav-brand b { width: 28px; height: 28px; display: grid; place-items: center; background: var(--accent); border: 1px solid rgba(255,255,255,.4); border-radius: 4px 9px 4px 9px; font-size: var(--fs-body); letter-spacing: 0; }
.nav-links { display: flex; align-items: stretch; gap: 4px; margin-left: auto; }
.nav-sub, .nav-dot { font-style: normal; }
.nav-item { position: relative; display: flex; align-items: center; gap: 6px; padding: 0 18px; border: 0; background: none; color: var(--nav-text); text-decoration: none; font: 400 var(--fs-body)/1 var(--sans); letter-spacing: .06em; white-space: nowrap; cursor: pointer; }
.nav-item:hover, .nav-item[aria-current="page"], .nav-lib.open .nav-item { color: var(--card); }
.nav-admin { font-size: var(--fs-dense); letter-spacing: 0; opacity: .8; }   /* 管理员才看得到的三个入口 */
.nav-item[aria-current="page"]::after { content: ""; position: absolute; left: 18px; right: 18px; bottom: 0; height: 3px; background: var(--mark); }
.nav-item .chev { width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .15s ease; }
.nav-lib { position: relative; display: flex; }
.nav-lib.open .chev { transform: translateY(1px) rotate(-135deg); }
.mega { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); display: none; grid-template-columns: repeat(2, 230px); gap: 10px; padding: 12px; background: var(--card); border-radius: 0 0 16px 16px; box-shadow: 0 12px 30px rgba(30,61,66,.18); }
.nav-lib.open .mega { display: grid; }
.door-link { display: grid; gap: 4px; align-content: start; padding: 14px 16px; border: 0.5px solid var(--border); border-radius: 16px; color: var(--ink); text-decoration: none; background: var(--paper); }
.door-link:hover { border-color: var(--accent); background: var(--card); }
.door-link .tag { justify-self: start; }
.door-link b { font-family: var(--serif); font-weight: 600; font-size: var(--fs-item); }
.door-link small { color: var(--meta); font-size: var(--fs-meta); }
/* 顶部右侧：白底椭圆分两半「AI 搜索 | 真人咨询」（ww 2026-10-15 定）；手机顶部也显示 */
.nav-pill { align-self: center; flex: none; display: flex; margin-left: 10px; padding: 3px; border-radius: 999px; background: var(--card); }
.nav-pill a { padding: 6px 16px; border-radius: 999px; color: var(--band); font-weight: 600; font-size: var(--fs-body); line-height: 1.5; text-decoration: none; white-space: nowrap; }
.nav-pill a + a { position: relative; }
.nav-pill a + a::before { content: ""; position: absolute; left: 0; top: 25%; bottom: 25%; border-left: 1px solid var(--border); }
.nav-pill a:hover, .nav-pill a[aria-current="page"] { background: var(--accent-soft); }
.nav-pill a:hover::before, .nav-pill a[aria-current="page"]::before, .nav-pill a:hover + a::before, .nav-pill a[aria-current="page"] + a::before { display: none; }
/* 每页最下面：左「不骗人 · 真服务」、右本页信息（ww 2026-10-15 定：以考研路径页为准） */
.colophon { display: flex; justify-content: space-between; gap: 16px; margin-top: 56px; padding: 14px 0 0; border-top: 1px solid var(--rule); font-family: var(--serif); font-weight: 600; font-size: var(--fs-body); letter-spacing: .2em; }
.colophon span + span { color: var(--meta); font-family: var(--sans); font-weight: 400; font-size: var(--fs-meta); letter-spacing: .12em; }

/* 手机底部一排 + 院校库底部面板：只在窄屏出现 */
.tabbar, .lib-sheet { display: none; }
.tag { display: inline-block; padding: 1px 10px; border: 1px solid var(--rule); border-radius: 999px; font-size: var(--fs-meta); font-weight: 600; letter-spacing: .1em; line-height: 1.6; }
.tag.solid { background: var(--band); border-color: var(--band); color: var(--card); }
.site-footer { margin-top: 28px; padding: 18px 16px calc(22px + env(safe-area-inset-bottom)); border-top: 1px solid var(--divider); color: var(--meta); font-size: var(--fs-meta); line-height: 1.8; text-align: center; }
.site-footer a { color: var(--meta); white-space: nowrap; text-underline-offset: 3px; text-decoration-color: var(--border); }
.site-footer .sep { margin: 0 8px; color: var(--border); }
.site-footer .foot-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 20px; margin-bottom: 8px; font-size: var(--fs-meta); }
.site-footer .foot-links a { color: var(--ink); text-decoration: none; }
.site-footer .foot-links a:hover { text-decoration: underline; }

@media (max-width: 860px) {
  .nav-item { padding: 0 12px; }
  .nav-item[aria-current="page"]::after { left: 12px; right: 12px; }
}
@media (max-width: 760px) {
  :root { --site-page-gutter: 16px; --site-header-height: 48px; --tap-min: 44px;
    /* 手机字号参照 apple.com.cn 手机版的层级（2026-10-18 实测：页面大标题 34–48、页面标题 28–32、版块标题 21–24、卡片标题 17–21、
       列表与按钮 17、说明 14、脚注 12）。2026-10-19 ww 看过后觉得取下限显得小气：规则不变，在苹果的范围里取居中偏舒展的值 */
    --fs-display: 40px; --fs-title: 30px; --fs-section: 24px; --fs-item: 19px; --fs-body: 17px; }
  .nav-in { padding: 0 var(--site-page-gutter); min-height: var(--site-header-height); }
  /* 触控区不小于 44（苹果 HIG 44pt、WCAG 2.2 目标尺寸 44×44；2026-10-18 按标准实测补齐）。
     句子里的行内链接除外；视觉上小的按钮（项目卡里的「对比」）用透明外扩加大可点范围，不改外观 */
  input[type="search"], input[type="text"], select, .btn, #mFilterOpen, #yzd-feedback-open, .figs-top, .cmp-chip,
  .act > a.link, .pj .links > a.link, .platform-ai-model-switch button, .platform-ai-send, .platform-ai-close { min-height: var(--tap-min); }
  .act > a.link, .pj .links > a.link { display: inline-flex; align-items: center; }
  .platform-ai-close { min-width: var(--tap-min); }
  .cmp-toggle { position: relative; }
  .cmp-toggle::after { content: ""; position: absolute; inset: -8px 0; }
  /* 「对比」放到这一行最右边，点卡片中间不会误点成加入对比（任务流实测发现，2026-10-19） */
  .m-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
  .m-meta .cmp-toggle { margin-left: auto; }
  .nav-links { display: none; }
  .nav-pill a { display: inline-flex; align-items: center; min-height: var(--tap-min); padding: 0 12px; font-size: var(--fs-dense); line-height: 1.5; }
  .nav-brand { gap: 8px; letter-spacing: .06em; }
  .nav-dot { display: none; }          /* 手机品牌显示「研知道院校库」，去掉中间的「 · 」（ww 2026-10-16） */
  .colophon { flex-direction: column; gap: 2px; margin-top: 32px; }
  /* 页脚：行距收紧，免责声明一段不再撑高 */
  .site-footer { margin-top: 20px; padding-top: 14px; line-height: 1.6; }
  .site-footer p + p { margin-top: 4px; }
  body { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
  .tabbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: grid; grid-template-columns: repeat(4, 1fr);
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); background: var(--card); border-top: 0.5px solid var(--border); box-shadow: 0 -6px 20px rgba(30,61,66,.06); }
  .tabbar a, .tabbar button { display: grid; justify-items: center; gap: 2px; padding: 4px 0; border: 0; background: none; color: var(--meta); text-decoration: none; font: 400 var(--fs-meta)/1.4 var(--sans); cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .tabbar svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
  .tabbar [aria-current="page"] { color: var(--band); font-weight: 600; }
  .tabbar [aria-current="page"] svg { stroke-width: 2.2; }
  .lib-sheet:not([hidden]) { position: fixed; inset: 0; z-index: 55; display: flex; align-items: flex-end; background: rgba(30,61,66,.32); }
  .lib-sheet-panel { width: 100%; display: grid; gap: 10px; padding: 16px 16px calc(84px + env(safe-area-inset-bottom)); background: var(--card); border-radius: 16px 16px 0 0; }
  .lib-sheet-panel p { color: var(--meta); font-size: var(--fs-meta); }
}

/* 最窄的手机（≤360，如 320 宽）：「全库检索 | 真人咨询」和品牌放一行，收紧内边距与字距（ww 2026-10-18 改名后变长） */
@media (max-width: 360px) {
  .nav-pill a { padding: 0 8px; }
  .nav-brand { gap: 6px; letter-spacing: 0; }
}

/* 登录后共用的管理导航；前台和后台使用同一组入口与状态。 */
.admin-nav{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;padding:12px max(24px,calc((100% - 1080px)/2));background:var(--card);border-bottom:1px solid var(--border);font:400 var(--fs-body)/1.5 var(--sans);color:var(--ink)}
.admin-nav>span{font-size:var(--fs-meta);color:var(--meta);margin-right:auto}
.admin-nav a{padding:6px 16px;border:1px solid var(--border);border-radius:999px;text-decoration:none;color:var(--ink);white-space:nowrap}
.admin-nav a:hover{background:var(--accent-soft)}
.admin-nav a[aria-current="page"]{background:var(--band);border-color:var(--band);color:var(--card);font-weight:600}
.admin-nav a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:760px){.admin-nav{padding:12px 16px;gap:8px}.admin-nav>span{flex-basis:100%}.admin-nav a{padding:6px 10px;font-size:var(--fs-dense)}}

/* 在小程序里打开（site.js 给 html 加 in-mp）：全库检索的入口先不放（ww 2026-10-19 定，首次提审更稳），底部一排改三格；
   直接打开全库检索页时只显示一段「请在网页版使用」；点到外站时的提示条 */
html.in-mp a[href^="/school/qa"], html.in-mp .platform-ai-launcher, html.in-mp .platform-ai-drawer,
html.in-mp section.ask[aria-labelledby="qT"], html.in-mp .mp-hide, html.in-mp body[data-page="qa"] main { display: none !important; }
html.in-mp .tabbar { grid-template-columns: repeat(3, 1fr); }
html.in-mp .nav-pill a::before { display: none; }   /* 只剩「真人咨询」一个，不要分隔线 */
/* 小程序里全库检索页只剩提示：不用问答页那套「跟着可见高度走」的固定布局（小程序网页容器报的高度不准，底部会空一截、跳动），
   改回普通页面，底部一排固定贴底（ww 2026-10-19 小程序实测） */
html.in-mp.qa-app, html.in-mp.qa-app body { height: auto !important; overflow: visible !important; }
html.in-mp.qa-app body { position: static !important; top: auto !important; min-height: 100vh; }
html.in-mp.qa-app .tabbar { position: fixed !important; }
.mp-qa-off { flex: 1 0 auto; width: 100%; max-width: 520px; margin: 0 auto; padding: 48px var(--site-page-gutter, 16px); text-align: center; }
.mp-qa-off h1 { font-family: var(--serif); font-weight: 600; font-size: var(--fs-section); line-height: 1.4; margin-bottom: 12px; }
.mp-qa-off p { color: var(--meta); font-size: var(--fs-body); line-height: 1.7; }
.mp-qa-off .mp-url { margin: 16px 0 20px; color: var(--ink); font-size: var(--fs-dense); word-break: break-all; }
.mp-toast { position: fixed; left: 50%; bottom: calc(96px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 2147483001;
  max-width: calc(100vw - 48px); padding: 10px 16px; border-radius: 999px; background: var(--ink); color: var(--card); font-size: var(--fs-dense); line-height: 1.5; text-align: center; }

/* 手机第 3 轮（2026-10-19）：能横滑的区域（加 class="hs"），哪边还有内容哪边渐隐；site.js 按滚动位置切 more-l / more-r */
.hs.more-r { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 36px), transparent); }
.hs.more-l { -webkit-mask-image: linear-gradient(to left, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(to left, #000 calc(100% - 36px), transparent); }
.hs.more-l.more-r { -webkit-mask-image: linear-gradient(to right, transparent, #000 36px, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(to right, transparent, #000 36px, #000 calc(100% - 36px), transparent); }
/* 按下去的反馈（只在触屏上）：按钮微缩、链接和底部一排变淡，去掉浏览器默认的灰色闪块。
   用独立的 scale 属性，不覆盖各元素自己的 transform */
@media (hover: none) {
  a, button, summary, label, [role="button"], .m-card, .dzh-card { -webkit-tap-highlight-color: transparent; }
  button, .btn, .chip, [role="button"], .m-card, .dzh-card { transition: scale .12s ease, opacity .12s ease; }
  button:not(:disabled):active, .btn:active, .chip:active, [role="button"]:active { scale: .97; }
  .m-card:active, .dzh-card:active { scale: .985; }
  a:active, summary:active, .tabbar button:active { opacity: .55; scale: 1; }
}
@media print{.nav,.admin-nav,.tabbar,.site-footer,.lib-sheet{display:none!important}}

/* 第一次使用的小提示（first-use-tips.js，ww 2026-10-18 定）：贴在实际要点的位置旁，一步一句，看过不再出现 */
.first-tip { position: absolute; z-index: 12600; width: min(300px, calc(100vw - 24px)); padding: 12px 14px 10px; border-radius: 10px; background: var(--ink); color: #fff; box-shadow: 0 10px 28px rgba(20,32,34,.24); font-size: var(--fs-dense); line-height: 1.6; animation: first-tip-in .18s ease-out; }
.first-tip::before { content: ""; position: absolute; top: -6px; left: var(--arrow-x, 20px); width: 12px; height: 12px; background: var(--ink); transform: rotate(45deg); border-radius: 2px; }
.first-tip.up::before { top: auto; bottom: -6px; }
.first-tip p { margin: 0 0 8px; }
.first-tip-acts { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.first-tip-n { margin-right: auto; color: rgba(255,255,255,.7); font-size: var(--fs-meta); }
.first-tip button { min-height: 32px; padding: 0 12px; border: 0; border-radius: 999px; background: transparent; color: rgba(255,255,255,.8); font: inherit; font-size: var(--fs-dense); cursor: pointer; }
.first-tip button.primary { background: #fff; color: var(--ink); font-weight: 600; }
@keyframes first-tip-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .first-tip { animation: none; } }