用途：为前端项目生成工程规范文档 ./docs/FRONTEND_GUIDELINES.md，作为团队统一编码规则的依据。
前置读取：依次读取 ./docs/TECH_STACK.md（框架、CSS 方案、状态库、数据请求库）、./docs/DESIGN_SYSTEM.md（设计令牌名，用于示例）、./docs/APP_FLOW.md（需构建的页面）、progress.txt（项目类型，决定布局规则）。若 DESIGN_SYSTEM.md 缺失，则跳过令牌示例并注明「DESIGN_SYSTEM.md not found — update token references after generating it.」。
框架识别：按检测到的框架只读取对应的结构章节，支持 Next.js App Router、Next.js Pages Router、Vite + React、Remix、SvelteKit、Astro、Django Templates，未列出则用 Generic 结构。
生成步骤：写 Overview（框架、样式、状态、数据、表单、认证）；插入匹配的项目结构；写布局模板规则；写命名约定、组件架构与组件模板；按实际状态库写状态管理；按实际数据库写数据请求；再写表单处理、响应式设计、无障碍、测试、性能；保存到 ./docs/FRONTEND_GUIDELINES.md，显示前 20 行预览，运行验证清单，并询问是否批准或修改。
核心规则要点：页面只输出内容，不重复声明 header/footer/nav，布局外壳只放在 components/layouts/；每文件一个组件，PascalCase 命名，Props 接口名为 ComponentNameProps，始终接受 className 并用 cn() 合并，禁止内联样式与硬编码颜色字体；状态区分本地（useState）、全局（所选库）、服务端（所选数据库，不用 useState 存接口数据）；无障碍要求 alt 文本、键盘可操作、:focus-visible 焦点环、WCAG AA 对比度 4.5:1、表单标签与 aria-describedby；性能要求路由懒加载、使用 next/image 或等价组件、内容区用骨架屏而非 spinner。
生成约束：代码示例使用 DESIGN_SYSTEM.md 的真实令牌名，库用法匹配 TECH_STACK.md 的实际库，结构匹配框架，避免通用占位库名。
限制：资料未提供安装方式、收费与平台信息；该技能依赖上述文档存在，文档缺失时生成质量会下降。