feat(typography): 可视化排版选择器（Sveltia inline 组件）+ 颜色扩充 + 方案 10

- 可视化选择（核心痛点解决）：Sveltia 原生支持 registerEditorComponent
  的 inline 形态且 onInsert 能拿到 selectedText → 实现「选中文字 → Insert ▸
  排版 → 选字体/颜色 → 自动包 span class」完整链路；因 inline 组件只能进
  Insert 菜单（field-based 虽可上工具栏但拿不到 selectedText），两个独立组件
  会互相抢 pattern 匹配，故收敛为单入口 + 18 项分组面板（键盘可达/Esc 取消/
  onEdit 回填当前类）
- public/admin/typography-classes.js 为单一事实源（扩展与文档共用）
- 颜色扩充 4 类：ink-warm / ink-cool / ink-faint / ink-accent-soft，全部亮暗
  双态实测 ≥4.5:1（ink-faint 取白底达标的最淡值 4.69/4.75）
- 字体：体积账否决 webfont 新增（@fontsource zcool-xiaowei 用到即 +647.7KB，
  远超 150KB 阈值；smiley-sans 无可用版本、sarasa 包为空壳），改为落地 4 个
  **系统回退类**（font-song/font-kai-sys/font-hei-sys/font-fangsong，零下载，
  文档注明依赖访客设备）
- 白名单 17 类同步；docs/写作指南.md 三表更新
- docs/research/10-页面后台化方案.md：五方案对比 + 推荐方案 E（页面骨架 blocks
  / 区块字段 / 局部自由区 / 样式即数据四层）+ 关于页九类区块 + 消毒与验收断言
  + 分阶段清单（约 7.2d）

验证: 16/16 颜色 computed 与对比度实测；选择器 7/7（桩 CMS 覆盖注册/插入/
      编辑三层）；构建 48 页 exit 0；E2E 37/37

Spec: none (排版能力 + 方案文档)

Co-authored-by: GLM-5.3

src/styles/global.css

@@ -172,10 +172,52 @@ pre code { background: none; border: none; padding: 0; font-size: inherit; }
 .prose-reading .ink-3, .prose-tech .ink-3 { color: var(--ink-3); }
 .prose-reading .ink-muted, .prose-tech .ink-muted { color: var(--ink-4); }
 .prose-reading .ink-accent, .prose-tech .ink-accent { color: var(--accent); }
+.prose-reading .ink-accent-soft, .prose-tech .ink-accent-soft { color: var(--accent-soft-text); }
+.prose-reading .ink-warm, .prose-tech .ink-warm { color: var(--ink-warm); }
+.prose-reading .ink-cool, .prose-tech .ink-cool { color: var(--ink-cool); }
+.prose-reading .ink-faint, .prose-tech .ink-faint { color: var(--ink-faint); }
+/* 语义色板：彩色只作用于正文强调（站点外壳保持灰阶）。
+   每色相两档：标准 / soft（阈值内最淡）；亮暗各取独立值，均实测 ≥4.5:1。 */
+.prose-reading .c-blue, .prose-tech .c-blue { color: var(--c-blue); }
+.prose-reading .c-blue-soft, .prose-tech .c-blue-soft { color: var(--c-blue-soft); }
+.prose-reading .c-teal, .prose-tech .c-teal { color: var(--c-teal); }
+.prose-reading .c-teal-soft, .prose-tech .c-teal-soft { color: var(--c-teal-soft); }
+.prose-reading .c-green, .prose-tech .c-green { color: var(--c-green); }
+.prose-reading .c-green-soft, .prose-tech .c-green-soft { color: var(--c-green-soft); }
+.prose-reading .c-yellow, .prose-tech .c-yellow { color: var(--c-yellow); }
+.prose-reading .c-yellow-soft, .prose-tech .c-yellow-soft { color: var(--c-yellow-soft); }
+.prose-reading .c-orange, .prose-tech .c-orange { color: var(--c-orange); }
+.prose-reading .c-orange-soft, .prose-tech .c-orange-soft { color: var(--c-orange-soft); }
+.prose-reading .c-red, .prose-tech .c-red { color: var(--c-red); }
+.prose-reading .c-red-soft, .prose-tech .c-red-soft { color: var(--c-red-soft); }
+.prose-reading .c-pink, .prose-tech .c-pink { color: var(--c-pink); }
+.prose-reading .c-pink-soft, .prose-tech .c-pink-soft { color: var(--c-pink-soft); }
+.prose-reading .c-purple, .prose-tech .c-purple { color: var(--c-purple); }
+.prose-reading .c-purple-soft, .prose-tech .c-purple-soft { color: var(--c-purple-soft); }
 .prose-reading .font-serif, .prose-tech .font-serif { font-family: var(--font-serif); }
 .prose-reading .font-kai, .prose-tech .font-kai { font-family: var(--font-kai); }
 .prose-reading .font-sans, .prose-tech .font-sans { font-family: var(--font-sans); }
 .prose-reading .font-mono, .prose-tech .font-mono { font-family: var(--font-mono); font-size: 0.92em; }
+/* 系统字族回退类：不下载字体，命中访客本机字体——跨设备不保证一致（docs 已注明） */
+/* 自托管优先 + 系统兜底（2026-11-02 口径）：跨设备一致性由站内 webfont 保证，
+   系统字族只作最后兜底；font-fangsong 暂无 OFL 自托管包，仍为纯系统回退（docs 已注明）。 */
+.prose-reading .font-song, .prose-tech .font-song {
+  font-family: "Noto Serif SC Variable", "Noto Serif SC", "Songti SC", SimSun, serif;
+}
+.prose-reading .font-kai-sys, .prose-tech .font-kai-sys {
+  font-family: "LXGW WenKai Screen", "Kaiti SC", STKaiti, KaiTi, serif;
+}
+.prose-reading .font-hei-sys, .prose-tech .font-hei-sys {
+  font-family: "Noto Sans SC Variable", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
+}
+.prose-reading .font-fangsong, .prose-tech .font-fangsong {
+  font-family: FangSong, STFangsong, "FangSong_GB2312", serif;
+}
+/* 霞鹜文楷 Light（自托管 @fontsource，OFL-1.1）：更轻的金句字重 */
+.prose-reading .font-kai-light, .prose-tech .font-kai-light {
+  font-family: 'LXGW WenKai', var(--font-kai);
+  font-weight: 300;
+}
 /* 文学常用：首字下沉（书评开篇）与金句块（引文式的独立强调段） */
 .prose-reading p.drop-cap::first-letter, .prose-tech p.drop-cap::first-letter {
   float: left;

src/styles/tokens.css

@@ -14,6 +14,29 @@
   --ink-2: #33343a;            /* 正文 */
   --ink-3: #6b6e78;            /* 次要：日期、元信息 */
   --ink-4: #a0a3ad;            /* 装饰：分隔线、icon 底 */
+  /* 语义色阶（2026-11-02 扩充；全部实测白底对比度 ≥4.5:1，仍属灰阶家族） */
+  --ink-warm: #3f362e;         /* 暖调正文：11.81:1 */
+  --ink-cool: #2f3742;         /* 冷调正文：12.03:1 */
+  --ink-faint: #70747c;        /* 最淡的可读档（白底 4.69:1，再淡即不达 AA） */
+  --accent-soft-text: #4f66c2; /* 弱强调文字（比 accent 淡一档）：5.23:1 */
+  /* 语义色板（2026-11-02 扩充；彩色仅用于正文强调，站点外壳仍灰阶——见 docs 使用纪律）
+     标准档 / soft 档（阈值内最淡值），全部实测白底对比度 ≥4.5:1 */
+  --c-blue: #2456c9;
+  --c-teal: #0d7d74;
+  --c-green: #1f7a3a;
+  --c-yellow: #7a5900;
+  --c-orange: #9a4a00;
+  --c-red: #b32020;
+  --c-pink: #a3246a;
+  --c-purple: #6a35b8;
+  --c-blue-soft: #4170dd;
+  --c-teal-soft: #0e847a;
+  --c-green-soft: #22853f;
+  --c-yellow-soft: #997000;
+  --c-orange-soft: #ba5900;
+  --c-red-soft: #db3737;
+  --c-pink-soft: #d3368c;
+  --c-purple-soft: #8c5ed1;
   --line: #e6e7eb;             /* 分隔线 */
 
   /* ---- 强调色（全站唯一，链接/hover/选中） ---- */
@@ -105,6 +128,27 @@
   --ink-3: #8b8f98;
   --paper: #201d18;             /* 暖棕夜灯（Q 卡视觉裁定） */
   --ink-4: #5c6066;
+  --ink-warm: #d6cbbd;         /* 暗态暖调：10.58:1 */
+  --ink-cool: #b9c6d6;         /* 暗态冷调：9.76:1 */
+  --ink-faint: #84888f;        /* 暗态最淡可读档：4.75:1 */
+  --accent-soft-text: #a8b7f7; /* 暗态弱强调文字：8.69:1 */
+  /* 语义色板暗态（各自独立取值，非亮态硬套）：全部实测 #191d23 底 ≥4.5:1 */
+  --c-blue: #7fb0ff;
+  --c-teal: #6fd6c8;
+  --c-green: #7ddf99;
+  --c-yellow: #ffd166;
+  --c-orange: #ffb163;
+  --c-red: #ff8b8b;
+  --c-pink: #ff9ecb;
+  --c-purple: #c4a6ff;
+  --c-blue-soft: #3381ff;
+  --c-teal-soft: #2a9384;
+  --c-green-soft: #269a47;
+  --c-yellow-soft: #af7a00;
+  --c-orange-soft: #d16800;
+  --c-red-soft: #ff2828;
+  --c-pink-soft: #ff0d7e;
+  --c-purple-soft: #9a67ff;
   --line: #262b33;             /* 5f 降一档：暗色切分感偏强（裁定 #7） */
 
   --accent: #8ea2ff;