样式、主题与代码风格

完整 UI 规范（token、组件语义、三态、文案、反例清单）见设计规范 · 共享核心，机器校验由 pnpm lint 里的 scripts/lint-design.mjs 承担。本页只列常用速查。

样式

使用 shadcn-vue 语义色（bg-primary、text-muted-foreground 等），禁止硬编码色值。已有 text-success / text-warning / text-info、bg-console 等 token。

一屏最多两级表面（base → card），禁止卡片套卡片；子分组用分隔线 + 标题 + 间距。
边框统一 1px hairline（border），不要混用 border-border；除浮层外禁止 rounded-xl。
bg-console 必须配 text-console-foreground*，否则深色底上文字不可读。
焦点环唯一写法：focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/60。
工具页每个功能模块用 @/components/tool/Panel 包裹，不要裸露模块或在 Panel 内叠卡片。

只允许 @lucide/vue（lucide-vue-next 已弃用，勿再引入）。

prettier：单引号、100 列、尾逗号 es5。提交前跑：

pnpm format

src/components/ui/** 是 shadcn-vue CLI 生成物：可改样式，勿改结构 / 逻辑。

主题色：设置页可切 6 档；新增自定义色需同步三处： assets/index.css 的 accent class → core/theme 的 ACCENTS → index.html 防闪白脚本。
默认主题色 / 默认主题：改 core/theme/index.ts 的 DEFAULT_ACCENT / DEFAULT_THEME （pnpm scaffold 也可交互式设置）。
根字号：设置页三档（小 13 / 正常 14 / 大 15），全部 UI 等比缩放；档位刻度定义见 assets/index.css 的注释表。
暗色基调：默认暗色（深空蓝灰），亮色同步维护；修改色板对照 index.css 中 :root / .dark 两段及 core/theme 的 NATIVE_BG（原生窗口底色）。