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

docs/写作指南.md

@@ -88,19 +88,41 @@ https://astro.build/
 
 正文里可用 `<span class="…">` / `<p class="…">` 做**受限**排版。构建期有白名单过滤：**只放行下表类名，其它 class 与 `style`、`on*` 属性一律被剥离**（防注入 + 保护灰阶骨架）。
 
+### 颜色类（全部实测亮暗对比度 ≥4.5:1）
+
 | 类名 | 作用 |
 |---|---|
-| `ink-1` / `ink-2` / `ink-3` | 指定灰阶层（正文/次要/更淡） |
+| `ink-1` / `ink-2` / `ink-3` | 指定灰阶层（标题/正文/次要） |
 | `ink-muted` | 最淡灰（注释感） |
-| `ink-accent` | 强调色（链接色，仅少量点缀） |
-| `font-serif` | 思源宋（书评正文族） |
-| `font-kai` | 霞鹜文楷（金句族） |
-| `font-sans` | 思源黑（UI/技术族） |
-| `font-mono` | 等宽族（标签/数值） |
+| `ink-faint` | 最淡**可读**档（再淡即不达 AA） |
+| `ink-warm` | 暖调正文（书评气质） |
+| `ink-cool` | 冷调正文（技术气质） |
+| `ink-accent` | 强调（链接色，少量点缀） |
+| `ink-accent-soft` | 弱强调（比强调淡一档） |
+
+### 字体类
+
+| 类名 | 作用 | 备注 |
+|---|---|---|
+| `font-serif` | 思源宋（书评正文族） | 自托管 |
+| `font-kai` | 霞鹜文楷（金句族） | 自托管 |
+| `font-sans` | 思源黑（UI/技术族） | 自托管 |
+| `font-mono` | JetBrains Mono（标签/数值） | 自托管 |
+| `font-song` | 宋体族 | ⚠️ 系统字体，**依赖访客设备** |
+| `font-kai-sys` | 楷体族 | ⚠️ 系统字体 |
+| `font-hei-sys` | 黑体族 | ⚠️ 系统字体 |
+| `font-fangsong` | 仿宋族 | ⚠️ 系统字体 |
+
+### 文学排版类（段落级）
+
+| 类名 | 作用 |
+|---|---|
 | `drop-cap` | 段落首字下沉（书评开篇） |
 | `quote-line` | 金句块（左侧竖线 + 文楷） |
 | `fig-cap` | 图注（居中小字） |
 
+> **系统字体类的前提**：`-sys` / `font-song` / `font-fangsong` 不下载任何字体文件，命中访客本机字体（macOS/iOS 有宋楷黑、Windows 有宋黑仿宋，Android 常缺楷仿宋）。**跨设备不保证一致**——要稳定请用自托管四族。
+
 ```markdown
 <span class="ink-muted">次要说明</span>
 <span class="font-kai">金句可以换文楷</span>
@@ -111,6 +133,11 @@ https://astro.build/
 - **颜色只能走上面这些类**（内部用 tokens，亮暗双态都可读）；写 `style="color:red"` 会被构建期剔除
 - 斜体就用普通 markdown `*斜体*`——行内强调，不会换行也不会居中
 
+### 后台可视化选择（推荐，不用写 HTML）
+
+后台编辑器里：**选中文字 → Insert 菜单 → 「排版（字体/颜色）」→ 面板里点一个类**，文字即被 `<span class="…">` 包住；点已套用的片段可改类，Backspace 可整体删除。
+面板里的两类与上表一一对应（字体 8 / 颜色 9），类清单单一事实源在 `public/admin/typography-classes.js`。
+
 ## 发布提醒
 
 - push main → webhook 自动构建发布（约 10 秒）