用途：从 Figma 设计稿生成 1:1 像素级保真的 Vue 3 + SCSS 纯展示组件，确保视觉效果与 Figma 一致。支持两种流程：有规格路径（结合 draft-spec.md / handoff payload 增强功能理解）与快速实现路径（直接从 Figma 推导）。
主要能力：读取 Figma 节点并精确提取版面结构、色彩、字级、间距、边框、阴影与交互点；先产出 node-to-component mapping 再实现；按功能语义命名组件（PascalCase），输出 index.vue、子组件与 types.ts；SCSS 采用 Mobile First，嵌套不超过 4 层；交接前做视觉验证与 coverage self-check，并输出 Handoff Payload（含 component_paths、figma_node_ids、spec_path、approved_node_ids、covered_node_ids、uncovered_node_ids、asset_fallbacks 等）。
使用方式：需提供 Figma 链接（必要），可选 draft-spec.md / spec_path、approved_node_ids、组件命名规则。唯一支持的 Figma 交互工具为 Framelink MCP for Figma，常用操作包括 mcp_framelink_mcp_get_figma_data(fileKey, nodeId)、截图获取与 mcp_framelink_mcp_download_figma_images()；文件操作使用 mcp-fs。完成后建议用 npm run storybook 或 npm run dev 预览。
适用场景：根据 Figma 产出 Vue 3 展示组件、按 spec 建立 UI、切版等。
限制：禁止使用 fetch()/axios、useStore()/Pinia、router.push()、v-if 商业判断与 API response mapping，应改用 prop、emit 或由父层容器处理；资源下载失败需记录 asset_fallbacks，关键品牌资产无法重建时须标记 uncovered_node_ids，不得宣称 1:1 完成。具体收费、价格与平台信息暂未提供。