主题系统
Design Token 驱动的主题系统，切换主题时所有元素（标题、代码块、图表、表格）同步变化。
切换主题
- 编辑器顶栏点击当前主题名称 → 下拉选择任意主题 → 预览区实时更新
- 深色 / 浅色模式：点击顶栏月亮 / 太阳图标切换，每套主题均有独立深色版本
内置主题列表
| 主题名 | 风格 | 强调色 | 适合 |
|---|---|---|---|
| Default | 现代简洁 | 蓝色 | 通用 |
| Tech Blog | 技术博客 | 紫色 + 深色代码块 | 开发者 |
| Academic | 学术论文 | 青色 + 衬线字体 | 研究者 |
| Minimal | 极简 | 灰黑 | 写作者 |
| Magazine | 杂志感 | 红色 + 展示字体 | 内容创作者 |
| FT Pink | 金融时报粉 | 粉色 | 财经写作 |
| New Yorker | 文学细衬线 | 深灰 | 人文博主 |
| Kinfolk | 北欧米白 | 暖色 | 生活方式 |
| Catppuccin | 暗色开发者 | Mocha 配色 | 开发者 |
| LaTeX Academic | 论文感 | 深蓝 | 研究者 |
| Wired | 科技媒体 | 黑色 | 科技评论 |
| 三联 | 中文人文 | 深棕 | 中文写作 |
Design Token 体系
每套主题由一组 Design Token 定义，切换主题本质上是切换一套 token 映射，所有渲染元素自动响应变化。
Primitive（原始层）
颜色色阶（gray.50–950、blue、red 等）、字体、字号、圆角等原始值
Semantic（语义层）
引用 Primitive 并赋予用途名称：text-primary、bg-surface、accent、border-primary；同时定义 light 和 dark 两套
Component（组件层）
绑定到具体渲染元素：code-block.header-bg、mermaid.node-bg、table.header-bg；从 Semantic 自动派生，可覆盖
Theme Studio
实时编辑 token、WCAG 对比度验证、导出 theme.json，打造专属主题。