/* 设计令牌（PLAN.md 第 3、10 节）。
 *
 * 换主题 = 换这个文件。其余样式表只引用变量，不写死任何色值。
 * 目前只有浅色一套。 */

/* ── 自托管字体（第 7-4 节）───────────────────────────────
 * scripts/build-fonts.sh 把 Noto Serif/Sans SC 子集化到 GB2312 常用字
 * （约 7400 字），各产出一个 woff2，走 /fonts/{*path} 下发（assets.rs，
 * immutable 长缓存，不走 asset() 的内容哈希——见该路由的文档注释）。
 *
 * 没跑过那个脚本时 static/fonts/ 是空的，这两个 url() 请求就是普通
 * 404，浏览器直接用下面 --font-serif/--font-sans 里排在后面的系统
 * 字体栈——不影响页面渲染，只是不是自托管版本。 */
@font-face {
  font-family: "Noto Serif SC";
  src: url("/fonts/serif.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Noto Sans SC";
  src: url("/fonts/sans.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ── 颜色 ────────────────────────────────────────────────
 * 两套，同一族（冷蓝灰 + 青）：白天是「晨雾」，夜里是「夜雾」。
 * 这条走过三轮：原本写的是「只有浅色」→ 2026-09 改版整个翻成深色的
 * 「萤火」（暖黄）→ 加回浅色时定的是冷调的晨雾，于是深色也跟着调成同族。
 * 规矩没变的那一条：**颜色只在这一个文件里，换主题 = 换这个文件。**
 *
 * 两个层次，顺序不能乱：
 *   1. `:root` 是晨雾，也是**默认**——什么都没选过就是白天，
 *      刻意不跟随系统的 `prefers-color-scheme`：这是一个人的站，
 *      站长要它默认什么样就什么样，不该由访客的系统设置替他决定。
 *   2. 用户在页头点过那个按钮 → `data-theme` 说了算（存 localStorage）。
 *
 * 每个值都量过 WCAG AA（正文 4.5:1）。
 * 晨雾：ink 对 bg 13.03 / 对 surface 14.26；muted 对 bg 5.60 / 对 surface 6.13
 *       / 对 accent-tint 5.16；accent 对 bg 6.38 / 对 surface 6.99
 *       / 对 accent-tint 5.89；sec 对 bg 5.52 / 对 sec-tint 5.11
 * 夜雾：ink 对 bg 12.53 / 对 surface 10.68；muted 对 bg 6.46 / 对 surface 5.50
 *       / 对 accent-tint 5.51；accent 对 bg 8.03 / 对 surface 6.85
 *       / 对 accent-tint 6.85；sec 对 bg 6.35 / 对 sec-tint 5.38
 *
 * **强调色两套必须分别配，不能拿同一个色调明暗**——亮底和暗底对它的
 * 要求正相反，同一个值不可能在两边都过 AA。 */
:root {
  --bg: #EFF2F4;        /* 晨雾 */
  --surface: #FBFCFD;   /* 卡片：比底色亮一档 */
  --ink: #1F2A31;       /* 墨：文字与年轮线 */
  --muted: #556269;     /* 次要文字 */
  --line: #DDE3E7;      /* 分隔线 */
  --accent: #1E5F70;    /* 青：此刻、选中、重点。用得极少才有力量 */
  --sec: #4D6472;       /* 蓝灰：分类这类次要强调 */
  --sec-tint: #E3EAEE;  /* 蓝灰的浅底 */
  --accent-tint: #DEEBEE; /* 青的浅底：选中的筛选项用它，不做成实心色块 */
  /* 整页的底：上浅下深的一条渐变，不是平涂。钉住的页头也铺这一张，
     两层都是 `fixed`（锚在视口上），所以永远严丝合缝、看不出接缝。 */
  --page-bg: linear-gradient(180deg, #F6F8F9 0%, #EFF2F4 46%, #E4E9ED 100%) fixed;
  /* 首页背景里的三层远山。颜色随主题走，所以放在这儿而不是 ring.css。 */
  --hill-1: #E1E7EB;
  --hill-2: #D9E0E5;
  --hill-3: #CFD8DE;
  --fly-max: 0.42;      /* 白天的那些光点：比夜里淡一档，不然像实心的沙粒 */
  /* 让浏览器自带的那些东西（滚动条、日期选择器、表单控件）也跟着走 */
  color-scheme: light;
}

:root[data-theme="dark"] {
  --bg: #1E262B;        /* 夜里的雾 */
  --surface: #27323A;
  --ink: #E3E9EC;       /* 冷白 */
  --muted: #9DAAB2;
  --line: #33414A;
  --accent: #7FC6D9;
  --sec: #93AAB8;
  --sec-tint: #25333B;
  --accent-tint: #22333A;
  --page-bg: linear-gradient(180deg, #222C32 0%, #1E262B 46%, #171E23 100%) fixed;
  --hill-1: #1B242A;
  --hill-2: #172026;
  --hill-3: #141B20;
  --fly-max: 0.9;
  color-scheme: dark;
}

:root {
  /* ── 字体 ────────────────────────────────────────────────
   * 自托管 + 中文子集化，见上面的 @font-face。等宽字体没有自托管：
   * 代码块里几乎全是 ASCII，为它切一遍 CJK 字体划不来。 */
  --font-serif: "Noto Serif SC", "Songti SC", "SimSun", "Noto Serif CJK SC",
                Georgia, serif;
  --font-sans: "Noto Sans SC", system-ui, -apple-system, "PingFang SC",
               "Hiragino Sans GB", "Noto Sans CJK SC", "Microsoft YaHei",
               sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
               "Liberation Mono", monospace;

  /* ── 字号 ──────────────────────────────────────────────── */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: 2.25rem;

  --leading-body: 1.85;   /* 中文正文需要比西文松 */
  --leading-tight: 1.35;

  /* ── 间距 ──────────────────────────────────────────────── */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* ── 其他 ──────────────────────────────────────────────── */
  --radius: 8px;
  --radius-sm: 4px;
  --measure: 34em;        /* 正文宽度，约 66–68 个西文字符 */
  --tap: 44px;            /* 可点击区域下限（第 10 节：手机优先） */
  --header-h: 6rem;       /* 钉住的页头大致多高：侧栏和目录靠它让位 */
}
