# Workspace Page Overrides

> **PROJECT:** XK Admin
> **Generated:** 2026-08-11 14:59:17（人工校准：对齐 Vben 主题变量）
> **Page Type:** Dashboard / Workbench（角色差异化工作台）

> ⚠️ **IMPORTANT:** Rules in this file **override** the Master file (`design-system/MASTER.md`).
> 本页规则以 **Vben 主题 CSS 变量** 为唯一色源，Master 中写死的 hex 色板对本页 **不适用**。

---

## Page-Specific Rules

### Color Overrides（强制，亮/暗双主题）

一律使用 Vben 语义变量，禁止写死 hex：

| 用途 | 变量 |
|------|------|
| 页面/卡片背景 | `hsl(var(--background))` / `hsl(var(--card))` |
| 次级底色 | `hsl(var(--muted) / 0.25)` |
| 主文字 | `hsl(var(--foreground))` |
| 次要文字 | `hsl(var(--muted-foreground))` |
| 边框/分割线 | `hsl(var(--border))` |
| 强调/选中/hover | `hsl(var(--primary))`、`hsl(var(--primary) / 0.1)` |
| 警示 | `hsl(var(--warning))`、`hsl(var(--destructive))` |

角色配置的 accent color 仅用于图标点缀，暗色下加透明度（如 `color-mix` 或 opacity 0.85）。

### Typography Overrides

- 不引入 Fira Code / Google Fonts，沿用项目现有字体栈
- KPI 数字：`text-2xl font-semibold`；标签：`text-xs text-muted-foreground`

### Layout Overrides（Dense Workbench）

- 不使用 Master 的 Horizontal Scroll Journey；采用纵向密集布局：
  1. 紧凑问候条（头像 40px，单行）
  2. 快捷入口卡（搜索框 + 密集网格：桌面 6~8 列 / 移动 4 列）
  3. 角色 KPI 摘要条（stat chips，横向 wrap）
  4. 公告紧凑列表
- 区块间距 `gap-4`（16px），卡片内 padding `p-4`
- 快捷入口单元：图标 20px + 单行标题 12px，`py-3`，禁止旧版 `w-1/3 py-8` 大卡

### Component Overrides（Premium Elegant 视觉语言）

参考 ui-ux-pro-max「Liquid Glass / Premium」方向做克制版（管理台不牺牲可读性）：

- **卡片壳**：圆角 12px；边框 `hsl(var(--border)/0.7)`；柔和双层阴影 `0 1px 2px + 0 8px 24px（primary 低透明）`；hover 轻抬升 `translateY(-1px)`
- **问候头**：primary 色相柔和渐变底 + 右上装饰性模糊光斑（`blur(64px)`、低透明度，暗色自动柔化）；头像带 2px primary/20 光环
- **快捷入口单元**：图标坐 40px 圆角容器（`hsl(var(--primary)/0.1)` 底色），hover 抬升 + 图标容器变实色；200ms `cubic-bezier(0.4,0,0.2,1)`
- **KPI 卡**：左上小图标（tinted 容器）+ 大数字 + 小标签；hover 抬升 + 边框透出 primary
- **公告行**：圆点/图标前缀，hover 整行 `hsl(var(--muted)/0.4)` 底色
- 搜索框 antd `Input` allowClear 圆角 8px，聚焦态跟 `--primary`
- 空态文案 `text-muted-foreground`
- 动效统一 200ms；`prefers-reduced-motion: reduce` 时关闭 transform 动效
- 禁止：彩虹渐变/iridescent、重 backdrop-filter 大面积使用（性能与对比度）、Google Fonts 引入

---

## Interaction Rules

- 搜索输入即过滤（本地），Enter 跳转第一条结果
- 所有可点击元素 `cursor-pointer`，键盘 focus 可见
- 遵守 `prefers-reduced-motion`

---

## Pre-Delivery Checklist（本页）

- [ ] 亮色 + 暗色主题各自检查一遍对比度
- [ ] 无写死 `#fff` / `#000` / `#0f172a` 等色值
- [ ] 375px / 768px / 1024px / 1440px 响应式
