/* ══════════════════════════════════════════════════════════
   V3 公共外壳层 —— reset + 导航 + 页脚 + 容器
   一处定义，八个页面共用。搭配 /assets/v3-tokens.css（token）与
   /assets/v3-ui.js（图标/检索/主题的 JS 注入部件）。

   为什么要有这个文件（2026-08-10 审计后新增）：
   - 8 个 V3 页此前各自内联复制 .nav/.nav-in/.wrap/footer 等外壳，
     跨页重复选择器 59 个、37 个已经漂移（about.html 的 .wrap 是
     1080px，其余 7 页是 1180px；.nav-in gap 30 对 28；.nav 透明度
     .9 对 .92——都是复制粘贴的误差，不是有意设计）。收拢到这里，
     漂移在结构上不可能再发生。
   - 这几个页面此前仍然 <link> 着 104KB 的 /styles.css，只为了拿
     focus-visible 和 reduced-motion 两条规则，代价是背景又跑起了
     一个无意义的 26s ambientWash 动画 + 颗粒噪点层（V3 的扁平白卡
     设计根本不需要这层）。这里把这两条规则原样接过来，styles.css
     可以从 V3 页面里摘掉。
   ══════════════════════════════════════════════════════════ */

/* ── Reset ──────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
*::selection { background: var(--v-ink); color: var(--v-bg); }
html { scroll-behavior: smooth; }
body {
  background: var(--v-bg);
  color: var(--v-ink);
  font-family: var(--font-cn, 'Noto Sans SC', sans-serif);
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
}
a { color: inherit; text-decoration: none; }

/* ── 无障碍：键盘可见焦点（从 styles.css 搬来，原样） ────── */
.nav a:focus-visible,
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--v-accent);
  outline-offset: 3px;
  border-radius: 3px;
}

/* ── 无障碍：尊重「减弱动态效果」（从 styles.css 搬来）────── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    transition-duration: .001ms !important;
    animation-duration: .001ms !important;
  }
}

/* ── 容器 ───────────────────────────────────────────────── */
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; }

/* ── 顶栏 ───────────────────────────────────────────────── */
.nav {
  position: sticky; top: 0; z-index: 60;
  background: rgba(251, 250, 246, .92);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--v-line);
}
html[data-theme="dark"] .nav { background: rgba(33, 31, 29, .92); }
.nav-in {
  max-width: 1180px; margin: 0 auto; padding: 14px 32px;
  display: flex; align-items: center; gap: 28px;
}
.brand {
  font-family: var(--font-cn-serif, serif); font-size: 19px; font-weight: 600;
  letter-spacing: .04em; color: var(--v-ink); white-space: nowrap;
}
.brand span {
  font-family: var(--font-mono, monospace); font-size: 9.5px; letter-spacing: .28em;
  color: var(--v-ink3); margin-left: 9px; text-transform: uppercase; font-weight: 400;
}
.nav-links { display: flex; gap: 2px; margin-left: 6px; }
.nav-links a {
  font-size: 14.5px; font-weight: 500; color: var(--v-ink2);
  padding: 7px 14px; border-radius: 9999px; transition: .15s;
}
.nav-links a:hover, .nav-links a.on { background: var(--v-bg3); color: var(--v-ink); }
.nav-right { margin-left: auto; display: flex; align-items: center; gap: 8px; }

/* ── 页脚 ───────────────────────────────────────────────── */
footer {
  border-top: 1px solid var(--v-line); padding: 36px 0;
  font-size: 13px; color: var(--v-ink3);
}
.foot-in {
  display: flex; justify-content: space-between; gap: 20px;
  flex-wrap: wrap; align-items: center;
}
footer a:hover { color: var(--v-accent); }

/* ── V3 预览角标（临时件，转正后可删） ─────────────────── */
.v3-flag {
  position: fixed; left: 14px; bottom: 14px; z-index: 80;
  background: var(--v-ink); color: var(--v-bg);
  font-family: var(--font-mono, monospace); font-size: 10px; letter-spacing: .16em;
  padding: 7px 13px; border-radius: 9999px; text-transform: uppercase; opacity: .9;
}

/* ── 断点 ───────────────────────────────────────────────── */
@media (max-width: 980px) {
  .nav-links { display: none; }
  .wrap, .nav-in { padding-left: 20px; padding-right: 20px; }
}
