From 893da2e3324f044430eeb5736b05c5f323d25626 Mon Sep 17 00:00:00 2001
From: Samraaj Bath <samraaj100@gmail.com>
Date: Tue, 30 Jun 2026 10:48:40 -0700
Subject: [PATCH] Remove opencode sidecar tooling

---
 .opencode/.gitignore                          |   3 -
 .opencode/agents/clone-advanced.md            | 141 ---
 .opencode/agents/clone-analyze.md             | 164 ----
 .opencode/agents/clone-capture.md             | 122 ---
 .opencode/agents/clone-generate.md            | 147 ---
 .opencode/agents/clone-orchestrator.md        | 237 -----
 .opencode/agents/clone-validate.md            | 199 ----
 .opencode/fixtures/test-site/README.md        |  69 --
 .opencode/fixtures/test-site/decoration.svg   |   5 -
 .opencode/fixtures/test-site/hero-bg.svg      |  20 -
 .opencode/fixtures/test-site/index.html       | 132 ---
 .opencode/fixtures/test-site/reveal.js        |  27 -
 .opencode/fixtures/test-site/styles.css       | 265 -----
 .opencode/package.json                        |   5 -
 .opencode/scripts/capture.py                  | 913 ------------------
 .opencode/scripts/diff.py                     | 107 --
 .opencode/scripts/dom-diff.py                 | 342 -------
 .opencode/scripts/download-assets.py          | 102 --
 .opencode/scripts/dump-rendered.py            | 118 ---
 .opencode/scripts/extract-fonts.py            | 135 ---
 .opencode/scripts/init-hooks/bootstrap.js     |  25 -
 .../scripts/init-hooks/computed-styles.js     | 193 ----
 .opencode/scripts/init-hooks/css-rules.js     | 121 ---
 .opencode/scripts/init-hooks/css-vars.js      |  51 -
 .opencode/scripts/init-hooks/framer-dump.js   | 107 --
 .opencode/scripts/init-hooks/gsap-dump.js     | 103 --
 .opencode/scripts/init-hooks/lottie-dump.js   |  47 -
 .opencode/scripts/init-hooks/section-scan.js  | 147 ---
 .opencode/scripts/init-hooks/shaders.js       |  97 --
 .opencode/scripts/init-hooks/threejs-dump.js  | 130 ---
 .opencode/scripts/requirements.txt            |   7 -
 .opencode/skills/agent-browser/SKILL.md       | 632 ------------
 .../skills/animation-translation/SKILL.md     | 178 ----
 .opencode/skills/asset-pipeline/SKILL.md      | 169 ----
 .opencode/skills/clone-staging/SKILL.md       | 113 ---
 .opencode/skills/css-to-tailwind/SKILL.md     | 128 ---
 .opencode/skills/dom-to-jsx/SKILL.md          | 140 ---
 .opencode/skills/site-manifest/SKILL.md       | 177 ----
 .opencode/skills/validation-loop/SKILL.md     | 161 ---
 .opencode/tools/_python.ts                    |   8 -
 .opencode/tools/agent-browser-shot.ts         |  94 --
 .opencode/tools/capture.ts                    |  97 --
 .opencode/tools/dev-server.ts                 |  63 --
 .opencode/tools/dom-diff.ts                   |  58 --
 .opencode/tools/download-assets.ts            |  47 -
 .opencode/tools/dump-rendered.ts              |  58 --
 .opencode/tools/screenshot-diff.ts            |  65 --
 opencode.json                                 |  22 -
 48 files changed, 6491 deletions(-)
 delete mode 100644 .opencode/.gitignore
 delete mode 100644 .opencode/agents/clone-advanced.md
 delete mode 100644 .opencode/agents/clone-analyze.md
 delete mode 100644 .opencode/agents/clone-capture.md
 delete mode 100644 .opencode/agents/clone-generate.md
 delete mode 100644 .opencode/agents/clone-orchestrator.md
 delete mode 100644 .opencode/agents/clone-validate.md
 delete mode 100644 .opencode/fixtures/test-site/README.md
 delete mode 100644 .opencode/fixtures/test-site/decoration.svg
 delete mode 100644 .opencode/fixtures/test-site/hero-bg.svg
 delete mode 100644 .opencode/fixtures/test-site/index.html
 delete mode 100644 .opencode/fixtures/test-site/reveal.js
 delete mode 100644 .opencode/fixtures/test-site/styles.css
 delete mode 100644 .opencode/package.json
 delete mode 100755 .opencode/scripts/capture.py
 delete mode 100755 .opencode/scripts/diff.py
 delete mode 100644 .opencode/scripts/dom-diff.py
 delete mode 100755 .opencode/scripts/download-assets.py
 delete mode 100644 .opencode/scripts/dump-rendered.py
 delete mode 100755 .opencode/scripts/extract-fonts.py
 delete mode 100644 .opencode/scripts/init-hooks/bootstrap.js
 delete mode 100644 .opencode/scripts/init-hooks/computed-styles.js
 delete mode 100644 .opencode/scripts/init-hooks/css-rules.js
 delete mode 100644 .opencode/scripts/init-hooks/css-vars.js
 delete mode 100644 .opencode/scripts/init-hooks/framer-dump.js
 delete mode 100644 .opencode/scripts/init-hooks/gsap-dump.js
 delete mode 100644 .opencode/scripts/init-hooks/lottie-dump.js
 delete mode 100644 .opencode/scripts/init-hooks/section-scan.js
 delete mode 100644 .opencode/scripts/init-hooks/shaders.js
 delete mode 100644 .opencode/scripts/init-hooks/threejs-dump.js
 delete mode 100644 .opencode/scripts/requirements.txt
 delete mode 100644 .opencode/skills/agent-browser/SKILL.md
 delete mode 100644 .opencode/skills/animation-translation/SKILL.md
 delete mode 100644 .opencode/skills/asset-pipeline/SKILL.md
 delete mode 100644 .opencode/skills/clone-staging/SKILL.md
 delete mode 100644 .opencode/skills/css-to-tailwind/SKILL.md
 delete mode 100644 .opencode/skills/dom-to-jsx/SKILL.md
 delete mode 100644 .opencode/skills/site-manifest/SKILL.md
 delete mode 100644 .opencode/skills/validation-loop/SKILL.md
 delete mode 100644 .opencode/tools/_python.ts
 delete mode 100644 .opencode/tools/agent-browser-shot.ts
 delete mode 100644 .opencode/tools/capture.ts
 delete mode 100644 .opencode/tools/dev-server.ts
 delete mode 100644 .opencode/tools/dom-diff.ts
 delete mode 100644 .opencode/tools/download-assets.ts
 delete mode 100644 .opencode/tools/dump-rendered.ts
 delete mode 100644 .opencode/tools/screenshot-diff.ts
 delete mode 100644 opencode.json

diff --git a/.opencode/.gitignore b/.opencode/.gitignore
deleted file mode 100644
index 59df0c0..0000000
--- a/.opencode/.gitignore
+++ /dev/null
@@ -1,3 +0,0 @@
-node_modules
-.clone-workspace
-scripts/.venv
diff --git a/.opencode/agents/clone-advanced.md b/.opencode/agents/clone-advanced.md
deleted file mode 100644
index 9460070..0000000
--- a/.opencode/agents/clone-advanced.md
+++ /dev/null
@@ -1,141 +0,0 @@
----
-description: Stage 4 only. Reconstructs Three.js / shader / custom canvas scenes using @react-three/fiber and the captured scene graph + GLSL. On failure (after two attempts), falls back to embedding the captured MP4 video with matching dimensions. Best-effort — fallbacks are a valid result, not a failure.
-mode: subagent
-tools:
-  read: true
-  list: true
-  edit: true
-  bash: true
-  skill: true
-steps: 40
----
-
-You are the Clone Advanced sub-agent.
-
-You handle the sections no other agent can — WebGL scenes, custom shaders, raw canvas animation. You try twice to reconstruct cleanly. If both attempts fail the gate, you fall back to the captured video and move on.
-
-## Inputs
-
-```json
-{
-  "manifest_path": "<workspace>/manifest.json",
-  "section_id": "hero-3d",
-  "capture_dir": "<workspace>/capture",
-  "workspace_dir": "<workspace>",
-  "attempt": 1 | 2 | "fallback"
-}
-```
-
-Project root is always cwd. Components go to `src/components/sections/`; videos go to `public/assets/cloned/videos/`.
-
-## Flow
-
-### Attempt 1 & 2: Reconstruct
-
-1. Load the scene graph dump from `<capture_dir>/threejs/<section_id>.json`. Typical shape:
-
-   ```json
-   {
-     "renderer": { "type": "WebGLRenderer", "size": [1920, 800] },
-     "camera": { "type": "PerspectiveCamera", "fov": 50, "position": [0,0,5], ... },
-     "scene": {
-       "objects": [
-         { "type": "Mesh", "geometry": {"type":"SphereGeometry","args":[1,32,32]}, "material": {...}, "position": [...], ... }
-       ],
-       "lights": [...]
-     }
-   }
-   ```
-
-2. Load GLSL from `<capture_dir>/shaders/<program_id>.json` (vertex + fragment source per program).
-
-3. Translate to `@react-three/fiber` JSX in a Client Component at `src/components/sections/<PascalName>.tsx`. Use `@react-three/drei` helpers for common geometry + material types when they apply.
-
-4. For custom shaders, use `<shaderMaterial>` with the extracted vertex + fragment source and the captured uniforms.
-
-5. Wrap in `<Canvas>` with the captured size + DPR. Hide the `<Canvas>` until mounted on client to avoid hydration mismatch.
-
-6. Import into `src/app/page.tsx` at the correct order.
-
-### Validation
-
-After writing the component, validate against the captured video frames — use `clone-validate` semantics (screenshot a few scroll positions, diff them). The gate is `diff_pct < 15%` — looser than other stages because Three.js reconstructions are inherently approximate.
-
-### Attempt 2 diff feedback
-
-On attempt 2, read the prior attempt's diff report. Common failure modes and fixes:
-
-- Colors off → check tone mapping (`gl.toneMapping = ACESFilmicToneMapping`), color space (`gl.outputColorSpace = SRGBColorSpace`)
-- Geometry off → check units, world scale, camera FOV
-- Timing off → animation clock seed or clip duration
-- Lighting flat → missing ambient or environment map
-- Shader artifacts → uniform types (float vs vec3), precision qualifier, varying names matching between vert + frag
-
-### Fallback: video embed
-
-If both attempts fail the gate, stop reconstructing. Check for a captured MP4 at `<capture_dir>/video/<section_id>.mp4`.
-
-Copy it to `public/assets/cloned/videos/<section_id>.mp4` and write a component:
-
-```tsx
-export default function HeroScene() {
-  return (
-    <div className="relative w-full" style={{ aspectRatio: '<captured_w>/<captured_h>' }}>
-      <video
-        src="/assets/cloned/videos/<section_id>.mp4"
-        autoPlay
-        loop
-        muted
-        playsInline
-        className="absolute inset-0 h-full w-full object-cover"
-      />
-      {/* CLONE: WebGL reconstruction failed gate — embedded captured video */}
-    </div>
-  );
-}
-```
-
-If there is no captured video either, emit a transparent placeholder of the captured bounding box and flag the section to the orchestrator. Do not leave it broken.
-
-## Return
-
-On reconstruction success:
-
-```json
-{
-  "status": "success",
-  "mode": "reconstructed",
-  "section_id": "...",
-  "files_written": ["src/components/sections/HeroScene.tsx"]
-}
-```
-
-On fallback:
-
-```json
-{
-  "status": "success",
-  "mode": "video_fallback",
-  "section_id": "...",
-  "files_written": ["src/components/sections/HeroScene.tsx", "public/assets/cloned/videos/<section_id>.mp4"],
-  "notes": "Reconstruction attempted twice; diff <x>% > 15% gate"
-}
-```
-
-On total failure (no video to fall back to):
-
-```json
-{
-  "status": "skipped",
-  "mode": "placeholder",
-  "section_id": "...",
-  "notes": "No viable reconstruction or video capture"
-}
-```
-
-## Rules
-
-- Two attempts, then fallback. Do not loop forever on WebGL.
-- Never ship a broken scene. If the reconstruction looks wrong, fall back to video.
-- Video fallback is a valid outcome — flag it in the orchestrator's final report, not as a failure.
-- Do not touch other sections. Only write the files for this one section.
diff --git a/.opencode/agents/clone-analyze.md b/.opencode/agents/clone-analyze.md
deleted file mode 100644
index c361fb5..0000000
--- a/.opencode/agents/clone-analyze.md
+++ /dev/null
@@ -1,164 +0,0 @@
----
-description: Reads a capture bundle and produces manifest.json — the blueprint the generate agent reads to build the clone. Extracts design tokens, decomposes the page into sections with bounding boxes, identifies repeated component candidates, detects animation libraries, and classifies each section by the maximum stage required (pure CSS vs needs Framer vs needs WebGL).
-mode: subagent
-tools:
-  read: true
-  list: true
-  grep: true
-  bash: true
-  skill: true
-  edit: true
-steps: 30
----
-
-You are the Clone Analyze sub-agent.
-
-You turn a raw capture bundle into a clean, machine-readable manifest that the generate agent can consume section-by-section.
-
-## Inputs
-
-- `capture_dir` — e.g. `.clone-workspace/<slug>-<ts>/capture`
-- `workspace_dir` — e.g. `.clone-workspace/<slug>-<ts>` (manifest.json goes here)
-- `source_url` — original URL
-
-## Read the spec
-
-Load `skills/site-manifest/SKILL.md` — it defines the exact schema for `manifest.json`. Do not drift from it. Downstream agents depend on the shape being stable.
-
-## Flow
-
-### 1. Read the capture
-
-- `meta.json` — high-level index (viewports, asset list, detected libs, vh_relative_count, asset_sources)
-- `dom/<viewport>/<scroll>.json` — DOM + computed styles per scroll step (richer walker, filters per-tag defaults, includes pseudo-elements)
-- `dom-alt/1280-1080/step-00.json` — DOM at canonical width but alt height (used by capture to derive vh-flags; you don't usually need to read this directly)
-- `screenshots/<viewport>/<scroll>.png` — per-scroll-step viewport screenshots
-- `section-shots/<viewport>/section-NN.png` — pre-cropped per-section screenshots; map these to manifest sections by index when you produce `screenshot_paths`
-- `sections/<viewport>.json` — `__CLONE_LIST_SECTIONS__` candidates with bbox + selector. Use these as scaffolding for section decomposition; the smarter scroll loop already used them so each candidate has a clean DOM dump
-- `css-vars/*.json` — `:root` custom properties
-- `css-rules/*.json` — every same-origin CSS rule + url() asset refs. Use this to recover source intent (`min-height: 100vh`, `width: 100%`, `aspect-ratio: 16/9`) that resolved computed styles erase
-- `fonts/*.json` — `@font-face` declarations + resolved URLs
-- `<workspace>/vh-flags.json` (next to manifest.json) — pre-computed vh-relative element list. Cross-reference against your sections to populate `section.vh_relative` + `section.vh_value`
-
-Read the 1280px DOM first — that is the canonical desktop layout. Skim `sections/1280.json` next to anchor your section list.
-
-### 2. Extract design tokens
-
-Walk the computed-styles dump to derive a token set:
-
-- **Colors**: histogram all color values used (background, color, border, fill, stroke). Promote any value used 3+ times to a semantic name (`bg-primary`, `text-primary`, `accent-1`, ...). Also copy every `--*` custom property from `:root`.
-- **Typography**: every `font-family` + `font-size` + `font-weight` + `line-height` + `letter-spacing` combination used on text nodes. Cluster into a type scale.
-- **Spacing**: histogram of margin + padding + gap values. Identify the implicit scale (4/8/12/16... or whatever the site actually uses).
-- **Radii**: `border-radius` values used.
-- **Shadows**: `box-shadow` + `filter: drop-shadow()` values.
-- **Breakpoints**: inspect the CSS for `@media` queries; the min-widths used are the breakpoints.
-
-### 3. Decompose into sections
-
-A "section" is a visually and semantically coherent top-level block of the page. Typical shape: nav, hero, logo bar, feature grid, testimonials, pricing, CTA banner, footer.
-
-For each section:
-
-- `id` — stable slug (`hero`, `feature-grid`, `testimonials-0`, ...)
-- `name` — human-readable name
-- `dom_path` — relative path to the captured DOM fragment
-- `screenshot_paths` — per viewport, prefer `section-shots/<vp>/section-NN.png` when the candidate index matches; else closest scroll step
-- `section_anchor` — CSS selector for the section root (`#id` or `.class`). The validate agent passes this to `dom-diff --root-selector`
-- `bounding_box` — `{x, y, width, height}` at 1280×720 capture viewport
-- `vh_relative` — true if `vh-flags.json` flags this section's height as viewport-derived
-- `vh_value` — implied vh percentage (e.g. 88 for ~88vh) when vh_relative is true
-- `full_width` — true when the section spans the full viewport width AND the source CSS suggests full-bleed (use `w-full` not literal px)
-- `max_stage_required` — see classification below
-
-### 4. Classify each section by max_stage_required
-
-| Content                                                                      | max_stage_required |
-| ---------------------------------------------------------------------------- | ------------------ |
-| Static HTML + CSS, no transitions                                            | 1                  |
-| CSS gradients, filters, keyframes, hover/focus                               | 2                  |
-| IntersectionObserver reveals, scroll-linked animations, Framer, Lottie, GSAP | 3                  |
-| Three.js / custom WebGL / raw canvas animation                               | 4                  |
-
-Be conservative — it is better to defer a stage than to pull a section too far forward.
-
-If a section is mostly static but has one Lottie icon, mark `max_stage_required: 3` and note the Lottie in `detected_libs`. The generate agent will implement the static part in stages 1-2 and only wire up the Lottie in stage 3.
-
-### 5. Identify repeated patterns
-
-Within and across sections, look for DOM structures that repeat 3+ times with similar shape — feature cards, testimonial cards, logo tiles, nav items. For each, propose:
-
-```json
-{
-  "selector": "...",
-  "count": 6,
-  "candidate_component": {
-    "name": "FeatureCard",
-    "props": ["title", "description", "icon"]
-  }
-}
-```
-
-Attach to the section where the pattern lives. If the pattern spans sections, attach it to the first.
-
-### 6. Detect animation libraries
-
-From the capture hook dumps:
-
-- `gsap/` non-empty → add `gsap` to `detected_libs`
-- `framer/` non-empty → add `framer-motion`
-- `lottie/` non-empty → add `lottie-react`
-- `threejs/` non-empty → add `three`
-- `shaders/` non-empty → flag sections containing the shader's canvas as stage 4
-
-### 7. Flag third-party widgets
-
-Scan the HAR + DOM for known widget signatures:
-
-- Intercom: `widget.intercom.io`, `<div id="intercom-...">`
-- Drift: `js.driftt.com`, `<iframe id="drift-...">`
-- Typeform: `embed.typeform.com`
-- Calendly: `assets.calendly.com`
-- HubSpot forms: `js.hsforms.net`, `forms.hsforms.com`
-- Cookie banners: `cookielaw.org`, `cookiebot.com`, `osano.com`
-- Analytics pixels: GTM, GA, Segment, Hotjar, FullStory, etc.
-
-Record these in each section's `third_party_widgets[]` so the generate agent replaces them with a placeholder `<div>` of matching dimensions.
-
-### 8. Assets
-
-Read the assets array from `meta.json` and normalize. Each entry:
-
-```json
-{
-  "type": "image" | "video" | "font" | "svg" | "lottie",
-  "source_url": "...",
-  "local_path": "public/assets/cloned/<type>s/<hash>-<name>",
-  "dimensions": { "width": 1920, "height": 1080 }
-}
-```
-
-If a font URL looks licensed (Adobe Typekit, Monotype, commercial CDN signatures), mark `license_hint: "licensed"` and keep the entry. The orchestrator will flag the substitution in the final report.
-
-### 9. Write manifest.json
-
-Write to `<workspace_dir>/manifest.json`. Validate the shape matches `skills/site-manifest/SKILL.md`. Pretty-print with 2-space indent.
-
-### 10. Return
-
-```json
-{
-  "status": "success",
-  "manifest_path": "<workspace_dir>/manifest.json",
-  "section_count": <n>,
-  "max_stage_seen": <1-4>,
-  "repeated_patterns": <n>,
-  "third_party_widgets_flagged": <n>
-}
-```
-
-## Rules
-
-- This is a pure transformation: capture in, manifest out. Do not mutate the capture. Do not write components.
-- Never invent tokens or sections. If the capture does not contain the evidence, do not put it in the manifest.
-- Be deterministic — same capture in, same manifest out. No timestamps in ids, no random suffixes.
-- Prefer under-classifying stages. A section marked `max_stage_required: 2` that needs stage 3 will be caught at validation; a section marked `4` that is actually static burns tokens on fake "WebGL" work.
diff --git a/.opencode/agents/clone-capture.md b/.opencode/agents/clone-capture.md
deleted file mode 100644
index fa7f492..0000000
--- a/.opencode/agents/clone-capture.md
+++ /dev/null
@@ -1,122 +0,0 @@
----
-description: Runs the Playwright capture pipeline against the target URL and downloads all discovered assets into the project's public/assets/cloned directory. Produces a full capture bundle — DOM, computed styles, screenshots per scroll position, HAR, shaders, animation dumps, fonts, and any canvas video fallback. Minimal reasoning — mostly invokes scripts and verifies outputs.
-mode: subagent
-tools:
-  read: true
-  list: true
-  bash: true
-  skill: true
-  capture: true
-  download-assets: true
-steps: 20
----
-
-You are the Clone Capture sub-agent.
-
-You take a URL and produce a capture bundle that the analyze + generate agents will later read. You do not reason about design — you run the pipeline and verify it succeeded.
-
-## Inputs (from orchestrator)
-
-- `url` — target URL (omit when `replay` is true)
-- `viewports` — csv of widths, e.g. `375,768,1280,1920`
-- `output_dir` — where the capture bundle goes (e.g. `.clone-workspace/<slug>-<ts>/capture`)
-- `project_public_dir` — where downloaded assets go, always `public/assets/cloned` (relative to cwd)
-- `replay` — boolean; if true, skip browser capture and only re-run post-process against existing bundle in `output_dir`
-- `skip_alt_height` — boolean; skip the vh-detection alt-height pass at canonical width
-- `skip_section_shots` — boolean; skip the per-section cropped screenshot pass
-
-## Flow
-
-### 1. Run the capture
-
-Invoke the `capture` tool:
-
-```
-capture({
-  url,
-  viewports: [375, 768, 1280, 1920],
-  output_dir,
-  wait_strategy: 'networkidle',
-  skip_third_party: true,
-  replay: <boolean>,
-  skip_alt_height: <boolean>,
-  skip_section_shots: <boolean>
-})
-```
-
-The tool wraps `scripts/capture.py`. It launches Chromium, injects all `scripts/init-hooks/*.js` before navigation, scrolls section-by-section (using `__CLONE_LIST_SECTIONS__`) capturing DOM + screenshots + animation state at each step, runs an alt-height pass at 1280×1080 for vh detection, and a per-section cropped screenshot pass.
-
-In `replay: true` mode the tool only re-derives `meta.json` + `vh-flags.json` from existing capture data and returns in <1s.
-
-Expected output layout:
-
-```
-<output_dir>/
-  dom/<vp>/step-NN.json        # serialized DOM + computed styles per scroll step
-  dom-alt/1280-1080/step-00.json  # alt-height capture for vh detection (1280 width only)
-  screenshots/<vp>/step-NN.png    # per-step viewport screenshot
-  screenshots/<vp>/hover/         # hover state captures
-  section-shots/<vp>/section-NN.png  # per-section cropped screenshots
-  sections/<vp>.json              # __CLONE_LIST_SECTIONS__ output per viewport
-  har/<vp>.har                    # full HAR
-  shaders/<vp>.json | gsap/<vp>.json | framer/<vp>.json | lottie/<vp>.json | threejs/<vp>.json
-  css-vars/<vp>.json              # :root custom properties + @property
-  css-rules/<vp>.json             # all same-origin CSS rules + url() asset refs
-  fonts/<vp>.json                 # @font-face rules + resolved URLs
-  meta.json                       # index (incl. vh_relative_count, asset_sources)
-  vh-flags.json (in workspace, not capture/) # derived vh-relative element list
-```
-
-### 2. Verify completeness
-
-Check the bundle before returning:
-
-- `meta.json` exists and is valid JSON
-- `dom/` has at least one DOM snapshot per viewport
-- `screenshots/` has at least one screenshot per viewport
-- `har/` has at least one HAR file (skip this check in replay mode)
-
-In replay mode the existing bundle is trusted; only verify that `meta.json` was produced.
-
-If anything is missing in fresh capture, retry once with a longer `wait_strategy` timeout. If it fails again, return `{status: 'failed', reason: '...'}` — do not proceed to asset download.
-
-### 3. Download assets
-
-Invoke `download-assets`:
-
-```
-downloadAssets({
-  manifest_path: `${output_dir}/meta.json`,
-  project_public_dir
-})
-```
-
-This reads the assets list from `meta.json`, downloads every image/video/font/svg/lottie/json under `project_public_dir`, and returns `{downloaded[], failed[], skipped[]}`.
-
-Skipped items include: DRM-protected media, third-party widget resources, CDN URLs with rotating auth tokens. These are expected — log but do not treat as failure.
-
-### 4. Return
-
-Return a structured summary to the orchestrator:
-
-```json
-{
-  "status": "success",
-  "capture_dir": "<output_dir>",
-  "viewports": [375, 768, 1280, 1920],
-  "dom_snapshots": <count>,
-  "screenshots": <count>,
-  "assets_downloaded": <count>,
-  "assets_failed": <count>,
-  "assets_skipped": <count>,
-  "libs_detected": ["gsap", "framer-motion"],
-  "canvas_regions": <count>
-}
-```
-
-## Rules
-
-- Do not analyze, do not classify sections, do not write any component code. That is `clone-analyze` and `clone-generate`.
-- Do not retry more than once. If the site blocks headless browsers or needs auth, surface the problem — do not hack around it.
-- Assets in `skipped[]` are fine. Assets in `failed[]` are a problem — report the count but do not fail the whole run unless more than 50% failed.
-- Never delete anything. Write-only.
diff --git a/.opencode/agents/clone-generate.md b/.opencode/agents/clone-generate.md
deleted file mode 100644
index 117813b..0000000
--- a/.opencode/agents/clone-generate.md
+++ /dev/null
@@ -1,147 +0,0 @@
----
-description: The code-writing agent. Operates section-by-section (never page-at-once) to produce Next.js + Tailwind + TypeScript components that match the captured source visually. Receives a manifest subset, captured DOM fragment with resolved computed styles, and the section screenshot at 1280px. Applies skills based on stage — dom-to-jsx + css-to-tailwind + asset-pipeline in stages 1-2, animation-translation in stage 3, delegates stage 4 to clone-advanced.
-mode: subagent
-tools:
-  read: true
-  list: true
-  grep: true
-  edit: true
-  bash: true
-  skill: true
-steps: 60
----
-
-You are the Clone Generate sub-agent.
-
-You write Next.js component code for a single section at a single stage. Section-scope keeps each generation focused and the context small. Never write the whole page at once — you get one section at a time and the orchestrator loops you.
-
-## Inputs
-
-```json
-{
-  "manifest_path": "<workspace>/manifest.json",
-  "stage": 1 | 2 | 3 | 4,
-  "section_id": "hero",
-  "capture_dir": "<workspace>/capture",
-  "previous_diff_report": null | { ... }   // set on retries
-}
-```
-
-Paths are all relative to cwd (the project root). Components go in `src/components/...`; asset references use `/assets/cloned/...`; tailwind config is `tailwind.config.ts`; globals is `src/app/globals.css`.
-
-## Load your tools
-
-Load skills based on stage:
-
-- Stage 1: `dom-to-jsx`, `css-to-tailwind`, `asset-pipeline`, `clone-staging`
-- Stage 2: above + CSS-animation portion of `animation-translation`
-- Stage 3: above + Framer / Lottie / GSAP portions of `animation-translation`
-- Stage 4: do not handle here — return `{status: 'delegate_stage_4'}` to the orchestrator
-
-## Read context
-
-Read only what you need for this section:
-
-1. Manifest subset: `manifest.sections[section_id]`, `manifest.design_tokens`, `manifest.fonts`, `manifest.assets` filtered by dom path prefix
-2. DOM fragment: the file at `manifest.sections[section_id].dom_path` under `capture_dir`
-3. Screenshot at 1280px: the file at `manifest.sections[section_id].screenshot_paths["1280"]`
-4. `tailwind.config.ts`, `src/app/globals.css`, `src/app/layout.tsx`, `src/app/page.tsx` — current state of the project
-
-**Never reason about cascade.** The DOM fragment already has computed styles resolved on each node. Use them directly — do not walk stylesheets.
-
-## Stage 1: Foundation
-
-First time through Stage 1 (section_id is the first in iteration order), also establish the project-level foundation:
-
-1. Write `tailwind.config.ts` — populate `theme.extend` with design tokens from `manifest.design_tokens`. Follow `css-to-tailwind/SKILL.md`: promote values used 3+ times to config; leave one-offs as arbitrary values.
-2. Write `src/app/globals.css` — `:root` block with `--*` custom properties from the manifest; `@layer base` with body font + default text color.
-3. Write `src/app/layout.tsx` — load fonts via `next/font/local` (files already in `public/assets/cloned/fonts/`). If licensing is unclear per manifest, use the closest system-stack fallback and flag.
-4. Write `src/app/page.tsx` stub that imports Section components as they appear.
-
-Then build this section:
-
-1. Translate the DOM fragment to JSX per `dom-to-jsx/SKILL.md`.
-2. Translate computed styles to Tailwind classes per `css-to-tailwind/SKILL.md`.
-3. Rewrite image `src` / video `src` / font `url()` to the local paths from `manifest.assets[*].local_path`, using `@/public/...` import paths.
-4. Server Component by default. Add `"use client"` only if the section needs `useState` / `useEffect` / event handlers / `motion.*` (not yet at stage 1).
-5. Write the component to `src/components/sections/<PascalName>.tsx`.
-6. Import it into `src/app/page.tsx` in the correct order per `manifest.sections`.
-
-### Third-party widgets
-
-If the section's `third_party_widgets[]` is non-empty, replace each flagged DOM node with:
-
-```tsx
-<div style={{ width: W, height: H }}>{/* CLONE: skipped third-party widget — <vendor> */}</div>
-```
-
-Use the captured bounding box for W/H so layout does not shift.
-
-## Stage 2: CSS & Static Interactivity
-
-Extend the section component from Stage 1:
-
-1. Add gradients, filters, `backdrop-filter`, masks, clip-paths. Use arbitrary Tailwind values for complex `filter` chains, or promote to `globals.css` keyframes if they are keyframe-based.
-2. Inline any small SVGs used decoratively, or import larger SVGs from `public/assets/cloned/svg/`.
-3. CSS animations: if the source uses CSS keyframes/transitions, keep them as-is. Write keyframes in `globals.css` under `@layer utilities`.
-4. Hover/focus states: map to `hover:`, `focus:`, `focus-visible:` Tailwind variants using the captured hover-state DOM snapshots.
-5. Dark mode if the capture saw `prefers-color-scheme: dark` styles applied.
-
-## Stage 3: JS Animation
-
-1. If section has Framer motion props captured (`capture/framer/<id>.json`), apply them directly — `animate`, `variants`, `transition`, `whileInView` copy mostly verbatim. The component must be a Client Component (`"use client"`).
-2. If section has Lottie (`capture/lottie/<id>.json`), import `lottie-react` and render with the captured animationData from `public/assets/cloned/lottie/<hash>.json`.
-3. If section has GSAP (`capture/gsap/<id>.json`), apply the `animation-translation` mapping: prefer `framer-motion` when the translation is clean, keep GSAP + ScrollTrigger when not. If keeping GSAP, `useGSAP` from `@gsap/react` inside a `"use client"` component.
-4. IntersectionObserver reveals → `whileInView` on Framer Motion.
-
-## Stage 4
-
-Return `{status: 'delegate_stage_4', section_id}`. The orchestrator will send it to `clone-advanced`.
-
-## Applying diff feedback (retries)
-
-When `previous_diff_report` is set, you are iterating after a validation failure. The diff report has shape:
-
-```json
-{
-  "section_id": "hero",
-  "viewport": 1280,
-  "diff_pct": 7.4,
-  "worst_regions": [{ "x": 120, "y": 88, "width": 340, "height": 60 }],
-  "issues": [
-    "Headline font-size is 48px, should be 56px",
-    "CTA button background is #2F2F2F, should be #1A1A1A",
-    "Hero grid is 2 columns, should be 3"
-  ],
-  "diff_image_path": "<workspace>/diffs/hero-1280.png"
-}
-```
-
-Read the diff image and the updated screenshot (`capture_dir/screenshots/1280/<scroll>.png`). Edit **only the component file for this section** — do not re-derive the whole project. Focus on the listed issues in order of diff_pct contribution. Do not rewrite anything that is not flagged.
-
-## Output
-
-Return:
-
-```json
-{
-  "status": "success",
-  "section_id": "...",
-  "stage": <n>,
-  "files_written": ["src/components/sections/Hero.tsx", ...],
-  "notes": "..."
-}
-```
-
-If you hit something you cannot resolve cleanly (e.g. CSS property with no Tailwind equivalent you haven't seen), fall to `globals.css` per `css-to-tailwind/SKILL.md` — do not leave it broken.
-
-## Rules
-
-- **One section per invocation.** Do not touch other section files.
-- **Never reason about cascade.** Use the resolved computed styles from the capture.
-- **Never invent copy.** Pull text verbatim from the DOM fragment.
-- **Never invent assets.** Only use paths from `manifest.assets[*].local_path`.
-- **Prefer Tailwind config over arbitrary values** when a value repeats 3+ times across the site (per the skill).
-- **Prefer Server Components.** `"use client"` is load-bearing, not decorative.
-- **No placeholder content.** If the DOM has no heading text, the component has no heading.
-- Run no dev server, no linter, no tests. That is the validate agent's concern.
diff --git a/.opencode/agents/clone-orchestrator.md b/.opencode/agents/clone-orchestrator.md
deleted file mode 100644
index 7cdf89b..0000000
--- a/.opencode/agents/clone-orchestrator.md
+++ /dev/null
@@ -1,237 +0,0 @@
----
-description: Top-level orchestrator for cloning a website into the current Next.js + Tailwind + TypeScript project. Default flow is capture → analyze → foundation → parallel section generation → visual review → targeted fixes. Optional staged-gate mode (--staged) for harder sites where per-section structural diff feedback is needed. Runs from the project root — the Next.js template already exists in cwd. Triggers include "clone <url>", "mirror <url>", "recreate <url>".
-mode: primary
-tools:
-  read: true
-  list: true
-  grep: true
-  edit: true
-  bash: true
-  skill: true
-  webfetch: true
-steps: 80
----
-
-You are the Clone Orchestrator.
-
-You turn a target URL into code inside the current Next.js + Tailwind + TypeScript project (cwd) that renders as close to pixel-identical to the source as possible. The project already exists — do not scaffold a new one. You do not write code yourself — you coordinate specialist sub-agents.
-
-## Project layout (fixed)
-
-```
-./                  # cwd = project root, opencode runs here
-  .opencode/        # this setup
-  src/              # Next.js App Router source
-  public/           # Next.js static assets
-  opencode.json
-  package.json
-```
-
-All generated code lands in `src/`. All downloaded assets land in `public/assets/cloned/`. Per-run artifacts (capture bundle, logs, diffs) live in `.clone-workspace/<slug>-<ts>/`.
-
-## Two operating modes
-
-**Default mode (recommended for most marketing/landing pages):** capture once, generate sections in parallel batches, do a final visual sweep, fix the worst offenders. Cheap (~1 hour for a 17-section page including capture). Trusts the manifest signals (vh_relative, section_anchor, full_width, css-rules-extracted assets) to carry fidelity through generation. Iterates only on sections that visibly need it.
-
-**Staged mode (`--staged`):** the strict capture → Stage 1 → ... → Stage 4 pipeline with per-section validation between stages, structural-diff feedback, hard gates. Use for component-heavy sites, sites with complex animation timing, or when default mode produces uneven results that need surgical iteration. ~3× the cost.
-
-If you don't know which to use, default. Switch to `--staged` only when default mode visibly fails fidelity.
-
-## Parse the request
-
-Accept forms like:
-
-- `clone https://example.com` — default mode, full capture
-- `mirror https://example.com --staged` — staged mode
-- `recreate https://example.com --viewports 375,768,1280`
-- `clone --replay <workspace_path>` — re-run from existing capture
-- `clone --replay <workspace_path> --section hero` — re-run a single section
-
-Flags:
-
-- `--staged` — opt into the strict staged-gate pipeline (slower, more thorough)
-- `--max-stage <1|2|3|4>` — stop after this stage (staged mode only; default 4)
-- `--from-stage <1|2|3|4>` — start at this stage; assumes prior stages are done (staged mode only; default 1)
-- `--viewports <csv>` — widths in px (default `375,768,1280,1920`)
-- `--replay <workspace_path>` — skip Stage 0 capture; reuse the bundle in `<workspace_path>/capture/`. Re-runs analyze (unless `--section`) + generation. Use this for prompt iteration without paying the ~3-minute capture cost.
-- `--section <id>` — only generate this single section. Requires `--replay` and an existing `manifest.json`. Use this when iterating on one specific section.
-- `--no-alt-height` — skip the vh-detection alt-height pass (faster capture, but the manifest will not have `vh_relative` flags).
-- `--no-section-shots` — skip the per-section cropped screenshot pass (faster capture).
-
-If the URL is missing or malformed AND `--replay` is not set, fail with one clear message — do not guess. If `--section` is set without `--replay`, that is a malformed request — fail.
-
-## Workspace
-
-Create the per-run workspace directory:
-
-```bash
-SLUG=$(echo "<url>" | sed -E 's#https?://##; s#/.*##; s#[^a-zA-Z0-9]#-#g')
-TS=$(date +%Y%m%d-%H%M%S)
-WS=".clone-workspace/${SLUG}-${TS}"
-mkdir -p "$WS"/{capture,logs,screenshots,diffs}
-```
-
-Generated code → `./src/`; assets → `./public/assets/cloned/`. Ensure asset folders exist before the pipeline:
-
-```bash
-mkdir -p public/assets/cloned/{images,videos,fonts,svgs,lottie}
-```
-
-## Pipeline — default mode
-
-### Step 0: Capture (always, unless --replay)
-
-If `--replay <workspace_path>` was passed, set `WS = <workspace_path>` and **invoke `capture` with `replay: true`** to refresh `meta.json` + `vh-flags.json` from existing capture data. Skip the rest of Step 0.
-
-Otherwise delegate to `clone-capture` with the URL, viewports, output dir, and any `--no-*` flags. Wait for completion. On capture failure, abort the run — there's nothing to analyze.
-
-### Step 1: Analyze
-
-If `--replay` is set AND `$WS/manifest.json` exists AND `--section <id>` was passed, **skip analyze** and reuse the existing manifest.
-
-Otherwise delegate to `clone-analyze`. It produces `$WS/manifest.json` with `sections[]`, `design_tokens`, `assets[]`, plus per-section `section_anchor`, `vh_relative`, `vh_value`, `full_width`, and `max_stage_required`. Read the manifest before moving on.
-
-### Step 2: Foundation generate
-
-The foundation files (`tailwind.config.ts`, `src/app/globals.css`, `src/app/layout.tsx`, `src/app/page.tsx` stub, `next/font/local` setup) must be written before any sections, since sections import from them. Always do this as a single, non-batched `clone-generate` call:
-
-```
-clone-generate({
-  manifest_path,
-  stage: 1,
-  section_id: <first section in DOM order>,    // also writes the foundation
-  capture_dir
-})
-```
-
-Tell generate explicitly: this call is responsible for foundation + the first section.
-
-### Step 3: Install conditional deps
-
-Inspect `manifest.detected_libs`. From cwd:
-
-- Always (if any sections have `max_stage_required >= 3`): `bun add framer-motion lottie-react`
-- If `detected_libs` includes `gsap`: `bun add gsap @gsap/react`
-- If any section has `max_stage_required == 4`: `bun add three @react-three/fiber @react-three/drei`
-- If the source uses Swiper-style carousels (visible from manifest section descriptions, e.g. hero/testimonials with multiple slides): `bun add swiper`
-
-Don't over-install. Skip libs the manifest doesn't justify.
-
-### Step 4: Parallel batched generation
-
-Generate the remaining sections in parallel batches. Each `clone-generate` call may handle up to 4 sections (`section_ids: [...]`) — they only write files under `src/components/sections/<Name>.tsx` and `src/components/cards/<Name>.tsx`, which don't conflict between sections. Do NOT batch the foundation call (Step 2).
-
-Dispatch multiple parallel `clone-generate` calls (up to ~4-5 concurrent) covering all remaining sections. For each call, pass per-section context including `section_anchor`, `vh_relative`, `vh_value`, `full_width` from the manifest — generate uses these directly.
-
-For sections with `max_stage_required == 4`, route to `clone-advanced` instead of `clone-generate`. If `clone-advanced` falls back to a video embed, that's a pass — flag in the final report.
-
-### Step 5: Visual review (always)
-
-After generation, start the dev server (`dev-server` tool) and capture screenshots at the canonical viewport (1280) at scroll positions 0, page-height/3, 2×page-height/3, page-height. Read each screenshot. Compare against the captured originals at `capture/screenshots/1280/step-NN.png` or `capture/section-shots/1280/section-NN.png`.
-
-Also `bun tsc --noEmit` to verify the project builds.
-
-Identify the worst-offending sections — usually 1-3 of them. "Worst offender" criteria:
-
-- Section is visibly missing content (image, text block, sub-component) that's clearly in the captured original
-- Layout is structurally wrong (wrong column count, wrong stacking, drastic height mismatch)
-- A specific element is clearly mis-styled (wrong color, missing background, wrong font scale)
-
-Sections that look approximately right but with small pixel-level deviations are NOT worst offenders — those are stage-2/3 polish concerns and not worth iterating on.
-
-### Step 6: Targeted fixes
-
-For each worst-offender section, dispatch a `clone-generate` call with:
-
-- The section_id
-- A `previous_diff_report` you author manually, listing the concrete issues you observed in Step 5 (e.g. `"Hero is missing the dataviz overlay illustration visible at top-right of the captured screenshot"`, `"FooterCta is using a flat green background but capture shows a radial gradient with a leaf-pattern background image"`)
-
-Optional: for sections where you can't tell what's wrong from pixels alone, invoke `clone-validate` ONCE for that section. It returns the structural diff (`dom-diff`) which gives concrete property-level feedback (`fontSize is 48px, should be 56px`). See `skills/validation-loop/SKILL.md`. Don't make this routine — only when you genuinely can't articulate the issue from looking.
-
-Cap targeted-fix iterations at 2 per section. After that, log the section to `$WS/logs/manual-review.md` and move on.
-
-### Step 7: Final report
-
-Write `$WS/logs/final-report.md`. Template below.
-
-## Pipeline — staged mode (--staged)
-
-When `--staged` is passed, replace Steps 4-6 above with the strict per-stage loop:
-
-For each stage `N` from `max(1, --from-stage)` to `min(4, --max-stage)`:
-
-1. Install deps for stage N (same rules as Step 3 above, but conditional on the stage).
-
-2. **Generate** for each section with `max_stage_required >= N`, in DOM order. Batching up to 4 sections per call is allowed; foundation file writes (stage 1 first call only) cannot be batched.
-
-3. **Validate** every section in the stage, **one section per call**:
-
-   ```
-   for section_id in stage_sections:
-     report = clone-validate({manifest_path, stage: N, section_id, capture_dir, workspace_dir})
-     if report.status == "pass": continue
-     if report.status == "fail":
-       clone-generate({..., previous_diff_report: report})
-       # then re-validate this same section_id
-   ```
-
-   Validate must invoke both pixel and structural diff channels (`screenshot-diff` and `dump-rendered` + `dom-diff`). See `skills/validation-loop/SKILL.md` for gate thresholds.
-
-   If validate returns empty or `status=error`: retry once, then log to `manual-review.md` and continue. Do NOT run `screenshot-diff` directly from the orchestrator — bypassing validate strips the structural diff channel.
-
-   **Hard cap: 3 iterations per section per stage.**
-
-4. After all sections in the stage are processed, check aggregate gate. Stage gates are from `skills/clone-staging/SKILL.md`. If the stage gate fails, pause and surface to the user — do not silently advance.
-
-## Non-goals (skip, do not attempt)
-
-When the manifest flags any of these in `third_party_widgets`, generate replaces them with a placeholder `<div>` of matching dimensions:
-
-- DRM'd video/audio (Widevine, FairPlay, PlayReady)
-- Third-party widgets: Intercom, Drift, Typeform, Calendly, HubSpot forms, chat widgets, cookie consent banners, analytics pixels
-- Authenticated or personalized content behind login
-- Obfuscated WASM modules
-- Real-time data feeds
-
-## Final report
-
-Write `$WS/logs/final-report.md`:
-
-```markdown
-# Clone Report: <url>
-
-## Summary
-
-- Mode: default | staged
-- Sections cloned: X/Y
-- Manual review needed: <count>
-- Assets downloaded: <count>
-- Assets skipped: <count> (reasons)
-
-## Sections
-
-| Section | Status | Notes                                   |
-| ------- | ------ | --------------------------------------- |
-| hero    | done   | uses min-h-[88vh] from vh_relative flag |
-
-## Manual review items
-
-- [section_id] — short reason, see `logs/manual-review.md`
-
-## Substitutions
-
-- Font "<Name>" → "<Fallback>" (reason)
-- <section>: WebGL reconstruction failed → MP4 fallback
-```
-
-Also write `$WS/logs/skipped.md` (third-party widgets, DRM, licensed fonts) and `$WS/logs/run.log`.
-
-## Rules
-
-- You are a coordinator. Never edit component files yourself — that's `clone-generate`'s job.
-- Never invent assets, URLs, or design tokens. If the manifest does not have it, the capture did not see it.
-- Default-mode visual review is your responsibility — read the screenshots, identify worst-offender sections, write concrete issue descriptions for the targeted-fix call. "Looks fine to me" with no pixel-diff or structural-diff verification is fine when the screenshots really do look fine; but call out the genuinely visible misses.
-- `clone-validate` is available on demand. It is REQUIRED in staged mode. In default mode, only call it when you cannot articulate the issue from looking at screenshots — and call it ONE SECTION AT A TIME.
-- If a sub-agent returns empty or errors twice on the same section, log to `manual-review.md` and move on. Don't burn the run on one broken section.
-- Respect `--max-stage` (staged mode). Stop cleanly there and still write the final report.
-- Be honest in the final report. If five sections needed manual review, say so.
diff --git a/.opencode/agents/clone-validate.md b/.opencode/agents/clone-validate.md
deleted file mode 100644
index 1d7c3b1..0000000
--- a/.opencode/agents/clone-validate.md
+++ /dev/null
@@ -1,199 +0,0 @@
----
-description: Two-channel validation for a SINGLE section — pixel diff (screenshots) plus structural DOM diff (rendered clone vs. captured source via __CLONE_DUMP_COMPUTED__). Returns pass/fail + ranked, actionable issues. In staged-mode runs the orchestrator calls this per-section per-stage. In default-mode runs the orchestrator calls this on-demand for specific sections that need investigation beyond visual review.
-mode: subagent
-tools:
-  read: true
-  list: true
-  bash: true
-  skill: true
-  screenshot-diff: true
-  dev-server: true
-  agent-browser-shot: true
-  dump-rendered: true
-  dom-diff: true
-steps: 20
----
-
-You are the Clone Validate sub-agent.
-
-You verify that a single section renders close enough to its captured source to pass the stage's gate (in staged mode) or to give the orchestrator concrete issues to act on (in default mode). You have **two diff channels**:
-
-1. **Pixel diff** — `screenshot-diff` over PNG screenshots. Catches visual mismatches.
-2. **Structural diff** — `dom-diff` over JSON DOM snapshots produced by the same `__CLONE_DUMP_COMPUTED__` walker the capture used. Catches missing elements, wrong sizes, wrong styles with concrete property/value pairs.
-
-Use both. The structural diff is the more actionable signal for the generate agent — the pixel diff is the fidelity check.
-
-## When you get called
-
-- **Staged-mode runs:** the orchestrator invokes you per-section per-stage as part of a strict generate→validate→iterate loop. Run both diff channels every time, return a structured report.
-- **Default-mode runs:** the orchestrator invokes you on-demand for sections it can't articulate issues on from visual review alone — typically 1-3 sections per run. Same behavior on your end: run both diff channels, return the report. The structural-diff `issues[]` is what the orchestrator will pass back to generate.
-
-Either way: your contract is the same. One section per call, both channels, structured JSON return. Whether you're called once or seventeen times is the orchestrator's concern.
-
-## Inputs
-
-```json
-{
-  "manifest_path": "<workspace>/manifest.json",
-  "stage": 1 | 2 | 3 | 4,
-  "section_id": "hero",
-  "capture_dir": "<workspace>/capture",
-  "workspace_dir": "<workspace>"
-}
-```
-
-**This agent is single-section by design.** `section_id` is singular, not an array. If the orchestrator passes ambiguous input ("validate all sections", missing `section_id`, etc.), return immediately with `{status: "error", reason: "section_id is required and must be a single string"}` rather than attempting batch work — the step budget cannot accommodate multi-section validation in one call.
-
-The project under test is always cwd. Dev server runs at http://localhost:3000.
-
-## Load the skill
-
-Load `skills/validation-loop/SKILL.md` for gate thresholds and tool usage.
-
-## Flow
-
-### 1. Ensure the dev server is running
-
-```
-devServer.health({ url: "http://localhost:3000" })
-```
-
-If not healthy:
-
-```
-devServer.start({ project_dir: "." })
-```
-
-Wait up to 30 seconds. If still not responding, return `{status: 'error', reason: 'dev_server_unreachable'}`.
-
-### 2. Read the manifest for this section
-
-- `manifest.sections[section_id].bounding_box` — coordinates at 1280px
-- `manifest.sections[section_id].dom_path` — source DOM JSON path
-- `manifest.sections[section_id].screenshot_paths` — captured PNGs per viewport
-- `manifest.sections[section_id].section_anchor` — `#id` or `.class` selector for the section root (for `dom-diff --root-selector`)
-- `manifest.viewports` — which viewports to test
-
-### 3. Pixel diff — screenshot the rendered section and diff
-
-For each viewport in `manifest.viewports`:
-
-```
-agentBrowserShot({
-  url: "http://localhost:3000/",
-  viewport: <width>,
-  scroll_y: <bbox.y - 80>,
-  output_path: "<workspace_dir>/screenshots/<section_id>-<viewport>.png",
-  reduce_motion: <true if stage==1>,
-  crop: { x: bbox.x, y: 80, width: bbox.width, height: bbox.height }
-})
-```
-
-Then:
-
-```
-diff({
-  before: "<capture_dir>/screenshots/<viewport>/step-NN.png" or "<capture_dir>/section-shots/<viewport>/section-XX.png",
-  after: "<workspace_dir>/screenshots/<section_id>-<viewport>.png",
-  threshold: 0.1
-})
-```
-
-Prefer `section-shots/<viewport>/section-XX.png` if available — those are pre-cropped to each section's bbox.
-
-### 4. Structural diff — dump rendered DOM and diff vs. captured source (REQUIRED — do not skip)
-
-This step is non-optional. The orchestrator depends on the `issues[]` array from `dom-diff` to feed actionable feedback to `clone-generate` on retries. Skipping this step (e.g. because pixel diff already failed) leaves generate guessing from pixels and the iteration loop fails to converge.
-
-For the canonical viewport (1280px — or the smallest viewport in `manifest.viewports` if 1280 is not present):
-
-```
-dumpRendered({
-  url: "http://localhost:3000/",
-  output: "<workspace_dir>/rendered-dom/<section_id>-1280.json",
-  viewport: 1280,
-  scroll_y: <bbox.y - 80>,
-  reduce_motion: <true if stage==1>
-})
-```
-
-Then:
-
-```
-domDiff({
-  captured: manifest.sections[section_id].dom_path,
-  rendered: "<workspace_dir>/rendered-dom/<section_id>-1280.json",
-  root_selector: manifest.sections[section_id].section_anchor || "#" + section_id
-})
-```
-
-Returns `{ matched, counts, issues: [string], structured_issues: [{...}] }`.
-
-If `dump-rendered` fails (init hooks didn't load, page errored, etc.) attempt it once more with a longer `settle_ms` (e.g. 1500). If it still fails, return `{status: "fail", reason: "rendered_dom_unavailable", issues: ["dump-rendered failed twice; structural diff unavailable for this section"]}` — do NOT silently fall back to pixel-only.
-
-### 5. Apply stage gate
-
-| Stage | Per-section gate                                                                                |
-| ----- | ----------------------------------------------------------------------------------------------- |
-| 1     | `diff_pct < 5%` at 1280px reduced-motion AND structural counts.missing == 0 AND no tag_mismatch |
-| 2     | `diff_pct < 3%` at rest AND structural style mismatches < 5                                     |
-| 3     | mean `diff_pct < 8%` across 5 scroll samples (animated sections)                                |
-| 4     | `diff_pct < 15%` (best effort)                                                                  |
-
-For stage 3, additionally sample 5 scroll positions for animated sections — the gate averages across them.
-
-### 6. On pass
-
-```json
-{
-  "status": "pass",
-  "section_id": "...",
-  "stage": <n>,
-  "viewports": { "375": {"diff_pct": 2.1, "structural_matched": 87, "issues": 0}, ... }
-}
-```
-
-### 7. On fail — emit actionable issues
-
-The `dom-diff` `issues` list is your primary feedback channel — it's already plain language and ranked by impact (`fontSize is 48px, should be 56px`, `section.hero > h1: missing in rendered`, `size 480x300, should be 560x420 (Δ16.7%)`).
-
-Take the top 3-6 issues from structural diff. If pixel diff caught anything structural didn't (color shifts inside a single matched element, gradient direction, image cropping), append 1-2 from looking at the diff PNG.
-
-```json
-{
-  "status": "fail",
-  "section_id": "...",
-  "stage": <n>,
-  "viewport": 1280,
-  "diff_pct": 7.4,
-  "structural": {
-    "matched": 76,
-    "missing": 2,
-    "style_mismatches": 5
-  },
-  "worst_regions": [{ "x": 120, "y": 88, "width": 340, "height": 60 }],
-  "issues": [
-    "section.hero > div[1]: missing in rendered (expected <img> #data-overlay, ~620x340)",
-    "section.hero > h1[0]: fontSize is 48px, should be 56px",
-    "section.hero: size 1280x634, should be 1280x792 (Δ22.4%) — likely vh-relative, use min-h-screen"
-  ],
-  "structured_issues": [...],
-  "diff_image_path": "<workspace>/diffs/hero-1280.png"
-}
-```
-
-If the manifest lists this section as `vh_relative`, prepend that hint to the issues list.
-
-The orchestrator passes this back to `clone-generate` as `previous_diff_report` for the next iteration.
-
-## Rules
-
-- **Do not edit component files.** Ever. If the diff fails, you report it — `clone-generate` fixes it.
-- **Do not restart the dev server on every call.** Only start if `health` says down.
-- **Cap iterations is the orchestrator's job, not yours.** You run once per invocation.
-- **Run both diff channels every time.** Pixel-only is not a pass — `dom-diff` is what gives the next generate iteration something to act on. If you skip it, generate guesses from pixels and the loop won't converge.
-- **One section per invocation.** Do not attempt to validate multiple sections or "all sections at once" even if asked — return an error and let the orchestrator iterate.
-- **Lead with structural issues** — they are concrete and reproducible. Fall back to pixel-diff descriptions only when structural didn't catch a real visible issue.
-- **Be specific.** "Headline too big" is useless. "section.hero > h1[0]: fontSize is 48px, should be 56px" is the goal — and `dom-diff` produces exactly that form, so use its output verbatim where you can.
-- **Always return a parseable JSON object.** Even on internal failure, return `{status: "error", reason: "..."}` so the orchestrator can decide what to do. An empty / no-text return is a worst-case outcome — the orchestrator has no signal to act on.
-- **If diff_pct > 30% AND structural counts.missing > 0**, the structural mismatch is dominating — say so directly: `"Structural mismatch — clone is missing <N> elements present in source; layout will not converge until those are added"`.
diff --git a/.opencode/fixtures/test-site/README.md b/.opencode/fixtures/test-site/README.md
deleted file mode 100644
index 4abdb84..0000000
--- a/.opencode/fixtures/test-site/README.md
+++ /dev/null
@@ -1,69 +0,0 @@
-# Capture-fixture site
-
-A small static site that exercises the capture-side ailing patterns we found on real WordPress / Elementor targets:
-
-| Section                  | What it tests                                                                                        |
-| ------------------------ | ---------------------------------------------------------------------------------------------------- |
-| `#hero`                  | `min-height: calc(100vh - var(--nav-h))` — vh detection should flag this                             |
-| `#features`              | full-width gradient + content `max-width` inner — `full_width` detection                             |
-| `#features .card.reveal` | IntersectionObserver-driven opacity reveal — only renders correctly when capture scrolls into view   |
-| `#bg`                    | lazy-loaded background-image (class toggle on intersection) — CSS-rule extraction must catch the URL |
-| `#bg::after`             | `::before/::after` decorative bg-image — pseudo-element styles must be captured                      |
-| `#marquee`               | CSS-keyframes infinite scroll with offscreen items — capture should still see all 8 logos            |
-| `#detailed-svg`          | inline SVG with `<defs>`, `<linearGradient>`, complex paths — must be preserved verbatim             |
-
-## Serve
-
-```bash
-cd .opencode/fixtures/test-site
-python3 -m http.server 8765
-# http://localhost:8765
-```
-
-## Run capture against the fixture
-
-```bash
-SLUG=fixture
-TS=$(date +%Y%m%d-%H%M%S)
-WS=".clone-workspace/${SLUG}-${TS}"
-mkdir -p "$WS"
-python3 .opencode/scripts/capture.py \
-  --url http://localhost:8765 \
-  --viewports 1280 \
-  --output "$WS/capture"
-```
-
-Then verify the new signals are present:
-
-```bash
-# vh detection
-jq '.[0:5]' "$WS/vh-flags.json"            # expect #hero or .hero with vh ≈ 91 (= (720-64)/720*100)
-
-# CSS asset extraction
-jq '.assets[] | select(.from_css)' "$WS/capture/meta.json"  # expect ./hero-bg.svg + ./decoration.svg
-
-# section discovery
-jq '.[0].selector,.[1].selector,.[2].selector' "$WS/capture/sections/1280.json"
-
-# per-section screenshots
-ls "$WS/capture/section-shots/1280/"
-```
-
-## Iterate fast
-
-```bash
-# Replay only the post-process (vh-flags, meta.json) — sub-second
-python3 .opencode/scripts/capture.py --replay --output "$WS/capture"
-
-# Diff a rendered clone vs the captured fixture
-python3 .opencode/scripts/dump-rendered.py \
-  --url http://localhost:3000/ \
-  --output /tmp/rendered.json \
-  --viewport 1280 --scroll-y 0
-python3 .opencode/scripts/dom-diff.py \
-  --captured "$WS/capture/dom/1280/step-00.json" \
-  --rendered /tmp/rendered.json \
-  --root-selector "#hero"
-```
-
-The fixture is intentionally tiny so a full capture takes <5s. Use it to validate any capture-side change before re-running against a real site.
diff --git a/.opencode/fixtures/test-site/decoration.svg b/.opencode/fixtures/test-site/decoration.svg
deleted file mode 100644
index 1f740f4..0000000
--- a/.opencode/fixtures/test-site/decoration.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
-  <circle cx="32" cy="32" r="28" fill="none" stroke="#22c55e" stroke-width="3" />
-  <path d="M20 36 L28 44 L46 22" fill="none" stroke="#22c55e" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" />
-</svg>
diff --git a/.opencode/fixtures/test-site/hero-bg.svg b/.opencode/fixtures/test-site/hero-bg.svg
deleted file mode 100644
index 1025464..0000000
--- a/.opencode/fixtures/test-site/hero-bg.svg
+++ /dev/null
@@ -1,20 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 600" preserveAspectRatio="xMidYMid slice">
-  <defs>
-    <linearGradient id="sky" x1="0" y1="0" x2="0" y2="1">
-      <stop offset="0" stop-color="#0c4a6e" />
-      <stop offset="1" stop-color="#082f49" />
-    </linearGradient>
-    <radialGradient id="glow" cx="50%" cy="40%" r="50%">
-      <stop offset="0" stop-color="#22c55e" stop-opacity="0.5" />
-      <stop offset="1" stop-color="#22c55e" stop-opacity="0" />
-    </radialGradient>
-  </defs>
-  <rect width="1200" height="600" fill="url(#sky)" />
-  <circle cx="600" cy="240" r="220" fill="url(#glow)" />
-  <g stroke="#22c55e" stroke-width="2" fill="none" opacity="0.4">
-    <path d="M0 480 Q 300 360, 600 480 T 1200 480" />
-    <path d="M0 520 Q 300 420, 600 520 T 1200 520" />
-    <path d="M0 560 Q 300 480, 600 560 T 1200 560" />
-  </g>
-</svg>
diff --git a/.opencode/fixtures/test-site/index.html b/.opencode/fixtures/test-site/index.html
deleted file mode 100644
index d15bc1f..0000000
--- a/.opencode/fixtures/test-site/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Capture Fixture — vh, lazy-bg, marquee, SVG, IO reveal</title>
-    <link rel="stylesheet" href="./styles.css" />
-  </head>
-  <body>
-    <header class="nav">
-      <a href="#" class="logo">Fixture</a>
-      <nav>
-        <a href="#hero">Hero</a>
-        <a href="#features">Features</a>
-        <a href="#bg">Lazy BG</a>
-        <a href="#marquee">Marquee</a>
-        <a href="#footer">Footer</a>
-      </nav>
-    </header>
-
-    <!-- Section A: vh-relative hero. 100vh - 64px nav. -->
-    <section id="hero" class="hero">
-      <h1>Full-fold hero</h1>
-      <p>
-        This section's height is <code>min-height: calc(100vh - 64px)</code>. At a 1280×720 capture it resolves to
-        656px; at 1280×1080 it resolves to 1016px. The <code>vh-flags.json</code> output should pick this up and set
-        <code>vh_value: 91</code>.
-      </p>
-      <a href="#" class="cta">Get started</a>
-    </section>
-
-    <!-- Section B: full-width gradient, content max-width inside -->
-    <section id="features" class="features">
-      <div class="inner">
-        <h2>Three cards</h2>
-        <ul class="grid">
-          <li class="card reveal">
-            <svg class="icon" viewBox="0 0 32 32">
-              <path d="M4 16 L14 26 L28 6" stroke="currentColor" stroke-width="3" fill="none" stroke-linecap="round" />
-            </svg>
-            <h3>Reveal me</h3>
-            <p>
-              I fade in via IntersectionObserver. A capture that doesn't trigger the IO callback will leave me at
-              opacity 0.
-            </p>
-          </li>
-          <li class="card reveal">
-            <svg class="icon" viewBox="0 0 32 32">
-              <circle cx="16" cy="16" r="12" stroke="currentColor" stroke-width="3" fill="none" />
-            </svg>
-            <h3>Reveal me too</h3>
-            <p>Same pattern. Stagger delay applied via inline style.</p>
-          </li>
-          <li class="card reveal">
-            <svg class="icon" viewBox="0 0 32 32">
-              <rect x="6" y="6" width="20" height="20" rx="3" stroke="currentColor" stroke-width="3" fill="none" />
-            </svg>
-            <h3>And me</h3>
-            <p>Three cards = repeated_pattern candidate.</p>
-          </li>
-        </ul>
-      </div>
-    </section>
-
-    <!-- Section C: lazy-loaded background image. The CSS sets bg via a class that we toggle with IO. -->
-    <section id="bg" class="lazy-bg">
-      <div class="inner">
-        <h2>Background loads on scroll</h2>
-        <p>
-          Until I'm intersected, my background-image is "none". After IO fires I get a CSS-driven background. Capture
-          must either scroll into view or follow the CSS rule from
-          <code>css-rules/&lt;vp&gt;.json</code> to know the bg URL.
-        </p>
-      </div>
-    </section>
-
-    <!-- Section D: Swiper-style marquee with offscreen items the response listener misses -->
-    <section id="marquee" class="marquee">
-      <h2>Marquee</h2>
-      <div class="track">
-        <!-- 8 logos; the first 4 are visible at the capture viewport, the rest drift in via translate -->
-        <div class="logo-tile" data-idx="1">
-          <svg viewBox="0 0 80 32"><text x="0" y="22" font-size="20" fill="currentColor">A1</text></svg>
-        </div>
-        <div class="logo-tile" data-idx="2">
-          <svg viewBox="0 0 80 32"><text x="0" y="22" font-size="20" fill="currentColor">A2</text></svg>
-        </div>
-        <div class="logo-tile" data-idx="3">
-          <svg viewBox="0 0 80 32"><text x="0" y="22" font-size="20" fill="currentColor">A3</text></svg>
-        </div>
-        <div class="logo-tile" data-idx="4">
-          <svg viewBox="0 0 80 32"><text x="0" y="22" font-size="20" fill="currentColor">A4</text></svg>
-        </div>
-        <div class="logo-tile" data-idx="5">
-          <svg viewBox="0 0 80 32"><text x="0" y="22" font-size="20" fill="currentColor">B1</text></svg>
-        </div>
-        <div class="logo-tile" data-idx="6">
-          <svg viewBox="0 0 80 32"><text x="0" y="22" font-size="20" fill="currentColor">B2</text></svg>
-        </div>
-        <div class="logo-tile" data-idx="7">
-          <svg viewBox="0 0 80 32"><text x="0" y="22" font-size="20" fill="currentColor">B3</text></svg>
-        </div>
-        <div class="logo-tile" data-idx="8">
-          <svg viewBox="0 0 80 32"><text x="0" y="22" font-size="20" fill="currentColor">B4</text></svg>
-        </div>
-      </div>
-    </section>
-
-    <!-- Section E: detailed SVG. Inline; the agent should preserve every path. -->
-    <section id="detailed-svg" class="detailed-svg">
-      <h2>Detailed SVG</h2>
-      <svg viewBox="0 0 200 100" width="400" height="200" xmlns="http://www.w3.org/2000/svg">
-        <defs>
-          <linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="0%">
-            <stop offset="0%" stop-color="#0ea5e9" />
-            <stop offset="100%" stop-color="#22c55e" />
-          </linearGradient>
-        </defs>
-        <rect x="0" y="0" width="200" height="100" fill="url(#g1)" rx="8" />
-        <path d="M10 80 Q 50 20, 100 50 T 190 30" stroke="#fff" stroke-width="3" fill="none" />
-        <circle cx="100" cy="50" r="6" fill="#fff" />
-        <text x="50%" y="92%" text-anchor="middle" font-size="12" fill="#fff">cluster</text>
-      </svg>
-    </section>
-
-    <footer id="footer" class="footer">
-      <p>© Fixture site — for capture-side regression testing only.</p>
-    </footer>
-
-    <script src="./reveal.js"></script>
-  </body>
-</html>
diff --git a/.opencode/fixtures/test-site/reveal.js b/.opencode/fixtures/test-site/reveal.js
deleted file mode 100644
index 3f5cac0..0000000
--- a/.opencode/fixtures/test-site/reveal.js
+++ /dev/null
@@ -1,27 +0,0 @@
-// Minimal IntersectionObserver-driven reveal + lazy-bg trigger.
-// The capture pipeline must scroll into view (or follow the CSS rule) for
-// these to fire. This is the same pattern Elementor and most WP themes use.
-
-(() => {
-  const reveals = document.querySelectorAll('.reveal');
-  const lazyBg = document.querySelector('.lazy-bg');
-
-  const io = new IntersectionObserver(
-    (entries) => {
-      for (const e of entries) {
-        if (e.isIntersecting) {
-          if (e.target.classList.contains('reveal')) e.target.classList.add('is-visible');
-          if (e.target === lazyBg) e.target.classList.add('is-loaded');
-          io.unobserve(e.target);
-        }
-      }
-    },
-    { threshold: 0.15 }
-  );
-
-  reveals.forEach((r, i) => {
-    r.style.transitionDelay = `${i * 120}ms`;
-    io.observe(r);
-  });
-  if (lazyBg) io.observe(lazyBg);
-})();
diff --git a/.opencode/fixtures/test-site/styles.css b/.opencode/fixtures/test-site/styles.css
deleted file mode 100644
index ed8b711..0000000
--- a/.opencode/fixtures/test-site/styles.css
+++ /dev/null
@@ -1,265 +0,0 @@
-/* Capture fixture stylesheet — deliberately includes patterns that the cropin clone got wrong:
-   vh-based heights, full-bleed widths, lazy-load gating via class toggle, marquee transform,
-   pseudo-element decoration, multi-stop gradient. */
-
-:root {
-  --nav-h: 64px;
-  --accent: #22c55e;
-  --accent-dark: #166534;
-  --bg: #f8fafc;
-  --text: #0f172a;
-  --muted: #64748b;
-}
-
-* {
-  box-sizing: border-box;
-}
-body {
-  margin: 0;
-  font-family: system-ui, -apple-system, sans-serif;
-  color: var(--text);
-  background: var(--bg);
-  line-height: 1.5;
-}
-
-.nav {
-  position: sticky;
-  top: 0;
-  z-index: 50;
-  height: var(--nav-h);
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0 24px;
-  background: white;
-  border-bottom: 1px solid #e2e8f0;
-}
-.nav .logo {
-  font-weight: 700;
-  text-decoration: none;
-  color: var(--text);
-}
-.nav nav {
-  display: flex;
-  gap: 16px;
-}
-.nav nav a {
-  color: var(--muted);
-  text-decoration: none;
-}
-.nav nav a:hover {
-  color: var(--text);
-}
-
-/* === Section A: vh-relative hero ===
-   The point of this section: computed.minHeight resolves to 656px at capture,
-   1016px on the user's 1080-tall viewport. The capture's vh-detection pass
-   should flag this as ~91vh. */
-.hero {
-  min-height: calc(100vh - var(--nav-h));
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: 16px;
-  padding: 32px;
-  text-align: center;
-  background: linear-gradient(135deg, #ecfdf5 0%, #f0f9ff 100%);
-}
-.hero h1 {
-  font-size: clamp(36px, 6vw, 64px);
-  margin: 0;
-}
-.hero p {
-  max-width: 56ch;
-  margin: 0;
-  color: var(--muted);
-}
-.hero .cta {
-  display: inline-block;
-  padding: 12px 24px;
-  background: var(--accent);
-  color: white;
-  font-weight: 600;
-  border-radius: 9999px;
-  text-decoration: none;
-  transition: transform 200ms;
-}
-.hero .cta:hover {
-  transform: translateY(-2px);
-}
-
-/* === Section B: full-width gradient with inner max-width container === */
-.features {
-  width: 100vw;
-  background: linear-gradient(180deg, #ffffff 0%, #f1f5f9 100%);
-  padding: 80px 0;
-}
-.features .inner {
-  max-width: 1200px;
-  margin: 0 auto;
-  padding: 0 24px;
-}
-.features h2 {
-  font-size: 36px;
-  margin: 0 0 32px;
-}
-.grid {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  gap: 24px;
-}
-.card {
-  padding: 24px;
-  background: white;
-  border-radius: 12px;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.06);
-}
-.card .icon {
-  width: 32px;
-  height: 32px;
-  color: var(--accent-dark);
-  margin-bottom: 12px;
-}
-.card h3 {
-  margin: 0 0 8px;
-  font-size: 20px;
-}
-.card p {
-  margin: 0;
-  color: var(--muted);
-}
-
-/* IntersectionObserver reveal — class .is-visible toggled via reveal.js */
-.reveal {
-  opacity: 0;
-  transform: translateY(16px);
-  transition: opacity 600ms ease, transform 600ms ease;
-}
-.reveal.is-visible {
-  opacity: 1;
-  transform: translateY(0);
-}
-
-/* === Section C: lazy-loaded background image ===
-   The class .is-loaded is added once IO fires. Until then, no bg image — and the
-   browser does NOT GET-request the URL. capture/css-rules/<vp>.json will still
-   contain the rule though, so a CSS-asset-extraction pass should pick it up. */
-.lazy-bg {
-  width: 100%;
-  min-height: 480px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  position: relative;
-  background-color: #0f172a;
-  color: white;
-  text-align: center;
-  padding: 64px 24px;
-  overflow: hidden;
-}
-.lazy-bg::before {
-  content: '';
-  position: absolute;
-  inset: 0;
-  background-image: linear-gradient(180deg, rgba(15, 23, 42, 0.4) 0%, rgba(15, 23, 42, 0.7) 100%);
-  z-index: 1;
-}
-.lazy-bg .inner {
-  position: relative;
-  z-index: 2;
-  max-width: 720px;
-}
-.lazy-bg h2 {
-  margin: 0 0 16px;
-  font-size: 36px;
-}
-.lazy-bg p {
-  margin: 0;
-  color: rgba(255, 255, 255, 0.85);
-}
-.lazy-bg.is-loaded {
-  background-image: url('./hero-bg.svg');
-  background-size: cover;
-  background-position: center;
-}
-/* Decorative content-image ::before that uses url() but is set in the stylesheet only. */
-.lazy-bg::after {
-  content: '';
-  position: absolute;
-  right: 24px;
-  bottom: 24px;
-  width: 64px;
-  height: 64px;
-  background-image: url('./decoration.svg');
-  background-size: contain;
-  background-repeat: no-repeat;
-  z-index: 2;
-  opacity: 0.85;
-}
-
-/* === Section D: marquee with overflow + transform translation === */
-.marquee {
-  padding: 64px 0;
-  background: white;
-  text-align: center;
-  overflow-x: hidden;
-}
-.marquee h2 {
-  margin: 0 0 24px;
-  font-size: 36px;
-}
-.marquee .track {
-  display: flex;
-  gap: 48px;
-  animation: scroll 20s linear infinite;
-  width: max-content;
-  padding: 0 24px;
-}
-.logo-tile {
-  flex: 0 0 auto;
-  height: 32px;
-  width: 80px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--muted);
-}
-.logo-tile svg {
-  height: 100%;
-  width: 100%;
-}
-@keyframes scroll {
-  from {
-    transform: translateX(0);
-  }
-  to {
-    transform: translateX(-50%);
-  }
-}
-
-/* === Section E: detailed inline SVG === */
-.detailed-svg {
-  padding: 64px 24px;
-  text-align: center;
-}
-.detailed-svg h2 {
-  margin: 0 0 24px;
-  font-size: 36px;
-}
-.detailed-svg svg {
-  display: block;
-  margin: 0 auto;
-}
-
-/* === Footer === */
-.footer {
-  padding: 32px 24px;
-  background: #0f172a;
-  color: rgba(255, 255, 255, 0.7);
-  text-align: center;
-}
diff --git a/.opencode/package.json b/.opencode/package.json
deleted file mode 100644
index 21dedf6..0000000
--- a/.opencode/package.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-  "dependencies": {
-    "@opencode-ai/plugin": "1.16.2"
-  }
-}
diff --git a/.opencode/scripts/capture.py b/.opencode/scripts/capture.py
deleted file mode 100755
index 5314ce4..0000000
--- a/.opencode/scripts/capture.py
+++ /dev/null
@@ -1,913 +0,0 @@
-#!/usr/bin/env python3
-"""
-capture.py — Playwright-based site capture for the clone pipeline.
-
-Produces a full capture bundle at --output. Layout is documented in
-.opencode/skills/site-manifest/SKILL.md and consumed by the analyze + generate
-agents.
-
-Pipeline:
-  Stage 0: Per-viewport scroll-loop capture — DOM + computed styles, screenshots,
-           HAR, animation library dumps, fonts, css-vars, css-rules.
-  Stage 1: Alt-height capture at the canonical desktop width (1280) for
-           vh-relative detection.
-  Stage 2: Per-section cropped screenshot pass — scroll each candidate section
-           into view and crop to its bbox.
-  Stage 3: Post-process — derive vh-relative flags, merge HAR + CSS asset URLs,
-           write meta.json.
-
-Replay mode: --replay skips stages 0-2 and only re-runs stage 3 against existing
-capture data. Use this when iterating on prompts/agents/skills without paying the
-~3-minute capture cost again.
-
-Dependencies: playwright (pip install playwright && playwright install chromium)
-"""
-
-from __future__ import annotations
-
-import argparse
-import hashlib
-import json
-import os
-import re
-import sys
-import time
-from pathlib import Path
-from urllib.parse import unquote, urlparse
-
-try:
-    from playwright.sync_api import sync_playwright, TimeoutError as PWTimeout
-except ImportError:
-    print(json.dumps({"error": "Missing dependencies. pip install playwright && playwright install chromium"}), file=sys.stderr)
-    sys.exit(1)
-
-
-THIRD_PARTY_HOST_RE = re.compile(
-    r"(intercom\.io|driftt\.com|drift\.com|typeform\.com|calendly\.com|hsforms\.(net|com)|"
-    r"cookielaw\.org|cookiebot\.com|osano\.com|googletagmanager\.com|google-analytics\.com|"
-    r"segment\.(io|com)|hotjar\.com|fullstory\.com)"
-)
-
-# Viewport that the analyze agent treats as canonical desktop. We capture a second
-# DOM dump at this width but a different height to detect vh-relative dimensions.
-CANONICAL_WIDTH = 1280
-CANONICAL_HEIGHT_PRIMARY = 720
-CANONICAL_HEIGHT_ALT = 1080
-
-
-def sha1_8(s: str) -> str:
-    return hashlib.sha1(s.encode("utf-8")).hexdigest()[:8]
-
-
-def sanitize(name: str) -> str:
-    name = name.lower()
-    name = re.sub(r"\s+", "-", name)
-    name = re.sub(r"[^a-z0-9.\-]", "", name)
-    return name[:80] or "asset"
-
-
-def load_init_hooks(hooks_dir: Path) -> list[str]:
-    sources: list[str] = []
-    for path in sorted(hooks_dir.glob("*.js")):
-        sources.append(path.read_text())
-    return sources
-
-
-def asset_type_from_url(url: str, content_type: str | None) -> str | None:
-    u = url.lower().split("?", 1)[0]
-    ct = (content_type or "").lower()
-    # SVG must be checked before generic image/* — content-type "image/svg+xml" matches both.
-    if u.endswith(".svg") or ct == "image/svg+xml":
-        return "svg"
-    if any(u.endswith(ext) for ext in (".jpg", ".jpeg", ".png", ".webp", ".avif", ".gif")) or ct.startswith("image/"):
-        return "image"
-    if any(u.endswith(ext) for ext in (".mp4", ".mov", ".webm")) or ct.startswith("video/"):
-        return "video"
-    if any(u.endswith(ext) for ext in (".woff2", ".woff", ".ttf", ".otf")) or ct in (
-        "font/woff2", "font/woff", "font/ttf", "application/font-woff2", "application/font-woff", "application/x-font-ttf"
-    ):
-        return "font"
-    if u.endswith(".json") and ("lottie" in u or "animations" in u):
-        return "lottie"
-    return None
-
-
-def asset_type_from_url_only(url: str) -> str | None:
-    return asset_type_from_url(url, None)
-
-
-def viewport_height_for(width: int) -> int:
-    """Default capture height — 16:9 ratio, but rounded sensibly."""
-    return round(width * 9 / 16)
-
-
-# ---------------------------------------------------------------------------
-# Browser helpers
-# ---------------------------------------------------------------------------
-
-
-def make_context(browser, viewport_w: int, viewport_h: int, har_path: Path | None, init_sources: list[str], skip_third_party: bool):
-    ctx_kwargs = {"viewport": {"width": viewport_w, "height": viewport_h}}
-    if har_path is not None:
-        ctx_kwargs["record_har_path"] = str(har_path)
-    ctx = browser.new_context(**ctx_kwargs)
-
-    if skip_third_party:
-        def route_handler(route):
-            if THIRD_PARTY_HOST_RE.search(route.request.url):
-                route.abort()
-            else:
-                route.continue_()
-        ctx.route("**/*", route_handler)
-
-    for src in init_sources:
-        ctx.add_init_script(src)
-
-    return ctx
-
-
-def goto_and_settle(page, url: str, wait_strategy: str) -> None:
-    try:
-        page.goto(url, wait_until=wait_strategy, timeout=60_000)
-    except PWTimeout:
-        page.goto(url, wait_until="domcontentloaded", timeout=60_000)
-
-    try:
-        page.evaluate("() => document.fonts.ready")
-    except Exception:
-        pass
-
-    try:
-        page.wait_for_function("window.__CLONE_READY__ === true", timeout=10_000)
-    except Exception:
-        pass
-
-
-def dump_dom(page) -> dict:
-    """Use the rich __CLONE_DUMP_COMPUTED__ walker (which filters per-tag defaults
-    and captures pseudo-elements). Falls back to a minimal walk if the hook
-    didn't load."""
-    try:
-        out = page.evaluate("() => (typeof window.__CLONE_DUMP_COMPUTED__ === 'function') ? window.__CLONE_DUMP_COMPUTED__() : null")
-        if out is not None:
-            return out
-    except Exception:
-        pass
-    return page.evaluate(
-        """() => {
-            const serialize = (el) => {
-                if (el.nodeType === Node.TEXT_NODE) {
-                    const t = el.textContent;
-                    return t && t.trim() ? { text: t } : null;
-                }
-                if (el.nodeType !== Node.ELEMENT_NODE) return null;
-                const cs = getComputedStyle(el);
-                const computed = {};
-                for (const p of ['color','backgroundColor','backgroundImage','fontFamily','fontSize','fontWeight','lineHeight','display','width','height','padding','margin','position']) {
-                    const v = cs[p];
-                    if (v && v !== 'normal' && v !== 'none' && v !== 'auto' && v !== '0px' && v !== 'rgba(0, 0, 0, 0)') computed[p] = v;
-                }
-                const attrs = {};
-                for (const a of el.attributes) attrs[a.name] = a.value;
-                const r = el.getBoundingClientRect();
-                const children = [];
-                for (const c of el.childNodes) { const s = serialize(c); if (s) children.push(s); }
-                return {
-                    tag: el.tagName.toLowerCase(),
-                    attrs,
-                    computed,
-                    bbox: { x: r.x, y: r.y + window.scrollY, width: r.width, height: r.height },
-                    children,
-                };
-            };
-            return serialize(document.body);
-        }"""
-    )
-
-
-def list_sections(page) -> list[dict]:
-    try:
-        return page.evaluate("() => (typeof window.__CLONE_LIST_SECTIONS__ === 'function') ? window.__CLONE_LIST_SECTIONS__() : []") or []
-    except Exception:
-        return []
-
-
-def smart_scroll_targets(sections: list[dict], page_height: int, viewport_h: int) -> list[int]:
-    """Compute scroll y positions to visit. We always include 0 (top), then
-    each section's y minus a small offset, deduped. Also fill any gap larger
-    than 1.5x viewport_h with intermediate stops so we don't skip content
-    between sections.
-    """
-    raw = [0]
-    for sec in sections:
-        y = max(int(sec.get("y") or 0) - 80, 0)
-        raw.append(y)
-    raw.append(max(page_height - viewport_h, 0))
-
-    # Sort + dedupe + fill gaps
-    raw = sorted(set(raw))
-    filled: list[int] = []
-    for i, y in enumerate(raw):
-        if filled and y - filled[-1] > int(viewport_h * 1.5):
-            mid = filled[-1] + viewport_h
-            while mid < y - viewport_h:
-                filled.append(mid)
-                mid += viewport_h
-        filled.append(y)
-    # Cap to avoid pathological cases
-    return filled[:50]
-
-
-def settle(page, max_ms: int = 1500) -> None:
-    """Wait for the layout to settle: networkidle attempt + a short fixed delay
-    + waitForFunction on document.fonts.ready. If a MutationObserver fires
-    rapidly, we yield more time up to max_ms."""
-    deadline = time.monotonic() + (max_ms / 1000.0)
-    try:
-        page.wait_for_load_state("networkidle", timeout=max(int(max_ms / 2), 500))
-    except Exception:
-        pass
-    remaining = deadline - time.monotonic()
-    if remaining > 0:
-        # Watch for mutation activity; if quiet for 250ms, return
-        try:
-            page.evaluate(
-                """async (maxMs) => {
-                    return await new Promise((resolve) => {
-                        let lastMutation = performance.now();
-                        const start = lastMutation;
-                        const obs = new MutationObserver(() => { lastMutation = performance.now(); });
-                        obs.observe(document.body, { subtree: true, childList: true, attributes: true });
-                        const tick = () => {
-                            const now = performance.now();
-                            if (now - lastMutation > 250 || now - start > maxMs) { obs.disconnect(); resolve(true); }
-                            else requestAnimationFrame(tick);
-                        };
-                        tick();
-                    });
-                }""",
-                int(remaining * 1000),
-            )
-        except Exception:
-            time.sleep(min(remaining, 0.5))
-
-
-# ---------------------------------------------------------------------------
-# Stage 0 — per-viewport scroll-loop capture
-# ---------------------------------------------------------------------------
-
-
-def capture_viewport(
-    browser,
-    viewport_width: int,
-    url: str,
-    wait_strategy: str,
-    init_sources: list[str],
-    output_dir: Path,
-    skip_third_party: bool,
-) -> dict:
-    viewport_height = viewport_height_for(viewport_width)
-    vp_dir = output_dir / "screenshots" / str(viewport_width)
-    dom_dir = output_dir / "dom" / str(viewport_width)
-    har_dir = output_dir / "har"
-    for d in (vp_dir, dom_dir, har_dir):
-        d.mkdir(parents=True, exist_ok=True)
-
-    har_path = har_dir / f"{viewport_width}.har"
-    page_context = make_context(browser, viewport_width, viewport_height, har_path, init_sources, skip_third_party)
-
-    page = page_context.new_page()
-    discovered_assets: dict[str, dict] = {}
-
-    def on_response(response):
-        try:
-            url_ = response.url
-            content_type = response.headers.get("content-type")
-            t = asset_type_from_url(url_, content_type)
-            if t is None:
-                return
-            if url_ in discovered_assets:
-                return
-            discovered_assets[url_] = {
-                "type": t,
-                "source_url": url_,
-                "content_type": content_type,
-                "status": response.status,
-            }
-        except Exception:
-            pass
-
-    page.on("response", on_response)
-    goto_and_settle(page, url, wait_strategy)
-
-    sections = list_sections(page)
-    page_height = page.evaluate("() => document.documentElement.scrollHeight") or 0
-    targets = smart_scroll_targets(sections, page_height, viewport_height)
-
-    for step, y in enumerate(targets):
-        page.evaluate(f"window.scrollTo({{ top: {y}, behavior: 'instant' }})")
-        settle(page, max_ms=1200)
-        page.screenshot(path=str(vp_dir / f"step-{step:02d}.png"), full_page=False)
-        snapshot = dump_dom(page)
-        (dom_dir / f"step-{step:02d}.json").write_text(json.dumps(snapshot, separators=(",", ":")))
-
-    # Pull animation/css-rules hook output
-    hook_output = page.evaluate("() => window.__CLONE_CAPTURE__ || {}") or {}
-    for kind in ("shaders", "gsap", "framer", "lottie", "threejs"):
-        d = output_dir / kind
-        d.mkdir(parents=True, exist_ok=True)
-        (d / f"{viewport_width}.json").write_text(json.dumps(hook_output.get(kind, []), indent=2))
-    for kind, dirname in (("cssVars", "css-vars"), ("fonts", "fonts"), ("cssRules", "css-rules")):
-        d = output_dir / dirname
-        d.mkdir(parents=True, exist_ok=True)
-        (d / f"{viewport_width}.json").write_text(json.dumps(hook_output.get(kind, {}), indent=2))
-
-    # Dump candidate sections per viewport (analyze agent uses these)
-    sec_dir = output_dir / "sections"
-    sec_dir.mkdir(parents=True, exist_ok=True)
-    (sec_dir / f"{viewport_width}.json").write_text(json.dumps(sections, indent=2))
-
-    # Hover capture
-    try:
-        hover_rects = page.evaluate(
-            """() => {
-                const els = document.querySelectorAll('a, button, [role="button"], [data-cta]');
-                const out = [];
-                for (const el of els) {
-                    const r = el.getBoundingClientRect();
-                    if (r.width < 40 || r.height < 20) continue;
-                    out.push({ x: r.x + r.width/2, y: r.y + r.height/2, tag: el.tagName });
-                    if (out.length >= 10) break;
-                }
-                return out;
-            }"""
-        )
-        hover_dir = output_dir / "screenshots" / str(viewport_width) / "hover"
-        hover_dir.mkdir(parents=True, exist_ok=True)
-        for idx, pos in enumerate(hover_rects):
-            try:
-                page.mouse.move(pos["x"], pos["y"])
-                time.sleep(0.2)
-                page.screenshot(path=str(hover_dir / f"hover-{idx:02d}.png"), full_page=False)
-            except Exception:
-                continue
-    except Exception:
-        pass
-
-    page.close()
-    page_context.close()
-
-    return {
-        "viewport": viewport_width,
-        "height": viewport_height,
-        "steps": len(targets),
-        "section_candidates": len(sections),
-        "hook_output_keys": [k for k in hook_output.keys()],
-        "har": str(har_path.relative_to(output_dir)),
-        "assets": discovered_assets,
-    }
-
-
-# ---------------------------------------------------------------------------
-# Stage 1 — alt-height capture at canonical width (vh detection)
-# ---------------------------------------------------------------------------
-
-
-def capture_alt_height(browser, url: str, wait_strategy: str, init_sources: list[str], output_dir: Path, skip_third_party: bool) -> dict:
-    """Capture only DOM at scroll 0 at (CANONICAL_WIDTH x CANONICAL_HEIGHT_ALT).
-    The post-process compares this to the primary capture to flag vh-relative
-    dimensions."""
-    page_context = make_context(browser, CANONICAL_WIDTH, CANONICAL_HEIGHT_ALT, None, init_sources, skip_third_party)
-    page = page_context.new_page()
-    goto_and_settle(page, url, wait_strategy)
-    settle(page, max_ms=1200)
-    snapshot = dump_dom(page)
-    sections = list_sections(page)
-
-    out_dir = output_dir / "dom-alt" / f"{CANONICAL_WIDTH}-{CANONICAL_HEIGHT_ALT}"
-    out_dir.mkdir(parents=True, exist_ok=True)
-    (out_dir / "step-00.json").write_text(json.dumps(snapshot, separators=(",", ":")))
-    (out_dir / "sections.json").write_text(json.dumps(sections, indent=2))
-
-    page.close()
-    page_context.close()
-    return {"viewport": CANONICAL_WIDTH, "alt_height": CANONICAL_HEIGHT_ALT, "section_candidates": len(sections)}
-
-
-# ---------------------------------------------------------------------------
-# Stage 2 — per-section cropped screenshots
-# ---------------------------------------------------------------------------
-
-
-def capture_section_screenshots(browser, url: str, wait_strategy: str, init_sources: list[str], output_dir: Path, skip_third_party: bool, viewport_widths: list[int]) -> int:
-    """For each viewport width, scroll each candidate section into view and
-    save a screenshot cropped to its bbox. The analyze agent maps these to
-    section ids; the validate agent uses them as the diff reference."""
-    total = 0
-    for vw in viewport_widths:
-        sections_path = output_dir / "sections" / f"{vw}.json"
-        if not sections_path.exists():
-            continue
-        sections = json.loads(sections_path.read_text())
-        if not sections:
-            continue
-        vh = viewport_height_for(vw)
-        page_context = make_context(browser, vw, vh, None, init_sources, skip_third_party)
-        page = page_context.new_page()
-        goto_and_settle(page, url, wait_strategy)
-        out_dir = output_dir / "section-shots" / str(vw)
-        out_dir.mkdir(parents=True, exist_ok=True)
-        for idx, sec in enumerate(sections):
-            try:
-                # Scroll so the section's top is ~80px below the viewport top
-                target_y = max(int(sec.get("y") or 0) - 80, 0)
-                page.evaluate(f"window.scrollTo({{ top: {target_y}, behavior: 'instant' }})")
-                settle(page, max_ms=1000)
-                clip = {
-                    "x": max(int(sec.get("x") or 0), 0),
-                    "y": max(int(sec.get("y") or 0) - target_y, 0),
-                    "width": min(int(sec.get("width") or vw), vw),
-                    "height": min(int(sec.get("height") or vh), vh * 4),
-                }
-                # Playwright clip cannot exceed the page viewport vertically; if the section is
-                # taller than the viewport, capture as-is and analyze handles the partial.
-                clip["height"] = min(clip["height"], vh)
-                page.screenshot(path=str(out_dir / f"section-{idx:02d}.png"), clip=clip)
-                total += 1
-            except Exception:
-                continue
-        page.close()
-        page_context.close()
-    return total
-
-
-# ---------------------------------------------------------------------------
-# Stage 3 — post-process: build assets list, derive vh flags, write meta.json
-# ---------------------------------------------------------------------------
-
-
-def merge_css_assets(output_dir: Path, har_assets: dict[str, dict]) -> dict[str, dict]:
-    """Walk css-rules/<vp>.json across viewports, append every url() reference
-    not already in har_assets. Type is inferred from the URL alone since CSS
-    references don't carry content-type."""
-    merged = dict(har_assets)
-    css_rules_dir = output_dir / "css-rules"
-    if css_rules_dir.exists():
-        for f in css_rules_dir.glob("*.json"):
-            try:
-                data = json.loads(f.read_text())
-            except Exception:
-                continue
-            for asset in data.get("assets", []) or []:
-                src = asset.get("source_url")
-                if not src or src in merged:
-                    continue
-                t = asset_type_from_url_only(src)
-                if t is None:
-                    continue
-                merged[src] = {
-                    "type": t,
-                    "source_url": src,
-                    "content_type": None,
-                    "status": None,
-                    "from_css": True,
-                }
-    return merged
-
-
-def build_assets_list(all_assets: dict[str, dict]) -> list[dict]:
-    out = []
-    for url, a in all_assets.items():
-        name = sanitize(unquote(os.path.basename(urlparse(url).path)) or "asset")
-        local_path = f"public/assets/cloned/{a['type']}s/{sha1_8(url)}-{name}"
-        entry = {
-            "type": a["type"],
-            "source_url": url,
-            "local_path": local_path,
-        }
-        if a.get("from_css"):
-            entry["from_css"] = True
-        out.append(entry)
-    return out
-
-
-def detect_vh_flags(output_dir: Path) -> list[dict]:
-    """Compare DOM at (1280x720) vs (1280x1080). For each element matchable by
-    structural path, if `h_alt / h_primary ≈ alt_height / primary_height`, flag
-    it as vh-relative and record the implied vh percentage.
-    Output: a flat list of { path, primary_h, alt_h, vh } entries.
-    """
-    primary = output_dir / "dom" / str(CANONICAL_WIDTH) / "step-00.json"
-    alt = output_dir / "dom-alt" / f"{CANONICAL_WIDTH}-{CANONICAL_HEIGHT_ALT}" / "step-00.json"
-    if not primary.exists() or not alt.exists():
-        return []
-    try:
-        a = json.loads(primary.read_text())
-        b = json.loads(alt.read_text())
-    except Exception:
-        return []
-
-    expected_ratio = CANONICAL_HEIGHT_ALT / CANONICAL_HEIGHT_PRIMARY  # 1.5
-    tolerance = 0.06  # 6% — accounts for content-driven elements that happen to be near vh
-
-    flags: list[dict] = []
-
-    def walk(na, nb, path):
-        if not isinstance(na, dict) or not isinstance(nb, dict):
-            return
-        if na.get("tag") != nb.get("tag"):
-            return
-        ha = (na.get("bbox") or {}).get("height") or 0
-        hb = (nb.get("bbox") or {}).get("height") or 0
-        if ha > 40 and hb > 40:
-            ratio = hb / ha
-            if abs(ratio - expected_ratio) / expected_ratio < tolerance:
-                vh_pct = round((ha / CANONICAL_HEIGHT_PRIMARY) * 100)
-                flags.append({
-                    "path": path,
-                    "tag": na.get("tag"),
-                    "id": (na.get("attrs") or {}).get("id") or None,
-                    "class": (na.get("attrs") or {}).get("class") or None,
-                    "primary_h": round(ha, 2),
-                    "alt_h": round(hb, 2),
-                    "ratio": round(ratio, 3),
-                    "vh": vh_pct,
-                })
-        ca = na.get("children") or []
-        cb = nb.get("children") or []
-        # Only walk matched element children; pair by tag-aware index
-        ai = bi = 0
-        idx = 0
-        while ai < len(ca) and bi < len(cb):
-            ea = ca[ai]
-            eb = cb[bi]
-            if not isinstance(ea, dict) or not isinstance(eb, dict) or ea.get("tag") != eb.get("tag"):
-                # Skip text-only / mismatched
-                if not isinstance(ea, dict) or "tag" not in ea:
-                    ai += 1
-                    continue
-                if not isinstance(eb, dict) or "tag" not in eb:
-                    bi += 1
-                    continue
-                # Different tags at same index — skip both
-                ai += 1
-                bi += 1
-                continue
-            walk(ea, eb, f"{path}>{ea.get('tag')}[{idx}]")
-            ai += 1
-            bi += 1
-            idx += 1
-
-    walk(a, b, a.get("tag", "body"))
-    return flags
-
-
-SECTION_LIKE_TAGS = {"section", "header", "footer", "nav", "main", "article", "aside"}
-SECTION_CLASS_RE = re.compile(r"(section|hero|banner|elementor-element|e-parent|e-con|footer|header|nav|main)", re.I)
-SECTION_ID_RE = re.compile(r"(hero|banner|section|footer|nav|header|main)", re.I)
-
-
-def _is_section_like(node: dict) -> bool:
-    tag = (node.get("tag") or "").lower()
-    if tag in SECTION_LIKE_TAGS:
-        return True
-    attrs = node.get("attrs") or {}
-    eid = attrs.get("id") or ""
-    if eid and SECTION_ID_RE.search(eid):
-        return True
-    cls = attrs.get("class") or ""
-    if cls and SECTION_CLASS_RE.search(cls):
-        return True
-    return False
-
-
-def _is_visible(node: dict) -> bool:
-    cs = node.get("computed") or {}
-    if cs.get("display") == "none" or cs.get("visibility") == "hidden":
-        return False
-    op = cs.get("opacity")
-    if op is not None and op != "":
-        try:
-            if float(op) == 0:
-                return False
-        except (TypeError, ValueError):
-            pass
-    return True
-
-
-def _build_selector(node: dict) -> str:
-    attrs = node.get("attrs") or {}
-    if attrs.get("id"):
-        return f"#{attrs['id']}"
-    cls = (attrs.get("class") or "").strip().split()
-    if cls:
-        # First class is usually the most distinctive (Elementor style)
-        return f"{node.get('tag')}.{cls[0]}"
-    return node.get("tag") or "?"
-
-
-def _walk_section_candidates(node: dict, vw: int, path: str, idx: int, out: list[dict]) -> None:
-    if not isinstance(node, dict) or "tag" not in node:
-        return
-    cur_path = f"{path}>{node.get('tag')}[{idx}]" if path else (node.get("tag") or "?")
-    bbox = node.get("bbox") or {}
-    w = bbox.get("width") or 0
-    h = bbox.get("height") or 0
-    if _is_visible(node) and _is_section_like(node) and w >= vw * 0.5 and h >= 80:
-        attrs = node.get("attrs") or {}
-        out.append({
-            "_path": cur_path,
-            "_node": node,
-            "selector": _build_selector(node),
-            "tag": node.get("tag"),
-            "id": attrs.get("id") or None,
-            "className": (attrs.get("class") or "")[:200] or None,
-            "x": round(bbox.get("x") or 0, 1),
-            "y": round(bbox.get("y") or 0, 1),
-            "width": round(w, 1),
-            "height": round(h, 1),
-        })
-    for i, c in enumerate(node.get("children") or []):
-        _walk_section_candidates(c, vw, cur_path, i, out)
-
-
-def _outermost_wins(candidates: list[dict]) -> list[dict]:
-    # Sort by path depth — shallowest first; only keep candidates that are not
-    # descendants of an already-kept candidate.
-    by_depth = sorted(candidates, key=lambda c: c["_path"].count(">"))
-    kept: list[dict] = []
-    for c in by_depth:
-        if any(c["_path"].startswith(k["_path"] + ">") for k in kept):
-            continue
-        kept.append(c)
-    return kept
-
-
-def _expand_oversized(candidates: list[dict], vw: int, vh: int, doc_h: float) -> list[dict]:
-    """For wrapper-shaped candidates (>2x viewport_h with >=3 inner sections),
-    replace the wrapper with its section-like children. Without this step,
-    Elementor / WP layouts where everything is wrapped in a single <main id="main">
-    or <div class="elementor-section-wrap"> collapse to a single huge candidate
-    and the smart-scroll loop never visits the actual sections."""
-    threshold = max(vh * 2, doc_h * 0.5)
-    expanded: list[dict] = []
-    for c in candidates:
-        if c["height"] < threshold:
-            expanded.append(c)
-            continue
-        inner: list[dict] = []
-        for i, child in enumerate(c["_node"].get("children") or []):
-            _walk_section_candidates(child, vw, c["_path"], i, inner)
-        inner = _outermost_wins(inner)
-        # Recurse: an inner section may itself be an oversized wrapper.
-        inner = _expand_oversized(inner, vw, vh, doc_h)
-        if len(inner) >= 3:
-            expanded.extend(inner)
-        else:
-            expanded.append(c)
-    return expanded
-
-
-def enrich_sections(output_dir: Path) -> int:
-    """Re-derive sections/<vp>.json from the captured dom/<vp>/step-00.json so
-    the JS section-scan's outermost-wins rule is corrected for wrapper-shaped
-    layouts. Idempotent — safe to run in both fresh-capture and replay paths.
-    Returns the total candidate count across viewports."""
-    dom_root = output_dir / "dom"
-    sec_root = output_dir / "sections"
-    if not dom_root.exists():
-        return 0
-    sec_root.mkdir(parents=True, exist_ok=True)
-    total = 0
-    for vp_dir in sorted(dom_root.iterdir()):
-        if not vp_dir.is_dir() or not vp_dir.name.isdigit():
-            continue
-        vp = int(vp_dir.name)
-        step0 = vp_dir / "step-00.json"
-        if not step0.exists():
-            continue
-        try:
-            root = json.loads(step0.read_text())
-        except Exception:
-            continue
-        doc_h = (root.get("bbox") or {}).get("height") or 0
-        vh = viewport_height_for(vp)
-        candidates: list[dict] = []
-        _walk_section_candidates(root, vp, "", 0, candidates)
-        kept = _outermost_wins(candidates)
-        expanded = _expand_oversized(kept, vp, vh, doc_h)
-        # Strip private fields, sort by y
-        public = [{k: v for k, v in c.items() if not k.startswith("_")} for c in expanded]
-        public = [s for s in public if s.get("height", 0) > 80]
-        public.sort(key=lambda s: s.get("y") or 0)
-        (sec_root / f"{vp}.json").write_text(json.dumps(public, indent=2))
-        total += len(public)
-    return total
-
-
-def detect_libs(output_dir: Path) -> list[str]:
-    libs_detected = set()
-    for kind in ("gsap", "framer", "lottie", "three", "shaders"):
-        dirname = "threejs" if kind == "three" else kind
-        d = output_dir / dirname
-        if not d.exists():
-            continue
-        for f in d.glob("*.json"):
-            try:
-                data = json.loads(f.read_text())
-                if data:
-                    libs_detected.add(kind)
-                    break
-            except Exception:
-                continue
-    return sorted(libs_detected)
-
-
-def collect_har_assets_from_disk(output_dir: Path) -> dict[str, dict]:
-    """Fallback for replay mode — read each har/<vp>.har and extract response URLs."""
-    har_dir = output_dir / "har"
-    out: dict[str, dict] = {}
-    if not har_dir.exists():
-        return out
-    for f in har_dir.glob("*.har"):
-        try:
-            har = json.loads(f.read_text())
-        except Exception:
-            continue
-        for entry in (har.get("log") or {}).get("entries", []):
-            req = entry.get("request") or {}
-            res = entry.get("response") or {}
-            url = req.get("url")
-            if not url:
-                continue
-            ct = None
-            for h in (res.get("headers") or []):
-                if (h.get("name") or "").lower() == "content-type":
-                    ct = h.get("value")
-                    break
-            t = asset_type_from_url(url, ct)
-            if t and url not in out:
-                out[url] = {"type": t, "source_url": url, "content_type": ct, "status": res.get("status")}
-    return out
-
-
-def write_meta(output_dir: Path, source_url: str, viewports: list[int], per_viewport_summary: list[dict], all_assets: dict[str, dict]) -> Path:
-    merged = merge_css_assets(output_dir, all_assets)
-    assets_list = build_assets_list(merged)
-    vh_flags = detect_vh_flags(output_dir)
-    # Emit vh-flags.json at the workspace level (parent of capture/) so it lives next to manifest.json.
-    if vh_flags:
-        workspace_root = output_dir.parent
-        (workspace_root / "vh-flags.json").write_text(json.dumps(vh_flags, indent=2))
-    # Re-derive sections/<vp>.json from the DOM dumps. Replaces the JS section-scan
-    # output with a Python pass that recurses into oversized wrappers (the JS hook
-    # also has the recursion now, but Python being authoritative makes the fix
-    # available in --replay mode against existing capture data).
-    enriched_section_total = enrich_sections(output_dir)
-
-    meta = {
-        "source_url": source_url,
-        "captured_at": time.strftime("%Y-%m-%dT%H:%M:%SZ", time.gmtime()),
-        "viewports": viewports,
-        "canonical_viewport": {"width": CANONICAL_WIDTH, "height": CANONICAL_HEIGHT_PRIMARY, "alt_height": CANONICAL_HEIGHT_ALT},
-        "per_viewport": per_viewport_summary,
-        "assets": assets_list,
-        "asset_sources": {
-            "har": sum(1 for a in assets_list if not a.get("from_css")),
-            "css": sum(1 for a in assets_list if a.get("from_css")),
-        },
-        "libs_detected": detect_libs(output_dir),
-        "dom_snapshots": sum(s.get("steps", 0) for s in per_viewport_summary),
-        "screenshots": sum(s.get("steps", 0) for s in per_viewport_summary),
-        "vh_relative_count": len(vh_flags),
-        "section_shots": len(list((output_dir / "section-shots").rglob("*.png"))) if (output_dir / "section-shots").exists() else 0,
-        "section_candidates_total": enriched_section_total,
-        "canvas_regions": 0,
-    }
-    out_path = output_dir / "meta.json"
-    out_path.write_text(json.dumps(meta, indent=2))
-    return out_path
-
-
-def replay(output_dir: Path, source_url: str | None) -> Path:
-    """Replay mode: re-derive meta.json + vh-flags.json from existing capture data.
-    Useful for iterating on the analyze/generate/validate agents without re-running
-    the (slow) browser pipeline."""
-    if not output_dir.exists():
-        raise SystemExit(f"replay: output dir does not exist: {output_dir}")
-
-    # Try existing meta.json for source_url + viewports
-    existing_meta_path = output_dir / "meta.json"
-    existing_meta = {}
-    if existing_meta_path.exists():
-        try:
-            existing_meta = json.loads(existing_meta_path.read_text())
-        except Exception:
-            existing_meta = {}
-    if not source_url:
-        source_url = existing_meta.get("source_url") or "unknown://replay"
-
-    # Infer viewports from existing dom/<vp>/ folders
-    dom_root = output_dir / "dom"
-    viewports: list[int] = []
-    if dom_root.exists():
-        for child in dom_root.iterdir():
-            if child.is_dir() and child.name.isdigit():
-                viewports.append(int(child.name))
-    viewports.sort()
-
-    per_viewport_summary: list[dict] = []
-    for vp in viewports:
-        steps = len(list((dom_root / str(vp)).glob("step-*.json")))
-        sections_path = output_dir / "sections" / f"{vp}.json"
-        section_count = 0
-        if sections_path.exists():
-            try:
-                section_count = len(json.loads(sections_path.read_text()))
-            except Exception:
-                pass
-        per_viewport_summary.append({
-            "viewport": vp,
-            "height": viewport_height_for(vp),
-            "steps": steps,
-            "section_candidates": section_count,
-            "har": f"har/{vp}.har" if (output_dir / "har" / f"{vp}.har").exists() else None,
-        })
-
-    har_assets = collect_har_assets_from_disk(output_dir)
-    return write_meta(output_dir, source_url, viewports, per_viewport_summary, har_assets)
-
-
-# ---------------------------------------------------------------------------
-# main
-# ---------------------------------------------------------------------------
-
-
-def main():
-    parser = argparse.ArgumentParser()
-    parser.add_argument("--url", required=False, help="Required unless --replay is set")
-    parser.add_argument("--viewports", required=False, default="375,768,1280,1920", help="csv of widths")
-    parser.add_argument("--output", required=True)
-    parser.add_argument("--wait-strategy", default="networkidle")
-    parser.add_argument("--scroll-step", type=int, default=900, help="(legacy; ignored — scroll is now section-driven)")
-    parser.add_argument("--skip-third-party", action="store_true")
-    parser.add_argument("--replay", action="store_true", help="Skip browser capture; only re-run post-process")
-    parser.add_argument("--skip-alt-height", action="store_true", help="Skip the vh-detection alt-height pass")
-    parser.add_argument("--skip-section-shots", action="store_true", help="Skip the per-section cropped screenshot pass")
-    args = parser.parse_args()
-
-    output_dir = Path(args.output).resolve()
-    output_dir.mkdir(parents=True, exist_ok=True)
-
-    if args.replay:
-        meta_path = replay(output_dir, args.url)
-        print(json.dumps({"status": "ok", "mode": "replay", "meta": str(meta_path)}))
-        return
-
-    if not args.url:
-        raise SystemExit("--url is required (unless --replay)")
-
-    script_dir = Path(__file__).resolve().parent
-    init_sources = load_init_hooks(script_dir / "init-hooks")
-
-    viewports = [int(v.strip()) for v in args.viewports.split(",") if v.strip()]
-
-    all_assets: dict[str, dict] = {}
-    per_viewport_summary: list[dict] = []
-
-    with sync_playwright() as p:
-        browser = p.chromium.launch(headless=True, args=["--disable-blink-features=AutomationControlled"])
-
-        # Stage 0
-        for vp in viewports:
-            summary = capture_viewport(browser, vp, args.url, args.wait_strategy, init_sources, output_dir, args.skip_third_party)
-            for url, a in summary.pop("assets", {}).items():
-                if url not in all_assets:
-                    all_assets[url] = a
-            per_viewport_summary.append(summary)
-
-        # Stage 1
-        if not args.skip_alt_height and CANONICAL_WIDTH in viewports:
-            try:
-                alt_summary = capture_alt_height(browser, args.url, args.wait_strategy, init_sources, output_dir, args.skip_third_party)
-                per_viewport_summary.append({"alt_pass": True, **alt_summary})
-            except Exception as e:
-                print(json.dumps({"warning": f"alt-height capture failed: {e}"}), file=sys.stderr)
-
-        # Stage 2
-        if not args.skip_section_shots:
-            try:
-                shots = capture_section_screenshots(browser, args.url, args.wait_strategy, init_sources, output_dir, args.skip_third_party, viewports)
-                per_viewport_summary.append({"section_shots_total": shots})
-            except Exception as e:
-                print(json.dumps({"warning": f"section-shots pass failed: {e}"}), file=sys.stderr)
-
-        browser.close()
-
-    # Stage 3
-    meta_path = write_meta(output_dir, args.url, viewports, per_viewport_summary, all_assets)
-    print(json.dumps({"status": "ok", "mode": "capture", "meta": str(meta_path)}))
-
-
-if __name__ == "__main__":
-    main()
diff --git a/.opencode/scripts/diff.py b/.opencode/scripts/diff.py
deleted file mode 100755
index 63654e8..0000000
--- a/.opencode/scripts/diff.py
+++ /dev/null
@@ -1,107 +0,0 @@
-#!/usr/bin/env python3
-"""
-diff.py — Pixel diff two PNGs, producing a highlighted diff image and stats.
-
-Uses the `pixelmatch` Python port (pip install pixelmatch pillow). Returns JSON to stdout:
-  { diff_pct, diff_image_path, worst_regions: [ { x, y, width, height } ] }
-
-Worst regions are computed via connected-component analysis on the diff mask, sorted by area desc.
-"""
-
-from __future__ import annotations
-
-import argparse
-import json
-import sys
-from pathlib import Path
-
-try:
-    from PIL import Image
-    from pixelmatch.contrib.PIL import pixelmatch
-except ImportError:
-    print(json.dumps({"error": "Missing dependencies. pip install pixelmatch pillow numpy"}), file=sys.stderr)
-    sys.exit(1)
-
-try:
-    import numpy as np
-    from scipy import ndimage
-    HAVE_SCIPY = True
-except ImportError:
-    HAVE_SCIPY = False
-
-
-def resize_to_match(a: Image.Image, b: Image.Image) -> tuple[Image.Image, Image.Image]:
-    if a.size == b.size:
-        return a, b
-    target = (min(a.size[0], b.size[0]), min(a.size[1], b.size[1]))
-    return a.resize(target), b.resize(target)
-
-
-def worst_regions_from_diff(diff_img: Image.Image, top_n: int = 5) -> list[dict]:
-    if not HAVE_SCIPY:
-        return []
-    arr = np.array(diff_img)
-    if arr.ndim == 3:
-        mask = (arr[..., :3].sum(axis=-1) > 0).astype(np.uint8)
-    else:
-        mask = (arr > 0).astype(np.uint8)
-    labels, n = ndimage.label(mask)
-    if n == 0:
-        return []
-    regions = []
-    for i in range(1, n + 1):
-        ys, xs = np.where(labels == i)
-        if len(xs) < 20:
-            continue
-        regions.append({
-            "x": int(xs.min()),
-            "y": int(ys.min()),
-            "width": int(xs.max() - xs.min() + 1),
-            "height": int(ys.max() - ys.min() + 1),
-            "area": int(len(xs)),
-        })
-    regions.sort(key=lambda r: r["area"], reverse=True)
-    out = []
-    for r in regions[:top_n]:
-        r.pop("area", None)
-        out.append(r)
-    return out
-
-
-def main():
-    parser = argparse.ArgumentParser()
-    parser.add_argument("--before", required=True)
-    parser.add_argument("--after", required=True)
-    parser.add_argument("--diff-out", required=True)
-    parser.add_argument("--threshold", type=float, default=0.1)
-    parser.add_argument("--json", action="store_true")
-    args = parser.parse_args()
-
-    a = Image.open(args.before).convert("RGBA")
-    b = Image.open(args.after).convert("RGBA")
-    a, b = resize_to_match(a, b)
-    diff = Image.new("RGBA", a.size, (0, 0, 0, 0))
-
-    mismatched = pixelmatch(a, b, diff, threshold=args.threshold, includeAA=False)
-    total = a.size[0] * a.size[1]
-    diff_pct = (mismatched / total) * 100.0 if total else 0.0
-
-    Path(args.diff_out).parent.mkdir(parents=True, exist_ok=True)
-    diff.save(args.diff_out)
-
-    worst = worst_regions_from_diff(diff)
-
-    result = {
-        "diff_pct": round(diff_pct, 3),
-        "diff_image_path": args.diff_out,
-        "worst_regions": worst,
-        "size": {"width": a.size[0], "height": a.size[1]},
-    }
-    if args.json:
-        print(json.dumps(result))
-    else:
-        print(f"diff_pct={result['diff_pct']}% diff_image={result['diff_image_path']} regions={len(worst)}")
-
-
-if __name__ == "__main__":
-    main()
diff --git a/.opencode/scripts/dom-diff.py b/.opencode/scripts/dom-diff.py
deleted file mode 100644
index 79eb062..0000000
--- a/.opencode/scripts/dom-diff.py
+++ /dev/null
@@ -1,342 +0,0 @@
-#!/usr/bin/env python3
-"""
-dom-diff.py — Structural diff between two DOM JSON snapshots produced by the
-__CLONE_DUMP_COMPUTED__ walker. Used by the validate agent to surface concrete,
-actionable issues to the generate agent (font sizes, missing elements, wrong
-dimensions) instead of relying solely on PNG pixel diffs.
-
-Inputs: --captured <captured DOM JSON>, --rendered <rendered DOM JSON>.
-Optionally --root-selector to scope the comparison to a specific subtree
-(typically a section's id or class), and --max-depth to cap recursion.
-
-Output (JSON to stdout): {
-  matched: <int>,
-  missing_in_rendered: [{ path, tag, id, class, expected_h, expected_w }],
-  extra_in_rendered:   [{ path, tag, id, class }],
-  style_mismatches:    [{ path, property, expected, actual, severity }],
-  size_mismatches:     [{ path, expected, actual, delta_pct }],
-  issues:              [string, string, ...]   // top human-readable issues
-}
-"""
-
-from __future__ import annotations
-
-import argparse
-import json
-import re
-import sys
-from pathlib import Path
-
-# Properties we treat as load-bearing for visual fidelity. Reported in this
-# order in the human-readable `issues` list.
-COMPARE_STYLE_PROPS = [
-    "fontSize",
-    "fontFamily",
-    "fontWeight",
-    "lineHeight",
-    "color",
-    "backgroundColor",
-    "backgroundImage",
-    "padding",
-    "margin",
-    "borderRadius",
-    "boxShadow",
-    "display",
-    "flexDirection",
-    "justifyContent",
-    "alignItems",
-    "gridTemplateColumns",
-    "gap",
-    "textAlign",
-    "letterSpacing",
-    "textTransform",
-]
-
-# How far apart two values can be before we flag them.
-NUMERIC_TOLERANCE_PX = 2
-SIZE_TOLERANCE_PCT = 5.0
-
-
-def find_subtree(node: dict, selector: str | None) -> dict | None:
-    if not selector:
-        return node
-    target = selector.lstrip("#.")
-    is_id = selector.startswith("#")
-    is_class = selector.startswith(".")
-
-    def walk(n: dict) -> dict | None:
-        if not isinstance(n, dict):
-            return None
-        attrs = n.get("attrs") or {}
-        if is_id and attrs.get("id") == target:
-            return n
-        if is_class:
-            cls = attrs.get("class") or ""
-            if target in cls.split():
-                return n
-        if not is_id and not is_class:
-            # Tag selector
-            if n.get("tag") == target:
-                return n
-        for c in n.get("children") or []:
-            r = walk(c)
-            if r is not None:
-                return r
-        return None
-
-    return walk(node)
-
-
-def parse_px(v: str | None) -> float | None:
-    if not v:
-        return None
-    m = re.match(r"^(-?\d+(?:\.\d+)?)px$", str(v).strip())
-    if m:
-        return float(m.group(1))
-    return None
-
-
-def normalize_style_value(v: str | None) -> str:
-    if v is None:
-        return ""
-    s = str(v).strip()
-    s = re.sub(r"\s+", " ", s)
-    return s
-
-
-def style_close(prop: str, expected: str | None, actual: str | None) -> bool:
-    if expected == actual:
-        return True
-    e_px = parse_px(expected)
-    a_px = parse_px(actual)
-    if e_px is not None and a_px is not None:
-        return abs(e_px - a_px) <= NUMERIC_TOLERANCE_PX
-    if normalize_style_value(expected) == normalize_style_value(actual):
-        return True
-    # backgroundImage: if both reference url(), only flag if the url paths differ
-    if prop == "backgroundImage" and expected and actual:
-        e_url = re.search(r"url\([^)]+\)", expected)
-        a_url = re.search(r"url\([^)]+\)", actual)
-        if e_url and a_url:
-            return False  # both have urls but different — flag
-        return False
-    return False
-
-
-def child_key(n: dict, idx: int) -> str:
-    if not isinstance(n, dict):
-        return f"text[{idx}]"
-    tag = n.get("tag") or "?"
-    attrs = n.get("attrs") or {}
-    if attrs.get("id"):
-        return f"{tag}#{attrs['id']}"
-    return f"{tag}[{idx}]"
-
-
-def compare(
-    a: dict | None,
-    b: dict | None,
-    path: str,
-    issues: list[dict],
-    counters: dict,
-    max_depth: int,
-    depth: int = 0,
-) -> None:
-    if depth > max_depth:
-        return
-
-    if a is None and b is None:
-        return
-    if a is None or not isinstance(a, dict):
-        return  # only flag when source had it
-    if b is None or not isinstance(b, dict):
-        # Element missing in rendered
-        attrs = a.get("attrs") or {}
-        bbox = a.get("bbox") or {}
-        issues.append({
-            "kind": "missing_in_rendered",
-            "path": path,
-            "tag": a.get("tag"),
-            "id": attrs.get("id"),
-            "class": attrs.get("class"),
-            "expected_w": round(bbox.get("width") or 0, 1),
-            "expected_h": round(bbox.get("height") or 0, 1),
-        })
-        counters["missing"] += 1
-        return
-
-    # Tag mismatch
-    if a.get("tag") != b.get("tag"):
-        attrs_a = a.get("attrs") or {}
-        attrs_b = b.get("attrs") or {}
-        issues.append({
-            "kind": "tag_mismatch",
-            "path": path,
-            "expected_tag": a.get("tag"),
-            "actual_tag": b.get("tag"),
-            "expected_id": attrs_a.get("id"),
-            "actual_id": attrs_b.get("id"),
-        })
-        counters["tag_mismatch"] += 1
-        return
-
-    counters["matched"] += 1
-
-    # Style comparison
-    ca = (a.get("computed") or {})
-    cb = (b.get("computed") or {})
-    for prop in COMPARE_STYLE_PROPS:
-        ev, av = ca.get(prop), cb.get(prop)
-        if ev is None and av is None:
-            continue
-        # If property only exists on rendered, that's a divergence too — but
-        # we only flag when source explicitly set it (prevents noise).
-        if ev is None:
-            continue
-        if not style_close(prop, ev, av):
-            issues.append({
-                "kind": "style_mismatch",
-                "path": path,
-                "property": prop,
-                "expected": ev,
-                "actual": av,
-            })
-            counters["style"] += 1
-
-    # Size comparison
-    ba = a.get("bbox") or {}
-    bb = b.get("bbox") or {}
-    ew, eh = ba.get("width") or 0, ba.get("height") or 0
-    aw, ah = bb.get("width") or 0, bb.get("height") or 0
-    if ew > 8 and eh > 8:
-        wdelta = abs(ew - aw) / max(ew, 1) * 100
-        hdelta = abs(eh - ah) / max(eh, 1) * 100
-        if wdelta > SIZE_TOLERANCE_PCT or hdelta > SIZE_TOLERANCE_PCT:
-            issues.append({
-                "kind": "size_mismatch",
-                "path": path,
-                "expected": [round(ew, 1), round(eh, 1)],
-                "actual": [round(aw, 1), round(ah, 1)],
-                "delta_pct": round(max(wdelta, hdelta), 1),
-            })
-            counters["size"] += 1
-
-    # Children — match by (tag, id) tuple when ids exist, else positional
-    ka = a.get("children") or []
-    kb = b.get("children") or []
-    # Filter to element children (skip pure text)
-    ka_el = [(i, c) for i, c in enumerate(ka) if isinstance(c, dict) and "tag" in c]
-    kb_el = [(i, c) for i, c in enumerate(kb) if isinstance(c, dict) and "tag" in c]
-
-    # Build a lookup of rendered children by id (cheap) and by (tag, idx) fallback
-    used_b: set[int] = set()
-    b_by_id: dict[str, int] = {}
-    for j, (_, ch) in enumerate(kb_el):
-        cid = (ch.get("attrs") or {}).get("id")
-        if cid:
-            b_by_id[cid] = j
-
-    for ai, (_, ch) in enumerate(ka_el):
-        a_id = (ch.get("attrs") or {}).get("id")
-        match_idx = None
-        if a_id and a_id in b_by_id and b_by_id[a_id] not in used_b:
-            match_idx = b_by_id[a_id]
-        elif ai < len(kb_el) and ai not in used_b:
-            cand = kb_el[ai][1]
-            if cand.get("tag") == ch.get("tag"):
-                match_idx = ai
-        if match_idx is None:
-            compare(ch, None, f"{path} > {child_key(ch, ai)}", issues, counters, max_depth, depth + 1)
-        else:
-            used_b.add(match_idx)
-            compare(ch, kb_el[match_idx][1], f"{path} > {child_key(ch, ai)}", issues, counters, max_depth, depth + 1)
-
-    # Extra children in rendered (no source counterpart) — only flag at top levels
-    # to avoid noise from minor wrappers
-    if depth < 3:
-        for j, (_, ch) in enumerate(kb_el):
-            if j in used_b:
-                continue
-            attrs = ch.get("attrs") or {}
-            issues.append({
-                "kind": "extra_in_rendered",
-                "path": f"{path} > {child_key(ch, j)}",
-                "tag": ch.get("tag"),
-                "id": attrs.get("id"),
-                "class": attrs.get("class"),
-            })
-            counters["extra"] += 1
-
-
-def humanize(issues: list[dict], top_n: int = 12) -> list[str]:
-    """Convert structured issues to human-readable strings, ranked by impact."""
-    # Rank: missing > tag_mismatch > size_mismatch > style_mismatch > extra
-    weights = {"missing_in_rendered": 100, "tag_mismatch": 80, "size_mismatch": 50, "style_mismatch": 25, "extra_in_rendered": 10}
-    style_weights = {"backgroundImage": 4, "fontSize": 3, "color": 2, "backgroundColor": 2, "fontFamily": 2}
-
-    def score(i: dict) -> float:
-        base = weights.get(i["kind"], 0)
-        if i["kind"] == "size_mismatch":
-            base += min(i.get("delta_pct", 0), 50)
-        if i["kind"] == "style_mismatch":
-            base += style_weights.get(i.get("property", ""), 1)
-        return base
-
-    issues_sorted = sorted(issues, key=score, reverse=True)
-    out: list[str] = []
-    for i in issues_sorted[:top_n]:
-        path = i.get("path", "?")
-        if i["kind"] == "missing_in_rendered":
-            out.append(f"{path}: missing in rendered (expected {i.get('tag')}{' #' + i['id'] if i.get('id') else ''}, ~{i.get('expected_w')}x{i.get('expected_h')})")
-        elif i["kind"] == "tag_mismatch":
-            out.append(f"{path}: expected <{i.get('expected_tag')}>, rendered <{i.get('actual_tag')}>")
-        elif i["kind"] == "size_mismatch":
-            ew, eh = i.get("expected", [0, 0])
-            aw, ah = i.get("actual", [0, 0])
-            out.append(f"{path}: size {aw}x{ah}, should be {ew}x{eh} (Δ{i.get('delta_pct')}%)")
-        elif i["kind"] == "style_mismatch":
-            out.append(f"{path}: {i.get('property')} is {i.get('actual')}, should be {i.get('expected')}")
-        elif i["kind"] == "extra_in_rendered":
-            out.append(f"{path}: extra element in rendered (<{i.get('tag')}>{' #' + i['id'] if i.get('id') else ''}) — not in source")
-    return out
-
-
-def main():
-    parser = argparse.ArgumentParser()
-    parser.add_argument("--captured", required=True)
-    parser.add_argument("--rendered", required=True)
-    parser.add_argument("--root-selector", default=None, help="e.g. #hero or .ecosystem to scope the diff to a section")
-    parser.add_argument("--max-depth", type=int, default=8)
-    parser.add_argument("--max-issues", type=int, default=200)
-    args = parser.parse_args()
-
-    captured = json.loads(Path(args.captured).read_text())
-    rendered = json.loads(Path(args.rendered).read_text())
-
-    a_root = find_subtree(captured, args.root_selector)
-    b_root = find_subtree(rendered, args.root_selector)
-
-    if a_root is None:
-        print(json.dumps({"error": f"root selector not found in captured: {args.root_selector}"}))
-        sys.exit(2)
-    if b_root is None:
-        print(json.dumps({"error": f"root selector not found in rendered: {args.root_selector}"}))
-        sys.exit(3)
-
-    issues: list[dict] = []
-    counters = {"matched": 0, "missing": 0, "extra": 0, "tag_mismatch": 0, "style": 0, "size": 0}
-    compare(a_root, b_root, args.root_selector or a_root.get("tag", "body"), issues, counters, args.max_depth)
-
-    issues = issues[: args.max_issues]
-    humanized = humanize(issues, top_n=12)
-
-    print(json.dumps({
-        "matched": counters["matched"],
-        "counts": counters,
-        "issues": humanized,
-        "structured_issues": issues,
-    }))
-
-
-if __name__ == "__main__":
-    main()
diff --git a/.opencode/scripts/download-assets.py b/.opencode/scripts/download-assets.py
deleted file mode 100755
index f93e115..0000000
--- a/.opencode/scripts/download-assets.py
+++ /dev/null
@@ -1,102 +0,0 @@
-#!/usr/bin/env python3
-"""
-download-assets.py — Download all assets referenced in a capture meta.json (or manifest.json)
-into <project>/public/assets/cloned/ using hash-based filenames.
-
-Input: JSON file with `assets[]` of shape { type, source_url, local_path }.
-Output (to --json stdout): { downloaded: [...], failed: [...], skipped: [...] }
-
-Dependencies: httpx (pip install httpx).
-"""
-
-from __future__ import annotations
-
-import argparse
-import json
-import re
-import sys
-from pathlib import Path
-
-try:
-    import httpx
-except ImportError:
-    print(json.dumps({"error": "Missing dependencies. pip install httpx"}), file=sys.stderr)
-    sys.exit(1)
-
-
-LICENSED_FONT_HOST_RE = re.compile(r"(use\.typekit\.net|fonts\.adobe\.com|fast\.fonts\.net|cloud\.typography\.com)")
-ROTATING_AUTH_RE = re.compile(r"[?&](token|signature|expires)=")
-USER_AGENT = "Mozilla/5.0 (compatible; IonCloneBot/1.0)"
-
-
-def download_one(client: httpx.Client, url: str, out_path: Path) -> str:
-    out_path.parent.mkdir(parents=True, exist_ok=True)
-    with client.stream("GET", url, timeout=30, headers={"User-Agent": USER_AGENT}) as r:
-        r.raise_for_status()
-        with out_path.open("wb") as f:
-            for chunk in r.iter_bytes():
-                f.write(chunk)
-    return "downloaded"
-
-
-def main():
-    parser = argparse.ArgumentParser()
-    parser.add_argument("--manifest", required=True, help="Path to meta.json or manifest.json")
-    parser.add_argument("--public-dir", required=True, help="Path to <project>/public/assets/cloned")
-    parser.add_argument("--json", action="store_true")
-    args = parser.parse_args()
-
-    manifest_path = Path(args.manifest)
-    public_dir = Path(args.public_dir)
-    public_dir.mkdir(parents=True, exist_ok=True)
-
-    manifest = json.loads(manifest_path.read_text())
-    assets = manifest.get("assets", [])
-
-    downloaded: list[str] = []
-    failed: list[dict] = []
-    skipped: list[dict] = []
-
-    with httpx.Client(follow_redirects=True) as client:
-        for a in assets:
-            url = a.get("source_url")
-            local_path = a.get("local_path")
-            atype = a.get("type")
-            if not url or not local_path:
-                failed.append({"url": url, "reason": "malformed_asset"})
-                continue
-
-            if atype == "font" and LICENSED_FONT_HOST_RE.search(url):
-                skipped.append({"url": url, "reason": "licensed_font_unclear"})
-                continue
-
-            if ROTATING_AUTH_RE.search(url):
-                skipped.append({"url": url, "reason": "rotating_auth_token"})
-                continue
-
-            # local_path in the asset is relative to the project root; public-dir is
-            # <project>/public/assets/cloned, so strip that prefix.
-            rel = local_path
-            for prefix in ("public/assets/cloned/", "assets/cloned/"):
-                if rel.startswith(prefix):
-                    rel = rel[len(prefix):]
-                    break
-            out_path = public_dir / rel
-
-            try:
-                download_one(client, url, out_path)
-                downloaded.append(str(out_path))
-            except httpx.HTTPError as e:
-                failed.append({"url": url, "reason": str(e)})
-            except Exception as e:
-                failed.append({"url": url, "reason": str(e)})
-
-    result = {"downloaded": downloaded, "failed": failed, "skipped": skipped}
-    if args.json:
-        print(json.dumps(result))
-    else:
-        print(f"downloaded={len(downloaded)} failed={len(failed)} skipped={len(skipped)}")
-
-
-if __name__ == "__main__":
-    main()
diff --git a/.opencode/scripts/dump-rendered.py b/.opencode/scripts/dump-rendered.py
deleted file mode 100644
index af94b18..0000000
--- a/.opencode/scripts/dump-rendered.py
+++ /dev/null
@@ -1,118 +0,0 @@
-#!/usr/bin/env python3
-"""
-dump-rendered.py — Open a URL (typically the local dev server) and dump its DOM
-using the same __CLONE_DUMP_COMPUTED__ walker the capture pipeline uses for the
-source. This produces a directly-comparable structural snapshot the validate
-agent can diff against the captured original.
-
-Usage:
-  dump-rendered.py --url http://localhost:3000/ --output workspace/rendered/1280-step-00.json \
-      --viewport 1280 --scroll-y 0
-
-Dependencies: playwright.
-"""
-
-from __future__ import annotations
-
-import argparse
-import json
-import sys
-import time
-from pathlib import Path
-
-try:
-    from playwright.sync_api import sync_playwright, TimeoutError as PWTimeout
-except ImportError:
-    print(json.dumps({"error": "Missing dependencies. pip install playwright && playwright install chromium"}), file=sys.stderr)
-    sys.exit(1)
-
-
-def load_init_hooks(hooks_dir: Path) -> list[str]:
-    sources: list[str] = []
-    # We only need computed-styles + section-scan for rendered-DOM purposes.
-    for name in ("bootstrap.js", "computed-styles.js", "section-scan.js"):
-        p = hooks_dir / name
-        if p.exists():
-            sources.append(p.read_text())
-    return sources
-
-
-def main():
-    parser = argparse.ArgumentParser()
-    parser.add_argument("--url", required=True)
-    parser.add_argument("--output", required=True, help="Path to write the rendered DOM JSON")
-    parser.add_argument("--viewport", type=int, default=1280)
-    parser.add_argument("--viewport-height", type=int, default=None, help="Default: 16:9 of viewport width")
-    parser.add_argument("--scroll-y", type=int, default=0)
-    parser.add_argument("--reduce-motion", action="store_true")
-    parser.add_argument("--settle-ms", type=int, default=800)
-    args = parser.parse_args()
-
-    output = Path(args.output).resolve()
-    output.parent.mkdir(parents=True, exist_ok=True)
-
-    height = args.viewport_height or round(args.viewport * 9 / 16)
-    script_dir = Path(__file__).resolve().parent
-    init_sources = load_init_hooks(script_dir / "init-hooks")
-
-    with sync_playwright() as p:
-        browser = p.chromium.launch(headless=True, args=["--disable-blink-features=AutomationControlled"])
-        ctx = browser.new_context(viewport={"width": args.viewport, "height": height})
-        for src in init_sources:
-            ctx.add_init_script(src)
-        page = ctx.new_page()
-
-        try:
-            page.goto(args.url, wait_until="networkidle", timeout=30_000)
-        except PWTimeout:
-            page.goto(args.url, wait_until="domcontentloaded", timeout=30_000)
-
-        if args.reduce_motion:
-            try:
-                page.evaluate("document.documentElement.classList.add('reduce-motion')")
-            except Exception:
-                pass
-
-        try:
-            page.evaluate("() => document.fonts.ready")
-        except Exception:
-            pass
-
-        try:
-            page.wait_for_function("window.__CLONE_READY__ === true", timeout=5_000)
-        except Exception:
-            pass
-
-        if args.scroll_y:
-            page.evaluate(f"window.scrollTo({{ top: {args.scroll_y}, behavior: 'instant' }})")
-
-        time.sleep(args.settle_ms / 1000.0)
-
-        snapshot = page.evaluate(
-            "() => (typeof window.__CLONE_DUMP_COMPUTED__ === 'function') ? window.__CLONE_DUMP_COMPUTED__() : null"
-        )
-        sections = page.evaluate(
-            "() => (typeof window.__CLONE_LIST_SECTIONS__ === 'function') ? window.__CLONE_LIST_SECTIONS__() : []"
-        ) or []
-
-        if snapshot is None:
-            raise SystemExit("dump-rendered: __CLONE_DUMP_COMPUTED__ unavailable — init hooks failed to load")
-
-        output.write_text(json.dumps(snapshot, separators=(",", ":")))
-        sections_path = output.with_name(output.stem + "-sections.json")
-        sections_path.write_text(json.dumps(sections, indent=2))
-
-        page.close()
-        ctx.close()
-        browser.close()
-
-    print(json.dumps({
-        "status": "ok",
-        "output": str(output),
-        "sections_path": str(sections_path),
-        "section_count": len(sections),
-    }))
-
-
-if __name__ == "__main__":
-    main()
diff --git a/.opencode/scripts/extract-fonts.py b/.opencode/scripts/extract-fonts.py
deleted file mode 100755
index c419e22..0000000
--- a/.opencode/scripts/extract-fonts.py
+++ /dev/null
@@ -1,135 +0,0 @@
-#!/usr/bin/env python3
-"""
-extract-fonts.py — Parse @font-face rules from captured CSS, resolve URLs, download,
-and write license_hint into the manifest.
-
-Run after capture.py and before generation. Input: capture directory with fonts/*.json.
-Output: writes font files into <public_dir>/fonts/ and an updated JSON summary.
-
-Dependencies: httpx, tinycss2 (pip install httpx tinycss2).
-"""
-
-from __future__ import annotations
-
-import argparse
-import hashlib
-import json
-import re
-import sys
-from pathlib import Path
-from urllib.parse import urljoin
-
-try:
-    import httpx
-    import tinycss2
-except ImportError:
-    print(json.dumps({"error": "Missing deps. pip install httpx tinycss2"}), file=sys.stderr)
-    sys.exit(1)
-
-
-LICENSED_HOSTS = re.compile(r"(use\.typekit\.net|fonts\.adobe\.com|fast\.fonts\.net|cloud\.typography\.com)")
-OPEN_HOSTS = re.compile(r"(fonts\.googleapis\.com|fonts\.gstatic\.com)")
-
-
-def sha1_8(s: str) -> str:
-    return hashlib.sha1(s.encode("utf-8")).hexdigest()[:8]
-
-
-def classify(url: str) -> str:
-    if LICENSED_HOSTS.search(url):
-        return "licensed"
-    if OPEN_HOSTS.search(url):
-        return "open"
-    return "unclear"
-
-
-def parse_face_rules(css_text: str, base_url: str) -> list[dict]:
-    out = []
-    rules = tinycss2.parse_stylesheet(css_text, skip_comments=True, skip_whitespace=True)
-    for rule in rules:
-        if rule.type != "at-rule" or rule.lower_at_keyword != "font-face":
-            continue
-        block = tinycss2.parse_declaration_list(rule.content or [])
-        face: dict = {}
-        for decl in block:
-            if decl.type != "declaration":
-                continue
-            name = decl.lower_name
-            value = tinycss2.serialize(decl.value).strip().strip('"').strip("'")
-            if name == "font-family":
-                face["family"] = value
-            elif name == "font-weight":
-                face["weight"] = value
-            elif name == "font-style":
-                face["style"] = value
-            elif name == "src":
-                urls = re.findall(r"url\(\s*['\"]?([^'\")]+)['\"]?\s*\)", tinycss2.serialize(decl.value))
-                face["urls"] = [urljoin(base_url, u) for u in urls]
-        if face.get("family") and face.get("urls"):
-            out.append(face)
-    return out
-
-
-def main():
-    parser = argparse.ArgumentParser()
-    parser.add_argument("--capture-dir", required=True)
-    parser.add_argument("--public-dir", required=True)
-    parser.add_argument("--json", action="store_true")
-    args = parser.parse_args()
-
-    capture_dir = Path(args.capture_dir)
-    public_dir = Path(args.public_dir)
-    fonts_out = public_dir / "fonts"
-    fonts_out.mkdir(parents=True, exist_ok=True)
-
-    face_dumps = list((capture_dir / "fonts").glob("*.json"))
-
-    all_faces: list[dict] = []
-    for dump in face_dumps:
-        data = json.loads(dump.read_text())
-        for entry in data if isinstance(data, list) else []:
-            css = entry.get("cssText") or ""
-            base = entry.get("baseUrl") or ""
-            all_faces.extend(parse_face_rules(css, base))
-
-    downloaded: list[dict] = []
-    skipped: list[dict] = []
-
-    with httpx.Client(follow_redirects=True) as client:
-        for face in all_faces:
-            family = face["family"]
-            license_hint = "unclear"
-            for url in face["urls"]:
-                license_hint = classify(url)
-                if license_hint == "licensed":
-                    skipped.append({"family": family, "url": url, "reason": "licensed"})
-                    break
-                try:
-                    ext = url.rsplit(".", 1)[-1].split("?", 1)[0].lower()
-                    if ext not in ("woff2", "woff", "ttf", "otf"):
-                        ext = "woff2"
-                    fname = f"{sha1_8(url)}-{re.sub(r'[^a-z0-9]+', '-', family.lower())}.{ext}"
-                    out_path = fonts_out / fname
-                    r = client.get(url, timeout=30, headers={"User-Agent": "Mozilla/5.0 (compatible; IonCloneBot/1.0)"})
-                    r.raise_for_status()
-                    out_path.write_bytes(r.content)
-                    downloaded.append({
-                        "family": family,
-                        "weight": face.get("weight"),
-                        "style": face.get("style"),
-                        "source_url": url,
-                        "local_path": str(out_path),
-                        "license_hint": license_hint,
-                    })
-                except Exception as e:
-                    skipped.append({"family": family, "url": url, "reason": str(e)})
-
-    result = {"downloaded": downloaded, "skipped": skipped}
-    if args.json:
-        print(json.dumps(result))
-    else:
-        print(f"downloaded={len(downloaded)} skipped={len(skipped)}")
-
-
-if __name__ == "__main__":
-    main()
diff --git a/.opencode/scripts/init-hooks/bootstrap.js b/.opencode/scripts/init-hooks/bootstrap.js
deleted file mode 100644
index 2a9fdb5..0000000
--- a/.opencode/scripts/init-hooks/bootstrap.js
+++ /dev/null
@@ -1,25 +0,0 @@
-// Initializes the shared capture bucket that every other hook writes into.
-// Runs first because hooks load in lexicographic order.
-(() => {
-  if (window.__CLONE_CAPTURE__) return;
-  window.__CLONE_CAPTURE__ = {
-    shaders: [],
-    gsap: [],
-    framer: [],
-    lottie: [],
-    threejs: [],
-    cssVars: {},
-    fonts: [],
-  };
-  // Sentinel the capture script waits on after DOMContentLoaded + a tick.
-  // Hooks that dump state on demand (gsap, framer) set __CLONE_READY__ when they've run.
-  window.__CLONE_READY__ = false;
-  window.addEventListener('load', () => {
-    setTimeout(() => {
-      try {
-        if (typeof window.__CLONE_FINALIZE__ === 'function') window.__CLONE_FINALIZE__();
-      } catch {}
-      window.__CLONE_READY__ = true;
-    }, 800);
-  });
-})();
diff --git a/.opencode/scripts/init-hooks/computed-styles.js b/.opencode/scripts/init-hooks/computed-styles.js
deleted file mode 100644
index d9f35cf..0000000
--- a/.opencode/scripts/init-hooks/computed-styles.js
+++ /dev/null
@@ -1,193 +0,0 @@
-// Exposes window.__CLONE_DUMP_COMPUTED__() which walks the DOM and returns a minimal tree
-// of resolved computed styles (only non-default values). The capture script calls this on demand
-// after each scroll step — cheap to call repeatedly, much richer than the inline per-step snapshot
-// the Playwright script does as a fallback.
-(() => {
-  const PROPS = [
-    'color',
-    'backgroundColor',
-    'backgroundImage',
-    'backgroundSize',
-    'backgroundPosition',
-    'backgroundRepeat',
-    'backgroundAttachment',
-    'backgroundClip',
-    'fontFamily',
-    'fontSize',
-    'fontWeight',
-    'lineHeight',
-    'letterSpacing',
-    'textTransform',
-    'textAlign',
-    'textDecoration',
-    'textShadow',
-    'whiteSpace',
-    'display',
-    'flexDirection',
-    'flexWrap',
-    'justifyContent',
-    'alignItems',
-    'alignContent',
-    'alignSelf',
-    'gap',
-    'rowGap',
-    'columnGap',
-    'gridTemplateColumns',
-    'gridTemplateRows',
-    'gridTemplateAreas',
-    'gridColumn',
-    'gridRow',
-    'gridAutoFlow',
-    'padding',
-    'paddingTop',
-    'paddingRight',
-    'paddingBottom',
-    'paddingLeft',
-    'margin',
-    'marginTop',
-    'marginRight',
-    'marginBottom',
-    'marginLeft',
-    'width',
-    'height',
-    'maxWidth',
-    'maxHeight',
-    'minWidth',
-    'minHeight',
-    'aspectRatio',
-    'position',
-    'top',
-    'right',
-    'bottom',
-    'left',
-    'zIndex',
-    'inset',
-    'border',
-    'borderTop',
-    'borderRight',
-    'borderBottom',
-    'borderLeft',
-    'borderRadius',
-    'borderColor',
-    'borderWidth',
-    'borderStyle',
-    'boxShadow',
-    'opacity',
-    'transform',
-    'transformOrigin',
-    'filter',
-    'backdropFilter',
-    'clipPath',
-    'mask',
-    'maskImage',
-    'mixBlendMode',
-    'isolation',
-    'overflow',
-    'overflowX',
-    'overflowY',
-    'scrollBehavior',
-    'scrollSnapType',
-    'cursor',
-    'pointerEvents',
-    'userSelect',
-    'willChange',
-    'contain',
-  ];
-
-  // Compute defaults once per tag by creating a hidden iframe so we don't treat
-  // inherited defaults as "used styles". The iframe is created lazily — at
-  // init-script time, document.documentElement may still be null (Playwright
-  // fires add_init_script before the HTML parser materialises <html>).
-  let iframe = null;
-  function ensureIframe() {
-    if (iframe) return iframe;
-    if (!document.documentElement) return null;
-    try {
-      iframe = document.createElement('iframe');
-      iframe.style.cssText = 'position:absolute;width:0;height:0;border:0;opacity:0;pointer-events:none';
-      iframe.srcdoc = '<!doctype html><html><body></body></html>';
-      document.documentElement.appendChild(iframe);
-    } catch {
-      iframe = null;
-    }
-    return iframe;
-  }
-
-  const defaultsByTag = new Map();
-  function defaultsFor(tag) {
-    if (defaultsByTag.has(tag)) return defaultsByTag.get(tag);
-    const ifr = ensureIframe();
-    const doc = ifr ? ifr.contentDocument : null;
-    if (!doc || !doc.body) return {};
-    const el = doc.createElement(tag);
-    doc.body.appendChild(el);
-    const cs = doc.defaultView.getComputedStyle(el);
-    const d = {};
-    for (const p of PROPS) d[p] = cs[p];
-    doc.body.removeChild(el);
-    defaultsByTag.set(tag, d);
-    return d;
-  }
-
-  function nonDefault(el) {
-    const cs = getComputedStyle(el);
-    const defaults = defaultsFor(el.tagName.toLowerCase());
-    const out = {};
-    for (const p of PROPS) {
-      const v = cs[p];
-      if (v == null || v === '') continue;
-      if (v === defaults[p]) continue;
-      out[p] = v;
-    }
-    return out;
-  }
-
-  function pseudoStyles(el) {
-    const out = {};
-    for (const pseudo of ['::before', '::after']) {
-      try {
-        const cs = getComputedStyle(el, pseudo);
-        const content = cs.content;
-        if (content && content !== 'normal' && content !== 'none') {
-          const block = {};
-          for (const p of PROPS) {
-            const v = cs[p];
-            if (v && v !== 'none' && v !== 'normal' && v !== 'auto') block[p] = v;
-          }
-          block.content = content;
-          out[pseudo] = block;
-        }
-      } catch {}
-    }
-    return Object.keys(out).length ? out : undefined;
-  }
-
-  function serialize(el) {
-    if (el.nodeType === Node.TEXT_NODE) {
-      const t = el.textContent;
-      return t && t.trim() ? { text: t } : null;
-    }
-    if (el.nodeType !== Node.ELEMENT_NODE) return null;
-    if (el.tagName === 'SCRIPT' || el.tagName === 'STYLE' || el.tagName === 'NOSCRIPT') return null;
-    const attrs = {};
-    for (const a of el.attributes) attrs[a.name] = a.value;
-    const computed = nonDefault(el);
-    const pseudo = pseudoStyles(el);
-    if (pseudo) computed.pseudo = pseudo;
-    const r = el.getBoundingClientRect();
-    const children = [];
-    for (const c of el.childNodes) {
-      const s = serialize(c);
-      if (s) children.push(s);
-    }
-    return {
-      tag: el.tagName.toLowerCase(),
-      attrs,
-      computed,
-      bbox: { x: r.x, y: r.y + window.scrollY, width: r.width, height: r.height },
-      children,
-    };
-  }
-
-  window.__CLONE_DUMP_COMPUTED__ = () => serialize(document.body);
-})();
diff --git a/.opencode/scripts/init-hooks/css-rules.js b/.opencode/scripts/init-hooks/css-rules.js
deleted file mode 100644
index cb39100..0000000
--- a/.opencode/scripts/init-hooks/css-rules.js
+++ /dev/null
@@ -1,121 +0,0 @@
-// Dumps every same-origin CSS rule as { selector, cssText } into __CLONE_CAPTURE__.cssRules,
-// and extracts every url(...) asset reference (resolved to absolute URLs) into
-// __CLONE_CAPTURE__.cssAssets. Catches background-images set in stylesheets that the
-// response listener missed (e.g. @media-gated, ::before, mask-image, list-style-image, cursor).
-(() => {
-  function isSameOrigin(href) {
-    if (!href) return true;
-    try {
-      const u = new URL(href, location.href);
-      return u.origin === location.origin;
-    } catch {
-      return false;
-    }
-  }
-
-  function resolveUrl(raw, baseHref) {
-    if (!raw) return null;
-    let s = raw.trim();
-    if (s.startsWith('"') || s.startsWith("'")) s = s.slice(1, -1);
-    if (s.startsWith('data:') || s.startsWith('#')) return null;
-    try {
-      return new URL(s, baseHref || location.href).href;
-    } catch {
-      return null;
-    }
-  }
-
-  function collectFromRules(rules, baseHref, out) {
-    if (!rules) return;
-    for (const rule of rules) {
-      const type = rule.constructor?.name || '';
-      if (type === 'CSSStyleRule') {
-        const text = rule.cssText || '';
-        out.rules.push({ selector: rule.selectorText, cssText: text, baseHref });
-        const urls = text.match(/url\(\s*([^)]+?)\s*\)/g) || [];
-        for (const m of urls) {
-          const inner = m
-            .slice(4, -1)
-            .trim()
-            .replace(/^['"]|['"]$/g, '');
-          const abs = resolveUrl(inner, baseHref);
-          if (abs && !out.assetSet.has(abs)) {
-            out.assetSet.add(abs);
-            out.assets.push({ source_url: abs, selector: rule.selectorText });
-          }
-        }
-      } else if (type === 'CSSMediaRule' || type === 'CSSSupportsRule' || type === 'CSSContainerRule') {
-        const condition = rule.conditionText || rule.media?.mediaText;
-        out.media.push({ condition, type });
-        collectFromRules(rule.cssRules, baseHref, out);
-      } else if (type === 'CSSImportRule') {
-        // Recurse into imported stylesheet if same-origin and accessible
-        try {
-          const importedHref = rule.styleSheet?.href || baseHref;
-          if (isSameOrigin(importedHref)) {
-            collectFromRules(rule.styleSheet?.cssRules, importedHref, out);
-          }
-        } catch {}
-      } else if (type === 'CSSFontFaceRule') {
-        const text = rule.cssText || '';
-        out.fontFaces.push({ cssText: text, baseHref });
-        const urls = text.match(/url\(\s*([^)]+?)\s*\)/g) || [];
-        for (const m of urls) {
-          const inner = m
-            .slice(4, -1)
-            .trim()
-            .replace(/^['"]|['"]$/g, '');
-          const abs = resolveUrl(inner, baseHref);
-          if (abs && !out.assetSet.has(abs)) {
-            out.assetSet.add(abs);
-            out.assets.push({ source_url: abs, selector: '@font-face' });
-          }
-        }
-      } else if (type === 'CSSKeyframesRule') {
-        const frames = [];
-        for (const k of rule.cssRules || []) frames.push({ key: k.keyText, cssText: k.style?.cssText || '' });
-        out.keyframes.push({ name: rule.name, frames, baseHref });
-      } else if (rule.cssRules) {
-        collectFromRules(rule.cssRules, baseHref, out);
-      }
-    }
-  }
-
-  function collect() {
-    const out = {
-      rules: [],
-      media: [],
-      fontFaces: [],
-      keyframes: [],
-      assets: [],
-      assetSet: new Set(),
-      crossOrigin: 0,
-    };
-    for (const sheet of document.styleSheets) {
-      const baseHref = sheet.href || location.href;
-      let rules;
-      try {
-        rules = sheet.cssRules;
-      } catch {
-        out.crossOrigin += 1;
-        continue;
-      }
-      collectFromRules(rules, baseHref, out);
-    }
-    delete out.assetSet;
-    window.__CLONE_CAPTURE__.cssRules = out;
-  }
-
-  const prevFinalize = window.__CLONE_FINALIZE__;
-  window.__CLONE_FINALIZE__ = function () {
-    if (prevFinalize)
-      try {
-        prevFinalize();
-      } catch {}
-    try {
-      collect();
-    } catch (e) {
-      window.__CLONE_CAPTURE__.cssRules = { error: String(e) };
-    }
-  };
-})();
diff --git a/.opencode/scripts/init-hooks/css-vars.js b/.opencode/scripts/init-hooks/css-vars.js
deleted file mode 100644
index 6c6cb34..0000000
--- a/.opencode/scripts/init-hooks/css-vars.js
+++ /dev/null
@@ -1,51 +0,0 @@
-// Dumps every :root --custom-property and every @property registration into
-// window.__CLONE_CAPTURE__.cssVars, keyed under { custom, registered }.
-(() => {
-  function collect() {
-    const custom = {};
-    try {
-      const cs = getComputedStyle(document.documentElement);
-      for (let i = 0; i < cs.length; i++) {
-        const name = cs[i];
-        if (!name.startsWith('--')) continue;
-        try {
-          custom[name] = cs.getPropertyValue(name).trim();
-        } catch {}
-      }
-    } catch {}
-
-    const registered = [];
-    try {
-      for (const sheet of document.styleSheets) {
-        let rules;
-        try {
-          rules = sheet.cssRules;
-        } catch {
-          continue;
-        }
-        if (!rules) continue;
-        for (const rule of rules) {
-          if (rule.constructor?.name === 'CSSPropertyRule' || rule.type === 18 /* @property */) {
-            registered.push({
-              name: rule.name,
-              syntax: rule.syntax,
-              initialValue: rule.initialValue,
-              inherits: rule.inherits,
-            });
-          }
-        }
-      }
-    } catch {}
-
-    window.__CLONE_CAPTURE__.cssVars = { custom, registered };
-  }
-
-  const prevFinalize = window.__CLONE_FINALIZE__;
-  window.__CLONE_FINALIZE__ = function () {
-    if (prevFinalize)
-      try {
-        prevFinalize();
-      } catch {}
-    collect();
-  };
-})();
diff --git a/.opencode/scripts/init-hooks/framer-dump.js b/.opencode/scripts/init-hooks/framer-dump.js
deleted file mode 100644
index 83a4522..0000000
--- a/.opencode/scripts/init-hooks/framer-dump.js
+++ /dev/null
@@ -1,107 +0,0 @@
-// Walks the React fiber tree (via __REACT_DEVTOOLS_GLOBAL_HOOK__) to find framer-motion
-// components and dump their animate/variants/transition/whileInView/whileHover props.
-// Called from __CLONE_FINALIZE__.
-(() => {
-  function cssPath(el) {
-    if (!el || el.nodeType !== 1) return null;
-    if (el.id) return `#${el.id}`;
-    const parts = [];
-    while (el && el.nodeType === 1 && parts.length < 10) {
-      let s = el.tagName.toLowerCase();
-      const p = el.parentNode;
-      if (p) {
-        const sibs = Array.from(p.children).filter((c) => c.tagName === el.tagName);
-        if (sibs.length > 1) s += `:nth-of-type(${sibs.indexOf(el) + 1})`;
-      }
-      parts.unshift(s);
-      el = el.parentNode;
-    }
-    return parts.join(' > ');
-  }
-
-  function isMotionComponent(fiber) {
-    const type = fiber?.type;
-    if (!type) return false;
-    if (type.$$typeof && type.render && type.render.displayName?.startsWith('motion.')) return true;
-    const dn = type.displayName || type.name;
-    if (typeof dn === 'string' && (dn.startsWith('motion.') || dn === 'MotionComponent')) return true;
-    return false;
-  }
-
-  function serializeProp(v) {
-    try {
-      if (v == null) return v;
-      if (typeof v === 'function') return null;
-      if (typeof v === 'object') {
-        const out = {};
-        for (const k of Object.keys(v)) {
-          const val = v[k];
-          if (typeof val === 'function') continue;
-          if (val && typeof val === 'object' && val.nodeType) continue;
-          out[k] = val;
-        }
-        return out;
-      }
-      return v;
-    } catch {
-      return null;
-    }
-  }
-
-  function findFibers(fiber, out) {
-    if (!fiber) return;
-    if (isMotionComponent(fiber)) {
-      const props = fiber.memoizedProps || {};
-      let node = fiber.stateNode;
-      if (!(node instanceof Element)) {
-        // Walk down to the first DOM host for selector extraction.
-        let cursor = fiber.child;
-        while (cursor) {
-          if (cursor.stateNode instanceof Element) {
-            node = cursor.stateNode;
-            break;
-          }
-          cursor = cursor.child;
-        }
-      }
-      out.push({
-        selector: node instanceof Element ? cssPath(node) : null,
-        initial: serializeProp(props.initial),
-        animate: serializeProp(props.animate),
-        exit: serializeProp(props.exit),
-        variants: serializeProp(props.variants),
-        transition: serializeProp(props.transition),
-        whileHover: serializeProp(props.whileHover),
-        whileTap: serializeProp(props.whileTap),
-        whileInView: serializeProp(props.whileInView),
-        viewport: serializeProp(props.viewport),
-      });
-    }
-    if (fiber.child) findFibers(fiber.child, out);
-    if (fiber.sibling) findFibers(fiber.sibling, out);
-  }
-
-  const prevFinalize = window.__CLONE_FINALIZE__;
-  window.__CLONE_FINALIZE__ = function () {
-    if (prevFinalize)
-      try {
-        prevFinalize();
-      } catch {}
-    try {
-      const hook = window.__REACT_DEVTOOLS_GLOBAL_HOOK__;
-      if (!hook || !hook.renderers) return;
-      for (const [, renderer] of hook.renderers) {
-        if (!renderer) continue;
-        const roots = renderer.findFiberByHostInstance ? null : renderer.roots || null;
-        const scanFrom = [];
-        if (hook.getFiberRoots) {
-          const rootSet = hook.getFiberRoots(1) || new Set();
-          for (const r of rootSet) scanFrom.push(r.current);
-        }
-        for (const fiber of scanFrom) findFibers(fiber, window.__CLONE_CAPTURE__.framer);
-      }
-    } catch (e) {
-      window.__CLONE_CAPTURE__.framer.push({ error: String(e) });
-    }
-  };
-})();
diff --git a/.opencode/scripts/init-hooks/gsap-dump.js b/.opencode/scripts/init-hooks/gsap-dump.js
deleted file mode 100644
index 9bff57a..0000000
--- a/.opencode/scripts/init-hooks/gsap-dump.js
+++ /dev/null
@@ -1,103 +0,0 @@
-// Dumps GSAP timelines + tweens into window.__CLONE_CAPTURE__.gsap after load.
-// Runs on __CLONE_FINALIZE__ so that page-load animations have had time to register.
-(() => {
-  function cssPath(el) {
-    if (!el || el.nodeType !== 1) return null;
-    if (el.id) return `#${el.id}`;
-    const parts = [];
-    while (el && el.nodeType === 1 && parts.length < 10) {
-      let s = el.tagName.toLowerCase();
-      const p = el.parentNode;
-      if (p) {
-        const sibs = Array.from(p.children).filter((c) => c.tagName === el.tagName);
-        if (sibs.length > 1) s += `:nth-of-type(${sibs.indexOf(el) + 1})`;
-      }
-      parts.unshift(s);
-      el = el.parentNode;
-    }
-    return parts.join(' > ');
-  }
-
-  function targetsToSelectors(targets) {
-    if (!targets) return [];
-    if (targets instanceof Element) return [cssPath(targets)];
-    if (Array.isArray(targets) || targets.length != null) {
-      const out = [];
-      for (let i = 0; i < targets.length; i++) {
-        const t = targets[i];
-        if (t instanceof Element) out.push(cssPath(t));
-        else if (typeof t === 'string') out.push(t);
-      }
-      return out;
-    }
-    if (typeof targets === 'string') return [targets];
-    return [];
-  }
-
-  function serializeEase(ease) {
-    if (!ease) return null;
-    if (typeof ease === 'string') return ease;
-    if (typeof ease === 'function') return ease.name || ease.toString().slice(0, 40);
-    return String(ease);
-  }
-
-  function serializeTween(t) {
-    const vars = {};
-    if (t.vars) {
-      for (const k of Object.keys(t.vars)) {
-        if (['onComplete', 'onStart', 'onUpdate', 'onRepeat', 'scrollTrigger'].includes(k)) continue;
-        try {
-          const v = t.vars[k];
-          if (typeof v === 'function') continue;
-          if (v && typeof v === 'object' && v.nodeType) continue;
-          vars[k] = v;
-        } catch {}
-      }
-    }
-    return {
-      type: 'tween',
-      targets: targetsToSelectors(t._targets || t.targets?.()),
-      duration: t.duration?.() ?? t._duration,
-      ease: serializeEase(t.vars?.ease),
-      vars,
-      scrollTrigger: t.vars?.scrollTrigger
-        ? {
-            trigger:
-              t.vars.scrollTrigger.trigger instanceof Element
-                ? cssPath(t.vars.scrollTrigger.trigger)
-                : t.vars.scrollTrigger.trigger,
-            start: t.vars.scrollTrigger.start,
-            end: t.vars.scrollTrigger.end,
-            scrub: t.vars.scrollTrigger.scrub,
-            pin: t.vars.scrollTrigger.pin,
-          }
-        : null,
-    };
-  }
-
-  function walk(tl) {
-    const out = { type: 'timeline', duration: tl.duration?.(), children: [] };
-    const kids = tl.getChildren ? tl.getChildren(true, true, true) : [];
-    for (const c of kids) {
-      if (c.getChildren) out.children.push(walk(c));
-      else out.children.push(serializeTween(c));
-    }
-    return out;
-  }
-
-  const prevFinalize = window.__CLONE_FINALIZE__;
-  window.__CLONE_FINALIZE__ = function () {
-    if (prevFinalize)
-      try {
-        prevFinalize();
-      } catch {}
-    try {
-      if (!window.gsap) return;
-      const root = window.gsap.globalTimeline;
-      if (!root) return;
-      window.__CLONE_CAPTURE__.gsap.push(walk(root));
-    } catch (e) {
-      window.__CLONE_CAPTURE__.gsap.push({ error: String(e) });
-    }
-  };
-})();
diff --git a/.opencode/scripts/init-hooks/lottie-dump.js b/.opencode/scripts/init-hooks/lottie-dump.js
deleted file mode 100644
index f3954bf..0000000
--- a/.opencode/scripts/init-hooks/lottie-dump.js
+++ /dev/null
@@ -1,47 +0,0 @@
-// Pulls registered Lottie animations + their animationData into window.__CLONE_CAPTURE__.lottie.
-// Called from __CLONE_FINALIZE__. Supports lottie-web directly; lottie-react uses lottie-web internally.
-(() => {
-  function cssPath(el) {
-    if (!el || el.nodeType !== 1) return null;
-    if (el.id) return `#${el.id}`;
-    const parts = [];
-    while (el && el.nodeType === 1 && parts.length < 10) {
-      let s = el.tagName.toLowerCase();
-      const p = el.parentNode;
-      if (p) {
-        const sibs = Array.from(p.children).filter((c) => c.tagName === el.tagName);
-        if (sibs.length > 1) s += `:nth-of-type(${sibs.indexOf(el) + 1})`;
-      }
-      parts.unshift(s);
-      el = el.parentNode;
-    }
-    return parts.join(' > ');
-  }
-
-  const prevFinalize = window.__CLONE_FINALIZE__;
-  window.__CLONE_FINALIZE__ = function () {
-    if (prevFinalize)
-      try {
-        prevFinalize();
-      } catch {}
-    try {
-      const lottie = window.lottie || window.bodymovin;
-      if (!lottie || typeof lottie.getRegisteredAnimations !== 'function') return;
-      const anims = lottie.getRegisteredAnimations();
-      for (const a of anims) {
-        try {
-          window.__CLONE_CAPTURE__.lottie.push({
-            selector: a.wrapper instanceof Element ? cssPath(a.wrapper) : null,
-            renderer: a.renderer?.name || 'unknown',
-            animationData: a.animationData ? JSON.parse(JSON.stringify(a.animationData)) : null,
-            loop: a.loop,
-            autoplay: a.autoplay,
-            name: a.name,
-          });
-        } catch {}
-      }
-    } catch (e) {
-      window.__CLONE_CAPTURE__.lottie.push({ error: String(e) });
-    }
-  };
-})();
diff --git a/.opencode/scripts/init-hooks/section-scan.js b/.opencode/scripts/init-hooks/section-scan.js
deleted file mode 100644
index 675230f..0000000
--- a/.opencode/scripts/init-hooks/section-scan.js
+++ /dev/null
@@ -1,147 +0,0 @@
-// Exposes window.__CLONE_LIST_SECTIONS__() which returns a list of candidate top-level
-// section bounding boxes for the capture script's scroll planner. We emit one entry per
-// large flex/block child of <body>, <main>, or any element classed as section/container/etc.
-// The capture script uses these to scroll-to-section instead of fixed-pixel stepping.
-(() => {
-  const SECTIONLIKE_TAGS = new Set(['section', 'header', 'footer', 'nav', 'main', 'article', 'aside']);
-  const SECTIONLIKE_CLASS_RE =
-    /(^|\s)(section|hero|container|banner|elementor-section|elementor-element-[^\s]+|e-con|e-parent|wp-block-[^\s]+)(\s|$)/i;
-
-  function isViewportWide(el, vw) {
-    const r = el.getBoundingClientRect();
-    return r.width >= vw * 0.5 && r.height >= 80;
-  }
-
-  function isVisible(el) {
-    const cs = getComputedStyle(el);
-    if (cs.display === 'none' || cs.visibility === 'hidden') return false;
-    if (parseFloat(cs.opacity) === 0) return false;
-    return true;
-  }
-
-  function looksLikeSection(el) {
-    const tag = el.tagName.toLowerCase();
-    if (SECTIONLIKE_TAGS.has(tag)) return true;
-    if (el.id && /(hero|banner|section|footer|nav|header)/i.test(el.id)) return true;
-    if (typeof el.className === 'string' && SECTIONLIKE_CLASS_RE.test(el.className)) return true;
-    return false;
-  }
-
-  function cssPath(el) {
-    if (!el || el.nodeType !== 1) return null;
-    if (el.id) return `#${el.id}`;
-    const parts = [];
-    while (el && el.nodeType === 1 && parts.length < 8) {
-      let s = el.tagName.toLowerCase();
-      const p = el.parentNode;
-      if (p && p.nodeType === 1) {
-        const sibs = Array.from(p.children).filter((c) => c.tagName === el.tagName);
-        if (sibs.length > 1) s += `:nth-of-type(${sibs.indexOf(el) + 1})`;
-      }
-      parts.unshift(s);
-      el = el.parentNode;
-    }
-    return parts.join(' > ');
-  }
-
-  const SECTION_QUERY =
-    'section, header, footer, nav, main, article, ' +
-    '[class*="section"], [class*="elementor-element"], [class*="e-parent"], [class*="e-con"], ' +
-    '[class*="hero"], [class*="banner"], [id*="section"], [id*="hero"], [id*="banner"]';
-
-  function snapshotEntry(el, vw) {
-    const r = el.getBoundingClientRect();
-    return {
-      element: el,
-      selector: cssPath(el),
-      tag: el.tagName.toLowerCase(),
-      id: el.id || null,
-      className: typeof el.className === 'string' ? el.className.slice(0, 200) : null,
-      x: r.x,
-      y: r.y + window.scrollY,
-      width: r.width,
-      height: r.height,
-      looksLikeSection: looksLikeSection(el),
-    };
-  }
-
-  function collectInScope(scope, vw, out, candidates) {
-    for (const el of candidates) {
-      if (!scope.contains(el) || el === scope) continue;
-      if (!isVisible(el) || !isViewportWide(el, vw)) continue;
-      // Outermost-wins inside this scope
-      let skip = false;
-      for (const o of out) {
-        if (o.element.contains(el)) {
-          skip = true;
-          break;
-        }
-      }
-      if (skip) continue;
-      for (let i = out.length - 1; i >= 0; i--) {
-        if (el.contains(out[i].element)) out.splice(i, 1);
-      }
-      out.push(snapshotEntry(el, vw));
-    }
-  }
-
-  window.__CLONE_LIST_SECTIONS__ = () => {
-    const vw = window.innerWidth;
-    const vh = window.innerHeight;
-    const docHeight = Math.max(document.documentElement.scrollHeight, document.body ? document.body.scrollHeight : 0);
-
-    // Pass 1: known section-like elements
-    const candidates = Array.from(document.querySelectorAll(SECTION_QUERY));
-
-    // Pass 2: large direct children of body/main as a fallback
-    const root = document.querySelector('main') || document.body;
-    if (root) {
-      for (const child of root.children) {
-        if (!candidates.includes(child)) candidates.push(child);
-      }
-    }
-
-    // First-pass dedup with outermost-wins
-    const out = [];
-    for (const el of candidates) {
-      if (!isVisible(el) || !isViewportWide(el, vw)) continue;
-      let skip = false;
-      for (const o of out) {
-        if (o.element.contains(el)) {
-          skip = true;
-          break;
-        }
-      }
-      if (skip) continue;
-      for (let i = out.length - 1; i >= 0; i--) {
-        if (el.contains(out[i].element)) out.splice(i, 1);
-      }
-      out.push(snapshotEntry(el, vw));
-    }
-
-    // Pass 3: oversized-wrapper expansion. WordPress / Elementor sites commonly
-    // wrap the whole page in <main id="main">. Without this step the outer
-    // wrapper wins and individual sections are dropped, so the smart-scroll
-    // loop never visits them and lazy backgrounds never fire.
-    const oversizedThreshold = Math.max(vh * 2, docHeight * 0.5);
-    const expanded = [];
-    for (const sec of out) {
-      if (sec.height < oversizedThreshold) {
-        expanded.push(sec);
-        continue;
-      }
-      const inner = [];
-      const innerCandidates = Array.from(sec.element.querySelectorAll(SECTION_QUERY));
-      collectInScope(sec.element, vw, inner, innerCandidates);
-      // Only replace the wrapper if recursion produced enough sections to be
-      // meaningful — otherwise this is a genuine large section, not a wrapper.
-      if (inner.length >= 3) expanded.push(...inner);
-      else expanded.push(sec);
-    }
-
-    return expanded
-      .filter((s) => s.height > 80)
-      .sort((a, b) => a.y - b.y)
-      .map(({ element, ...rest }) => rest);
-  };
-})();
diff --git a/.opencode/scripts/init-hooks/shaders.js b/.opencode/scripts/init-hooks/shaders.js
deleted file mode 100644
index 4fd636a..0000000
--- a/.opencode/scripts/init-hooks/shaders.js
+++ /dev/null
@@ -1,97 +0,0 @@
-// Extract GLSL from WebGL1 + WebGL2 by intercepting shaderSource / compileShader / linkProgram / useProgram.
-// Stashes into window.__CLONE_CAPTURE__.shaders as
-//   { programId, vertex, fragment, attributes, uniforms, canvasSelector }
-(() => {
-  const CAPTURE = () => window.__CLONE_CAPTURE__;
-
-  const shaderMap = new WeakMap(); // WebGLShader -> { type, source }
-  const programMap = new WeakMap(); // WebGLProgram -> { vertex, fragment }
-  let nextProgramId = 1;
-  const contextCanvas = new WeakMap(); // WebGL(2)RenderingContext -> canvas
-
-  function patch(ctxProto, isGL2) {
-    const origShaderSource = ctxProto.shaderSource;
-    ctxProto.shaderSource = function (shader, source) {
-      shaderMap.set(shader, { source, type: this.getShaderParameter?.(shader, this.SHADER_TYPE) });
-      return origShaderSource.call(this, shader, source);
-    };
-
-    const origAttach = ctxProto.attachShader;
-    ctxProto.attachShader = function (program, shader) {
-      const info = shaderMap.get(shader);
-      const t = this.getShaderParameter(shader, this.SHADER_TYPE);
-      const entry = programMap.get(program) || {};
-      if (t === this.VERTEX_SHADER) entry.vertex = info?.source || '';
-      else if (t === this.FRAGMENT_SHADER) entry.fragment = info?.source || '';
-      programMap.set(program, entry);
-      return origAttach.call(this, program, shader);
-    };
-
-    const origLink = ctxProto.linkProgram;
-    ctxProto.linkProgram = function (program) {
-      const res = origLink.call(this, program);
-      const entry = programMap.get(program) || {};
-      if (!entry.id) entry.id = nextProgramId++;
-      const canvas = contextCanvas.get(this);
-      const sel = canvas ? cssPath(canvas) : null;
-      const attributes = [];
-      const uniforms = [];
-      try {
-        const aCount = this.getProgramParameter(program, this.ACTIVE_ATTRIBUTES);
-        for (let i = 0; i < aCount; i++) {
-          const info = this.getActiveAttrib(program, i);
-          if (info) attributes.push({ name: info.name, type: info.type, size: info.size });
-        }
-        const uCount = this.getProgramParameter(program, this.ACTIVE_UNIFORMS);
-        for (let i = 0; i < uCount; i++) {
-          const info = this.getActiveUniform(program, i);
-          if (info) uniforms.push({ name: info.name, type: info.type, size: info.size });
-        }
-      } catch {}
-      CAPTURE().shaders.push({
-        programId: entry.id,
-        vertex: entry.vertex || '',
-        fragment: entry.fragment || '',
-        attributes,
-        uniforms,
-        canvasSelector: sel,
-        isWebGL2: isGL2,
-      });
-      return res;
-    };
-  }
-
-  // Intercept getContext to remember which canvas owns which WebGL context.
-  const origGetContext = HTMLCanvasElement.prototype.getContext;
-  HTMLCanvasElement.prototype.getContext = function (type, ...rest) {
-    const ctx = origGetContext.call(this, type, ...rest);
-    if (ctx && (type === 'webgl' || type === 'webgl2' || type === 'experimental-webgl')) {
-      contextCanvas.set(ctx, this);
-    }
-    return ctx;
-  };
-
-  if (typeof WebGLRenderingContext !== 'undefined') patch(WebGLRenderingContext.prototype, false);
-  if (typeof WebGL2RenderingContext !== 'undefined') patch(WebGL2RenderingContext.prototype, true);
-
-  function cssPath(el) {
-    if (!el) return null;
-    const parts = [];
-    while (el && el.nodeType === 1 && parts.length < 10) {
-      let s = el.tagName.toLowerCase();
-      if (el.id) {
-        s += '#' + el.id;
-        parts.unshift(s);
-        break;
-      }
-      const parent = el.parentNode;
-      if (parent) {
-        const sibs = Array.from(parent.children).filter((c) => c.tagName === el.tagName);
-        if (sibs.length > 1) s += `:nth-of-type(${sibs.indexOf(el) + 1})`;
-      }
-      parts.unshift(s);
-      el = el.parentNode;
-    }
-    return parts.join(' > ');
-  }
-})();
diff --git a/.opencode/scripts/init-hooks/threejs-dump.js b/.opencode/scripts/init-hooks/threejs-dump.js
deleted file mode 100644
index ba6d3b5..0000000
--- a/.opencode/scripts/init-hooks/threejs-dump.js
+++ /dev/null
@@ -1,130 +0,0 @@
-// Patches THREE.WebGLRenderer to track its canvas + scene root, then serializes the scene graph
-// at __CLONE_FINALIZE__. Records geometry types, material types + uniforms, lights, cameras,
-// and per-object position/rotation/scale.
-(() => {
-  const renderers = new Set();
-  const rendererToScene = new WeakMap();
-
-  function cssPath(el) {
-    if (!el || el.nodeType !== 1) return null;
-    if (el.id) return `#${el.id}`;
-    const parts = [];
-    while (el && el.nodeType === 1 && parts.length < 10) {
-      let s = el.tagName.toLowerCase();
-      const p = el.parentNode;
-      if (p) {
-        const sibs = Array.from(p.children).filter((c) => c.tagName === el.tagName);
-        if (sibs.length > 1) s += `:nth-of-type(${sibs.indexOf(el) + 1})`;
-      }
-      parts.unshift(s);
-      el = el.parentNode;
-    }
-    return parts.join(' > ');
-  }
-
-  function patchWhenReady() {
-    if (!window.THREE || !window.THREE.WebGLRenderer) return false;
-    const WR = window.THREE.WebGLRenderer;
-    const origRender = WR.prototype.render;
-    WR.prototype.render = function (scene, camera) {
-      renderers.add(this);
-      if (scene) rendererToScene.set(this, { scene, camera });
-      return origRender.call(this, scene, camera);
-    };
-    return true;
-  }
-
-  if (!patchWhenReady()) {
-    const timer = setInterval(() => {
-      if (patchWhenReady()) clearInterval(timer);
-    }, 200);
-    setTimeout(() => clearInterval(timer), 10_000);
-  }
-
-  function serializeObject(obj) {
-    const out = {
-      type: obj.type || obj.constructor?.name || 'Object3D',
-      name: obj.name || undefined,
-      position: obj.position ? [obj.position.x, obj.position.y, obj.position.z] : undefined,
-      rotation: obj.rotation ? [obj.rotation.x, obj.rotation.y, obj.rotation.z] : undefined,
-      scale: obj.scale ? [obj.scale.x, obj.scale.y, obj.scale.z] : undefined,
-      visible: obj.visible,
-      children: [],
-    };
-    if (obj.geometry) {
-      out.geometry = {
-        type: obj.geometry.type,
-        parameters: obj.geometry.parameters ? { ...obj.geometry.parameters } : undefined,
-      };
-    }
-    if (obj.material) {
-      const m = Array.isArray(obj.material) ? obj.material[0] : obj.material;
-      out.material = {
-        type: m.type,
-        color: m.color ? m.color.getHex?.().toString(16) : undefined,
-        opacity: m.opacity,
-        transparent: m.transparent,
-        uniforms: m.uniforms ? summarizeUniforms(m.uniforms) : undefined,
-        vertexShader: m.vertexShader?.slice(0, 4000),
-        fragmentShader: m.fragmentShader?.slice(0, 4000),
-      };
-    }
-    if (obj.isLight) {
-      out.light = {
-        type: obj.type,
-        color: obj.color?.getHex?.()?.toString(16),
-        intensity: obj.intensity,
-      };
-    }
-    if (obj.isCamera) {
-      out.camera = {
-        type: obj.type,
-        fov: obj.fov,
-        aspect: obj.aspect,
-        near: obj.near,
-        far: obj.far,
-      };
-    }
-    if (obj.children?.length) {
-      out.children = obj.children.map(serializeObject);
-    }
-    return out;
-  }
-
-  function summarizeUniforms(u) {
-    const out = {};
-    for (const k of Object.keys(u)) {
-      try {
-        const v = u[k]?.value;
-        if (v == null) continue;
-        if (typeof v === 'number') out[k] = v;
-        else if (Array.isArray(v)) out[k] = v.slice(0, 16);
-        else if (v.x != null && v.y != null) out[k] = [v.x, v.y, v.z ?? 0, v.w ?? 0];
-        else out[k] = String(v).slice(0, 80);
-      } catch {}
-    }
-    return out;
-  }
-
-  const prevFinalize = window.__CLONE_FINALIZE__;
-  window.__CLONE_FINALIZE__ = function () {
-    if (prevFinalize)
-      try {
-        prevFinalize();
-      } catch {}
-    try {
-      for (const r of renderers) {
-        const { scene, camera } = rendererToScene.get(r) || {};
-        const dom = r.domElement;
-        window.__CLONE_CAPTURE__.threejs.push({
-          canvasSelector: dom instanceof Element ? cssPath(dom) : null,
-          size: dom ? [dom.width, dom.height] : null,
-          scene: scene ? serializeObject(scene) : null,
-          camera: camera ? serializeObject(camera) : null,
-        });
-      }
-    } catch (e) {
-      window.__CLONE_CAPTURE__.threejs.push({ error: String(e) });
-    }
-  };
-})();
diff --git a/.opencode/scripts/requirements.txt b/.opencode/scripts/requirements.txt
deleted file mode 100644
index 87dff14..0000000
--- a/.opencode/scripts/requirements.txt
+++ /dev/null
@@ -1,7 +0,0 @@
-playwright>=1.40
-httpx>=0.25
-tinycss2>=1.2
-pixelmatch>=0.3
-pillow>=10
-numpy>=1.26
-scipy>=1.11
diff --git a/.opencode/skills/agent-browser/SKILL.md b/.opencode/skills/agent-browser/SKILL.md
deleted file mode 100644
index 416e933..0000000
--- a/.opencode/skills/agent-browser/SKILL.md
+++ /dev/null
@@ -1,632 +0,0 @@
----
-name: agent-browser
-description: Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to "open a website", "fill out a form", "click a button", "take a screenshot", "scrape data from a page", "test this web app", "login to a site", "automate browser actions", or any task requiring programmatic web interaction.
-user-invocable: false
-allowed-tools: Bash(npx agent-browser:*), Bash(agent-browser:*)
----
-
-# Browser Automation with agent-browser
-
-## Core Workflow
-
-Every browser automation follows this pattern:
-
-1. **Navigate**: `agent-browser open <url>`
-2. **Snapshot**: `agent-browser snapshot -i` (get element refs like `@e1`, `@e2`)
-3. **Interact**: Use refs to click, fill, select
-4. **Re-snapshot**: After navigation or DOM changes, get fresh refs
-
-```bash
-agent-browser open https://example.com/form
-agent-browser snapshot -i
-# Output: @e1 [input type="email"], @e2 [input type="password"], @e3 [button] "Submit"
-
-agent-browser fill @e1 "user@example.com"
-agent-browser fill @e2 "password123"
-agent-browser click @e3
-agent-browser wait --load networkidle
-agent-browser snapshot -i  # Check result
-```
-
-## Command Chaining
-
-Commands can be chained with `&&` in a single shell invocation. The browser persists between commands via a background daemon, so chaining is safe and more efficient than separate calls.
-
-```bash
-# Chain open + wait + snapshot in one call
-agent-browser open https://example.com && agent-browser wait --load networkidle && agent-browser snapshot -i
-
-# Chain multiple interactions
-agent-browser fill @e1 "user@example.com" && agent-browser fill @e2 "password123" && agent-browser click @e3
-
-# Navigate and capture
-agent-browser open https://example.com && agent-browser wait --load networkidle && agent-browser screenshot page.png
-```
-
-**When to chain:** Use `&&` when you don't need to read the output of an intermediate command before proceeding (e.g., open + wait + screenshot). Run commands separately when you need to parse the output first (e.g., snapshot to discover refs, then interact using those refs).
-
-## Handling Authentication
-
-When automating a site that requires login, choose the approach that fits:
-
-**Option 1: Import auth from the user's browser (fastest for one-off tasks)**
-
-```bash
-# Connect to the user's running Chrome (they're already logged in)
-agent-browser --auto-connect state save ./auth.json
-# Use that auth state
-agent-browser --state ./auth.json open https://app.example.com/dashboard
-```
-
-State files contain session tokens in plaintext -- add to `.gitignore` and delete when no longer needed. Set `AGENT_BROWSER_ENCRYPTION_KEY` for encryption at rest.
-
-**Option 2: Persistent profile (simplest for recurring tasks)**
-
-```bash
-# First run: login manually or via automation
-agent-browser --profile ~/.myapp open https://app.example.com/login
-# ... fill credentials, submit ...
-
-# All future runs: already authenticated
-agent-browser --profile ~/.myapp open https://app.example.com/dashboard
-```
-
-**Option 3: Session name (auto-save/restore cookies + localStorage)**
-
-```bash
-agent-browser --session-name myapp open https://app.example.com/login
-# ... login flow ...
-agent-browser close  # State auto-saved
-
-# Next time: state auto-restored
-agent-browser --session-name myapp open https://app.example.com/dashboard
-```
-
-**Option 4: Auth vault (credentials stored encrypted, login by name)**
-
-```bash
-echo "$PASSWORD" | agent-browser auth save myapp --url https://app.example.com/login --username user --password-stdin
-agent-browser auth login myapp
-```
-
-**Option 5: State file (manual save/load)**
-
-```bash
-# After logging in:
-agent-browser state save ./auth.json
-# In a future session:
-agent-browser state load ./auth.json
-agent-browser open https://app.example.com/dashboard
-```
-
-See [references/authentication.md](references/authentication.md) for OAuth, 2FA, cookie-based auth, and token refresh patterns.
-
-## Essential Commands
-
-```bash
-# Navigation
-agent-browser open <url>              # Navigate (aliases: goto, navigate)
-agent-browser close                   # Close browser
-
-# Snapshot
-agent-browser snapshot -i             # Interactive elements with refs (recommended)
-agent-browser snapshot -i -C          # Include cursor-interactive elements (divs with onclick, cursor:pointer)
-agent-browser snapshot -s "#selector" # Scope to CSS selector
-
-# Interaction (use @refs from snapshot)
-agent-browser click @e1               # Click element
-agent-browser click @e1 --new-tab     # Click and open in new tab
-agent-browser fill @e2 "text"         # Clear and type text
-agent-browser type @e2 "text"         # Type without clearing
-agent-browser select @e1 "option"     # Select dropdown option
-agent-browser check @e1               # Check checkbox
-agent-browser press Enter             # Press key
-agent-browser keyboard type "text"    # Type at current focus (no selector)
-agent-browser keyboard inserttext "text"  # Insert without key events
-agent-browser scroll down 500         # Scroll page
-agent-browser scroll down 500 --selector "div.content"  # Scroll within a specific container
-
-# Get information
-agent-browser get text @e1            # Get element text
-agent-browser get url                 # Get current URL
-agent-browser get title               # Get page title
-agent-browser get cdp-url             # Get CDP WebSocket URL
-
-# Wait
-agent-browser wait @e1                # Wait for element
-agent-browser wait --load networkidle # Wait for network idle
-agent-browser wait --url "**/page"    # Wait for URL pattern
-agent-browser wait 2000               # Wait milliseconds
-
-# Downloads
-agent-browser download @e1 ./file.pdf          # Click element to trigger download
-agent-browser wait --download ./output.zip     # Wait for any download to complete
-agent-browser --download-path ./downloads open <url>  # Set default download directory
-
-# Viewport & Device Emulation
-agent-browser set viewport 1920 1080          # Set viewport size (default: 1280x720)
-agent-browser set viewport 1920 1080 2        # 2x retina (same CSS size, higher res screenshots)
-agent-browser set device "iPhone 14"          # Emulate device (viewport + user agent)
-
-# Capture
-agent-browser screenshot              # Screenshot to temp dir
-agent-browser screenshot --full       # Full page screenshot (AVOID: can exceed 8000px API image limit — use scroll + multiple viewport screenshots instead)
-agent-browser screenshot --annotate   # Annotated screenshot with numbered element labels
-agent-browser pdf output.pdf          # Save as PDF
-
-# Diff (compare page states)
-agent-browser diff snapshot                          # Compare current vs last snapshot
-agent-browser diff snapshot --baseline before.txt    # Compare current vs saved file
-agent-browser diff screenshot --baseline before.png  # Visual pixel diff
-agent-browser diff url <url1> <url2>                 # Compare two pages
-agent-browser diff url <url1> <url2> --wait-until networkidle  # Custom wait strategy
-agent-browser diff url <url1> <url2> --selector "#main"  # Scope to element
-```
-
-## Common Patterns
-
-### Form Submission
-
-```bash
-agent-browser open https://example.com/signup
-agent-browser snapshot -i
-agent-browser fill @e1 "Jane Doe"
-agent-browser fill @e2 "jane@example.com"
-agent-browser select @e3 "California"
-agent-browser check @e4
-agent-browser click @e5
-agent-browser wait --load networkidle
-```
-
-### Authentication with Auth Vault (Recommended)
-
-```bash
-# Save credentials once (encrypted with AGENT_BROWSER_ENCRYPTION_KEY)
-# Recommended: pipe password via stdin to avoid shell history exposure
-echo "pass" | agent-browser auth save github --url https://github.com/login --username user --password-stdin
-
-# Login using saved profile (LLM never sees password)
-agent-browser auth login github
-
-# List/show/delete profiles
-agent-browser auth list
-agent-browser auth show github
-agent-browser auth delete github
-```
-
-### Authentication with State Persistence
-
-```bash
-# Login once and save state
-agent-browser open https://app.example.com/login
-agent-browser snapshot -i
-agent-browser fill @e1 "$USERNAME"
-agent-browser fill @e2 "$PASSWORD"
-agent-browser click @e3
-agent-browser wait --url "**/dashboard"
-agent-browser state save auth.json
-
-# Reuse in future sessions
-agent-browser state load auth.json
-agent-browser open https://app.example.com/dashboard
-```
-
-### Session Persistence
-
-```bash
-# Auto-save/restore cookies and localStorage across browser restarts
-agent-browser --session-name myapp open https://app.example.com/login
-# ... login flow ...
-agent-browser close  # State auto-saved to ~/.agent-browser/sessions/
-
-# Next time, state is auto-loaded
-agent-browser --session-name myapp open https://app.example.com/dashboard
-
-# Encrypt state at rest
-export AGENT_BROWSER_ENCRYPTION_KEY=$(openssl rand -hex 32)
-agent-browser --session-name secure open https://app.example.com
-
-# Manage saved states
-agent-browser state list
-agent-browser state show myapp-default.json
-agent-browser state clear myapp
-agent-browser state clean --older-than 7
-```
-
-### Data Extraction
-
-```bash
-agent-browser open https://example.com/products
-agent-browser snapshot -i
-agent-browser get text @e5           # Get specific element text
-agent-browser get text body > page.txt  # Get all page text
-
-# JSON output for parsing
-agent-browser snapshot -i --json
-agent-browser get text @e1 --json
-```
-
-### Parallel Sessions
-
-```bash
-agent-browser --session site1 open https://site-a.com
-agent-browser --session site2 open https://site-b.com
-
-agent-browser --session site1 snapshot -i
-agent-browser --session site2 snapshot -i
-
-agent-browser session list
-```
-
-### Connect to Existing Chrome
-
-```bash
-# Auto-discover running Chrome with remote debugging enabled
-agent-browser --auto-connect open https://example.com
-agent-browser --auto-connect snapshot
-
-# Or with explicit CDP port
-agent-browser --cdp 9222 snapshot
-```
-
-### Color Scheme (Dark Mode)
-
-```bash
-# Persistent dark mode via flag (applies to all pages and new tabs)
-agent-browser --color-scheme dark open https://example.com
-
-# Or via environment variable
-AGENT_BROWSER_COLOR_SCHEME=dark agent-browser open https://example.com
-
-# Or set during session (persists for subsequent commands)
-agent-browser set media dark
-```
-
-### Viewport & Responsive Testing
-
-```bash
-# Set a custom viewport size (default is 1280x720)
-agent-browser set viewport 1920 1080
-agent-browser screenshot desktop.png
-
-# Test mobile-width layout
-agent-browser set viewport 375 812
-agent-browser screenshot mobile.png
-
-# Retina/HiDPI: same CSS layout at 2x pixel density
-# Screenshots stay at logical viewport size, but content renders at higher DPI
-agent-browser set viewport 1920 1080 2
-agent-browser screenshot retina.png
-
-# Device emulation (sets viewport + user agent in one step)
-agent-browser set device "iPhone 14"
-agent-browser screenshot device.png
-```
-
-The `scale` parameter (3rd argument) sets `window.devicePixelRatio` without changing CSS layout. Use it when testing retina rendering or capturing higher-resolution screenshots.
-
-### Visual Browser (Debugging)
-
-```bash
-agent-browser --headed open https://example.com
-agent-browser highlight @e1          # Highlight element
-agent-browser inspect                # Open Chrome DevTools for the active page
-agent-browser record start demo.webm # Record session
-agent-browser profiler start         # Start Chrome DevTools profiling
-agent-browser profiler stop trace.json # Stop and save profile (path optional)
-```
-
-Use `AGENT_BROWSER_HEADED=1` to enable headed mode via environment variable. Browser extensions work in both headed and headless mode.
-
-### Local Files (PDFs, HTML)
-
-```bash
-# Open local files with file:// URLs
-agent-browser --allow-file-access open file:///path/to/document.pdf
-agent-browser --allow-file-access open file:///path/to/page.html
-agent-browser screenshot output.png
-```
-
-### iOS Simulator (Mobile Safari)
-
-```bash
-# List available iOS simulators
-agent-browser device list
-
-# Launch Safari on a specific device
-agent-browser -p ios --device "iPhone 16 Pro" open https://example.com
-
-# Same workflow as desktop - snapshot, interact, re-snapshot
-agent-browser -p ios snapshot -i
-agent-browser -p ios tap @e1          # Tap (alias for click)
-agent-browser -p ios fill @e2 "text"
-agent-browser -p ios swipe up         # Mobile-specific gesture
-
-# Take screenshot
-agent-browser -p ios screenshot mobile.png
-
-# Close session (shuts down simulator)
-agent-browser -p ios close
-```
-
-**Requirements:** macOS with Xcode, Appium (`npm install -g appium && appium driver install xcuitest`)
-
-**Real devices:** Works with physical iOS devices if pre-configured. Use `--device "<UDID>"` where UDID is from `xcrun xctrace list devices`.
-
-## Security
-
-All security features are opt-in. By default, agent-browser imposes no restrictions on navigation, actions, or output.
-
-### Content Boundaries (Recommended for AI Agents)
-
-Enable `--content-boundaries` to wrap page-sourced output in markers that help LLMs distinguish tool output from untrusted page content:
-
-```bash
-export AGENT_BROWSER_CONTENT_BOUNDARIES=1
-agent-browser snapshot
-# Output:
-# --- AGENT_BROWSER_PAGE_CONTENT nonce=<hex> origin=https://example.com ---
-# [accessibility tree]
-# --- END_AGENT_BROWSER_PAGE_CONTENT nonce=<hex> ---
-```
-
-### Domain Allowlist
-
-Restrict navigation to trusted domains. Wildcards like `*.example.com` also match the bare domain `example.com`. Sub-resource requests, WebSocket, and EventSource connections to non-allowed domains are also blocked. Include CDN domains your target pages depend on:
-
-```bash
-export AGENT_BROWSER_ALLOWED_DOMAINS="example.com,*.example.com"
-agent-browser open https://example.com        # OK
-agent-browser open https://malicious.com       # Blocked
-```
-
-### Action Policy
-
-Use a policy file to gate destructive actions:
-
-```bash
-export AGENT_BROWSER_ACTION_POLICY=./policy.json
-```
-
-Example `policy.json`:
-
-```json
-{ "default": "deny", "allow": ["navigate", "snapshot", "click", "scroll", "wait", "get"] }
-```
-
-Auth vault operations (`auth login`, etc.) bypass action policy but domain allowlist still applies.
-
-### Output Limits
-
-Prevent context flooding from large pages:
-
-```bash
-export AGENT_BROWSER_MAX_OUTPUT=50000
-```
-
-## Diffing (Verifying Changes)
-
-Use `diff snapshot` after performing an action to verify it had the intended effect. This compares the current accessibility tree against the last snapshot taken in the session.
-
-```bash
-# Typical workflow: snapshot -> action -> diff
-agent-browser snapshot -i          # Take baseline snapshot
-agent-browser click @e2            # Perform action
-agent-browser diff snapshot        # See what changed (auto-compares to last snapshot)
-```
-
-For visual regression testing or monitoring:
-
-```bash
-# Save a baseline screenshot, then compare later
-agent-browser screenshot baseline.png
-# ... time passes or changes are made ...
-agent-browser diff screenshot --baseline baseline.png
-
-# Compare staging vs production
-agent-browser diff url https://staging.example.com https://prod.example.com --screenshot
-```
-
-`diff snapshot` output uses `+` for additions and `-` for removals, similar to git diff. `diff screenshot` produces a diff image with changed pixels highlighted in red, plus a mismatch percentage.
-
-## Timeouts and Slow Pages
-
-The default Playwright timeout is 25 seconds for local browsers. This can be overridden with the `AGENT_BROWSER_DEFAULT_TIMEOUT` environment variable (value in milliseconds). For slow websites or large pages, use explicit waits instead of relying on the default timeout:
-
-```bash
-# Wait for network activity to settle (best for slow pages)
-agent-browser wait --load networkidle
-
-# Wait for a specific element to appear
-agent-browser wait "#content"
-agent-browser wait @e1
-
-# Wait for a specific URL pattern (useful after redirects)
-agent-browser wait --url "**/dashboard"
-
-# Wait for a JavaScript condition
-agent-browser wait --fn "document.readyState === 'complete'"
-
-# Wait a fixed duration (milliseconds) as a last resort
-agent-browser wait 5000
-```
-
-When dealing with consistently slow websites, use `wait --load networkidle` after `open` to ensure the page is fully loaded before taking a snapshot. If a specific element is slow to render, wait for it directly with `wait <selector>` or `wait @ref`.
-
-## Session Management and Cleanup
-
-When running multiple agents or automations concurrently, always use named sessions to avoid conflicts:
-
-```bash
-# Each agent gets its own isolated session
-agent-browser --session agent1 open site-a.com
-agent-browser --session agent2 open site-b.com
-
-# Check active sessions
-agent-browser session list
-```
-
-Always close your browser session when done to avoid leaked processes:
-
-```bash
-agent-browser close                    # Close default session
-agent-browser --session agent1 close   # Close specific session
-```
-
-If a previous session was not closed properly, the daemon may still be running. Use `agent-browser close` to clean it up before starting new work.
-
-## Ref Lifecycle (Important)
-
-Refs (`@e1`, `@e2`, etc.) are invalidated when the page changes. Always re-snapshot after:
-
-- Clicking links or buttons that navigate
-- Form submissions
-- Dynamic content loading (dropdowns, modals)
-
-```bash
-agent-browser click @e5              # Navigates to new page
-agent-browser snapshot -i            # MUST re-snapshot
-agent-browser click @e1              # Use new refs
-```
-
-## Annotated Screenshots (Vision Mode)
-
-Use `--annotate` to take a screenshot with numbered labels overlaid on interactive elements. Each label `[N]` maps to ref `@eN`. This also caches refs, so you can interact with elements immediately without a separate snapshot.
-
-In native mode, this currently works on the CDP-backed browser path (Chromium/Lightpanda). The Safari/WebDriver backend does not yet support `--annotate`.
-
-```bash
-agent-browser screenshot --annotate
-# Output includes the image path and a legend:
-#   [1] @e1 button "Submit"
-#   [2] @e2 link "Home"
-#   [3] @e3 textbox "Email"
-agent-browser click @e2              # Click using ref from annotated screenshot
-```
-
-Use annotated screenshots when:
-
-- The page has unlabeled icon buttons or visual-only elements
-- You need to verify visual layout or styling
-- Canvas or chart elements are present (invisible to text snapshots)
-- You need spatial reasoning about element positions
-
-## Semantic Locators (Alternative to Refs)
-
-When refs are unavailable or unreliable, use semantic locators:
-
-```bash
-agent-browser find text "Sign In" click
-agent-browser find label "Email" fill "user@test.com"
-agent-browser find role button click --name "Submit"
-agent-browser find placeholder "Search" type "query"
-agent-browser find testid "submit-btn" click
-```
-
-## JavaScript Evaluation (eval)
-
-Use `eval` to run JavaScript in the browser context. **Shell quoting can corrupt complex expressions** -- use `--stdin` or `-b` to avoid issues.
-
-```bash
-# Simple expressions work with regular quoting
-agent-browser eval 'document.title'
-agent-browser eval 'document.querySelectorAll("img").length'
-
-# Complex JS: use --stdin with heredoc (RECOMMENDED)
-agent-browser eval --stdin <<'EVALEOF'
-JSON.stringify(
-  Array.from(document.querySelectorAll("img"))
-    .filter(i => !i.alt)
-    .map(i => ({ src: i.src.split("/").pop(), width: i.width }))
-)
-EVALEOF
-
-# Alternative: base64 encoding (avoids all shell escaping issues)
-agent-browser eval -b "$(echo -n 'Array.from(document.querySelectorAll("a")).map(a => a.href)' | base64)"
-```
-
-**Why this matters:** When the shell processes your command, inner double quotes, `!` characters (history expansion), backticks, and `$()` can all corrupt the JavaScript before it reaches agent-browser. The `--stdin` and `-b` flags bypass shell interpretation entirely.
-
-**Rules of thumb:**
-
-- Single-line, no nested quotes -> regular `eval 'expression'` with single quotes is fine
-- Nested quotes, arrow functions, template literals, or multiline -> use `eval --stdin <<'EVALEOF'`
-- Programmatic/generated scripts -> use `eval -b` with base64
-
-## Configuration File
-
-Create `agent-browser.json` in the project root for persistent settings:
-
-```json
-{
-  "headed": true,
-  "proxy": "http://localhost:8080",
-  "profile": "./browser-data"
-}
-```
-
-Priority (lowest to highest): `~/.agent-browser/config.json` < `./agent-browser.json` < env vars < CLI flags. Use `--config <path>` or `AGENT_BROWSER_CONFIG` env var for a custom config file (exits with error if missing/invalid). All CLI options map to camelCase keys (e.g., `--executable-path` -> `"executablePath"`). Boolean flags accept `true`/`false` values (e.g., `--headed false` overrides config). Extensions from user and project configs are merged, not replaced.
-
-## Deep-Dive Documentation
-
-| Reference                                                            | When to Use                                               |
-| -------------------------------------------------------------------- | --------------------------------------------------------- |
-| [references/commands.md](references/commands.md)                     | Full command reference with all options                   |
-| [references/snapshot-refs.md](references/snapshot-refs.md)           | Ref lifecycle, invalidation rules, troubleshooting        |
-| [references/session-management.md](references/session-management.md) | Parallel sessions, state persistence, concurrent scraping |
-| [references/authentication.md](references/authentication.md)         | Login flows, OAuth, 2FA handling, state reuse             |
-| [references/video-recording.md](references/video-recording.md)       | Recording workflows for debugging and documentation       |
-| [references/profiling.md](references/profiling.md)                   | Chrome DevTools profiling for performance analysis        |
-| [references/proxy-support.md](references/proxy-support.md)           | Proxy configuration, geo-testing, rotating proxies        |
-
-## Experimental: Native Mode
-
-agent-browser has an experimental native Rust daemon that communicates with Chrome directly via CDP, bypassing Node.js and Playwright entirely. It is opt-in and not recommended for production use yet.
-
-```bash
-# Enable via flag
-agent-browser --native open example.com
-
-# Enable via environment variable (avoids passing --native every time)
-export AGENT_BROWSER_NATIVE=1
-agent-browser open example.com
-```
-
-The native daemon supports Chromium and Safari (via WebDriver). Firefox and WebKit are not yet supported. All core commands (navigate, snapshot, click, fill, screenshot, cookies, storage, tabs, eval, etc.) work identically in native mode. Use `agent-browser close` before switching between native and default mode within the same session.
-
-## Browser Engine Selection
-
-Use `--engine` to choose a local browser engine. The default is `chrome`.
-
-```bash
-# Use Lightpanda (fast headless browser, requires separate install)
-agent-browser --engine lightpanda open example.com
-
-# Via environment variable
-export AGENT_BROWSER_ENGINE=lightpanda
-agent-browser open example.com
-
-# With custom binary path
-agent-browser --engine lightpanda --executable-path /path/to/lightpanda open example.com
-```
-
-Supported engines:
-
-- `chrome` (default) -- Chrome/Chromium via CDP
-- `lightpanda` -- Lightpanda headless browser via CDP (10x faster, 10x less memory than Chrome)
-
-Lightpanda does not support `--extension`, `--profile`, `--state`, or `--allow-file-access`. Install Lightpanda from https://lightpanda.io/docs/open-source/installation.
-
-## Ready-to-Use Templates
-
-| Template                                                                 | Description                         |
-| ------------------------------------------------------------------------ | ----------------------------------- |
-| [templates/form-automation.sh](templates/form-automation.sh)             | Form filling with validation        |
-| [templates/authenticated-session.sh](templates/authenticated-session.sh) | Login once, reuse state             |
-| [templates/capture-workflow.sh](templates/capture-workflow.sh)           | Content extraction with screenshots |
-
-```bash
-./templates/form-automation.sh https://example.com/form
-./templates/authenticated-session.sh https://app.example.com/login
-./templates/capture-workflow.sh https://example.com ./output
-```
diff --git a/.opencode/skills/animation-translation/SKILL.md b/.opencode/skills/animation-translation/SKILL.md
deleted file mode 100644
index 3194d57..0000000
--- a/.opencode/skills/animation-translation/SKILL.md
+++ /dev/null
@@ -1,178 +0,0 @@
----
-name: animation-translation
-description: Library mapping from source-site animation primitives (CSS keyframes, CSS transitions, GSAP tweens/timelines/ScrollTrigger, Framer Motion, Lottie, Three.js, IntersectionObserver reveals) to target primitives in the cloned Next.js project. Rules on when to translate vs keep source library. Load this in Stage 2 (CSS portion) and Stage 3 (JS portion).
-user-invocable: false
----
-
-# Animation Translation
-
-Rule of thumb: prefer declarative (Framer Motion, Tailwind transitions) over imperative (GSAP, manual `requestAnimationFrame`) when the translation is clean. Keep imperative when translation loses fidelity — e.g. a GSAP timeline with 15 chained steps.
-
-## Mapping table
-
-| Source                                    | Target                                             | Stage | Notes                                                       |
-| ----------------------------------------- | -------------------------------------------------- | ----- | ----------------------------------------------------------- |
-| CSS keyframes (`@keyframes`)              | CSS keyframes kept in `globals.css`                | 2     | No reason to translate                                      |
-| CSS transition                            | Tailwind `transition-*` / arbitrary                | 2     | `transition-colors duration-200 ease-in-out`                |
-| GSAP tween (single property)              | Framer Motion `animate` prop                       | 3     | `<motion.div animate={{ opacity: 1 }} transition={{...}}/>` |
-| GSAP timeline (complex, chained)          | Keep GSAP + `@gsap/react` `useGSAP`                | 3     | Do not force bad Framer translation                         |
-| GSAP ScrollTrigger (simple)               | Framer `useScroll` + `useTransform`                | 3     | Only when trigger + 1-2 output props                        |
-| GSAP ScrollTrigger (complex)              | Keep GSAP + ScrollTrigger                          | 3     | Timeline > 3 steps, pinned, scrub                           |
-| Framer Motion (source already)            | Framer Motion direct                               | 3     | Copy `variants`, `transition`, `whileInView` verbatim       |
-| Lottie                                    | `lottie-react` + captured `animationData`          | 3     | Component is `"use client"`                                 |
-| Three.js                                  | `@react-three/fiber` + `drei`                      | 4     | Handled by `clone-advanced`                                 |
-| Custom GLSL shaders                       | `<shaderMaterial>` with extracted GLSL             | 4     | Handled by `clone-advanced`                                 |
-| `IntersectionObserver` reveal             | Framer `whileInView` + `viewport: { once: true }`  | 3     | Rarely worth keeping imperative                             |
-| Raw `<canvas>` 2D loop                    | Keep the `<canvas>` + `"use client"` + `useEffect` | 4     | If reconstruction fails, video fallback                     |
-| WAAPI (`Element.animate()`)               | Translate to Framer `animate`                      | 3     | Similar semantics                                           |
-| Parallax (`background-attachment: fixed`) | CSS kept                                           | 2     | Browsers support it directly                                |
-
-## Stage 2 (CSS animation)
-
-### Keyframes
-
-Source:
-
-```css
-@keyframes fadeUp {
-  from {
-    opacity: 0;
-    transform: translateY(12px);
-  }
-  to {
-    opacity: 1;
-    transform: none;
-  }
-}
-.hero-title {
-  animation: fadeUp 0.6s ease-out forwards;
-}
-```
-
-Target — in `globals.css`:
-
-```css
-@layer utilities {
-  @keyframes fade-up {
-    from {
-      opacity: 0;
-      transform: translateY(12px);
-    }
-    to {
-      opacity: 1;
-      transform: none;
-    }
-  }
-  .animate-fade-up {
-    animation: fade-up 0.6s ease-out forwards;
-  }
-}
-```
-
-Or, per `css-to-tailwind`, add to `tailwind.config.ts`:
-
-```ts
-theme: { extend: {
-  keyframes: { "fade-up": { from: { opacity: "0", transform: "translateY(12px)" }, to: { opacity: "1", transform: "none" } } },
-  animation: { "fade-up": "fade-up 0.6s ease-out forwards" },
-}}
-```
-
-Then the component just has `className="animate-fade-up"`.
-
-### Transitions
-
-Source: `transition: transform 400ms cubic-bezier(0.22,1,0.36,1);`
-
-Target: `className="transition-transform duration-[400ms] ease-[cubic-bezier(0.22,1,0.36,1)]"`. If that tuple repeats, promote the easing to `theme.extend.transitionTimingFunction`.
-
-## Stage 3 (JS animation)
-
-### Framer Motion (common path)
-
-The capture hook dump gives you the component's `variants`, `transition`, `animate`, `initial`, `whileInView`, `whileHover`, `whileTap` verbatim. Reproduce them:
-
-```tsx
-'use client';
-import { motion } from 'framer-motion';
-
-const variants = { hidden: { opacity: 0, y: 12 }, visible: { opacity: 1, y: 0 } };
-export default function Hero() {
-  return (
-    <motion.section
-      initial="hidden"
-      whileInView="visible"
-      viewport={{ once: true, amount: 0.3 }}
-      variants={variants}
-      transition={{ duration: 0.6, ease: [0.22, 1, 0.36, 1] }}
-    >
-      ...
-    </motion.section>
-  );
-}
-```
-
-### GSAP ScrollTrigger kept
-
-When the source has a pinned, scrubbed, multi-step timeline, translating to Framer would flatten it. Keep GSAP:
-
-```tsx
-'use client';
-import { useRef } from 'react';
-import { gsap } from 'gsap';
-import { ScrollTrigger } from 'gsap/ScrollTrigger';
-import { useGSAP } from '@gsap/react';
-
-gsap.registerPlugin(ScrollTrigger);
-
-export default function PinnedHero() {
-  const ref = useRef<HTMLDivElement>(null);
-  useGSAP(
-    () => {
-      const tl = gsap.timeline({
-        scrollTrigger: { trigger: ref.current, start: 'top top', end: '+=1200', pin: true, scrub: 1 },
-      });
-      tl.to('.layer-a', { yPercent: -30 }).to('.layer-b', { yPercent: -50 }, '<');
-    },
-    { scope: ref }
-  );
-  return <div ref={ref}>...</div>;
-}
-```
-
-### Lottie
-
-```tsx
-'use client';
-import Lottie from 'lottie-react';
-import animationData from '@/public/assets/cloned/lottie/<hash>.json';
-
-export default function LottieIcon() {
-  return <Lottie animationData={animationData} loop autoplay style={{ width: 64, height: 64 }} />;
-}
-```
-
-Prefer imports over `fetch()` so the JSON ships in the bundle and there is no layout shift on first play.
-
-## Respecting `prefers-reduced-motion`
-
-The Stage 1 gate runs with reduced motion forced, so your Stage 1 output should render a static final-state snapshot when motion is reduced.
-
-In Framer Motion, use the `MotionConfig` with `reducedMotion="user"` in `layout.tsx`, or gate `animate` / `initial` on a `useReducedMotion()` hook.
-
-For CSS animations, wrap the rule:
-
-```css
-@media (prefers-reduced-motion: no-preference) {
-  .animate-fade-up {
-    animation: fade-up 0.6s ease-out forwards;
-  }
-}
-```
-
-## Do not
-
-- Do not add animations that are not in the source. The clone target is fidelity, not flair.
-- Do not approximate a GSAP timeline with a Framer `animate` sequence if the timeline has overlaps, labels, or scrubbing — keep GSAP.
-- Do not use `requestAnimationFrame` by hand if Framer covers the case. You will burn React lifecycle bugs.
-- Do not import full `gsap` bundle if only `ScrollTrigger` is needed — it is fine to `import { gsap } from "gsap"` because tree-shaking handles it, but check the bundle size if multiple sections use GSAP.
diff --git a/.opencode/skills/asset-pipeline/SKILL.md b/.opencode/skills/asset-pipeline/SKILL.md
deleted file mode 100644
index 44ead4a..0000000
--- a/.opencode/skills/asset-pipeline/SKILL.md
+++ /dev/null
@@ -1,169 +0,0 @@
----
-name: asset-pipeline
-description: Rules for how the clone pipeline names, organizes, and references downloaded assets. Covers folder layout under public/assets/cloned, hash-based filename convention, font strategy (self-host via next/font/local, fall back to system stack if licensing unclear), SVG inline-vs-file threshold, video format, and import paths. Load this when downloading assets and when referencing them in JSX.
-user-invocable: false
----
-
-# Asset Pipeline
-
-All cloned assets live under the generated project's `public/assets/cloned/`. Never outside this tree. Never in the workspace `.clone-workspace` beyond the capture bundle.
-
-## Layout
-
-```
-<project>/public/assets/cloned/
-  images/       # jpg, png, webp, avif
-  videos/       # mp4 (only)
-  fonts/        # woff2 (preferred), woff, ttf
-  svg/          # .svg files when not inlined
-  lottie/       # .json animation data
-```
-
-## Naming
-
-Every file is renamed to `<sha1-8>-<sanitized-original-name>`. The sha1 is of the source URL (not content), truncated to 8 hex chars. Sanitization: lowercase, spaces → `-`, strip everything not in `[a-z0-9.-]`.
-
-Examples:
-
-- `https://cdn.site.com/hero-bg.jpg` → `a1b2c3d4-hero-bg.jpg`
-- `https://fonts.site.com/inter-display-500.woff2` → `e5f67890-inter-display-500.woff2`
-
-Collisions are effectively impossible at 8 chars for any one site. If they happen, extend to 10.
-
-The manifest records the full `local_path` for each asset — the generate agent reads that field, never reconstructs the path.
-
-## Fonts
-
-**Preferred: self-hosted via `next/font/local`.** In `src/app/layout.tsx`:
-
-```ts
-import localFont from 'next/font/local';
-
-const display = localFont({
-  src: [
-    { path: '../../public/assets/cloned/fonts/e5f67890-inter-display-400.woff2', weight: '400', style: 'normal' },
-    { path: '../../public/assets/cloned/fonts/abcd1234-inter-display-500.woff2', weight: '500', style: 'normal' },
-  ],
-  variable: '--font-display',
-  display: 'swap',
-});
-
-export default function RootLayout({ children }: { children: React.ReactNode }) {
-  return (
-    <html lang="en" className={display.variable}>
-      <body className="font-display">{children}</body>
-    </html>
-  );
-}
-```
-
-Then in `tailwind.config.ts`:
-
-```ts
-theme: {
-  extend: {
-    fontFamily: {
-      display: ['var(--font-display)', 'sans-serif'];
-    }
-  }
-}
-```
-
-**If licensing is unclear** (manifest marks `license_hint: "licensed"` or `"unclear"`), do NOT ship the font file. Substitute with the closest free alternative from a system stack and flag in the final report:
-
-| Source font                      | Fallback                                               |
-| -------------------------------- | ------------------------------------------------------ |
-| Any licensed sans                | Inter from Google Fonts (via `next/font/google`)       |
-| Any licensed serif               | `ui-serif, Georgia, Cambria, "Times New Roman", serif` |
-| Any licensed mono                | `ui-monospace, SFMono-Regular, Menlo, monospace`       |
-| Variable display font (licensed) | Inter or Manrope via `next/font/google`                |
-
-Record the substitution in the manifest's `skipped[]` with `reason: "licensed_font_unclear"` and log to `logs/skipped.md`.
-
-## SVGs
-
-**Inline as React component** when all hold:
-
-- Source size < 5KB
-- SVG is used in-flow, not as a CSS `background-image`
-- SVG has no `<script>` tags (never inline external scripts)
-
-Use `@svgr/webpack` or inline the markup by hand in a small component file `src/components/icons/<Name>.tsx`. Prefer hand-written components for simple icons — `@svgr` adds tooling complexity that rarely pays back.
-
-**Keep as file** when:
-
-- SVG ≥ 5KB
-- SVG is used as `background-image` (referenced from CSS)
-- SVG contains references to `<filter>` or `<pattern>` that make it complex to inline
-
-For file-kept SVGs, reference as `<img src="/assets/cloned/svg/<hash>.svg" alt="" />`. `next/image` does not accept SVGs without the `dangerouslyAllowSVG` flag — prefer raw `<img>` over enabling that flag.
-
-## Videos
-
-Only MP4. Capture normalizes HLS/DASH to MP4 when possible; if the source is DRM-protected (Widevine / FairPlay / PlayReady signatures in HAR), skip with `reason: "drm"` in the manifest.
-
-Embed as:
-
-```tsx
-<video
-  src="/assets/cloned/videos/<hash>.mp4"
-  autoPlay
-  loop
-  muted
-  playsInline
-  poster="/assets/cloned/images/<hash>-poster.jpg"
-/>
-```
-
-## Images
-
-`next/image` is preferred. Configure no remote domains — everything is local under `/assets/cloned/`, which Next.js serves as static assets automatically.
-
-```tsx
-import Image from 'next/image';
-<Image
-  src="/assets/cloned/images/abc1234-hero.jpg"
-  alt=""
-  width={1920}
-  height={1080}
-  priority={isAboveTheFold}
-  sizes="(max-width: 768px) 100vw, 1200px"
-/>;
-```
-
-- `alt=""` for decorative images. Preserve source `alt` when present.
-- `priority` on above-the-fold images (hero bg, logo).
-- `sizes` matches the responsive layout — omit if the image is fixed-width.
-
-For background images (CSS `background-image`), keep as CSS with arbitrary Tailwind value:
-
-```tsx
-<div className="bg-[url('/assets/cloned/images/abc1234-bg.jpg')] bg-cover bg-center" />
-```
-
-## Lottie
-
-Lottie JSON files go under `lottie/`. Import them as ES modules, not fetch at runtime — this eliminates flash and is under 100KB in nearly every case:
-
-```tsx
-import animationData from '@/public/assets/cloned/lottie/<hash>.json';
-```
-
-If a Lottie is > 1MB, consider dynamic import with a `<Suspense>` boundary to defer.
-
-## Import paths
-
-In Next.js, the public directory is served at the root. Use absolute paths starting with `/`:
-
-- ✅ `<img src="/assets/cloned/svg/logo.svg" />`
-- ✅ `import data from "@/public/assets/cloned/lottie/x.json"` (for ES import of JSON)
-- ❌ Never `../../../public/...` from components
-- ❌ Never `https://source-site.com/...` — those were downloaded
-
-## Flagging failures
-
-If an asset download fails (404, timeout, CORS, auth), the orchestrator records it in `logs/skipped.md` with the URL and reason. Generation should render a placeholder of the captured dimensions rather than a broken `<img>` for any section that referenced the missing asset.
-
-## Cleanup rule
-
-Do not delete assets the capture downloaded "just in case they are unused". The analyze agent records `assets[].referenced_by[]`; if the array is empty, leave the file in place — it might be referenced in a stage that has not run yet. Orphan cleanup is a post-run task, not part of generation.
diff --git a/.opencode/skills/clone-staging/SKILL.md b/.opencode/skills/clone-staging/SKILL.md
deleted file mode 100644
index 6eaf710..0000000
--- a/.opencode/skills/clone-staging/SKILL.md
+++ /dev/null
@@ -1,113 +0,0 @@
----
-name: clone-staging
-description: The four-stage taxonomy for the clone pipeline (Foundation, CSS & Static Interactivity, JS Animation, WebGL/3D), with gate thresholds. In staged-mode runs, gates are hard — sections must pass each stage before progressing. In default-mode runs, the staging is descriptive: it tells the generate agent which features go in early vs late and what's deferrable. Load this before starting any cloning work — the orchestrator, generate, and validate agents all reference these definitions.
-user-invocable: false
----
-
-# Clone Staging
-
-The clone pipeline organizes work into four ordered stages by capability. The same taxonomy serves two roles depending on orchestrator mode:
-
-- **Staged-mode (`--staged`):** gates are hard. A section never enters stage N until stage N-1 has passed for that section. Prevents burning tokens on WebGL translation when the layout is still broken. Used for sites where surgical iteration matters.
-- **Default-mode:** stages are descriptive guidance for the generate agent — what goes in foundation, what's deferred to animation, what's webgl-only. The orchestrator does NOT enforce gates between stages; it generates everything in parallel batches per section, then iterates on visible failures. Used for marketing/landing pages where the manifest signals are usually enough to carry fidelity through one generation pass.
-
-Either way, the stage classifications below are the source of truth for what work belongs where.
-
-## Stage 0 — Capture (always, once)
-
-Not a generation stage. The capture agent runs once and produces the bundle under `<workspace>/capture/`. Generation only begins after capture is complete and the manifest is written.
-
-## Stage 1 — Foundation
-
-**Scope:**
-
-- Design tokens in `tailwind.config.ts` + `globals.css` (colors, typography, spacing, shadows, radii, breakpoints)
-- Asset pipeline: all images, videos, fonts, SVGs, lottie JSONs downloaded to `/public/assets/cloned/`
-- Font loading via `next/font/local` (self-hosted `@font-face`)
-- Layout primitives: `Container`, `Section`, base typography in `globals.css`
-- Static page structure — DOM skeleton per section, no interactivity
-
-**Gate:**
-
-- Per-section diff at 1280px viewport with `prefers-reduced-motion` forced: `diff_pct < 5%`
-- All viewports (375 / 768 / 1280 / 1920) render without cumulative layout shift
-- No 404s in the network log for local assets
-
-## Stage 2 — CSS & Static Interactivity
-
-**Scope:**
-
-- Gradients, filters, `backdrop-filter`, masks, clip-paths
-- SVGs inlined or imported as components
-- CSS animations: `@keyframes`, `transition`
-- Hover, focus, focus-visible states
-- `prefers-color-scheme: dark` styles if detected in capture
-
-**Gate:**
-
-- Per-section diff at rest: `diff_pct < 3%`
-- Hover/focus state screenshots match the captured variants (delta `< 4%`)
-
-## Stage 3 — JS Animation (only if Stage 2 passes)
-
-**Scope:**
-
-- Scroll-linked animations — Framer Motion `useScroll` / `useTransform` if simple, keep GSAP ScrollTrigger if timeline is complex
-- Framer Motion variants for entrance / exit / `whileInView`
-- Lottie animations via `lottie-react`
-- IntersectionObserver-driven reveals → Framer `whileInView`
-
-**Gate:**
-
-- Per-section diff averaged across 5 sampled scroll positions (0%, 25%, 50%, 75%, 100%): `diff_pct < 8%`
-
-## Stage 4 — WebGL / 3D (only if Stage 3 passes)
-
-**Scope:**
-
-- Three.js scenes reconstructed from the captured scene graph via `@react-three/fiber`
-- Custom shaders reinstated from extracted GLSL
-- Custom `<canvas>` 2D animation if detected
-
-**Gate:**
-
-- Best-effort. `diff_pct < 15%` on sampled frames is a pass.
-- Two reconstruction attempts; if both fail, fall back to the captured MP4 embedded as `<video autoplay loop muted playsinline>` with matching dimensions. Fallback is a valid pass — flag in report.
-
-## Tie-breakers
-
-**A section straddles stages.** Classify by the _highest_ stage required for any element in it.
-
-Example: a hero section is mostly static CSS but has one Lottie icon → `max_stage_required: 3`. The generate agent still builds the static part in Stage 1, adds CSS flourishes in Stage 2, and only wires up the Lottie in Stage 3. The Stage 1 gate is applied with the Lottie slot rendered as a placeholder of matching dimensions.
-
-**Placeholder rule during earlier stages.** For elements whose implementation is deferred to a later stage, render a positioned placeholder `<div style={{ width, height }}>` so layout diffs at the earlier-stage gate are not polluted. Replace in the later stage.
-
-**Conservative staging.** When in doubt about whether a section needs Stage 3 (e.g. subtle fade-in), mark it Stage 2. If Stage 2 validation fails because the animation is material to layout, promote at that point. Cheap to promote upward; expensive to demote.
-
-## Non-goals (skip, do not attempt)
-
-When any of these is detected, do not try to clone. Replace with a sized placeholder and comment:
-
-- DRM'd video/audio (Widevine, FairPlay, PlayReady)
-- Third-party widgets: Intercom, Drift, Typeform, Calendly, HubSpot forms, chat widgets, cookie consent banners
-- Authenticated or personalized content behind login
-- Obfuscated WASM modules
-- Real-time data feeds (stock tickers, live chat)
-- Analytics pixels / tag managers (no value to clone; actively harmful)
-
-Pattern:
-
-```tsx
-<div style={{ width: W, height: H }}>{/* CLONE: skipped third-party widget — <vendor> */}</div>
-```
-
-The captured bounding box supplies W/H so layout does not shift.
-
-## Iteration caps
-
-- **Staged mode:** 3 iterations per section per stage. After three failed attempts at the same section at the same stage, log to `logs/manual-review.md` with the current component code, diff images, and most recent issues list; move on. A partial clone is better than a stuck clone.
-- **Default mode:** 2 targeted-fix iterations per section AFTER the initial parallel-batch generation. Same logging rule on exhaustion.
-
-## Default-mode "advisory" gates
-
-When the orchestrator does the visual-review pass in default mode, the gate thresholds above are useful guidance but not enforced. A section showing 12% pixel diff dominated by font-rendering or video-frame timing is fine. A section showing 12% pixel diff with a visibly missing element is not. The orchestrator's judgment call — informed by reading the screenshots — is what triggers a targeted-fix call.
diff --git a/.opencode/skills/css-to-tailwind/SKILL.md b/.opencode/skills/css-to-tailwind/SKILL.md
deleted file mode 100644
index bc63395..0000000
--- a/.opencode/skills/css-to-tailwind/SKILL.md
+++ /dev/null
@@ -1,128 +0,0 @@
----
-name: css-to-tailwind
-description: Rules for converting resolved computed CSS from the capture into Tailwind v3 classes on Next.js components. Decides when to use arbitrary values vs extending tailwind.config.ts, how to handle gradients / shadows / filters / clamp / variable fonts / container queries, and when to bail to globals.css. Load this in every Stage 1 or Stage 2 generation run.
-user-invocable: false
----
-
-# CSS → Tailwind
-
-The generate agent receives a DOM fragment with computed styles already resolved per node. Your job is to turn those styles into Tailwind classes on the JSX output — no cascade reasoning required.
-
-## Core decision: utility vs arbitrary vs config vs CSS file
-
-| Situation                                                                                      | Approach                                        |
-| ---------------------------------------------------------------------------------------------- | ----------------------------------------------- |
-| Value matches a default Tailwind scale step (e.g. `p-4`, `gap-8`)                              | Use the utility                                 |
-| Value is used 1-2 times site-wide and does not match scale                                     | Arbitrary: `w-[347px]`                          |
-| Value is used 3+ times site-wide                                                               | Extend `tailwind.config.ts`, then use the token |
-| Cannot be expressed in Tailwind (complex `filter`, `@property`, `@supports`, dynamic `attr()`) | Write to `globals.css`                          |
-
-The manifest's `design_tokens` object is already deduplicated by frequency — use it as the source of truth for what goes into `tailwind.config.ts`.
-
-## Specific rules
-
-### Heights and widths — use intent over resolved px
-
-The capture's computed styles resolve `vh`/`vw`/`%`/`calc()` to literal pixel values at the capture viewport (1280×720). **Do not blindly transcribe these.** The manifest gives you better signals:
-
-1. **`section.vh_relative === true`**: the section's height is viewport-height-derived. Map `section.vh_value` to Tailwind:
-   - `vh_value` ≈ 100 → `min-h-screen` (or `h-screen` if the source had `height` not `min-height`)
-   - `vh_value` between 50 and 99 → `min-h-[<vh>vh]` arbitrary, e.g. `min-h-[88vh]`
-   - `vh_value` < 50 → still `min-h-[<vh>vh]` but consider whether content alone determines the height (if so, omit the height entirely and let content size it)
-2. **`section.full_width === true`**: use `w-full` (or `w-screen` for true full-bleed elements that escape parent padding). Never write `w-[1280px]`.
-3. **`capture/css-rules/<vp>.json`** has the source intent verbatim. When in doubt for a specific element, read the rule that matched its selector. Look for `100vh`, `100%`, `calc(...)`, `clamp(...)`, `aspect-ratio` — these are signals to NOT use the literal px value.
-
-Heuristic for elements not in `vh_relative_elements` but suspected vh-relative: if `bounding_box.height` is close to `viewport_height * N` for `N ∈ {0.5, 0.75, 1.0}` and the element is a top-level section with no other content driving height, prefer the vh form. Cheaper to over-flag here than to leave a brittle px height.
-
-### Colors
-
-- Every color in `manifest.design_tokens.colors` gets promoted into `theme.extend.colors` under its semantic name.
-- Reference as `bg-primary`, `text-primary`, `border-accent-1`, etc. in class output.
-- Unseen one-off colors: arbitrary, e.g. `text-[#3a3a3a]`.
-
-### Typography
-
-- Font families: promote to `theme.extend.fontFamily`. Use `next/font/local` in `layout.tsx` with the downloaded woff2 files and expose via CSS variable, then reference as `['var(--font-display)']` etc.
-- Font sizes: promote clusters to `theme.extend.fontSize` as named keys (`display`, `h1`, `body`, `small`). Value is `[fontSize, { lineHeight, letterSpacing, fontWeight }]`.
-- One-off sizes: `text-[32px]/[1.2]` arbitrary.
-
-### Spacing
-
-- Infer the scale from `manifest.design_tokens.spacing[]`. Often 4px / 8px / 16px / 24px ... but match what the site actually uses.
-- Extend Tailwind's spacing scale only for values not already close to a default step.
-- Use `gap-*`, `p-*`, `m-*`, `space-y-*` utilities.
-
-### Gradients
-
-- Linear: `bg-gradient-to-r from-[#...] via-[#...] to-[#...]` for simple 2-3 stops. For more stops or angled variants, use arbitrary `bg-[linear-gradient(135deg,#a_0%,#b_50%,#c_100%)]`.
-- Radial: `bg-[radial-gradient(...)]` arbitrary.
-- Conic: `bg-[conic-gradient(...)]` arbitrary.
-- Mesh / multi-layer: wrap in `bg-[image:...]` syntax with escaped commas.
-
-### Shadows
-
-- Single-layer shadows that match scale: `shadow-md`, `shadow-xl`.
-- Multi-layer shadows: arbitrary with escaped commas: `shadow-[0_1px_2px_rgba(0,0,0,0.05),_0_4px_8px_rgba(0,0,0,0.08)]`.
-- Promote 3+ occurrences of the same shadow to `theme.extend.boxShadow`.
-
-### Filters and backdrop-filter
-
-- Built-in: `blur-*`, `brightness-*`, `contrast-*`, `grayscale-*`, `backdrop-blur-*`, `backdrop-saturate-*`.
-- Arbitrary: `filter-[blur(16px)_saturate(140%)]`, `backdrop-filter-[blur(20px)_saturate(140%)]`.
-- Complex filter chains (4+ functions): promote to a CSS utility class in `globals.css` under `@layer utilities`.
-
-### clamp() / min() / max()
-
-- Preserve verbatim in arbitrary: `text-[clamp(24px,4vw,48px)]`, `w-[min(100%,1200px)]`.
-- Do not try to approximate with `md:` breakpoints — the whole point of `clamp()` is continuous scaling.
-
-### Variable fonts
-
-- `font-variation-settings: "wght" 420, "ital" 0` → arbitrary `[font-variation-settings:'wght'_420,'ital'_0]`.
-- If the site uses variable weights fluidly (e.g. on hover), pair with `transition-[font-variation-settings]`.
-
-### Container queries
-
-- Use the `@tailwindcss/container-queries` plugin. Add to `tailwind.config.ts` plugins.
-- Mark the container: `@container`.
-- Query: `@md:grid-cols-2`, `@lg:text-lg`, etc.
-
-### clip-path and mask
-
-- Built-in utilities cover basic cases (`rounded-full`). Anything custom: arbitrary.
-- `clip-path: polygon(...)` → `[clip-path:polygon(0_0,100%_0,100%_80%,0_100%)]`.
-- `mask-image` → `[mask-image:linear-gradient(...)]` + matching `[-webkit-mask-image:...]` if Safari support needed.
-
-### Transforms
-
-- Scale / rotate / translate cover common cases. Chained transforms: Tailwind's `transform` + individual utilities, or arbitrary `[transform:perspective(800px)_rotateY(12deg)]`.
-
-### Transitions
-
-- Simple: `transition-colors`, `duration-200`, `ease-in-out`.
-- Multi-property transitions: arbitrary `[transition:transform_400ms_cubic-bezier(0.22,1,0.36,1),_opacity_300ms]`.
-
-### Keyframes / `@keyframes`
-
-- Always bail to `globals.css` under `@layer utilities` or a named keyframe in `tailwind.config.ts` `theme.extend.keyframes` + `animation`.
-- Then reference in JSX: `animate-fade-up`.
-
-## When to bail to `globals.css`
-
-Write rules to `src/app/globals.css` (not to the component) when:
-
-- The rule is `@property` — Tailwind cannot express it.
-- The rule is `@supports` — conditional CSS outside Tailwind's reach.
-- The rule is `@font-face` — prefer `next/font/local`, but if the font is served from a remote URL that cannot be downloaded, `@font-face` in `globals.css` is acceptable.
-- A selector you cannot express as a class (e.g. `:has()`, `:nth-child(odd) > :first-of-type`).
-- Complex multi-rule animations (keyframes + state variants + JS hooks).
-
-Keep `globals.css` under 200 lines. If it grows beyond, group related rules into separate files imported from `globals.css`.
-
-## Do not
-
-- Do not re-derive cascade from the source stylesheets. The computed styles on each node already resolve cascade. Copy those.
-- Do not use `!important`. If a style is not applying, you have a selector specificity problem — fix it by structuring the JSX, not by nuking the cascade.
-- Do not add classes that are not represented in the captured computed styles. If the source does not have `box-shadow`, do not add one "for polish".
-- Do not add `@apply` in component files. `@apply` only belongs in `globals.css` when consolidating a repeated utility cluster.
-- Do not leave TODO comments in component files — the cloner is meant to be done work, not a scaffold.
diff --git a/.opencode/skills/dom-to-jsx/SKILL.md b/.opencode/skills/dom-to-jsx/SKILL.md
deleted file mode 100644
index fae9f05..0000000
--- a/.opencode/skills/dom-to-jsx/SKILL.md
+++ /dev/null
@@ -1,140 +0,0 @@
----
-name: dom-to-jsx
-description: Rules for converting captured DOM fragments into Next.js App Router JSX components. Covers component naming, when to split, Server vs Client classification, hydration-safe patterns, image handling (next/image vs raw img), and prop extraction for repeated patterns. Load this in every generation run from Stage 1 onward.
-user-invocable: false
----
-
-# DOM → JSX
-
-The generate agent receives a DOM fragment per section. Convert it into idiomatic Next.js 14+ App Router JSX.
-
-## Component naming
-
-- PascalCase. Section-scoped: `HeroSection`, `FeatureGrid`, `TestimonialCard`, `PricingTable`, `CTAStrip`.
-- File path: `src/components/sections/<Name>.tsx` for top-level sections, `src/components/cards/<Name>.tsx` for repeated card components, `src/components/ui/<Name>.tsx` for primitives (button, badge).
-- Default export matches the file name. Named exports are fine for sub-components.
-
-## When to split
-
-Split a component when any of these is true:
-
-- File exceeds 150 lines of JSX
-- JSX nesting exceeds 3 levels
-- A repeated pattern appears 3+ times within the section
-
-When splitting for a repeat, extract a component with a `data` prop (array of items) or a single-item prop shape matching the manifest's `candidate_component` proposal.
-
-Example — manifest says a `FeatureCard` appears 6 times with `{title, description, icon}`:
-
-```tsx
-// src/components/cards/FeatureCard.tsx
-type Props = { title: string; description: string; icon: string };
-export default function FeatureCard({ title, description, icon }: Props) { ... }
-
-// src/components/sections/Features.tsx
-import FeatureCard from "@/components/cards/FeatureCard";
-const ITEMS = [{ title: "...", description: "...", icon: "..." }, ...];
-export default function Features() {
-  return <div className="grid grid-cols-3 gap-8">{ITEMS.map(i => <FeatureCard key={i.title} {...i} />)}</div>;
-}
-```
-
-Extract `ITEMS` as a local `const` in the section file for Stage 1. If the data is clearly content-managed (12+ items, or visually heterogeneous), move to `src/content/<section>.ts` as a typed export.
-
-## Server vs Client
-
-Default: **Server Component**. Add `"use client"` at the top of a file only if any of these is true:
-
-- Uses `useState`, `useEffect`, `useRef`, or any other hook
-- Uses event handlers (`onClick`, `onChange`, etc.) — interactive buttons that do more than `<a href>`-style navigation
-- Uses `framer-motion`'s `motion.*` components
-- Uses `lottie-react` or any other client-only lib
-- Uses browser APIs (`window`, `document`, `localStorage`)
-
-Do not mark parents client unnecessarily. Keep `"use client"` at the leaf — a client leaf can live inside a server parent, not vice versa.
-
-## Hydration safety
-
-- **No** `Date.now()` / `Math.random()` / `new Date()` at render. If needed, generate in `useEffect` and store in state. At render time the first pass must be deterministic.
-- **No** reading `window` / `document` at module scope. Wrap in `useEffect` or guard with `typeof window !== "undefined"`.
-- `suppressHydrationWarning` is a last resort — only on a single element where the server/client divergence is intentional and minimal (e.g. a `<time>` element).
-- Do not pass `new Date()` or live content into a Server Component from within a client wrapper at first paint — you will get a mismatch.
-
-## Image handling
-
-**Default: `next/image`** when all of these hold:
-
-- The image has known dimensions (the manifest captured them)
-- The image is a raster (jpg, png, webp, avif)
-- The image is content, not purely decorative
-
-Example:
-
-```tsx
-import Image from 'next/image';
-<Image src="/assets/cloned/images/abc1234-hero.jpg" alt="" width={1920} height={1080} />;
-```
-
-**Raw `<img>`** for:
-
-- SVGs (use native `<img src="/assets/cloned/svg/xyz.svg" alt="" />` or inline the SVG as a component if <5KB and decorative)
-- Images with unknown dimensions at clone time
-- Decorative blur-ups where LCP is not a concern
-
-**Inline SVG** when:
-
-- The SVG is <5KB in the source
-- The SVG is used in-flow (not as a background-image)
-- Animated parts need to be controlled from JS
-
-Configure `next.config.js` to allow loading from `/assets/cloned` paths — no external loader needed since everything is already local.
-
-## Video
-
-```tsx
-<video src="/assets/cloned/videos/<hash>.mp4" autoPlay loop muted playsInline className="..." />
-```
-
-Always `playsInline` (iOS won't inline autoplay without it). Always `muted` for autoplay (browsers require it).
-
-## Links
-
-- Internal: `<Link href="/...">` from `next/link`.
-- External: `<a href="..." target="_blank" rel="noopener noreferrer">`.
-- Anchor in page: plain `<a href="#id">` is fine — `<Link>` with a hash works too.
-
-## Accessibility
-
-Keep what the source had — do not invent. If the source has `aria-label` or `alt=""`, preserve it. If the source is inaccessible, the clone is inaccessible. This is a fidelity tool, not a correction tool.
-
-That said — do not _remove_ accessibility attributes the source had.
-
-## Third-party widgets (skip per `clone-staging`)
-
-When the manifest flags a subtree as a third-party widget, replace with:
-
-```tsx
-<div style={{ width: W, height: H }}>{/* CLONE: skipped third-party widget — <vendor> */}</div>
-```
-
-Pull `W` and `H` from the manifest's bounding box for the widget's container. This preserves layout so later sections land at the right Y offset.
-
-## Forms
-
-The clone is a static marketing-page mirror. Forms should render visually but the `onSubmit` handler is `(e) => e.preventDefault()` — no backend wiring.
-
-If the source had client-side validation that is material to the layout (error states, spinners), keep it as a visual-only `useState` example. Do not call real APIs.
-
-## Attribute translation
-
-- `class` → `className`
-- `for` → `htmlFor`
-- `tabindex` → `tabIndex`
-- Hyphenated attrs on SVG: most become camelCase (`stroke-width` → `strokeWidth`), but `data-*` and `aria-*` stay hyphenated.
-- `style="..."` → `style={{ ... }}` with camelCase keys. Only inline style that is computed / dynamic; static style always goes to Tailwind per `css-to-tailwind`.
-
-## Content
-
-- Copy text verbatim from the DOM fragment. Do not paraphrase. Do not translate. Do not "improve" grammar.
-- Preserve whitespace-sensitive content (`<pre>`, `<code>`) exactly.
-- Keep HTML entities as-is (`&mdash;`, `&nbsp;`, `&hellip;`) but JSX renders them when placed inside string literals — use `{"—"}` or `{"\u00a0"}` for non-breaking spaces when adjacency matters.
diff --git a/.opencode/skills/site-manifest/SKILL.md b/.opencode/skills/site-manifest/SKILL.md
deleted file mode 100644
index 5640226..0000000
--- a/.opencode/skills/site-manifest/SKILL.md
+++ /dev/null
@@ -1,177 +0,0 @@
----
-name: site-manifest
-description: Schema and rules for manifest.json — the single blueprint artifact the analyze agent produces and the generate + validate agents consume. Defines field shapes, stable id conventions, token naming conventions, and what goes where. Load this in the analyze agent before writing manifest.json and in any agent that reads it.
-user-invocable: false
----
-
-# site-manifest
-
-Everything the generate + validate agents need lives in `manifest.json` at `<workspace>/manifest.json`. The capture bundle is the raw source; the manifest is the refined, structured index.
-
-## Top-level schema
-
-```ts
-type Manifest = {
-  source_url: string; // absolute URL
-  captured_at: string; // ISO 8601
-  viewports: number[]; // e.g. [375, 768, 1280, 1920]
-
-  design_tokens: {
-    colors: Record<string, string>; // semantic_name -> hex (e.g. "primary" -> "#1A1A1A")
-    typography: {
-      families: Record<string, string>; // semantic -> family (e.g. "display" -> "'Inter Display', sans-serif")
-      scales: Array<{
-        name: string; // "display" | "h1" | "body" | "small" | ...
-        size: string; // "48px"
-        lineHeight: string; // "1.1"
-        weight: number; // 500
-        letterSpacing: string; // "-0.02em"
-      }>;
-    };
-    spacing: number[]; // the scale in px — e.g. [4, 8, 12, 16, 24, 32, 48, 64]
-    radii: Record<string, string>; // "sm" -> "4px"
-    shadows: Record<string, string>; // "md" -> "0 1px 2px ..." (full CSS value)
-    breakpoints: Record<string, number>; // "md" -> 768
-  };
-
-  fonts: Array<{
-    family: string; // "Inter Display"
-    weights: number[]; // [400, 500, 700]
-    styles: Array<'normal' | 'italic'>;
-    source_urls: string[]; // as seen in @font-face
-    local_paths: string[]; // where they were downloaded
-    license_hint?: 'licensed' | 'unclear' | 'open';
-  }>;
-
-  sections: Array<{
-    id: string; // slug — stable across reruns
-    name: string; // "Hero" | "Feature Grid" | ...
-    dom_path: string; // relative to capture_dir — JSON file with DOM + computed styles
-    screenshot_paths: Record<number, string>; // viewport -> relative path in capture_dir
-    section_anchor?: string; // CSS selector for this section's root element (e.g. "#hero", ".elementor-element-fe377c0"). Used by validate's dom-diff `root_selector`. REQUIRED when present in capture.
-    bounding_box: { x: number; y: number; width: number; height: number }; // at canonical 1280×720 capture
-    vh_relative?: boolean; // true if the height is viewport-height-derived (see vh-flags.json)
-    vh_value?: number; // implied vh percentage (e.g. 88 for ~min-height: 88vh) when vh_relative is true
-    full_width?: boolean; // true if width matched viewport width at capture time AND nominal source CSS targets full-bleed (use w-full / w-screen, not the literal px value)
-    max_stage_required: 1 | 2 | 3 | 4;
-    detected_libs: string[]; // ["gsap", "framer-motion", "lottie", "three"]
-    third_party_widgets: Array<{ vendor: string; selector: string; bbox: BBox }>;
-    repeated_patterns: Array<{
-      selector: string; // pattern selector in the captured DOM
-      count: number; // 3+
-      candidate_component: {
-        name: string; // PascalCase
-        props: string[]; // field names extracted from pattern variance
-      };
-    }>;
-  }>;
-
-  assets: Array<{
-    type: 'image' | 'video' | 'font' | 'svg' | 'lottie';
-    source_url: string; // absolute
-    local_path: string; // "public/assets/cloned/images/<hash>-<name>"
-    dimensions?: { width: number; height: number };
-    from_css?: boolean; // true if discovered from a CSS url() rather than a HAR response
-    referenced_by: string[]; // section ids where this asset appears
-  }>;
-
-  // Optional — populated when capture.py finds vh-relative elements (compares
-  // canonical 1280×720 capture against a 1280×1080 alt-height capture).
-  vh_relative_elements?: Array<{
-    path: string; // structural path produced by detect_vh_flags()
-    tag: string;
-    id?: string | null;
-    class?: string | null;
-    primary_h: number; // height at 1280×720
-    alt_h: number; // height at 1280×1080
-    ratio: number; // alt_h / primary_h — should ~= 1.5 for vh-relative
-    vh: number; // implied vh % (= primary_h / 720 * 100)
-  }>;
-
-  skipped: Array<{
-    reason: 'drm' | 'third_party_widget' | 'auth_required' | 'wasm_obfuscated' | 'licensed_font_unclear';
-    element?: string; // selector
-    original_url?: string;
-    vendor?: string;
-  }>;
-};
-```
-
-## Id conventions
-
-- `section.id` is a slug from `section.name`, suffixed with a stable counter when the same semantic name appears twice: `features-0`, `features-1`. Order is DOM order top-to-bottom.
-- Asset `local_path` uses an 8-char sha1 hash of the source URL + the original filename: `abc12345-hero-background.jpg`. This guarantees no collisions and is stable across reruns.
-- `repeated_patterns[].candidate_component.name` is PascalCase, singular: `FeatureCard` not `FeatureCards`.
-
-## Determinism
-
-The analyze agent MUST produce the same manifest on the same capture input. This means:
-
-- No timestamps inside section ids (`captured_at` at the top is fine — it is read-once)
-- No random numbers, no iterator-order-dependent ids
-- Sort arrays by semantic key (sections by DOM order, assets by local_path, skipped by reason then element)
-
-## Promotion rule for tokens
-
-A value goes into `design_tokens` only if it is used 3+ times in the capture. One-off values stay inline in the DOM fragment and become arbitrary Tailwind values in generation.
-
-Exception: the page-level background color, primary text color, and primary font family always go into `design_tokens` regardless of count — downstream agents need them to set globals.
-
-## Capture artifacts the analyze agent should read
-
-In addition to per-section `dom_path` files, several capture-level artifacts are now available:
-
-- `<capture_dir>/sections/<viewport>.json` — `__CLONE_LIST_SECTIONS__` candidate sections per viewport, with bbox and selector. Use these as scaffolding when decomposing into manifest sections — the smarter scroll loop already used these to time the capture, so each candidate has a clean DOM dump.
-- `<capture_dir>/section-shots/<viewport>/section-NN.png` — pre-cropped per-section screenshots. Map these to manifest sections by index; the validate agent uses them as the diff reference.
-- `<capture_dir>/css-rules/<viewport>.json` — every same-origin CSS rule, plus extracted `url()` asset references. Use this to recover source intent (e.g. `min-height: 100vh`, `width: 100%`, `aspect-ratio: 16/9`) that resolved computed styles erase. Also lets you recover backgrounds/masks/cursors that were not GET-requested at capture time.
-- `<capture_dir>/dom-alt/1280-1080/step-00.json` — DOM at canonical width with alt height. Used internally to derive `vh-flags.json`; you don't need to read this directly.
-- `<workspace>/vh-flags.json` (next to manifest.json) — pre-computed list of vh-relative element candidates. Cross-reference against your section bbox.y values to populate `section.vh_relative` + `section.vh_value`.
-
-## How to populate vh_relative on a section
-
-1. Load `vh-flags.json`.
-2. For each entry, check whether its `path` resolves to an element inside or equal to one of your section roots.
-3. If a flagged entry IS the section root, set `section.vh_relative = true` and `section.vh_value = entry.vh`.
-4. If a flagged entry is a child but the child's height equals the section's height, the section itself is vh-relative — same flag.
-5. The generate agent uses this to emit `min-h-[<vh>vh]` (Tailwind arbitrary) or `min-h-screen` when vh ≈ 100. See `css-to-tailwind` for the rule.
-
-## Reading the DOM fragment
-
-Each `section.dom_path` points to a JSON file with this shape:
-
-```ts
-type DomNode = {
-  tag: string;
-  attrs: Record<string, string>; // already translated: class, for, tabindex names
-  text?: string; // text content if leaf or pre-text
-  computed: {
-    // resolved computed styles — only non-default values
-    color?: string;
-    backgroundColor?: string;
-    fontFamily?: string;
-    fontSize?: string;
-    // ... any property the node actually uses
-    pseudo?: {
-      '::before'?: Record<string, string>;
-      '::after'?: Record<string, string>;
-      ':hover'?: Record<string, string>;
-      ':focus-visible'?: Record<string, string>;
-    };
-  };
-  children: DomNode[];
-};
-```
-
-The generate agent walks this tree and emits JSX with Tailwind classes derived from `computed`. Because the styles are already resolved, no cascade reasoning is required.
-
-## Validation
-
-After writing `manifest.json`, self-check:
-
-- `viewports.length >= 1`
-- Every `section.screenshot_paths` has a key for each viewport
-- Every `asset.local_path` starts with `public/assets/cloned/`
-- No section has `max_stage_required > 4` or `< 1`
-- `design_tokens.colors.primary` exists (fall back to `#000` if none inferred — noisy fallback is better than missing key)
-
-If a check fails, fix the manifest — do not write a broken one.
diff --git a/.opencode/skills/validation-loop/SKILL.md b/.opencode/skills/validation-loop/SKILL.md
deleted file mode 100644
index a3ba3ab..0000000
--- a/.opencode/skills/validation-loop/SKILL.md
+++ /dev/null
@@ -1,161 +0,0 @@
----
-name: validation-loop
-description: How the validate agent runs the two diff channels — screenshot pixel-diff AND structural DOM diff — against captured originals, ranks issues, and feeds them back to the generate agent. Defines thresholds, tool usage, diff report format, and the 3-iteration hard cap per section per stage. Load this in the validate agent every run.
-user-invocable: false
----
-
-# Validation Loop
-
-The validate agent closes the loop: render → screenshot + DOM dump → diff against captured originals → decide pass/fail → return a report the generate agent can act on.
-
-## Two diff channels
-
-Both run on every fail. Combine the signals.
-
-### 1. Pixel diff — `screenshot-diff`
-
-Wraps `scripts/diff.py` (pixelmatch + scipy connected components).
-
-Inputs: `before` (captured PNG), `after` (rendered PNG), `threshold` (default 0.1).
-Outputs: `diff_pct`, `diff_image_path`, `worst_regions[]`.
-
-Prefer per-section pre-cropped captures when available:
-
-- `capture/section-shots/<viewport>/section-<idx>.png` — if the analyze agent matched this section to a candidate index.
-- Otherwise the closest scroll-step PNG from `capture/screenshots/<viewport>/step-NN.png`.
-
-### 2. Structural diff — `dom-diff`
-
-Wraps `scripts/dom-diff.py`. Compares two DOM JSON files produced by `__CLONE_DUMP_COMPUTED__` (the rich walker the capture script and `dump-rendered` both use). Returns concrete property-level mismatches the generate agent can fix without eyeballing pixels.
-
-Inputs:
-
-- `captured` — `manifest.sections[id].dom_path` from the source capture.
-- `rendered` — JSON from `dump-rendered` against `localhost:3000`.
-- `root_selector` — `#id` or `.class` to scope to the section. Use the manifest's `section_anchor` field; fall back to `#<section_id>`.
-
-Outputs:
-
-```json
-{
-  "matched": 76,
-  "counts": { "matched": 76, "missing": 2, "extra": 1, "tag_mismatch": 0, "style": 5, "size": 3 },
-  "issues": [
-    "section.hero > div[1]: missing in rendered (expected <img> #data-overlay, ~620x340)",
-    "section.hero > h1[0]: fontSize is 48px, should be 56px",
-    "section.hero: size 1280x634, should be 1280x792 (Δ22.4%)"
-  ],
-  "structured_issues": [...]
-}
-```
-
-The `issues` array is already ranked and human-readable. Use it verbatim in the validate report.
-
-## Capturing the rendered clone
-
-For pixel: see `agent-browser-shot`. For structural:
-
-```
-dumpRendered({
-  url: "http://localhost:3000/",
-  output: "<workspace>/rendered-dom/<section_id>-<vp>.json",
-  viewport: <width>,
-  scroll_y: <bbox.y - 80>,
-  reduce_motion: <stage===1>
-})
-```
-
-The walker captures the same property set as the source, so the comparison is apples-to-apples.
-
-## Gate thresholds
-
-From `clone-staging`:
-
-| Stage | Pixel                                                            | Structural extra check                           |
-| ----- | ---------------------------------------------------------------- | ------------------------------------------------ |
-| 1     | `diff_pct < 5%` at 1280px, reduced motion. Layout shift = 0.     | counts.missing == 0 AND counts.tag_mismatch == 0 |
-| 2     | `diff_pct < 3%` at rest. Hover/focus delta < 4%.                 | counts.style + counts.size < 5                   |
-| 3     | mean `diff_pct < 8%` across 5 scroll samples.                    | (animations dominate; structural less reliable)  |
-| 4     | `diff_pct < 15%` on sampled frames. Fallback to MP4 also passes. | n/a                                              |
-
-A pass requires BOTH pixel and structural to pass at Stages 1 and 2. A pixel pass with `counts.missing > 0` is a fail because the diff distributed across pixels; an early-stage section with a missing 600x400 element will sometimes squeak under a 5% pixel threshold and that is the regression we are guarding against.
-
-## Diff report format
-
-Pass:
-
-```json
-{
-  "status": "pass",
-  "section_id": "hero",
-  "stage": 2,
-  "viewports": {
-    "375": { "diff_pct": 1.8, "structural": { "matched": 60, "missing": 0 } },
-    "1280": { "diff_pct": 1.5, "structural": { "matched": 87, "missing": 0 } }
-  }
-}
-```
-
-Fail:
-
-```json
-{
-  "status": "fail",
-  "section_id": "hero",
-  "stage": 2,
-  "viewport": 1280,
-  "diff_pct": 7.4,
-  "structural": { "matched": 76, "missing": 2, "tag_mismatch": 0, "style": 5, "size": 3 },
-  "worst_regions": [{ "x": 120, "y": 88, "width": 340, "height": 60 }],
-  "issues": [
-    "section.hero > div[1]: missing in rendered (expected <img> #data-overlay, ~620x340)",
-    "section.hero > h1[0]: fontSize is 48px, should be 56px",
-    "section.hero: size 1280x634, should be 1280x792 (Δ22.4%) — vh-relative; use min-h-screen"
-  ],
-  "structured_issues": [...],
-  "diff_image_path": "<workspace>/diffs/hero-1280.png"
-}
-```
-
-The `issues` array is the key payload. 3-6 items, most-impactful first. Each item is a single concrete change.
-
-## Issue ranking
-
-`dom-diff` already ranks: missing > tag_mismatch > size_mismatch > style_mismatch > extra. Style mismatches further weight `backgroundImage`, `fontSize`, `color`, `backgroundColor`, `fontFamily` higher than other properties.
-
-Only override the order if pixel-diff caught something structural missed (color gradients, image content shift, blur/filter changes that don't show in computed styles).
-
-## Special cases
-
-### Section flagged as vh_relative
-
-If `manifest.sections[id].vh_relative === true`, the captured `bounding_box.height` reflects a viewport-height-derived value at capture time. When the rendered clone is wider/taller than the capture viewport, structural size mismatches on the section itself are expected unless the clone uses `min-h-screen`/`h-screen`. **Report the size mismatch with the hint `"vh-relative; use min-h-screen"` so generate knows the fix shape.**
-
-### Cumulative layout shift
-
-A Stage 1 failure even if `diff_pct` is below threshold. Detect by comparing the rendered viewport at multiple scroll positions — if elements jump > 4px between initial paint and post-network-idle paint, fail with `issues: ["Layout shift detected: hero image reflows 120px after load"]`.
-
-### Font swap flicker
-
-If captured shows the web font and the clone's first paint shows fallback, `next/font/local` is mis-wired. Report — usually fix is `display: "swap"` + correct `preload`.
-
-### Dark mode
-
-If the manifest records dark-mode styles, diff both modes. Run with `document.documentElement.classList.add("dark")` (or the captured toggle mechanism) and diff both screenshots and DOMs.
-
-### Hover / focus states
-
-At Stage 2, hover interactive elements flagged in capture, wait 200ms, screenshot, diff. Structural diff isn't useful here — pixel only.
-
-## Iteration cap
-
-**3 iterations per section per stage.** Orchestrator-enforced. Each call is one-shot: snapshot + diff + report.
-
-After third failure, orchestrator writes a `manual-review.md` entry with: section id, stage, final component file, final diff image, last issues list. Continue to next section.
-
-## Do not
-
-- Do not edit component files. Report, do not fix.
-- Do not restart the dev server mid-validation — flushes state.
-- Do not widen `threshold` to make a diff pass.
-- Do not report "no issues found" with a failing `diff_pct` — if the gate fails, list issues. If structural matched cleanly but pixel still failed: that's a non-DOM divergence (canvas content, video frame, font rendering); say so explicitly: `["Pixel diff fails despite clean structural match — likely canvas/video/font-rendering divergence; consider re-rendering at higher DPR"]`.
diff --git a/.opencode/tools/_python.ts b/.opencode/tools/_python.ts
deleted file mode 100644
index ee1d9b1..0000000
--- a/.opencode/tools/_python.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import { existsSync } from 'node:fs';
-import { resolve } from 'node:path';
-
-export function resolvePython(worktree: string): string {
-  const venvPython = resolve(worktree, '.opencode/scripts/.venv/bin/python');
-  if (existsSync(venvPython)) return venvPython;
-  return 'python3';
-}
diff --git a/.opencode/tools/agent-browser-shot.ts b/.opencode/tools/agent-browser-shot.ts
deleted file mode 100644
index b4bd102..0000000
--- a/.opencode/tools/agent-browser-shot.ts
+++ /dev/null
@@ -1,94 +0,0 @@
-import { tool } from '@opencode-ai/plugin';
-
-export default tool({
-  description:
-    'Thin wrapper over the agent-browser CLI. Opens the target URL at the requested viewport, optionally scrolls to a section, waits for networkidle plus a settle delay, then saves a cropped PNG screenshot. Used by clone-validate to capture rendered sections for diff against the captured originals.',
-  args: {
-    url: tool.schema.string().describe('URL to open (typically http://localhost:3000/)'),
-    viewport: tool.schema.number().describe('Viewport width in pixels (height is derived 16:9)'),
-    output_path: tool.schema.string().describe('Absolute path to write the PNG to'),
-    scroll_y: tool.schema
-      .number()
-      .nullable()
-      .describe('Absolute Y pixel position to scroll to before screenshot. Omit for no scroll.'),
-    crop: tool.schema
-      .object({
-        x: tool.schema.number(),
-        y: tool.schema.number(),
-        width: tool.schema.number(),
-        height: tool.schema.number(),
-      })
-      .nullable()
-      .describe('Crop region to extract from the viewport screenshot. Omit to keep full viewport.'),
-    reduce_motion: tool.schema
-      .boolean()
-      .nullable()
-      .describe('If true, adds the `reduce-motion` class to <html> before screenshot. Default false.'),
-    settle_ms: tool.schema
-      .number()
-      .nullable()
-      .describe('Extra ms to wait after networkidle before screenshot. Default 500.'),
-  },
-  async execute(args, context) {
-    const { spawn } = await import('node:child_process');
-    const { resolve, dirname } = await import('node:path');
-    const { mkdirSync, existsSync } = await import('node:fs');
-    const { resolvePython } = await import('./_python.js');
-
-    const python = resolvePython(context.worktree);
-    const outPath = resolve(context.worktree, args.output_path);
-    const outDir = dirname(outPath);
-    if (!existsSync(outDir)) mkdirSync(outDir, { recursive: true });
-
-    const height = Math.round((args.viewport * 9) / 16);
-    const session = `clone-validate-${args.viewport}`;
-
-    const steps: string[][] = [
-      ['--session', session, 'set', 'viewport', String(args.viewport), String(height)],
-      ['--session', session, 'open', args.url],
-      ['--session', session, 'wait', '--load', 'networkidle'],
-    ];
-
-    if (args.reduce_motion ?? false) {
-      steps.push(['--session', session, 'eval', 'document.documentElement.classList.add("reduce-motion")']);
-    }
-
-    if (args.scroll_y != null) {
-      steps.push(['--session', session, 'eval', `window.scrollTo({ top: ${args.scroll_y}, behavior: "instant" })`]);
-    }
-
-    steps.push(['--session', session, 'wait', String(args.settle_ms ?? 500)]);
-    steps.push(['--session', session, 'screenshot', outPath]);
-
-    for (const argv of steps) {
-      await new Promise<void>((resolvePromise, reject) => {
-        const child = spawn('agent-browser', argv, { stdio: 'inherit' });
-        child.on('exit', (code) => {
-          if (code === 0) resolvePromise();
-          else reject(new Error(`agent-browser ${argv.join(' ')} exited ${code}`));
-        });
-        child.on('error', reject);
-      });
-    }
-
-    if (args.crop != null) {
-      await new Promise<void>((resolvePromise, reject) => {
-        const child = spawn(
-          python,
-          [
-            '-c',
-            `from PIL import Image; import sys; im=Image.open(sys.argv[1]); im.crop((${args.crop!.x}, ${
-              args.crop!.y
-            }, ${args.crop!.x + args.crop!.width}, ${args.crop!.y + args.crop!.height})).save(sys.argv[1])`,
-            outPath,
-          ],
-          { stdio: 'inherit' }
-        );
-        child.on('exit', (code) => (code === 0 ? resolvePromise() : reject(new Error(`crop failed ${code}`))));
-        child.on('error', reject);
-      });
-    }
-
-    return JSON.stringify({ output_path: outPath, viewport: args.viewport });
-  },
-});
diff --git a/.opencode/tools/capture.ts b/.opencode/tools/capture.ts
deleted file mode 100644
index 30f3630..0000000
--- a/.opencode/tools/capture.ts
+++ /dev/null
@@ -1,97 +0,0 @@
-import { tool } from '@opencode-ai/plugin';
-
-export default tool({
-  description:
-    'Run the Playwright-based site capture pipeline against a target URL. Produces a full capture bundle (DOM + computed styles per scroll position, screenshots per viewport, HAR, animation library dumps, shaders, CSS rules + url() asset refs, fonts, per-section cropped screenshots, alt-height pass for vh detection) at output_dir. Wraps scripts/capture.py. Set replay=true to skip capture entirely and only re-run the post-process (vh-flags + meta.json) against an existing capture bundle — use this when iterating on prompts/agents/skills.',
-  args: {
-    url: tool.schema
-      .string()
-      .nullable()
-      .describe('Absolute target URL, e.g. https://example.com. Required unless replay=true.'),
-    viewports: tool.schema
-      .array(tool.schema.number())
-      .nullable()
-      .describe('Viewport widths in pixels to capture, e.g. [375, 768, 1280, 1920]. Default [375,768,1280,1920].'),
-    output_dir: tool.schema
-      .string()
-      .describe('Directory where the capture bundle is written (absolute path or relative to cwd)'),
-    wait_strategy: tool.schema
-      .enum(['networkidle', 'load', 'domcontentloaded'])
-      .nullable()
-      .describe('Playwright wait strategy for navigation. Default networkidle.'),
-    skip_third_party: tool.schema
-      .boolean()
-      .nullable()
-      .describe('If true, blocks requests to known third-party widget domains. Default true.'),
-    replay: tool.schema
-      .boolean()
-      .nullable()
-      .describe(
-        'If true, skip browser capture entirely and only re-run post-process (vh-flags + meta.json) against existing capture data in output_dir. ~100x faster than a real capture.'
-      ),
-    skip_alt_height: tool.schema
-      .boolean()
-      .nullable()
-      .describe('If true, skip the vh-detection alt-height pass at canonical width. Saves ~10s.'),
-    skip_section_shots: tool.schema
-      .boolean()
-      .nullable()
-      .describe('If true, skip the per-section cropped screenshot pass. Saves ~30s.'),
-  },
-  async execute(args, context) {
-    const { spawn } = await import('node:child_process');
-    const { resolve } = await import('node:path');
-    const { readFileSync, existsSync } = await import('node:fs');
-    const { resolvePython } = await import('./_python.js');
-
-    const scriptPath = resolve(context.worktree, '.opencode/scripts/capture.py');
-    const outputDir = resolve(context.worktree, args.output_dir);
-    const python = resolvePython(context.worktree);
-    const replay = args.replay ?? false;
-
-    if (!replay && !args.url) {
-      throw new Error('capture: url is required unless replay=true');
-    }
-
-    const viewports = args.viewports ?? [375, 768, 1280, 1920];
-
-    const cmdArgs = [scriptPath, '--output', outputDir];
-    if (args.url) cmdArgs.push('--url', args.url);
-    if (viewports.length) cmdArgs.push('--viewports', viewports.join(','));
-    cmdArgs.push('--wait-strategy', args.wait_strategy ?? 'networkidle');
-    if (args.skip_third_party ?? true) cmdArgs.push('--skip-third-party');
-    if (replay) cmdArgs.push('--replay');
-    if (args.skip_alt_height ?? false) cmdArgs.push('--skip-alt-height');
-    if (args.skip_section_shots ?? false) cmdArgs.push('--skip-section-shots');
-
-    await new Promise<void>((resolvePromise, reject) => {
-      const child = spawn(python, cmdArgs, { cwd: context.worktree, stdio: 'inherit' });
-      child.on('exit', (code) => {
-        if (code === 0) resolvePromise();
-        else reject(new Error(`capture.py exited with code ${code}`));
-      });
-      child.on('error', reject);
-    });
-
-    const metaPath = resolve(outputDir, 'meta.json');
-    if (!existsSync(metaPath)) {
-      throw new Error(`capture.py did not produce ${metaPath}`);
-    }
-    const meta = JSON.parse(readFileSync(metaPath, 'utf-8'));
-
-    return JSON.stringify({
-      status: 'success',
-      mode: replay ? 'replay' : 'capture',
-      capture_dir: outputDir,
-      viewports: meta.viewports ?? viewports,
-      dom_snapshots: meta.dom_snapshots ?? 0,
-      screenshots: meta.screenshots ?? 0,
-      section_shots: meta.section_shots ?? 0,
-      assets_discovered: Array.isArray(meta.assets) ? meta.assets.length : 0,
-      asset_sources: meta.asset_sources ?? null,
-      libs_detected: meta.libs_detected ?? [],
-      vh_relative_count: meta.vh_relative_count ?? 0,
-      canvas_regions: meta.canvas_regions ?? 0,
-    });
-  },
-});
diff --git a/.opencode/tools/dev-server.ts b/.opencode/tools/dev-server.ts
deleted file mode 100644
index f13d766..0000000
--- a/.opencode/tools/dev-server.ts
+++ /dev/null
@@ -1,63 +0,0 @@
-import { tool } from '@opencode-ai/plugin';
-
-export default tool({
-  description:
-    "Start, stop, or health-check the Next.js dev server for the generated clone project. Use action='health' to check if a server is already responding at url; action='start' to spawn `bun run dev` in project_dir; action='stop' to kill the pid from a prior start.",
-  args: {
-    action: tool.schema.enum(['health', 'start', 'stop']).describe('Which lifecycle action to perform'),
-    project_dir: tool.schema.string().nullable().describe('Path to the generated Next.js project (required for start)'),
-    url: tool.schema.string().nullable().describe('Base URL to health-check. Default http://localhost:3000'),
-    port: tool.schema.number().nullable().describe('Port for `bun run dev` when starting. Default 3000.'),
-    pid: tool.schema.number().nullable().describe('Pid to kill when action=stop'),
-  },
-  async execute(args, context) {
-    const { spawn } = await import('node:child_process');
-    const { resolve } = await import('node:path');
-    const url = args.url ?? 'http://localhost:3000';
-
-    if (args.action === 'health') {
-      try {
-        const res = await fetch(url, { method: 'HEAD' });
-        return JSON.stringify({ healthy: res.ok || res.status === 404, status: res.status, url });
-      } catch {
-        return JSON.stringify({ healthy: false, status: 0, url });
-      }
-    }
-
-    if (args.action === 'start') {
-      if (!args.project_dir) throw new Error('project_dir is required for action=start');
-      const cwd = resolve(context.worktree, args.project_dir);
-      const port = args.port ?? 3000;
-      const child = spawn('bun', ['run', 'dev', '--port', String(port)], {
-        cwd,
-        detached: true,
-        stdio: 'ignore',
-      });
-      child.unref();
-
-      const deadline = Date.now() + 30_000;
-      while (Date.now() < deadline) {
-        try {
-          const res = await fetch(url, { method: 'HEAD' });
-          if (res.ok || res.status === 404) {
-            return JSON.stringify({ status: 'started', url, pid: child.pid });
-          }
-        } catch {}
-        await new Promise((r) => setTimeout(r, 1000));
-      }
-      return JSON.stringify({ status: 'timeout', url, pid: child.pid });
-    }
-
-    if (args.action === 'stop') {
-      if (args.pid == null) throw new Error('pid is required for action=stop');
-      try {
-        process.kill(args.pid, 'SIGTERM');
-        return JSON.stringify({ status: 'stopped', pid: args.pid });
-      } catch (err) {
-        return JSON.stringify({ status: 'error', pid: args.pid, error: String(err) });
-      }
-    }
-
-    throw new Error(`unknown action ${args.action}`);
-  },
-});
diff --git a/.opencode/tools/dom-diff.ts b/.opencode/tools/dom-diff.ts
deleted file mode 100644
index 6d933da..0000000
--- a/.opencode/tools/dom-diff.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-import { tool } from '@opencode-ai/plugin';
-
-export default tool({
-  description:
-    'Structural diff between two DOM JSON snapshots produced by __CLONE_DUMP_COMPUTED__ — one from the source capture, one from the rendered clone (via dump-rendered). Returns a ranked list of concrete issues (missing elements, wrong dimensions, style mismatches) the generate agent can act on directly. Wraps scripts/dom-diff.py.',
-  args: {
-    captured: tool.schema.string().describe('Path to the captured DOM JSON (e.g. capture/dom/1280/step-00.json)'),
-    rendered: tool.schema.string().describe('Path to the rendered DOM JSON produced by dump-rendered'),
-    root_selector: tool.schema
-      .string()
-      .nullable()
-      .describe(
-        'Optional — scope the diff to a subtree, e.g. "#hero" or ".ecosystem". Omit to diff the whole document.'
-      ),
-    max_depth: tool.schema.number().nullable().describe('Recursion depth cap. Default 8.'),
-    max_issues: tool.schema
-      .number()
-      .nullable()
-      .describe('Cap on the number of structured issues returned. Default 200.'),
-  },
-  async execute(args, context) {
-    const { spawn } = await import('node:child_process');
-    const { resolve } = await import('node:path');
-    const { resolvePython } = await import('./_python.js');
-
-    const scriptPath = resolve(context.worktree, '.opencode/scripts/dom-diff.py');
-    const capturedPath = resolve(context.worktree, args.captured);
-    const renderedPath = resolve(context.worktree, args.rendered);
-    const python = resolvePython(context.worktree);
-
-    const cmdArgs = [scriptPath, '--captured', capturedPath, '--rendered', renderedPath];
-    if (args.root_selector) cmdArgs.push('--root-selector', args.root_selector);
-    if (args.max_depth != null) cmdArgs.push('--max-depth', String(args.max_depth));
-    if (args.max_issues != null) cmdArgs.push('--max-issues', String(args.max_issues));
-
-    let stdout = '';
-    let stderr = '';
-    await new Promise<void>((resolvePromise, reject) => {
-      const child = spawn(python, cmdArgs, { cwd: context.worktree });
-      child.stdout.on('data', (chunk) => (stdout += chunk.toString()));
-      child.stderr.on('data', (chunk) => (stderr += chunk.toString()));
-      child.on('exit', (code) => {
-        if (code === 0 || code === 2 || code === 3) resolvePromise();
-        else reject(new Error(`dom-diff.py exited ${code}: ${stderr}`));
-      });
-      child.on('error', reject);
-    });
-
-    const result = JSON.parse(stdout.trim().split('\n').pop() ?? '{}');
-    return JSON.stringify({
-      matched: result.matched ?? 0,
-      counts: result.counts ?? {},
-      issues: result.issues ?? [],
-      structured_issues: result.structured_issues ?? [],
-      error: result.error ?? null,
-    });
-  },
-});
diff --git a/.opencode/tools/download-assets.ts b/.opencode/tools/download-assets.ts
deleted file mode 100644
index 4fb14fd..0000000
--- a/.opencode/tools/download-assets.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-import { tool } from '@opencode-ai/plugin';
-
-export default tool({
-  description:
-    'Download every asset referenced in the capture bundle into the target Next.js project public directory using hash-based filenames. Wraps scripts/download-assets.py. Returns lists of downloaded, failed, and skipped URLs.',
-  args: {
-    manifest_path: tool.schema
-      .string()
-      .describe('Path to meta.json from capture (or manifest.json after analyze) — whichever has assets[]'),
-    project_public_dir: tool.schema
-      .string()
-      .describe('Path to <project>/public/assets/cloned where assets are written'),
-  },
-  async execute(args, context) {
-    const { spawn } = await import('node:child_process');
-    const { resolve } = await import('node:path');
-    const { resolvePython } = await import('./_python.js');
-
-    const scriptPath = resolve(context.worktree, '.opencode/scripts/download-assets.py');
-    const manifestPath = resolve(context.worktree, args.manifest_path);
-    const publicDir = resolve(context.worktree, args.project_public_dir);
-    const python = resolvePython(context.worktree);
-
-    let stdout = '';
-    let stderr = '';
-
-    await new Promise<void>((resolvePromise, reject) => {
-      const child = spawn(python, [scriptPath, '--manifest', manifestPath, '--public-dir', publicDir, '--json'], {
-        cwd: context.worktree,
-      });
-      child.stdout.on('data', (chunk) => (stdout += chunk.toString()));
-      child.stderr.on('data', (chunk) => (stderr += chunk.toString()));
-      child.on('exit', (code) => {
-        if (code === 0) resolvePromise();
-        else reject(new Error(`download-assets.py exited with code ${code}: ${stderr}`));
-      });
-      child.on('error', reject);
-    });
-
-    const result = JSON.parse(stdout.trim().split('\n').pop() ?? '{}');
-    return JSON.stringify({
-      downloaded: result.downloaded ?? [],
-      failed: result.failed ?? [],
-      skipped: result.skipped ?? [],
-    });
-  },
-});
diff --git a/.opencode/tools/dump-rendered.ts b/.opencode/tools/dump-rendered.ts
deleted file mode 100644
index cfba644..0000000
--- a/.opencode/tools/dump-rendered.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-import { tool } from '@opencode-ai/plugin';
-
-export default tool({
-  description:
-    'Open a URL (typically the local dev server at http://localhost:3000) and dump its DOM + computed styles using the same __CLONE_DUMP_COMPUTED__ walker the source capture pipeline uses. Produces a directly-comparable structural snapshot the validate agent can pass to dom-diff. Wraps scripts/dump-rendered.py.',
-  args: {
-    url: tool.schema.string().describe('URL to dump, typically http://localhost:3000/'),
-    output: tool.schema.string().describe('Path to write the rendered DOM JSON (the section snapshot file)'),
-    viewport: tool.schema.number().nullable().describe('Viewport width in px. Default 1280.'),
-    viewport_height: tool.schema
-      .number()
-      .nullable()
-      .describe('Viewport height in px. Default = 16:9 of viewport width.'),
-    scroll_y: tool.schema.number().nullable().describe('Y position to scroll to before dumping. Default 0.'),
-    reduce_motion: tool.schema
-      .boolean()
-      .nullable()
-      .describe('Add reduce-motion class to <html> before dumping (matches the Stage 1 validate gate). Default false.'),
-    settle_ms: tool.schema.number().nullable().describe('Extra ms to wait after scroll before dumping. Default 800.'),
-  },
-  async execute(args, context) {
-    const { spawn } = await import('node:child_process');
-    const { resolve } = await import('node:path');
-    const { resolvePython } = await import('./_python.js');
-
-    const scriptPath = resolve(context.worktree, '.opencode/scripts/dump-rendered.py');
-    const outPath = resolve(context.worktree, args.output);
-    const python = resolvePython(context.worktree);
-
-    const cmdArgs = [scriptPath, '--url', args.url, '--output', outPath];
-    if (args.viewport != null) cmdArgs.push('--viewport', String(args.viewport));
-    if (args.viewport_height != null) cmdArgs.push('--viewport-height', String(args.viewport_height));
-    if (args.scroll_y != null) cmdArgs.push('--scroll-y', String(args.scroll_y));
-    if (args.reduce_motion ?? false) cmdArgs.push('--reduce-motion');
-    if (args.settle_ms != null) cmdArgs.push('--settle-ms', String(args.settle_ms));
-
-    let stdout = '';
-    let stderr = '';
-    await new Promise<void>((resolvePromise, reject) => {
-      const child = spawn(python, cmdArgs, { cwd: context.worktree });
-      child.stdout.on('data', (chunk) => (stdout += chunk.toString()));
-      child.stderr.on('data', (chunk) => (stderr += chunk.toString()));
-      child.on('exit', (code) => {
-        if (code === 0) resolvePromise();
-        else reject(new Error(`dump-rendered.py exited ${code}: ${stderr}`));
-      });
-      child.on('error', reject);
-    });
-
-    const result = JSON.parse(stdout.trim().split('\n').pop() ?? '{}');
-    return JSON.stringify({
-      status: result.status ?? 'success',
-      output: result.output ?? outPath,
-      sections_path: result.sections_path,
-      section_count: result.section_count ?? 0,
-    });
-  },
-});
diff --git a/.opencode/tools/screenshot-diff.ts b/.opencode/tools/screenshot-diff.ts
deleted file mode 100644
index f558077..0000000
--- a/.opencode/tools/screenshot-diff.ts
+++ /dev/null
@@ -1,65 +0,0 @@
-import { tool } from '@opencode-ai/plugin';
-
-export default tool({
-  description:
-    'Pixel-diff two PNG screenshots using pixelmatch. Returns diff percentage, path to a diff image with changed pixels highlighted, and bounding boxes of the worst regions (top connected components of changed pixels).',
-  args: {
-    before: tool.schema.string().describe('Path to the captured original PNG'),
-    after: tool.schema.string().describe('Path to the rendered clone PNG'),
-    threshold: tool.schema.number().nullable().describe('pixelmatch per-pixel color tolerance 0-1. Default 0.1.'),
-    diff_out: tool.schema
-      .string()
-      .nullable()
-      .describe('Path to write the diff PNG to. Default: same dir as after with -diff suffix.'),
-  },
-  async execute(args, context) {
-    const { spawn } = await import('node:child_process');
-    const { resolve, dirname, basename, extname, join } = await import('node:path');
-    const { resolvePython } = await import('./_python.js');
-
-    const scriptPath = resolve(context.worktree, '.opencode/scripts/diff.py');
-    const beforePath = resolve(context.worktree, args.before);
-    const afterPath = resolve(context.worktree, args.after);
-    const python = resolvePython(context.worktree);
-    const diffOut =
-      args.diff_out != null
-        ? resolve(context.worktree, args.diff_out)
-        : join(dirname(afterPath), `${basename(afterPath, extname(afterPath))}-diff.png`);
-
-    let stdout = '';
-    let stderr = '';
-
-    await new Promise<void>((resolvePromise, reject) => {
-      const child = spawn(
-        python,
-        [
-          scriptPath,
-          '--before',
-          beforePath,
-          '--after',
-          afterPath,
-          '--diff-out',
-          diffOut,
-          '--threshold',
-          String(args.threshold ?? 0.1),
-          '--json',
-        ],
-        { cwd: context.worktree }
-      );
-      child.stdout.on('data', (chunk) => (stdout += chunk.toString()));
-      child.stderr.on('data', (chunk) => (stderr += chunk.toString()));
-      child.on('exit', (code) => {
-        if (code === 0) resolvePromise();
-        else reject(new Error(`diff.py exited with code ${code}: ${stderr}`));
-      });
-      child.on('error', reject);
-    });
-
-    const result = JSON.parse(stdout.trim().split('\n').pop() ?? '{}');
-    return JSON.stringify({
-      diff_pct: result.diff_pct ?? 100,
-      diff_image_path: diffOut,
-      worst_regions: result.worst_regions ?? [],
-    });
-  },
-});
diff --git a/opencode.json b/opencode.json
deleted file mode 100644
index 87139db..0000000
--- a/opencode.json
+++ /dev/null
@@ -1,22 +0,0 @@
-{
-  "$schema": "https://opencode.ai/config.json",
-  "disabled_providers": ["copilot"],
-  "permission": {
-    "bash": {
-      "rm -rf*": "deny",
-      "git reset --hard*": "deny",
-      "git clean -fd*": "deny",
-      "*": "allow"
-    },
-    "edit": "allow",
-    "webfetch": "allow",
-    "external_directory": "allow"
-  },
-  "mcp": {
-    "image-tools": {
-      "type": "local",
-      "command": ["env", "bunx", "tsx", ".opencode/mcp/image-tools/index.ts"],
-      "enabled": false
-    }
-  }
-}