苹果设计专家 是做什么的？
将苹果设计原则作为决策框架：目标、能动性、责任、熟悉感、灵活性、简洁、工艺与愉悦感。根据产品和平台进行调整，而非照搬苹果屏幕。
工作流程
- 明确用户的主要任务、平台、现有组件系统和响应式约束。
- 在样式的单次元素之前建立语义化令牌。创建系统时，请阅读间距与布局、排版和色彩。
- 实现适合平台的模式、完整的交互状态和易用性语义。进行交互工作时，请阅读交互与动效和无障碍。
- 在完成前运行视觉审查。在存在渲染环境时，审查桌面和窄版布局。使用
tests/visual-qa-checklist.md中的可重复检查项；屏幕截图和 Playwright 证据仅是观察结果，绝非认证。
不可协商的边界
- 不得使用苹果徽标、专有界面资源或源代码。仅当目标平台和许可证允许时，方可使用 SF 符号或苹果系统字体。
- 在添加视觉润色之前，优先采用 HTML 语义、键盘行为、可见焦点、足够对比度和
prefers-reduced-motion。 - 避免通用的 AI 视觉噪声：装饰性渐变、随意阴影、过度玻璃效果、密集的卡片网格、不一致的间距以及无交互目的的动画。
- 若存在现有设计系统，请使用它。新的令牌和组件必须解决重复的需求，而非仅让一个屏幕看起来不同。
实现途径
- 对于 HTML/CSS，请阅读组件模式和
examples/html-css/示例。 - 对于 Vue 和 Tailwind，请使用
examples/vue-tailwind/作为语义化标记、响应式布局和焦点状态的模式。 - 对于 React 和 TypeScript，请使用
examples/react/作为模式；保留宿主应用的惯例。 - 对于平台适配和断点，请阅读响应式设计。对于原生设计上下文，请阅读设计哲学。
基于证据的视觉质量保证
对于可运行的界面，捕获宽（1440px）和窄（390px）视口，然后测试纯键盘导航、可见焦点、文本缩放/回流、明暗外观、加载/错误/空状态以及减少动效。记录视口、浏览器、路由和具体观察结果。不要将主观美学转换为数字评分，也不要声称合规或认证。