refactor(forma36): remove Paths D and E from skill

Paths D (Code → Figma) and E (Edit existing Figma design) output Figma
Plugin API JavaScript, not React with Forma 36 components. They don't
belong in a design system skill — removed to keep the scope focused on
the three React-based workflows (A/B/C).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Author: toniwowtscherk

skills/SKILL.md

@@ -34,7 +34,7 @@ REQUIRED  Skeleton sub-components: Skeleton.Container, Skeleton.DisplayText, Ske
 
 ## Choose your path
 
-This skill serves five workflows. Pick the one that matches your task, then follow its reading order.
+This skill serves three workflows. Pick the one that matches your task, then follow its reading order.
 
 ### Path A — Designer prototyping (no Figma URL)
 
@@ -130,95 +130,6 @@ This loop typically converges in 1–2 iterations. The first comparison catches
 
 See `guidelines/composition/visual-verification.md` for the detailed checklist.
 
-### Path D — Code to Figma design (writing to Figma via MCP)
-
-You have existing code, a running prototype, or a component implementation and want to push it into a Figma file as a design. This uses the Figma MCP server's write capabilities.
-
-**Prerequisites:**
-
-- Figma MCP server connected (remote `mcp.figma.com` or local `127.0.0.1:3845/mcp`)
-- Load the `figma-use` skill **before every `use_figma` call** — mandatory, skipping it causes hard-to-debug failures
-- For full-page layouts, also load the `figma-generate-design` skill
-
-**How this works:**
-
-1. Read the source code to understand what components, tokens, and layout patterns are used
-2. Use `search_design_system` via MCP to discover matching Forma 36 Figma components, variables, and styles in the target file's libraries
-3. Map React props back to Figma component properties using `guidelines/code-connect.md` in reverse — e.g. `variant="primary"` on `<Button>` means set Figma property "Type" to "Primary"
-4. Build the design in Figma section-by-section using `use_figma`, importing library components rather than drawing raw shapes
-5. Bind Figma variables (color, spacing, typography) instead of hardcoding values — this keeps the design connected to the design system
-
-**Reading order:**
-
-1. Read the source code — identify all Forma 36 components, tokens, and screen pattern used
-2. `guidelines/code-connect.md` — Use the mapping table **in reverse** (React prop -> Figma property name) to set correct variant properties on Figma components
-3. `guidelines/tokens/color.md` + `guidelines/tokens/spacing.md` — Know which token values to bind as Figma variables
-4. `guidelines/composition/base-shell.md` — Replicate the app chrome faithfully in the Figma frame
-5. Load `figma-use` skill — required Plugin API reference for every `use_figma` call
-6. Load `figma-generate-design` skill — for multi-section page assembly workflow
-
-**Key principles:**
-
-- **Use library components, not raw shapes.** Call `search_design_system` to find the published Forma 36 component, then create an instance. Never recreate a Button from rectangles and text.
-- **Reverse the Code Connect table.** If the code says `<Button variant="primary" size="small">`, set Figma properties `Type=Primary`, `Size=Small (default)` on the component instance.
-- **Bind variables, don't hardcode.** Map `tokens.spacingM` to the corresponding Figma spacing variable, `tokens.blue600` to the color variable. This keeps the design token-connected.
-- **Build incrementally.** For full pages, assemble section-by-section — header first, then sidebar, then content area — verifying each section via `get_screenshot` before moving on.
-- **Match the real layout.** Use auto-layout in Figma to mirror the Flex/Stack/Grid structure in code. A `<Stack flexDirection="column" spacing="spacingM">` becomes a vertical auto-layout frame with `itemSpacing=16`.
-
-**When to use this path vs. `figma-capture-to-file`:**
-
-- Use **Path D** when you want an editable, token-connected, component-based Figma design that designers can iterate on
-- Use **`figma-capture-to-file`** when you just need a flat screenshot of a running localhost dropped into a Figma frame
-
-### Path E — Edit existing Figma design (modify a frame on canvas)
-
-A designer points to an existing Figma frame (via URL or desktop selection) and asks for changes — swap a variant, adjust layout, add a component, rearrange sections, update copy, or restyle an element. The design already exists; you are modifying it in place.
-
-**Prerequisites:**
-
-- Figma MCP server connected (remote `mcp.figma.com` or local `127.0.0.1:3845/mcp`)
-- Load the `figma-use` skill **before every `use_figma` call** — mandatory
-
-**How this works:**
-
-1. Fetch the current state of the frame using `get_design_context` or `get_screenshot` to understand what's already there
-2. Identify the specific nodes that need to change — use `get_metadata` or the Plugin API via `use_figma` to walk the layer tree
-3. Make targeted edits using `use_figma` — change properties, swap component instances, reorder children, update text, adjust auto-layout settings
-4. Verify each edit with `get_screenshot` before moving to the next change
-5. Use `guidelines/code-connect.md` to ensure any component property changes use correct Figma property names (e.g., set "Type" not "Variant")
-
-**Reading order:**
-
-1. Fetch the design — `get_design_context` or `get_screenshot` to see the current state
-2. `guidelines/code-connect.md` — Reference the Figma property names when changing component variants (the "Figma prop" column is what you set on the canvas)
-3. `guidelines/tokens/` — When changing colors, spacing, or typography, bind to Figma variables matching the token names
-4. `guidelines/composition/screen-patterns.md` — If restructuring a page, verify the result still follows the correct pattern
-5. `guidelines/foundations/writing.md` — If updating copy, follow the writing rules (sentence case, verb-first labels, "Never mind")
-6. Load `figma-use` skill — required before every `use_figma` call
-
-**Key principles:**
-
-- **Read, log, then write.** Always fetch current state AND return current property values before overwriting. Use a read-only `use_figma` call that returns `{ before: { componentProperties, text, fills } }`, then a separate write call. See `guidelines/code-connect.md` for the pattern.
-- **Edit surgically.** Change only what was requested. Don't reorganize layers, rename nodes, or "clean up" the design unless asked.
-- **Preserve component instances.** When swapping a variant, change the property on the existing instance — don't detach it and rebuild.
-- **Use Figma property names, not React names.** On the canvas, it's "Type" not "variant", "Small (default)" not "small". The Code Connect table's "Figma prop" column is your reference.
-- **Verify after EVERY edit.** Call `get_screenshot` MCP tool after each `use_figma` write. This is mandatory, not optional. Do not skip this step.
-- **Respect auto-layout.** If a frame uses auto-layout, work within it — add children, change spacing, adjust padding. Don't switch to absolute positioning unless the designer explicitly asks.
-
-**Common edit operations:**
-
-- Change a component variant: set the Figma property (e.g., `Type=Negative` on a Button instance)
-- Update text content: find the text node and set `characters`
-- Add a component: use `search_design_system` to find it, create instance, insert into the target frame
-- Reorder items: move child nodes within their parent's `children` array
-- Adjust spacing: change `itemSpacing` on an auto-layout frame, or `paddingTop`/`paddingBottom`/etc.
-- Swap an icon: find the icon instance, swap its component to a different one from the library
-
-**When to use Path E vs. Path D:**
-
-- Use **Path E** when a design already exists and needs modification
-- Use **Path D** when creating a new design from scratch based on code
-
 ---
 
 ## Critical rules