Shell · 顶栏五段架构 Vue 化补强
范围：Phase 1-3（共 5 工作日）· 依赖：Phase 0 · 产出：Shell 顶栏五段插槽 + mode-switcher / stageToolbar 组件 + 全局单例引擎
Phase 列表
| Phase | 标题 | 工作日 | 关键产出 | 文档 |
|---|---|---|---|---|
| 1 | Shell 顶栏五段架构 Vue 化骨架 | 2d | StageBar.vue 五段 DOM 完整 · CSS grid 对齐 v4.3 demo | 10-topbar-5-segments.md（占位 · 待 Phase 0 后细化） |
| 2 | mode-switcher + stageToolbar 组件 | 2d | <ModeSwitcher> + <StageToolbar> Vue 组件 + Pinia useTopbarStore 接通 |
20-mode-switcher-stage-toolbar.md（占位） |
| 3 | 全局单例引擎按钮 + Shell 通用按钮组 | 1d | useEngineStore + ▶/■ toggle 按钮 + 跨 stage 共享 + 4 个 .topbar-ico-btn（🤖/🪟/🔒/🎨） |
30-engine-singleton.md（占位） |
验收里程碑
- ✅ Phase 1：5 段 DOM 槽位完整 · 视觉对齐 v4.3 demo · 类名匹配 codex.css
- ✅ Phase 2：切 stage 时 mode-switcher / stageToolbar 内容跟随刷新（数据驱动）
- ✅ Phase 3：XL 启动 ▶ → 切 XT 显示 ■（跨 stage 共享 _engineRunning 单例）
关联文档
- 上层契约：
v1.2-ide-architecture.md §13.1-§13.6 - 协议改造：
../00-baseline-alignment.md §3.2-§3.4 - v4.3 demo 视觉参考：
layout-demo/index.html
占位说明：Phase 1-3 的具体任务清单 / 接口契约 / 验收脚本将在 Phase 0 完成后基于其实际产出细化（避免过早写死）。