# Task 6: 开发 Canvas 2D 深空巡航实时玩法

## Agent: full-stack-developer

## 完成状态: ✅ 全部完成

## 创建的文件
1. `/home/z/my-project/src/lib/game/cruise.ts` — 逻辑层（~520 行纯 TS）
2. `/home/z/my-project/src/components/game/CruiseMode.tsx` — Canvas 2D 渲染层（~830 行）

## 修改的文件
1. `/home/z/my-project/src/app/page.tsx` — 新增巡航入口按钮 + CruiseMode 渲染

## 关键实现细节

### cruise.ts 逻辑层
- **类型系统**：CruiseEntity 联合类型（8 种实体：ship/asteroid/storm/crystal/insight/beacon/stargate/particle），完整 CruiseState/Phase/RunResult/Stats/Input
- **关卡生成**：mulberry32 + FNV-1a 种子化 RNG；陨石(8+level×2)、风暴(1+level/2)、晶体(5+level)、洞见(2+level/3)、信标(1+level/4)、星门；时长 60-90s
- **物理**：飞船 8 方向加速度+摩擦+限速+边界反弹；陨石碰撞扣盾+击退+600ms 无敌；风暴持续 DPS；收集物吸引半径 90px 自动吸入
- **奖励**：crystals=碎片×(8+lvl×2)、insights=洞见×(2+lvl×0.5)、contact=信标×(1.5+lvl×0.3)；通关×1.5、失败×0.5
- **localStorage**：独立 key `echo-nexus-cruise-v1`，记录最高分/通关数/最高关卡/累计奖励/最近 20 局

### CruiseMode.tsx 渲染层
- **全屏 Canvas**：fixed inset-0 z-50，DPR cap 2，resize 监听
- **3 层视差星空**：远/中/近 100/60/30 星，独立漂移+飞船速度视差+闪烁
- **实体辉光绘制**：全部使用 ctx.shadowBlur；飞船三角形+尾焰渐变；陨石不规则多边形；风暴 5 层云团+闪电；晶体菱形+脉冲环；洞见球体+漩涡；信标光束+旋转环；星门 4 层旋涡+吸入粒子
- **粒子系统**：尾焰/收集/碰撞/烟花，上限 200
- **屏幕震动**：受击 280ms 衰减抖动
- **低护盾警告**：shield<30% 屏幕边缘 rose 脉冲边框
- **HUD**：HTML 叠层（非 canvas），glass+backdrop-blur；护盾/能量/分数/用时/收集计数；80ms 节流更新
- **控制**：桌面 WASD/方向键；移动端 floating 虚拟摇杆；P 暂停；Esc 退出；失焦自动暂停
- **奖励同步**：结算时 grantCruiseReward + recordRun，rewardGrantedRef 防重

### page.tsx 集成
- header 按钮区新增「巡航」按钮（Navigation 图标，amber 主题）
- 新增 cruiseOpen state
- 组件末尾渲染 {cruiseOpen && <CruiseMode onClose={...} />}
- 未破坏现有 7 标签页和其他功能

## QA 验证结果
- ✅ lint 零错误
- ✅ 巡航按钮出现在顶部 header
- ✅ 点击进入全屏 Canvas，ready 界面完整
- ✅ WASD 控制飞船移动，按 W 直冲星门通关
- ✅ 收集 2 晶体 → 奖励 +30（2×10×1.5=30 计算正确）
- ✅ localStorage 正确记录 highScore/totalWins/bestLevel
- ✅ 奖励同步到 gameStore
- ✅ 退出返回主界面，7 标签页完好
- ✅ 移动端 viewport 测试通过

## 色彩遵循
emerald(#34d399) / rose(#fb7185) / amber(#fbbf24) / fuchsia(#e879f9) 四色全息色谱，零蓝色/靛色