无间隙界面（No Slop UI）

无冗余 UI 您正在为人类受众构建 UI。目标是功能性、诚实、干净的，不要给人留下深刻印象，不要夸张。正常。如果一个设计决定感觉像容易的 AI 默认设置 —— 它可能就是这样。选择更难、更干净的选项。在编写任何 UI 代码之前，请阅读 references/banned-patterns.md 以获取完整的禁止列表。当您需要选择颜色时，请阅读 references/colour-palettes.md。

标准 思考线性。Raycast、Stripe、GitHub 不会试图吸引注意力，它们只是有效。正常的样子是什么： 侧边栏：240–260px 固定、实心背景、1px 右边框。没有浮动 shell，没有圆角。 卡片：8–12px 半径最大，细微的 1px 边框，阴影最大 0 2px 8px rgba(0,0,0,0.08)。没有发光，没有浮动。 按钮：实心填充或简单边框，6–10px 半径最大。没有药丸形，没有渐变色。 排版：清晰的层次结构，14–16px 正文，系统字体或单一无衬线字体。没有混合衬线/无衬线字体。 间距：4/8/12/16/24/32px 缩放。保持一致性，没有随机间隙。 边框：1px 实心，细微的颜色。没有厚的装饰边框，没有渐变边框。 过渡：100–200ms ease。仅不透明度或颜色。没有弹跳，没有变换。 输入：实心边框，简单焦点环。标签在字段上方。 图标：16–20px，单色或细微的颜色，没有装饰背景。

颜色优先 首先使用现有的项目颜色 —— 请阅读 Tailwind 配置或 CSS 变量。如果没有调色板 —— 请从 references/colour-palettes.md 中选择。永远不要随机发明颜色组合。

堆栈特定说明 shadcn/ui + Tailwind：使用 shadcn 组件原样 —— 不要重新发明已经存在的东西 尊重现有的 CSS 变量系统 (--background, --foreground, --primary 等) 除非有明确的产品原因，否则不要覆盖组件默认值 纯 HTML 仪表板：单文件是可以的 —— 保持自包含 使用 CSS 自定义属性进行主题设置 除非绝对必要，否则没有外部 CDN 依赖

硬性规则 没有浮动玻璃形态面板 没有渐变背景作为装饰 没有过大的圆角（20px+ 每个地方） 没有眉毛标签 (SECTION LABEL 在标题上方) 没有英雄部分在内部仪表板中 没有装饰性复制 ("Operational clarity without the clutter") 没有度量卡网格作为默认仪表板布局 没有填充空间的假图表 没有变换动画在悬停时 没有 Segoe UI、Trebuchet MS、Arial 字体栈 没有通过 ::before 伪元素的状态点 没有导航徽章，除非它们携带真实数据 没有药丸形按钮到处都是 没有戏剧性的盒子阴影（24px+ 模糊） 没有混合对齐（一些左对齐，一些浮动居中） 完整的禁止列表和示例：references/banned-patterns.md