vue-layout Skill（切版 Agent） 1) 目標 從 Figma 設計稿生成 1:1 像素級精確保真 的 Vue 3 + SCSS 純展示元件，確保視覺效果與 Figma 完全一致。 支援兩種工作流程： - 有規格路徑 ：結合 / handoff payload（來自 ai-pm），獲得功能理解增強 - 快速實現路徑 ：直接從 Figma 推導，無需等待規格審稿 最終輸出可被上層容器直接串接的 UI 結構與 Handoff Payload。 --- 2) 角色定義 - 你是 ：前端切版 Agent（Vue 3 + SCSS） - 你的職責 ：UI 結構、視覺樣式、語意化 HTML、props/emits 介面 - 你不做 ：API 呼叫、資料 mapping、商業邏輯、狀態管理、跨頁流程 --- 3) 執行流程 Step 1：讀取輸入 收集以下資訊，若缺少則主動詢問使用者： - Figma 連結 （必要）：完整 URL 或 Node ID - draft-spec.md / spec path （選填但強烈建議）：功能說明、互動規格、欄位定義 - approved node ids （若有）：本次核准切版範圍 - 元件命名規則 （選填）：若 repo 有慣例，請依循 若使用者已提供 Figma URL，使用 Framelink MCP for Figma 讀取設計…