feat: P2 Mobile CSS 变量对齐

- 新建 mobile/src/styles/variables.css — Design Token 变量定义
- App.vue — 使用 var(--muted) / var(--foreground) 替代硬编码
- sandbox/index.vue — 完整迁移参考页（品牌色/边框/文字/背景）
- docs/design-tokens.md — 更新 Mobile 迁移对照表

docs/design-tokens.md

@@ -118,10 +118,24 @@ page {
 
 ## Mobile (Vue) 迁移清单
 
-| 文件 | 问题 | 修复 |
+| 文件 | 状态 | 备注 |
 |------|------|------|
-| `App.vue` | `background-color: #f5f5f5` | 使用 CSS 变量 |
-| 所有页面 | 硬编码 `#333`/`#666`/`#999`/`#f5f5f5` | 替换为 `var(--foreground)` 等 |
-| 所有页面 | `#4f8cff` 品牌色 | 替换为 `var(--brand)` |
+| `mobile/src/styles/variables.css` | ✅ 新建 | 完整 Design Token CSS 变量定义 |
+| `mobile/src/App.vue` | ✅ 已修复 | 使用 `var(--muted)` / `var(--foreground)` |
+| `mobile/src/pages/sandbox/index.vue` | ✅ 已修复 | 参考页面，全部替换为 CSS 变量 |
+| 其余 16 个页面 | ⏳ | 按 sandbox 模式全局替换硬编码颜色 |
 
-> 此文档在 UI 变更时同步更新。Mobile 迁移见 P0b 跟踪。
+### Mobile 迁移对照表
+
+| 旧值 | 新值 |
+|------|------|
+| `#fff` / `white` | `var(--card)` |
+| `#f5f5f5` | `var(--muted)` |
+| `#333` | `var(--foreground)` |
+| `#666` / `#999` | `var(--muted-foreground)` |
+| `#4f8cff` | `var(--brand)` |
+| `#e0effe` | `var(--brand-light)` |
+| `#f0f0f0` / `#e5e5e5` | `var(--border)` |
+| `12rpx` border-radius | `var(--radius)` |
+
+> 此文档在 UI 变更时同步更新。