# App Template — 设计方向 脚手架视觉基线:**深空工业中控终端**。不绑定具体产品叙事;下游可在此 palette / type 上换肤,但 **`@app/design-tokens` 色板 token 路径约定不变**(改值可以,改结构需同步全局)。 ## Style anchor 深色工业 HUD / 控制台:近黑底、信号黄强调、发丝线框、等宽铭牌。 ## Palette | 角色 | 值 | |------|-----| | 背景(近黑) | `#0E0F0E` | | 表面 | `#191919` | | 下沉 | `#121212` | | 线框 | `#2E2E2E` | | 线框(强) | `#35373C` | | 墨色 | `#F2F2F2` | | 弱化文字 | `#999999` | | 更弱文字 | `#666666` | | 强调(信号黄) | `#FFFA00` | | 信号绿 | `#00FFA2` | | 信号品红 | `#FF1AAC` | | 亮色背景(对照) | `#FAFAFA` | ## Typography - Display:`Space Grotesk` + `Noto Sans SC` 900 - 正文 CJK:`Noto Sans SC` / `PingFang SC` - 等宽:`JetBrains Mono`(编号、快捷键、路径、状态读出) - 字阶:10–11px 铭牌 / 13–14px 正文 / 28–48px 标题;标签全大写 + `0.16–0.22em` 字距 ## Layout - 左侧固定竖栏(品牌 + 导航 + 主题) - 内容壳 + 顶栏;分隔用点线 `u-dotline` / 虚线 - 按钮 `u-btn`;卡片 `u-card`;间距 4px 节奏;小圆角 3–12px - **克制装饰**:禁贴纸堆叠;色彩以 tokens 为准 ## Interaction - 主题:系统 / 亮 / 暗(`app-theme`) - 语言:cookie `app-lang` + Accept-Language - SSR 输出结构与内容;动效只在浏览器 effect 内绑定 - 尊重 `prefers-reduced-motion` ## 范围 `tokens.css` · `globals.css` · `AppLayout.astro` · `ThemeSwitch` · `UserMenu` · `home` / `dashboard` 视图 · `ui/*`