设计规则
在简要、项目的DESIGN.md文件以及正在使用的设计技能（通常为impeccable）未明确规定时，应用这些规则。若上述任一来源有明确指示，则以其为准。在第一次编辑UI或撰写评审/审核报告前阅读它们。
文案
- 控件的标签应命名其结果，且同一词语在整个流程中保持一致：例如，“发布”按钮产生“已发布”确认信息。
- 错误文本需说明失败原因及修复方法，使用产品自身的语气，不包含任何道歉。
- 在导航、英雄区和页脚中，每个意图只使用一个标签（选择“联系销售”或“与我们交流”，不要同时使用）。主按钮标签应在一行内，不超过三个单词。
- 标题和按钮遵循项目已有的大小写格式；新项目使用句子大小写。
- 每页使用一种语域：夸张和简洁的产品文案不要出现在同一屏幕上。
- 使用弯引号和撇号，真实的省略号（…），不出现长破折号（使用句号、逗号或冒号），每行最多一个中间点。
- 推荐语应控制在三行以内，并包含推荐人的姓名和职务。
- 交付前，完整阅读渲染页面上所有可见文本，包括Alt文本、空状态和页脚，并去除“空话”：那些只说明产品好处的句子。
当轴心可选时应避免的视觉元素
- 调色板：暖奶油色背景（接近#F4F1EA）搭配陶土色强调色（接近#D97757）（Claude自身界面颜色）；高端消费级组合#F5F1EA、#EFEAE0、#B08947、#B6553A、#9A2436、#1A1714；浅黑色（#0B0B0B、#111）代替纯黑。
- 排印：标题中一个单词通过斜体、粗细或颜色突出显示；全部大写的标签；链接和按钮文本后附加“→”；标签构建为“单词 — 片段”。
- 界面装饰：英雄区中的版本标签（V0.6、BETA）或版本页脚；滚动提示；语言、时钟或天气条；装饰性状态点或图像上的药丸；装饰性照片版权；类似“品牌. 动态. 空间.”的标语条；“安静地受到信任”。
- 数据：超过五项列表以行形式绘制，上下带边框；使用填充进度条比较数值。
说服类页面
- 英雄区：桌面宽度下标题不超过两行，支持文本不超过20个单词，主要操作无需滚动即可可见，文本元素不超过四个，顶部内边距不超过6rem，操作按钮下方无内容（无标语、信任条或定价提示）。
- 将标题放置于宽容器中，使用自适应大小（约为
clamp(3rem, 5vw, 5.5rem)），以便在任何宽度下容纳两到三行。 - 导航栏位于一行，高度64–72px，不超过80px。
- 每页最多一个跑马灯，且连续最多两个交替的图片/文本分块。
- 包含N项的Bento网格应恰好有N个单元格且无空单元格；使用紧凑排列时，检查各跨度在所有断点下是否完美交错。
- 明确访客在首次浏览后应记住的一件事，并使后续选择服务于该目标。
组件与细节
- 嵌套圆角：内半径 = 外半径 − 两者之间的间隙。
- 在一行卡片中，将每张卡片的操作固定到底部边缘，使按钮对齐；定价功能列表在每列中从相同高度开始。
- 斜体显示字体（带有降部）的行高设置为1.1或更高，并添加少量底部内边距，以避免裁剪。
- 正文段落使用
text-wrap: pretty，确保段落末尾不出现孤立的单词。 - 已访问链接在用户返回的内容（文档、文章列表）中显示不同样式。不要交付
href="#"的占位符。 - 可折叠侧边栏宽度为56–72px，DOM中保留其标签，目标元素大小为44×44px，在切换开关上设置
aria-expanded，在隐藏内容上设置inert。 - 全高部分使用
dvh或svh，绝不使用100vh。 - 任何宽度下均无水平滚动条。对动画或偏移元素使用
overflow-x: clip裁剪溢出内容；hidden会破坏粘性定位。 - 滚动关联效果使用CSS滚动驱动动画或IntersectionObserver实现，而非基于每次滚动事件或每帧写入框架状态。
- Viewport元标记允许缩放（无
user-scalable=no，无maximum-scale=1）。过渡效果应指定属性名称，而非使用transition: all。 - 公开网站应包含“跳转到内容”链接、自定义404页面、favicon、标题、meta描述和Open Graph标签，以及页脚中的法律链接。
- 保持CSS选择器特异性扁平化，检查节级规则（
.section）和组件规则（.cta）是否互相抵消内边距或外边距。
暗黑模式
- 在根元素上设置
color-scheme: dark，使表单控件和滚动条跟随主题。 - 正文文本为米白色（接近#E0E0E0，从调色板中取色），非纯白色。
- 强调色相对于亮色主题值降低10–20%饱和度。
评审与审核
将这些发现报告在设计技能本身的评审或审核结构中，它们不添加新的报告部分。
- 主干测试：针对每个页面，首次访问者能否说出这是什么网站、当前页面、主要区域有哪些、可供选择的操作、在结构中的位置以及如何搜索？三个或更少明确答案为高严重性发现。
- 好感度：起始值为70。隐藏定价或联系方式或强制导览扣15分；对输入格式过于严格（如拒绝在卡号中输入空格）或询问任务不需要的信息扣10分；每个模糊选项扣5分。报告分数及每项扣除。
- 第一印象：说出眼睛首先落到的三个事物，以及它们是否是重要的三个。
- 空话：报告页面的总字数以及其中属于空话的比例。
重设计
在替换现有网站外观之前，记录SEO基线（标题、meta描述、标题、已索引URL）。保留URL碎片、导航标签、表单字段名称及顺序、Logo、法律及同意文案、分析ID，除非用户同意更改。
变体、设计方案与字体
- 如果两个变体的标题可以互换而不引起注意，则它们过于接近；应将其中一个进一步差异化。
- 为查看设计方案中的细节，重新生成该部分并放大，而不是裁剪画板。
- 批量截图轮次覆盖375px、768px和1440px宽度。
- 通过针对性编辑失败部分的元素来修复已构建的页面；仅在重建时才重新生成整个文件。
- 确认每种字体的官方列表（Google Fonts、Fontshare或字厂），并从该来源获取URL；对于未确认的字体标记为“待定”，而不是猜测名称或URL。