feat(translate): /translate 页 DeepL 风重设计 · V0.11

[bob798]

背景

/translate 页（Vue 3 版，V0.9.4）在功能与样式上均有可改进空间。当前问题：

1. 视觉粗糙（译文区 min-height 180px 大片空白、文本/结果视觉权重相同）
2. swap 按钮交互反直觉（把译文塞回输入框、清空译文）
3. 生词本与 V0.10 FSRS 脱节：已掌握/翻牌仍写 localStorage MASTERED_KEY，复习数据是孤岛
4. 缺学习闭环：未复用项目已有的 /practice/explain/* /ask/threads 能力

改版方向（已与产品确认）

• PC 端优先（与项目整体「移动优先」策略不同）
• 重构为 DeepL 风：左输入 / 右译文 / 右侧 sidebar 三栏
• 800ms debounce 自动翻译 + 前端 LRU cache + requestId stale-response 防御
• 译文单词 hover 出本地 IPA，click 调 LLM 完整解读
• 生词本接入 V0.10 FSRS（4 档评分），删除孤立 MASTERED_KEY
• 后端零改动，复用现有接口

设计文档

详见 PR (待补)：docs/superpowers/specs/2026-05-19-translate-deepl-redesign-design.md

设计阶段已请 codex 做过一轮独立 review，修订了 4 个 blocker（接口字段假设错、反向校验与 debounce 冲突、PR 拆分依赖）+ 7 项重要建议（并发安全、a11y、中文分词、去重坑等）。

实施 PR 计划

每个 PR 保证 ship 后页面可用，无半成品入口：

• PR 1 · 结构 + 翻译主流程：拆 5 个 SFC、三栏布局、debounce + cache + stale 防御 + AbortController、swap 修 bug、方向自动检测
• PR 2 · 单词交互：分词 + WordToken（a11y 键盘可达）+ hover IPA + click 词卡解读；暂不露 ⭐
• PR 3 · Sidebar 接通 FSRS + 收藏闭环：vocab 列表 + 4 档评分 + 单词/句子收藏 + 反向校验 + 历史 tab + 删 MASTERED_KEY
• PR 4 · 移动端 + QA：抽 BottomSheet.vue 共享组件 + 移动端 FAB/sheet + 手测全清单 + 回归

验收

• 桌面三栏布局、800ms 自动译、单词 hover/click、生词本 4 档评分、移动端 sheet a11y
• 详见 spec § 11 验收标准

不动的部分

• 后端 /translate/* /vocab/* /practice/explain/* 全部零改动
• static/translate.html（legacy /legacy/translate）
• 例外：会抽 frontend/src/components/BottomSheet.vue 并把 Practice/VoiceSettings 的 sheet 迁过来

🤖 Generated with Claude Code

[bob798]

Spec PR: #44 (docs only，合入后实施 PR1-4 引用本 issue + spec PR)