用途
Focus.AI 品牌规范技能用于将 Focus.AI 的品牌指南应用到文档、演示文稿、网站及其他材料中。它提供一套完整的设计系统，供在制作 Focus.AI 相关材料时统一视觉与语气。
品牌架构
该技能支持两个子品牌：
- Focus.AI (Client)：面向服务、产品与客户工作。美学为编辑杂志风格，精致、自信。调色板为 Paper、Ink、Petrol、Vermilion。
- Focus.AI Labs：面向研究、实验与公开内容。美学为贝尔实验室研究报告风格，好奇、慷慨。调色板为 Paper、Void、Rand-Blue、Alert-Red。
选择原则：客户工作或销售服务使用 Client 品牌；分享学习成果或探索使用 Labs 品牌。
六项原则
- 网格优先：每个布局基于 12 列网格（编辑页面使用 3 列非对称变体），间距以 8px 为基础单位。
- 始终移动优先：先为 320px 设计，再扩展，系统化使用 sm:、md:、lg: 前缀。
- 留白即结构：充裕的内边距和外边距本身就是设计，而非浪费。
- 透明度创造层级：绝不引入第二种文字颜色来表示权重，而是对主文字颜色使用透明度。
- 最多两种强调色，克制使用：主强调色用于 CTA 和导航，次强调色仅用于装饰性高亮。
- 清晰优于装饰：每个元素都要有其价值，若不能帮助读者聚焦重点，则移除。
排版
- Display：Source Serif 4，用于封面标题、分页报告中的 H1、引文、统计数字。
- Sans：Inter，用于章节标题（h2–h4）、正文、UI、导航。
- Mono：Courier Prime，用于标签、元数据、代码、页码。
字重规则：标题使用 font-black (900) 或 font-bold (700) 并配合负字距；正文使用 font-normal (400) 或 font-medium (500)，行高 1.6；标签使用等宽字体、大写、宽字距。
颜色
Client 品牌：背景 Paper #faf9f6，主文字 Ink #161616，主强调色 Petrol #0e3b46，次强调色 Vermilion #c3471d，边框 #d4d3cf。
Labs 品牌：背景 Paper #f3f2ea，主文字 Void #1a1a1a，主强调色 Rand-Blue #0055aa，次强调色 Alert-Red #d93025，边框 rgba(26,26,26,0.2)。
绝不使用纯 #ffffff 或 #000000 作为背景。
透明度层级（核心规则）
通过降低透明度来弱化，绝不改变色相：
- 完整：text-[ink] → 主要内容
- 较柔：text-[ink]/70 → 次级标签、辅助文字
- 安静：text-[ink]/40 → 说明文字、元数据
- 幽灵：text-[ink]/20 → 禁用、占位符
间距
基础单位 8px，所有间距值为 8 的倍数。紧凑 8px（行内间隙、图标间距），默认 16px（组件内部间距），组件之间 32px，区块内边距移动/平板 48–64px，桌面 96–128px。
布局
两种布局模式：12 列网格（通用，Tailwind grid grid-cols-12 gap-8）；非对称编辑布局（[144px 标签] [1fr 内容，最大 740px] [192px 边注]）。正文最大宽度 60ch，绝不更宽。
渲染到文档与演示文稿
该技能只定义品牌，不定义文档渲染方式。渲染由两个独立的、品牌无关的技能负责：
- PDF / 可打印报告 / 杂志跨页：paged-reports，提供分页字号体系、调色板、封面处理。
- PowerPoint .pptx：pptx-decks，提供幻灯片调色板、字体映射。
两者从 references/design-system.md 的 "Output-Format Tokens" 读取品牌值。渲染 Focus.AI 材料时，使用这些技能并传入 client 或 labs 作为样式；品牌变更时只需修改本技能。
何时阅读参考文件
- 完整颜色令牌、字号体系、CSS 属性、深色模式：references/design-system.md
- 12 列网格、非对称布局、区块间距、装饰：references/grid-and-layout.md
- 移动优先断点、流体字号、响应式清单：references/responsive.md
- Tailwind 组件模式（按钮、卡片、导航、表单）：references/components.md
- 可直接粘贴的 Tailwind v3/v4 配置、Google Fonts 链接标签：references/tailwind-config.md
- 分页报告字号体系与幻灯片调色板：references/design-system.md
- AI 图像生成风格（文艺复兴、贝尔实验室）：references/imagery.md
- 语气与语调指南、反模式、示例转换：references/voice.md
- 发布前审计清单：references/checklist.md
注意事项
- 绝不使用纯白或纯黑，使用纸张色调和 ink/void。
- 标题绝不单独使用 font-bold，使用 font-black (900) 配合紧凑负字距。
- 正文最大 60ch，更宽的列会损害可读性。
- 区块内边距要充裕，最小 py-12 (48px)，标准 py-16–py-24 (64–96px)。
- 标签始终使用等宽字体：Courier Prime、大写、宽字距。
- 边框圆角要微妙：卡片/按钮 4–8px，大型容器绝不使用全圆角。
- 使用透明度而非灰色调：text-ink/70 而非 text-gray-500。
- 背景要温暖：即使深色模式也使用暖炭色，而非冷黑色。
- Source Serif 4 仅用于展示：绝不用于正文或 h2–h4，仅用于封面标题、分页报告中的 h1、引文、统计数字。
- 最多两种强调色：主色用于操作/链接，次色克制用于装饰性高亮。
- 每个布局都要在移动端可用：默认类为移动端，始终添加 md: / lg: 变体。