用途：在用户项目中直接编写生产级前端界面，强调明确的视觉方向，优先实现而非交付纯设计稿，除非用户明确只要设计。默认使用 Next.js，用户可指定其他框架。
主要能力与工作流：
- 安全检查：若项目使用 Next.js，先核对版本以应对 CVE-2025-55182。受影响范围包括 >=14.3.0-canary.77 且 <15.0.5、>=15.1.0-canary.0 且 <15.1.9、>=15.2.0-canary.0 且 <15.2.6、>=15.3.0-canary.0 且 <15.3.6、>=15.4.0-canary.0 且 <15.4.8、>=15.5.0-canary.0 且 <15.5.7、>=16.0.0-canary.0 且 <16.0.7。安全版本为 15.0.5、15.1.9、15.2.6、15.3.6、15.4.8、15.5.7 或同线更新补丁，16.0.7 或更新，15.6.0-canary.58+ 与 16.1.0-canary.12+；13.x 与 14.x 稳定版不受影响。版本不明时先升级到最新稳定版。
- 确认实现简报：收集交付物类型（页面、区块、流程、组件）、目标设备、框架与约束、所需状态与交互、品牌约束；仅在缺少必要信息时追问。
- 编码前确定设计方向：明确目的与受众、调性与美学、布局与层级策略、字体与色彩系统、动效策略，以及一个标志性差异元素；可加载 references/design-direction.md。
- 按需获取定向灵感：仅对确实需要参考的具体组件使用 21st.dev，不做大范围灵感搜集；需先确认截图与网页搜索能力可用，否则停止并按原文提示用户（截图不可用："This workflow requires screenshot capture for targeted component inspiration. Install the screenshot skill and retry."；搜索不可用则提示重启并开启搜索）；只采集最少参考，综合模式而非克隆；可加载 references/component-inspiration.md。
- 在项目代码中实现：优先复用现有组件与约定，保持响应式与可访问状态，避免通用化的 AI 风格结构、间距与样式默认值，保持视觉与既定方向一致。
- 验证与交付：对改动文件运行相关 lint/test/build 检查，验证响应式行为与关键交互状态，确认实现符合声明的方向；可加载 references/validation-checklist.md 做最终质量检查。
输出要求：最终回复需说明所选设计方向与标志性差异元素、使用了定向灵感的组件（如有）、所用框架、具体改动的文件、验证状态（已运行与未运行内容）。
适用场景：需要设计或重做前端界面的开发任务。限制：依赖截图与搜索能力用于定向灵感步骤；未提供其他平台、收费或效果信息。