feat: 统一全局 Header 结构

- 新增 AppHeader 组件（Logo + 台入口 + 用户状态）
- 新增 UserDropdown 组件（用户下拉菜单）
- 新增 AppLayout 布局组件
- 移除 SidebarBrand 和 SidebarUser 组件
- 修改各台页面，移除侧边栏中的品牌区和用户区
- 修改 HomePage，移除独立 header/footer
- 修改 Layout 组件，简化为 sidebar + content
- 账户设置改为弹框形式，不中断用户操作
- 更新 README.md 布局系统说明
- 同步 delta specs 到主 specs

openspec/specs/layout-system/spec.md

@@ -1,15 +1,25 @@
-## ADDED Requirements
+## Purpose
+布局系统提供应用级外壳布局、聊天页面布局、管理台布局等核心页面骨架。
+
+## Requirements
 
 ### Requirement: 应用外壳布局
-布局系统 SHALL 提供应用级外壳布局，包含侧边栏、顶部栏、主内容区。
+布局系统 SHALL 提供应用级外壳布局，包含全局头部、可选侧边栏、主内容区。
 
 #### Scenario: 基础应用布局
 - **WHEN** 开发者需要管理控制台布局
-- **THEN** 系统 SHALL 提供 `.app-shell` 类，包含 `.app-shell__sidebar`、`.app-shell__header`、`.app-shell__main` 区域
+- **THEN** 系统 SHALL 提供 `.app-layout` 类，包含 `.app-layout__header`、`.app-layout__sidebar`（可选）、`.app-layout__main` 区域
 
-#### Scenario: 侧边栏结构
-- **WHEN** 侧边栏需要品牌区、导航区、用户区
-- **THEN** 系统 SHALL 提供 `.sidebar__brand`、`.sidebar__nav`、`.sidebar__user` 元素类
+#### Scenario: 全局头部
+- **WHEN** 页面需要统一导航
+- **THEN** 系统 SHALL 在 `.app-layout__header` 区域渲染 `AppHeader` 组件
+- **AND** 头部固定在页面顶部
+
+#### Scenario: 侧边栏可选
+- **WHEN** 页面需要侧边栏（如工作台、开发台、管理台）
+- **THEN** 系统 SHALL 渲染 `.app-layout__sidebar` 区域
+- **WHEN** 页面不需要侧边栏（如主页）
+- **THEN** 系统 SHALL 不渲染侧边栏区域
 
 #### Scenario: 导航项
 - **WHEN** 侧边栏需要导航菜单
@@ -27,16 +37,13 @@
 - **WHEN** 导航项需要文本和额外信息
 - **THEN** 系统 SHALL 提供 `.nav-item__text` 和 `.nav-item__meta` 元素类
 
-#### Scenario: 顶部栏结构
-- **WHEN** 顶部栏需要左侧标题区和右侧操作区
-- **THEN** 系统 SHALL 提供 `.header__left`、`.header__right` 元素类
-
 ### Requirement: 聊天页面布局
-布局系统 SHALL 提供聊天页面专用布局。
+布局系统 SHALL 提供聊天页面专用布局，侧边栏不包含品牌区和用户区。
 
 #### Scenario: 聊天布局容器
 - **WHEN** 开发者需要聊天界面布局
-- **THEN** 系统 SHALL 提供 `.chat-layout` 类，包含 `.chat-layout__header`、`.chat-layout__sidebar`、`.chat-layout__content`
+- **THEN** 系统 SHALL 提供 `.chat-layout` 类，包含 `.chat-layout__sidebar`、`.chat-layout__content`
+- **AND** 侧边栏不包含品牌区（`.sidebar-brand`）
 
 #### Scenario: 会话列表
 - **WHEN** 侧边栏需要展示会话列表
@@ -46,12 +53,23 @@
 - **WHEN** 需要展示消息和输入区
 - **THEN** 系统 SHALL 提供 `.chat-content__messages` 和 `.chat-content__input` 区域
 
+#### Scenario: 侧边栏不含用户区
+- **WHEN** 聊天页面侧边栏渲染时
+- **THEN** 系统 SHALL 不显示用户状态区域
+- **AND** 用户状态统一在全局头部显示
+
 ### Requirement: 管理台布局
-布局系统 SHALL 提供管理台页面布局。
+布局系统 SHALL 提供管理台页面布局，侧边栏不包含品牌区和用户区。
 
 #### Scenario: 管理台侧边栏
 - **WHEN** 管理台需要独立导航结构
 - **THEN** 系统 SHALL 提供 `.admin-layout` 类，包含 `.admin-layout__sidebar` 和 `.admin-layout__content`
+- **AND** 侧边栏不包含品牌区（`.admin-sidebar-header`）和用户区（`.admin-sidebar-user`）
+
+#### Scenario: 侧边栏不含用户区
+- **WHEN** 管理台侧边栏渲染时
+- **THEN** 系统 SHALL 不显示用户状态区域
+- **AND** 用户状态统一在全局头部显示
 
 ### Requirement: 页面内容区
 布局系统 SHALL 提供标准化的页面内容容器。

openspec/specs/unified-header/spec.md

@@ -0,0 +1,111 @@
+## Purpose
+统一的全局导航头部，包含品牌标识、台入口切换和用户状态管理。
+
+## Requirements
+
+### Requirement: 统一导航头部
+系统 SHALL 提供统一的全局导航头部组件，包含品牌标识、台入口切换和用户状态。
+
+#### Scenario: 头部基础结构
+- **WHEN** 页面需要显示导航头部
+- **THEN** 系统 SHALL 提供 `AppHeader` 组件
+- **AND** 组件包含左侧品牌区和右侧功能区
+
+#### Scenario: 品牌区展示
+- **WHEN** 用户查看头部左侧
+- **THEN** 系统 SHALL 显示 Logo 图标和 "GrandClaw" 标题
+- **AND** Logo 使用 `.sidebar-logo-icon` 样式类
+
+### Requirement: 台入口切换
+系统 SHALL 在头部提供三个台的入口导航，支持切换确认和高亮状态。
+
+#### Scenario: 台入口展示
+- **WHEN** 用户查看头部右侧
+- **THEN** 系统 SHALL 显示"工作台"、"开发台"、"管理台"三个入口
+- **AND** 每个入口包含图标和文字
+
+#### Scenario: 当前台高亮
+- **WHEN** 用户在某个台内（如工作台）
+- **THEN** 系统 SHALL 为当前台入口添加高亮样式
+- **AND** 其他台入口保持默认样式
+
+#### Scenario: 台切换确认
+- **WHEN** 用户点击非当前台的入口
+- **THEN** 系统 SHALL 显示确认对话框
+- **AND** 对话框提示"切换到[台名称]？"
+- **AND** 用户确认后执行跳转
+
+#### Scenario: 台入口路由
+- **WHEN** 用户确认切换
+- **THEN** 系统 SHALL 跳转到对应的路由
+- **AND** 工作台路由为 `/console`
+- **AND** 开发台路由为 `/developer`
+- **AND** 管理台路由为 `/admin`
+
+### Requirement: 用户状态区域
+系统 SHALL 在头部右侧显示当前用户状态，支持已登录和未登录两种状态。
+
+#### Scenario: 已登录状态展示
+- **WHEN** 用户已登录
+- **THEN** 系统 SHALL 显示用户头像、用户名和下拉图标
+- **AND** 头像使用 `user-avatar` 样式类
+
+#### Scenario: 未登录状态展示
+- **WHEN** 用户未登录
+- **THEN** 系统 SHALL 显示"登录"按钮
+- **AND** 点击后跳转到登录页
+
+### Requirement: 用户下拉菜单
+系统 SHALL 提供用户下拉菜单，包含账户设置和退出登录选项。
+
+#### Scenario: 下拉菜单展开
+- **WHEN** 用户点击用户状态区域
+- **THEN** 系统 SHALL 展开下拉菜单
+- **AND** 菜单包含"账户设置"和"退出登录"选项
+
+#### Scenario: 账户设置入口
+- **WHEN** 用户点击"账户设置"
+- **THEN** 系统 SHALL 打开账户设置弹框
+- **AND** 下拉菜单收起
+- **AND** 弹框宽度为 720px
+- **AND** 弹框内按钮靠右对齐
+
+#### Scenario: 退出登录
+- **WHEN** 用户点击"退出登录"
+- **THEN** 系统 SHALL 执行退出操作
+- **AND** 跳转到登录页
+
+#### Scenario: 点击外部关闭
+- **WHEN** 下拉菜单展开时
+- **AND** 用户点击菜单外部区域
+- **THEN** 系统 SHALL 收起下拉菜单
+
+### Requirement: 头部移动端适配
+系统 SHALL 在移动端适配头部布局，将台入口收起到汉堡菜单。
+
+#### Scenario: 移动端台入口收起
+- **WHEN** 屏幕宽度小于 768px
+- **THEN** 系统 SHALL 隐藏台入口的直接显示
+- **AND** 显示汉堡菜单按钮
+
+#### Scenario: 移动端菜单展开
+- **WHEN** 用户点击汉堡菜单按钮
+- **THEN** 系统 SHALL 展开移动端菜单
+- **AND** 菜单包含三个台入口选项
+
+#### Scenario: 移动端用户状态保留
+- **WHEN** 屏幕宽度小于 768px
+- **THEN** 系统 SHALL 保持用户状态区域可见
+- **AND** 用户状态不收起到汉堡菜单中
+
+### Requirement: 头部布局路由控制
+系统 SHALL 通过路由配置控制头部的显示与隐藏。
+
+#### Scenario: 需要 Header 的页面
+- **WHEN** 用户访问主页、工作台、开发台、管理台
+- **THEN** 系统 SHALL 显示统一头部
+
+#### Scenario: 不需要 Header 的页面
+- **WHEN** 用户访问登录页
+- **THEN** 系统 SHALL 不显示头部
+- **AND** 页面使用独立布局