/* ══════════════════════════════════════════════════════════════
   全站公共外壳：顶部工具栏 + 主导航（含下拉）+ 页脚
   风格参照 gh-ap.com（光华剑樑官网）：白底、主色 #3747FF、
   辅色 #2F2552、点缀 #fec624，Noto Sans SC，内容宽 1290px。
   ──────────────────────────────────────────────────────────────
   用法（任何页面，两行即可）：
     <link rel="stylesheet" href="css/site-chrome.css">
     …页面内容…
     <script src="js/site-chrome.js"></script>
   导航/页脚由脚本注入 <body> 首尾，各自带 .site- 前缀，不碰页面自己的样式。
   ══════════════════════════════════════════════════════════════ */

:root {
  --site-blue: #3747FF;
  --site-blue-soft: #eef0ff;
  --site-indigo: #2F2552;
  --site-yellow: #fec624;
  --site-ink: #17173a;
  --site-body: #4a4a5a;
  --site-muted: #7a7a8c;
  --site-smoke: #f5f6fa;
  --site-line: #e6e7ef;
  --site-white: #ffffff;
  --site-max: 1290px;
  --site-gutter: 30px;
}

/* ── 注入的容器本身不占布局 ─────────────────────────────── */
#siteHeader, #siteFooter { all: unset; display: block; }

/* ── 第一行：品牌 + 快捷入口 ────────────────────────────── */
.site-top {
  background: var(--site-white);
  border-bottom: 1px solid var(--site-line);
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", Lato, system-ui, sans-serif;
}
.site-top-in {
  max-width: var(--site-max);
  margin: 0 auto;
  padding: .85rem var(--site-gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.site-brand { display: flex; align-items: center; gap: .7rem; text-decoration: none; }
.site-mark {
  width: 40px; height: 40px; border-radius: 11px; flex: none;
  background: linear-gradient(135deg, var(--site-blue) 0%, #6b7bff 100%);
  color: #fff; display: grid; place-items: center;
  font-weight: 800; font-size: .95rem; letter-spacing: .02em;
  box-shadow: 0 4px 12px rgba(55, 71, 255, .28);
}
.site-brand-tx b { display: block; font-size: 1.02rem; color: var(--site-ink); line-height: 1.25; }
.site-brand-tx span {
  display: block; font-size: .68rem; color: var(--site-muted);
  letter-spacing: .14em; text-transform: uppercase;
}
.site-quick { display: flex; align-items: center; gap: .35rem; }
.site-quick a {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .42rem .7rem; border-radius: 8px;
  font-size: .84rem; font-weight: 500; color: var(--site-body);
  text-decoration: none; white-space: nowrap;
}
.site-quick a:hover { background: var(--site-smoke); color: var(--site-blue); }

/* ── 第二行：主导航（sticky） ───────────────────────────── */
.site-nav {
  position: sticky; top: 0; z-index: 40;             /* 登录门是 50/200，盖得住 */
  /* 不用 backdrop-filter：sticky + 毛玻璃在软件渲染/无头 Chrome 里会把整页拖死
     （2026-11-14：APCSA 课程页加了本样式后 headless 直接不出 DOM）。用近不透明白底代替。 */
  background: var(--site-white);
  border-bottom: 1px solid var(--site-line);
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", Lato, system-ui, sans-serif;
}
.site-nav-in {
  max-width: var(--site-max);
  margin: 0 auto;
  padding: 0 var(--site-gutter);
  display: flex; align-items: center; gap: .15rem;
}
.site-nav .mi {
  position: relative;
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .82rem .95rem;
  font-size: .92rem; font-weight: 600; color: var(--site-body);
  text-decoration: none; cursor: pointer;
  border: none; background: none; font-family: inherit;
}
.site-nav .mi:hover, .site-nav .mi:focus-visible { color: var(--site-blue); }
.site-nav .mi.cur { color: var(--site-blue); box-shadow: inset 0 -2.5px 0 var(--site-blue); }
.site-nav .mi .car { font-size: .62rem; transition: transform .18s; opacity: .7; }
.site-nav .has-sub:hover .car, .site-nav .has-sub:focus-within .car { transform: rotate(180deg); }

/* 下拉面板 */
.site-nav .sub {
  position: absolute; top: 100%; left: 0;
  min-width: 250px; padding: .5rem;
  background: var(--site-white);
  border: 1px solid var(--site-line); border-radius: 12px;
  box-shadow: 0 18px 40px rgba(23, 23, 58, .13);
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .16s, transform .16s, visibility .16s;
  z-index: 41;
}
.site-nav .has-sub:hover .sub, .site-nav .has-sub:focus-within .sub {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.site-nav .sub .grp {
  padding: .45rem .6rem .2rem; font-size: .68rem; font-weight: 700;
  letter-spacing: .1em; color: var(--site-muted); text-transform: uppercase;
}
.site-nav .sub a {
  display: flex; align-items: baseline; gap: .5rem;
  padding: .48rem .6rem; border-radius: 8px;
  font-size: .88rem; font-weight: 500; color: var(--site-ink);
  text-decoration: none;
}
.site-nav .sub a:hover { background: var(--site-blue-soft); color: var(--site-blue); }
.site-nav .sub a em { font-style: normal; font-size: .74rem; color: var(--site-muted); }
.site-nav .sub a.cur { background: var(--site-blue-soft); color: var(--site-blue); font-weight: 700; }

/* 右侧：搜索式入口（考试安排）+ 移动端汉堡 */
.site-nav .spacer { margin-left: auto; }
.site-nav .cta {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .45rem .95rem; border-radius: 999px;
  background: var(--site-blue); color: #fff;
  font-size: .85rem; font-weight: 600; text-decoration: none;
}
.site-nav .cta:hover { background: #2b3ae0; }
.site-burger { display: none; }

/* ── 页脚 ───────────────────────────────────────────────── */
.site-foot {
  margin-top: 3.5rem;
  background: var(--site-indigo);
  color: rgba(255, 255, 255, .72);
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", Lato, system-ui, sans-serif;
}
.site-foot-in {
  max-width: var(--site-max); margin: 0 auto;
  padding: 3rem var(--site-gutter) 1.6rem;
  display: grid; grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)); gap: 2.2rem;
}
.site-foot-in > div { min-width: 0; }
.site-foot h4 {
  margin: 0 0 .9rem; font-size: .78rem; font-weight: 700;
  letter-spacing: .12em; color: #fff; text-transform: uppercase;
}
.site-foot ul { list-style: none; margin: 0; padding: 0; }
.site-foot li { margin-bottom: .5rem; }
.site-foot a { color: rgba(255, 255, 255, .72); font-size: .87rem; text-decoration: none; }
.site-foot a:hover { color: var(--site-yellow); }
.site-foot .brandline { display: flex; align-items: center; gap: .7rem; margin-bottom: .9rem; }
.site-foot .brandline .site-mark { box-shadow: none; }
.site-foot .blurb { font-size: .87rem; line-height: 1.7; max-width: 34ch; }
.site-foot .mail {
  display: inline-block; margin-top: .9rem; padding: .5rem 1rem;
  border: 1px solid rgba(255, 255, 255, .28); border-radius: 999px;
  font-size: .85rem; color: #fff; text-decoration: none; overflow-wrap: anywhere;
}
.site-foot .mail:hover { border-color: var(--site-yellow); color: var(--site-yellow); }
.site-foot-bar {
  border-top: 1px solid rgba(255, 255, 255, .14);
  padding: 1.1rem var(--site-gutter);
  text-align: center; font-size: .78rem; color: rgba(255, 255, 255, .5);
}

/* ── 响应式 ─────────────────────────────────────────────── */
@media (max-width: 1080px) {
  .site-quick a span { display: none; }         /* 只留图标 */
  .site-quick a { padding: .42rem .5rem; }
}
@media (max-width: 900px) {
  .site-foot-in { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem; }
}
@media (max-width: 760px) {
  .site-top-in { padding: .7rem 1rem; }
  .site-quick { display: none; }
  .site-nav-in { padding: 0 .6rem; flex-wrap: wrap; }
  .site-burger {
    display: inline-flex; margin-left: auto;
    border: none; background: none; font-size: 1.3rem; color: var(--site-ink);
    padding: .5rem .6rem; cursor: pointer;
  }
  /* 移动端：导航收成竖排，下拉改成常驻列表 */
  .site-nav .mi { padding: .7rem .6rem; font-size: .9rem; }
  .site-nav .mi.cur { box-shadow: none; background: var(--site-blue-soft); border-radius: 8px; }
  .site-nav .spacer, .site-nav .cta { display: none; }
  .site-nav .sub {
    position: static; opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: none; border-radius: 0;
    padding: 0 0 .4rem 1rem; min-width: 0;
  }
  .site-nav.collapsed .mi:not(.burger) { display: none; }
  .site-nav.collapsed .sub { display: none; }
}

/* ── 打印：外壳不上纸 ───────────────────────────────────── */
@media print {
  #siteHeader, #siteFooter { display: none !important; }
}

/* ── 让位给全站头部 ─────────────────────────────────────
   各页自己的浮动主题按钮原本钉在 top:1rem，现在那儿是全站顶部工具栏 + 主导航
   （合计约 105px 高）。统一挪到头部下方，别叠在导航上。
   本条在页面自己的 <style> 之后加载（链接插在 </head> 前），同特异性下后者胜。 */
.theme-toggle { top: 6.6rem; z-index: 45; }