feat(agents): 新增 UI 设计师 Agent + Figma MCP + 设计存档 Skills

UI 设计师 Agent (.claude/agents/ui-designer.md):
- 自动判断设计复杂度
- 简单变更：直接输出文字规范，flutter-coder 立即实现
- 复杂设计：输出 Figma 设计需求文档并暂停，等用户确认设计稿
- 包含完整视觉规范（颜色、字体、间距、状态标签）

Figma MCP 配置 (.mcp.json):
- 接入 Figma 官方 MCP Server (https://mcp.figma.com/mcp)
- 支持读取设计文件、组件、Token

Skills (.claude/skills/):
- /archive-design：将确认上线的设计存档到 docs/design/archive/
  含 Figma 链接、设计决策、组件清单、版本历史
- /design-review：对比 Figma 设计稿与 Flutter 实现，输出还原度报告
  标注颜色/间距/布局差异，分必须修复和建议调整两级

更新 CLAUDE.md：
- 工作流中加入 ui-designer（架构后、编码前）
- 上线前运行 /design-review，上线后运行 /archive-design

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

.claude/skills/archive-design/SKILL.md

@@ -0,0 +1,152 @@
+---
+name: archive-design
+description: 将已确认上线的 Figma 设计稿存档到 docs/design/archive/。接收 Figma 文件链接，通过 Figma MCP 读取设计内容，自动整理并写入存档文档。在设计确认、功能上线后调用。
+allowed-tools: Read, Write, Glob, Grep
+user-invocable: true
+argument-hint: <figma-url> <功能名称> [版本号，默认v1]
+---
+
+# 设计存档工作流
+
+你正在执行 `/archive-design` 命令，将已确认的 Figma 设计存档。
+
+## 参数解析
+
+```
+$ARGUMENTS 格式：<figma-url> <功能名称> [版本]
+示例：https://figma.com/file/xxx 入库单 v1
+```
+
+从 `$ARGUMENTS` 中提取：
+- `FIGMA_URL`：Figma 文件链接
+- `FEATURE_NAME`：功能名称（用于目录和文件命名）
+- `VERSION`：版本号，未提供则默认 `v1`
+
+## 执行步骤
+
+### Step 1：读取 Figma 文件
+
+使用 Figma MCP 工具读取设计文件内容：
+- 获取所有页面列表
+- 获取主要页面的组件结构
+- 获取设计 Token（颜色、文字样式、间距）
+- 获取组件列表和说明
+
+如果 Figma MCP 不可用，跳过此步骤，仅记录链接和手动填写的信息。
+
+### Step 2：读取已有需求和架构文档
+
+读取以下文件，补充存档上下文：
+- `docs/requirements/{功能名称}.md`（如存在）
+- `docs/api/{功能名称}.md`（如存在）
+- `docs/design/{功能名称}-design-brief.md`（如存在）
+
+### Step 3：写入存档文档
+
+创建 `docs/design/archive/{功能名称}/{版本}/design-archive.md`：
+
+```markdown
+# {功能名称} — 设计存档 {版本}
+
+**存档时间**：{当前日期}
+**Figma 文件**：{FIGMA_URL}
+**状态**：✅ 已确认上线
+
+---
+
+## 设计概览
+
+### 页面清单
+
+| 页面名称 | Figma 画板 | 说明 |
+|---------|-----------|------|
+| （从 Figma 读取或手动填写）|
+
+### 核心设计决策
+
+（从 docs/design/{功能名称}-design-brief.md 中提取设计目标和关键决策）
+
+---
+
+## 设计规范
+
+### 颜色使用
+
+```yaml
+（从 Figma 读取，或按项目基础规范填写）
+主色:   #1565C0  用于：顶栏、主按钮、链接
+成功色: #2E7D32  用于：已审核状态标签
+危险色: #C62828  用于：删除操作、库存不足警告
+```
+
+### 组件清单
+
+```yaml
+（列出本功能使用的主要组件）
+复用现有组件:
+  - AppDataTable：通用数据表格
+  - StatusBadge：状态标签
+  - FormDialog：弹窗表单
+
+新增组件:
+  - （从 Figma 读取或手动填写）
+```
+
+### 关键尺寸
+
+```yaml
+（从 Figma 读取，或手动填写关键布局尺寸）
+弹窗宽度:   720px
+表格行高:   48px
+工具栏高:   52px
+```
+
+---
+
+## 交互说明
+
+（描述关键交互逻辑，如状态流转、操作确认弹窗等）
+
+---
+
+## 与需求的对应关系
+
+| 用户故事 | 设计实现 |
+|---------|---------|
+| （从需求文档提取，对应到具体设计页面）|
+
+---
+
+## 历史版本
+
+| 版本 | 时间 | 变更说明 |
+|------|------|---------|
+| {版本} | {当前日期} | 初始版本 |
+```
+
+### Step 4：更新设计索引
+
+在 `docs/design/archive/INDEX.md` 中追加一行记录（如文件不存在则创建）：
+
+```markdown
+# 设计存档索引
+
+| 功能 | 版本 | 存档时间 | Figma 链接 | 存档文档 |
+|------|------|---------|-----------|---------|
+| {功能名称} | {版本} | {日期} | [查看]({FIGMA_URL}) | [文档](/{功能名称}/{版本}/design-archive.md) |
+```
+
+### Step 5：完成提示
+
+输出：
+```
+✅ 设计存档完成
+
+📁 存档路径：docs/design/archive/{功能名称}/{版本}/design-archive.md
+🔗 Figma 链接：{FIGMA_URL}
+📋 索引已更新：docs/design/archive/INDEX.md
+
+下一步建议：
+- 运行 /design-review 对比实现与设计稿的差异
+- 提交存档文件到 git：git add docs/design/archive/
+```