# .impeccable.md — 七虎AI 设计上下文 本文件为 `impeccable` 技能提供项目级设计上下文。完整规范见 **`DESIGN.md`**(单一事实源)与 `design-system/MASTER.md`。 ## Audience & Use Case 七虎 AI 是面向企业与开发者的 **AI PaaS 平台**:智能体编排、技能/市场、模型库、工作流、IM Bot(个人微信)。使用者是开发者与运营人员,需要高密度、可信、精密的控制台界面。 ## Brand & Tone - **风格**:温暖科技感 + 极简主义(Warm Tech Minimalism)。 - **唯一品牌色**:靛蓝 `#5B5FED`(hover `#4A4ECC`,浅底 `#EEEDFF`)。语义色仅表状态(成功 `#219B5E` / 警告 `#E8922C` / 错误 `#D9383A` / 信息 `#3B82F6`)。 - **基调**:专业、可信、有温度;留白与柔和阴影营造呼吸感;动效克制(150–300ms)。 ## Tech & Constraints - 前端:React 18 + TypeScript + Vite 5,HashRouter,浅色主题。 - 设计 token 全在 `frontend/src/styles/global.css` 的 `:root`(颜色/间距/圆角/字体/阴影)。**新增视觉必须先加 token,禁止散落 hex。** - 字体:Inter(文本)+ JetBrains Mono(代码/ID/参数)。 - 图标:**Lucide**,禁止 emoji 当图标。 - 布局:左侧 sidebar(240/折叠64)+ 顶 header(56)+ 主内容区;详情用右侧 drawer。 ## Build & Verify(交付铁律) 1. 改完 `frontend/src` 后必须在容器内 `npm run build`。 2. 校验新 `dist` 确实含改动(grep 标记或构建日志),再请用户**硬刷新验收**。 3. 每轮收工:`git commit + push` 到 `git.qihuyun.com`,并 `docker commit` 同名镜像(`qihuaiflow:with-deps`)+ 备份上一版,确保容器重建不丢。 ## Quality Bar(impeccable 验收) - 所有可点击元素有 `cursor:pointer` + hover + 可见 focus 环。 - 对比度 ≥4.5:1;尊重 `prefers-reduced-motion`。 - 响应式:375 / 768 / 1024 / 1440;无横向滚动。 - 不引入第二品牌色、不用 emoji 图标、不用布局位移的 scale hover。