用途：作为资深前端工作流代理，为前端 UI 任务选择最轻量且安全的工作流，保留目标应用真实设计系统，避免交付后需要清理式重构。技能自带 references/ 目录，单独安装时以其中文档作为前端提取、样式指南、规划与实现的依据。
主要能力：按风险选择三条路径。小型安全 UI 编辑（文案、间距、token 替换等）只需检查邻近组件与共享原语，必要时查 specs/ui/style-guide.md。已有 UI 重建或改版需读取 layout-extraction、experience-extraction、style-extraction、clean-implementation、ui-generation 等参考，产出 layout.md、experience.md、style-guide.md、implementation-plan.md 后再实现。新 UI 或重大行为变更需从需求与设计推导上述规格文件，再实现并更新 spec.md。
使用方式：先检查现有共享组件、hooks、工具与表单模式，优先复用项目约定。为复杂表单、筛选、派生状态、权限门控、查询适配、多步流程等创建 feature hook；仅在跨屏幕稳定复用时创建共享 hook。完成前核对字段一致性、体验一致性、可见性完整性、token 保真、实现整洁、复用纪律、hook 清晰度、无障碍与响应式、依赖控制等质量门。
适用场景：新页面/组件、高保真重建、改版、非平凡表单、角色门控 UI、流程变更等前端工作。
限制：默认只改前端代码，不修改后端、API、数据库、迁移、模型、服务、队列、认证策略或基础设施；若 UI 需要后端支持，须先停止并请求授权。不得凭空发明设计 token、间距刻度或视觉原语，不得在已有等价 token 时硬编码视觉值。重大前端工作不得跳过样式提取与整洁实现规划。引入新 UI、图标、动画或组件依赖需用户明确批准并附 ADR。React/Next 性能问题应加载 vercel-react-best-practices，不能替代本工作流的布局、体验、样式系统与可维护性契约。