@vibeframe/cli 0.57.3 → 0.59.0

package/dist/index.js

@@ -6746,7 +6746,10 @@ var init_output = __esm({
       "pipeline highlights": { min: 0.05, max: 1, unit: "per analysis" },
       "pipeline auto-shorts": { min: 0.1, max: 2, unit: "per batch" },
       "pipeline animated-caption": { min: 0.01, max: 0.1, unit: "per video" },
-      "pipeline regenerate-scene": { min: 0.5, max: 5, unit: "per scene" }
+      "pipeline regenerate-scene": { min: 0.5, max: 5, unit: "per scene" },
+      // Scene composition (v0.59+) — per-beat composer call ≈ $0.06 (PR #111
+      // pre-flight). Range covers a 1-beat preview to a 10-beat long-form.
+      "compose scenes with skills": { min: 0.05, max: 1.5, unit: "per pipeline" }
     };
   }
 });
@@ -14966,7 +14969,7 @@ var init_GeminiProvider = __esm({
        * Sleep helper
        */
       sleep(ms) {
-        return new Promise((resolve53) => setTimeout(resolve53, ms));
+        return new Promise((resolve54) => setTimeout(resolve54, ms));
       }
       /**
        * Extend a previously generated Veo video
@@ -19053,7 +19056,7 @@ var init_RunwayProvider = __esm({
        * Sleep helper
        */
       sleep(ms) {
-        return new Promise((resolve53) => setTimeout(resolve53, ms));
+        return new Promise((resolve54) => setTimeout(resolve54, ms));
       }
     };
     RunwayProvider.API_VERSION = "2024-11-06";
@@ -19485,7 +19488,7 @@ var init_KlingProvider = __esm({
        * Sleep helper
        */
       sleep(ms) {
-        return new Promise((resolve53) => setTimeout(resolve53, ms));
+        return new Promise((resolve54) => setTimeout(resolve54, ms));
       }
     };
     klingProvider = new KlingProvider();
@@ -19794,7 +19797,7 @@ var init_GrokProvider = __esm({
         }
       }
       sleep(ms) {
-        return new Promise((resolve53) => setTimeout(resolve53, ms));
+        return new Promise((resolve54) => setTimeout(resolve54, ms));
       }
     };
     grokProvider = new GrokProvider();
@@ -19815,11 +19818,11 @@ var require_middleware = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -19835,7 +19838,7 @@ var require_middleware = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -19920,11 +19923,11 @@ var require_response = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -19940,7 +19943,7 @@ var require_response = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -20047,11 +20050,11 @@ var require_utils = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -20067,7 +20070,7 @@ var require_utils = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -20160,7 +20163,7 @@ var require_utils = __commonJS({
     }
     function sleep2(ms) {
       return __awaiter(this, void 0, void 0, function* () {
-        return new Promise((resolve53) => setTimeout(resolve53, ms));
+        return new Promise((resolve54) => setTimeout(resolve54, ms));
       });
     }
   }
@@ -20172,11 +20175,11 @@ var require_retry = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -20192,7 +20195,7 @@ var require_retry = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -20399,11 +20402,11 @@ var require_request = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -20419,7 +20422,7 @@ var require_request = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -20506,11 +20509,11 @@ var require_storage = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -20526,7 +20529,7 @@ var require_storage = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -20854,11 +20857,11 @@ var require_auth = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -20874,7 +20877,7 @@ var require_auth = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -20913,11 +20916,11 @@ var require_streaming = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -20933,7 +20936,7 @@ var require_streaming = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -21166,7 +21169,7 @@ var require_streaming = __commonJS({
           query: options.queryParams
         });
         this.options = options;
-        this.donePromise = new Promise((resolve53, reject) => {
+        this.donePromise = new Promise((resolve54, reject) => {
           if (this.streamClosed) {
             reject(new response_1.ApiError({
               message: "Streaming connection is already closed.",
@@ -21177,11 +21180,11 @@ var require_streaming = __commonJS({
           }
           this.signal.addEventListener("abort", () => {
             var _a2;
-            resolve53((_a2 = this.currentData) !== null && _a2 !== void 0 ? _a2 : {});
+            resolve54((_a2 = this.currentData) !== null && _a2 !== void 0 ? _a2 : {});
           });
           this.on("done", (data) => {
             this.streamClosed = true;
-            resolve53(data);
+            resolve54(data);
           });
           this.on("error", (error) => {
             this.streamClosed = true;
@@ -21206,7 +21209,7 @@ var require_streaming = __commonJS({
             if (data) {
               yield yield __await(data);
             }
-            yield __await(new Promise((resolve53) => setTimeout(resolve53, 16)));
+            yield __await(new Promise((resolve54) => setTimeout(resolve54, 16)));
           }
         });
       }
@@ -21251,11 +21254,11 @@ var require_queue = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -21271,7 +21274,7 @@ var require_queue = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -21406,7 +21409,7 @@ var require_queue = __commonJS({
               }
               return doneStatus;
             }
-            return new Promise((resolve53, reject) => {
+            return new Promise((resolve54, reject) => {
               var _a;
               let pollingTimeoutId;
               const pollInterval = "pollInterval" in options && typeof options.pollInterval === "number" ? (_a = options.pollInterval) !== null && _a !== void 0 ? _a : DEFAULT_POLL_INTERVAL : DEFAULT_POLL_INTERVAL;
@@ -21438,7 +21441,7 @@ var require_queue = __commonJS({
                   }
                   if (requestStatus.status === "COMPLETED") {
                     clearScheduledTasks();
-                    resolve53(requestStatus);
+                    resolve54(requestStatus);
                     return;
                   }
                   pollingTimeoutId = setTimeout(poll, pollInterval);
@@ -23399,11 +23402,11 @@ var require_realtime = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -23419,7 +23422,7 @@ var require_realtime = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -23744,11 +23747,11 @@ var require_client = __commonJS({
     "use strict";
     var __awaiter = exports && exports.__awaiter || function(thisArg, _arguments, P, generator) {
       function adopt(value) {
-        return value instanceof P ? value : new P(function(resolve53) {
-          resolve53(value);
+        return value instanceof P ? value : new P(function(resolve54) {
+          resolve54(value);
         });
       }
-      return new (P || (P = Promise))(function(resolve53, reject) {
+      return new (P || (P = Promise))(function(resolve54, reject) {
         function fulfilled(value) {
           try {
             step(generator.next(value));
@@ -23764,7 +23767,7 @@ var require_client = __commonJS({
           }
         }
         function step(result) {
-          result.done ? resolve53(result.value) : adopt(result.value).then(fulfilled, rejected);
+          result.done ? resolve54(result.value) : adopt(result.value).then(fulfilled, rejected);
         }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
       });
@@ -24329,7 +24332,7 @@ var init_ReplicateProvider = __esm({
        * Sleep helper
        */
       sleep(ms) {
-        return new Promise((resolve53) => setTimeout(resolve53, ms));
+        return new Promise((resolve54) => setTimeout(resolve54, ms));
       }
       /**
        * Generate music from text prompt using MusicGen
@@ -25315,7 +25318,7 @@ async function prompt(question, hidden = false) {
     input: process.stdin,
     output: process.stdout
   });
-  return new Promise((resolve53) => {
+  return new Promise((resolve54) => {
     if (hidden && process.stdin.isTTY) {
       process.stdout.write(question);
       let input = "";
@@ -25329,7 +25332,7 @@ async function prompt(question, hidden = false) {
           process.stdin.removeListener("data", onData);
           process.stdout.write("\n");
           rl.close();
-          resolve53(input);
+          resolve54(input);
         } else if (char === "") {
           process.exit(1);
         } else if (char === "\x7F" || char === "\b") {
@@ -25344,7 +25347,7 @@ async function prompt(question, hidden = false) {
     } else {
       rl.question(question, (answer) => {
         rl.close();
-        resolve53(answer);
+        resolve54(answer);
       });
     }
   });
@@ -25611,6 +25614,70 @@ function buildEmptyRootHtml(opts) {
 </html>
 `;
 }
+function buildDesignMd(opts) {
+  const { name, style } = opts;
+  const intro = style ? `Visual identity for **${name}**, scaffolded from the **${style.name}** style (after ${style.designer}). Customise freely \u2014 this file is the single source of truth for every scene's palette, typography, and motion.` : `Visual identity for **${name}**. Fill the sections below before authoring any scene HTML or generating any backdrop. Pick a named style with \`vibe scene styles\` if you want a credible starting point.`;
+  const moodLine = style ? `**Mood:** ${style.mood} \xB7 **Best for:** ${style.bestFor}` : `**Mood:** _(one line \u2014 what should the viewer FEEL?)_`;
+  const palette = style ? `${style.palette.map((c) => `- \`${c}\``).join("\n")}
+
+${style.paletteNotes}` : `- _hex_ \u2014 primary
+- _hex_ \u2014 accent
+
+_2\u20133 colours max. Declare explicit hex values; never name colours abstractly._`;
+  const typography = style ? style.typography : `_One family, two weights. State the role of each (headline / label / body)._`;
+  const composition = style ? style.composition : `_Grid? Centered? Layered? How does negative space behave?_`;
+  const motion = style ? `${style.motion}
+
+**GSAP signature:** ${style.gsapSignature}` : `_How fast? Snappy or fluid? Overshoot or precision?_
+
+**GSAP signature:** _e.g. \`expo.out\`, \`sine.inOut\`, \`back.out(1.8)\`_`;
+  const transition = style ? style.transition : `_Which Hyperframes shader matches the energy? (Cinematic Zoom, Cross-Warp Morph, Glitch, Domain Warp, \u2026)_`;
+  const avoid = style ? style.avoid.map((a) => `- ${a}`).join("\n") : `- _anti-pattern 1_
+- _anti-pattern 2_
+- _anti-pattern 3_`;
+  return `# ${name} \u2014 Design
+
+> **Hard-gate.** This file defines the visual identity of every scene.
+> Author it before generating any HTML, backdrop image, or motion.
+> The Hyperframes \`hyperframes\` skill enforces this: scenes that
+> contradict DESIGN.md are rejected.
+
+${intro}
+
+## Style
+
+${moodLine}
+
+## Palette
+
+${palette}
+
+## Typography
+
+${typography}
+
+## Composition
+
+${composition}
+
+## Motion
+
+${motion}
+
+## Transition
+
+${transition}
+
+## What NOT to do
+
+${avoid}
+
+---
+
+_Browse other named styles: \`vibe scene styles\`_
+${style ? `_This file was seeded by \`vibe scene init --visual-style "${style.name}"\`._` : `_Seed this file from a named style: \`vibe scene init <dir> --visual-style "<name>"\`._`}
+`;
+}
 function buildProjectClaudeMd(name) {
   return `# ${name} \u2014 Scene Authoring Project
 
@@ -25618,6 +25685,16 @@ This project is **bilingual**: it works with both VibeFrame (\`vibe\`) and
 HeyGen Hyperframes (\`hyperframes\`). You can run either CLI inside this
 directory.
 
+## Visual identity hard-gate
+
+**Author \`DESIGN.md\` before any scene HTML.** It defines palette,
+typography, motion, and transition rules. Both the agent-driven path and
+the fallback emit reference it; scenes that contradict DESIGN.md are
+rejected by the Hyperframes \`hyperframes\` skill.
+
+Browse named styles: \`vibe scene styles\`. Re-seed from one with
+\`vibe scene init . --visual-style "Swiss Pulse"\` (idempotent).
+
 ## Skills \u2014 USE THESE FIRST
 
 **Always invoke the relevant skill before authoring scenes.** Skills encode
@@ -25626,14 +25703,23 @@ semantics, VibeFrame pipeline conventions) that are NOT in generic web docs.
 
 | Skill             | Command          | When to use                                                                           |
 | ----------------- | ---------------- | ------------------------------------------------------------------------------------- |
-| **vibe-scene**    | \`/vibe-scene\`    | Authoring / editing per-scene HTML in this project \u2014 preferred                        |
-| **hyperframes**   | \`/hyperframes\`   | Fallback: direct HF authoring (install via \`npx skills add heygen-com/hyperframes\`) |
+| **hyperframes**   | \`/hyperframes\`   | Cinematic-quality composition \u2014 DESIGN.md hard-gate, named styles, motion principles  |
+| **vibe-scene**    | \`/vibe-scene\`    | VibeFrame's authoring loop, AI assets, lint feedback, pipeline integration            |
 | **gsap**          | \`/gsap\`          | GSAP tweens, timelines, easing                                                        |
 
-If the skill is not available, follow the **Key Rules** below.
+Install the Hyperframes skills once per machine:
+
+\`\`\`bash
+npx skills add heygen-com/hyperframes
+\`\`\`
+
+Restart your agent session (or reload the skill list) after installing.
+If skills aren't available, follow the **Key Rules** below \u2014 they cover
+the framework-level minimum, not the cinematic craft layer.
 
 ## Project structure
 
+- \`DESIGN.md\` \u2014 visual identity contract (palette, type, motion, transitions)
 - \`index.html\` \u2014 root composition (timeline)
 - \`compositions/scene-*.html\` \u2014 per-scene HTML authored by you or the agent
 - \`assets/\` \u2014 shared media (narration audio, images, video)
@@ -25751,6 +25837,17 @@ async function scaffoldSceneProject(opts) {
     await writeFile4(claudePath, buildProjectClaudeMd(name), "utf-8");
     created.push(claudePath);
   }
+  const designPath = resolve5(dir, "DESIGN.md");
+  if (await pathExists(designPath)) {
+    skipped.push(designPath);
+  } else {
+    await writeFile4(
+      designPath,
+      buildDesignMd({ name, style: opts.visualStyle }),
+      "utf-8"
+    );
+    created.push(designPath);
+  }
   const gitignorePath = resolve5(dir, ".gitignore");
   if (await pathExists(gitignorePath)) {
     skipped.push(gitignorePath);
@@ -25774,6 +25871,180 @@ var init_scene_project = __esm({
   }
 });
 
+// src/commands/_shared/visual-styles.ts
+function listVisualStyles() {
+  return STYLES;
+}
+function getVisualStyle(query) {
+  const q = query.trim().toLowerCase();
+  return STYLES.find(
+    (s) => s.name.toLowerCase() === q || s.slug === q
+  );
+}
+function visualStyleNames() {
+  return STYLES.map((s) => `"${s.name}"`).join(", ");
+}
+var STYLES;
+var init_visual_styles = __esm({
+  "src/commands/_shared/visual-styles.ts"() {
+    "use strict";
+    STYLES = [
+      {
+        name: "Swiss Pulse",
+        slug: "swiss-pulse",
+        designer: "Josef M\xFCller-Brockmann",
+        mood: "Clinical, precise",
+        bestFor: "SaaS dashboards, developer tools, APIs, metrics",
+        palette: ["#1a1a1a", "#ffffff", "#0066FF"],
+        paletteNotes: "Black, white, ONE accent \u2014 electric blue (#0066FF) or amber (#FFB300). Never both accents at once.",
+        typography: "Helvetica or Inter Bold for headlines, Regular for labels. Numbers dominate at 80\u2013120px.",
+        composition: "Grid-locked. Every element snaps to an invisible 12-column grid. Hard cuts only \u2014 no decorative transitions.",
+        motion: "Animated counters count up from 0. Entries are fast and snap into place. Nothing floats.",
+        transition: "Cinematic Zoom or SDF Iris (precise, geometric)",
+        gsapSignature: "expo.out, power4.out \u2014 fast arrivals, hard stops",
+        avoid: [
+          "Decorative transitions (fades, dissolves) \u2014 use hard cuts",
+          "Two accent colours competing in one frame",
+          "Off-grid placement or floating elements"
+        ]
+      },
+      {
+        name: "Velvet Standard",
+        slug: "velvet-standard",
+        designer: "Massimo Vignelli",
+        mood: "Premium, timeless",
+        bestFor: "Luxury products, enterprise software, keynotes, investor decks",
+        palette: ["#000000", "#ffffff", "#1a237e"],
+        paletteNotes: "Black, white, ONE rich accent \u2014 deep navy (#1a237e) or gold (#c9a84c).",
+        typography: "Thin sans-serif, ALL CAPS, wide letter-spacing (0.15em+). Sequential reveals only.",
+        composition: "Generous negative space. Symmetrical, centered, architectural precision. Nothing busy.",
+        motion: "Slow, deliberate. Sequential reveals with long holds. No frantic motion.",
+        transition: "Cross-Warp Morph (elegant, organic flow between scenes)",
+        gsapSignature: "sine.inOut, power1 \u2014 nothing snaps, everything glides",
+        avoid: [
+          "Tight letter-spacing \u2014 kills the premium register",
+          "Bouncy or elastic easings \u2014 too playful",
+          "Multiple elements arriving at once \u2014 break sequence"
+        ]
+      },
+      {
+        name: "Deconstructed",
+        slug: "deconstructed",
+        designer: "Neville Brody",
+        mood: "Industrial, raw",
+        bestFor: "Tech news, developer launches, security products, punk-energy reveals",
+        palette: ["#1a1a1a", "#D4501E", "#f0f0f0"],
+        paletteNotes: "Dark grey (#1a1a1a), rust orange (#D4501E), raw white (#f0f0f0).",
+        typography: "Type at angles, overlapping edges, escaping frames. Bold industrial weight.",
+        composition: "Gritty textures \u2014 scan-line effects, glitch artifacts baked into the design.",
+        motion: "Text SLAMS and SHATTERS. Letters scramble then snap to final position.",
+        transition: "Glitch shader or Whip Pan (breaks the rules, feels aggressive)",
+        gsapSignature: "back.out(2.5), steps(8), elastic.out(1.2, 0.4) \u2014 intentional irregularity",
+        avoid: [
+          "Polished, centered compositions \u2014 must feel raw",
+          "Smooth fades \u2014 use glitch / scramble entries",
+          "Soft easings \u2014 every motion lands hard"
+        ]
+      },
+      {
+        name: "Maximalist Type",
+        slug: "maximalist-type",
+        designer: "Paula Scher",
+        mood: "Loud, kinetic",
+        bestFor: "Big product launches, milestone announcements, high-energy hype videos",
+        palette: ["#E63946", "#FFD60A", "#000000", "#ffffff"],
+        paletteNotes: "Bold saturated: red (#E63946), yellow (#FFD60A), black, white \u2014 maximum contrast.",
+        typography: "Text IS the visual. Overlapping type layers at different scales and angles, filling 50\u201380% of frame.",
+        composition: "Text layered OVER footage \u2014 never empty backgrounds. 2\u20133 second rapid-fire scenes.",
+        motion: "Everything is kinetic \u2014 slamming, sliding, scaling. No static moments.",
+        transition: "Ridged Burn (explosive, dramatic, impossible to ignore)",
+        gsapSignature: "expo.out, back.out(1.8) \u2014 fast arrivals, hard stops",
+        avoid: [
+          "Static moments \u2014 every frame must move",
+          "Empty backgrounds \u2014 text and footage must layer",
+          "Single typeface at a single size \u2014 must be layered"
+        ]
+      },
+      {
+        name: "Data Drift",
+        slug: "data-drift",
+        designer: "Refik Anadol",
+        mood: "Futuristic, immersive",
+        bestFor: "AI products, ML platforms, data companies, speculative tech",
+        palette: ["#0a0a0a", "#7c3aed", "#06b6d4"],
+        paletteNotes: "Iridescent \u2014 deep black (#0a0a0a), electric purple (#7c3aed), cyan (#06b6d4).",
+        typography: "Thin futuristic sans-serif \u2014 floating, weightless, minimal text.",
+        composition: "Fluid morphing compositions. Extreme scale shifts (micro \u2192 macro). Particles coalesce into numbers.",
+        motion: "Light traces data paths through the frame. Smooth, continuous, organic \u2014 nothing hard.",
+        transition: "Gravitational Lens or Domain Warp (otherworldly distortion)",
+        gsapSignature: "sine.inOut, power2.out \u2014 smooth, continuous, organic",
+        avoid: [
+          "Hard cuts \u2014 break the immersion",
+          "Heavy/bold typography \u2014 too grounded",
+          "Static compositions \u2014 must feel like flow"
+        ]
+      },
+      {
+        name: "Soft Signal",
+        slug: "soft-signal",
+        designer: "Stefan Sagmeister",
+        mood: "Intimate, warm",
+        bestFor: "Wellness brands, personal stories, lifestyle products, human-centered apps",
+        palette: ["#F5A623", "#FFF8EC", "#C4A3A3", "#8FAF8C"],
+        paletteNotes: "Warm amber (#F5A623), cream (#FFF8EC), dusty rose (#C4A3A3), sage green (#8FAF8C).",
+        typography: "Handwritten-style or humanist serif fonts. Personal, lowercase, delicate.",
+        composition: "Close-up framing feel \u2014 single element fills the frame. Nothing feels corporate.",
+        motion: "Slow drifts and floats, never snaps. Soft organic motion throughout.",
+        transition: "Thermal Distortion (warm, flowing, like heat shimmer)",
+        gsapSignature: "sine.inOut, power1.inOut \u2014 everything breathes",
+        avoid: [
+          "Sharp geometric layouts \u2014 break the warmth",
+          "Hard easings or snaps \u2014 too clinical",
+          "Cool tones (blue/green-blue) without warm balance"
+        ]
+      },
+      {
+        name: "Folk Frequency",
+        slug: "folk-frequency",
+        designer: "Eduardo Terrazas",
+        mood: "Cultural, vivid",
+        bestFor: "Consumer apps, food platforms, community products, festive launches",
+        palette: ["#FF1493", "#0047AB", "#FFE000", "#009B77"],
+        paletteNotes: "Vivid folk: hot pink (#FF1493), cobalt blue (#0047AB), sun yellow (#FFE000), emerald (#009B77).",
+        typography: "Bold warm rounded type. Every frame feels handcrafted.",
+        composition: "Pattern and repetition \u2014 folk art rhythm and density. Layered compositions with rich visual texture.",
+        motion: "Colorful motion \u2014 elements bounce, pop, and spin into place with joy.",
+        transition: "Swirl Vortex or Ripple Waves (hypnotic, celebratory)",
+        gsapSignature: "back.out(1.6), elastic.out(1, 0.5) \u2014 overshoots feel intentional",
+        avoid: [
+          "Muted or monochrome palettes \u2014 kill the celebration",
+          "Pure flat / minimal compositions \u2014 must feel layered",
+          "Linear easings \u2014 motion should feel joyful"
+        ]
+      },
+      {
+        name: "Shadow Cut",
+        slug: "shadow-cut",
+        designer: "Hans Hillmann",
+        mood: "Dark, cinematic",
+        bestFor: "Security products, dramatic reveals, investigative content, intense launches",
+        palette: ["#0a0a0a", "#3a3a3a", "#ffffff", "#C1121F"],
+        paletteNotes: "Near-monochrome \u2014 deep blacks (#0a0a0a), cold greys (#3a3a3a), stark white + ONE accent (blood red #C1121F or toxic green #39FF14).",
+        typography: "Sharp angular text like film noir title cards. Heavy contrast, no softness.",
+        composition: "Heavy shadow \u2014 elements emerge from darkness. The reveal IS the narrative.",
+        motion: "Slow creeping push-ins, dramatic scale reveals. Silence before the hit matters.",
+        transition: "Domain Warp (dissolves reality before revealing the next scene)",
+        gsapSignature: "power4.in for exits, power3.out for dramatic reveals \u2014 pause before the hit",
+        avoid: [
+          "Bright or saturated palettes \u2014 kill the cinematic mood",
+          "Bouncy easings \u2014 break the tension",
+          "Quick cuts \u2014 let the reveal breathe"
+        ]
+      }
+    ];
+  }
+});
+
 // src/commands/_shared/scene-html-emit.ts
 function esc(text) {
   return text.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
@@ -25799,6 +26070,27 @@ function buildTranscriptTweens(transcript, targetSelector) {
     return `tl.fromTo('${sel}', { opacity: 0, y: 10 }, { opacity: 1, y: 0, duration: 0.18, ease: 'power2.out' }, ${start});`;
   }).join("\n      ");
 }
+function crossfadeTweens(scope, dur) {
+  return `tl.from('${scope}', { opacity: 0, duration: ${SCENE_OVERLAP_SECONDS}, ease: 'power2.out' }, 0);
+      tl.to('${scope}', { opacity: 0, duration: ${SCENE_OVERLAP_SECONDS}, ease: 'power2.in' }, ${(dur - SCENE_OVERLAP_SECONDS).toFixed(2)});`;
+}
+function fitFontSize(text, baseMaxPx, minPx, comfortableChars) {
+  const charCount = text.length;
+  if (charCount <= comfortableChars) return baseMaxPx;
+  const ratio = comfortableChars / charCount;
+  return Math.max(minPx, Math.round(baseMaxPx * ratio));
+}
+function fitKineticFontSize(words) {
+  const totalChars = words.join(" ").length;
+  if (totalChars <= 18) return 180;
+  if (totalChars <= 26) return 140;
+  if (totalChars <= 38) return 110;
+  if (totalChars <= 54) return 90;
+  return 72;
+}
+function kenBurnsTween(scope, dur, endScale = 1.08) {
+  return `tl.fromTo('${scope} .backdrop', { scale: 1.0 }, { scale: ${endScale}, duration: ${dur.toFixed(2)}, ease: 'none' }, 0);`;
+}
 function buildPreset(input) {
   const id = input.id;
   const scope = `[data-composition-id="${id}"]`;
@@ -25835,7 +26127,8 @@ function buildPreset(input) {
       const captionInner = useWordSync ? renderTranscriptSpans(transcript) : esc(captionText);
       const wordCss = useWordSync ? `
       ${scope} .caption .word { display: inline-block; opacity: 0; }` : "";
-      const timeline = useWordSync ? buildTranscriptTweens(transcript, `${scope} .caption .word`) : `tl.from('${scope} .caption', { opacity: 0, y: 28, duration: 0.45, ease: 'power3.out' }, 0.05);`;
+      const captionFontPx = fitFontSize(captionText, 56, 28, 60);
+      const captionTween = useWordSync ? buildTranscriptTweens(transcript, `${scope} .caption .word`) : `tl.from('${scope} .caption', { opacity: 0, y: 28, duration: 0.45, ease: 'power3.out' }, 0.05);`;
       return {
         css: `${scope} {
         position: absolute; inset: 0; width: 100%; height: 100%;
@@ -25843,21 +26136,26 @@ function buildPreset(input) {
         color: #fff; overflow: hidden; background: #000;
       }
       ${backdrop}
+      ${scope} .backdrop { transform-origin: center; }
       ${scope} .caption {
         position: absolute;
         left: 8%; right: 8%; bottom: 12%;
         text-align: center;
-        font-size: 56px;
+        font-size: ${captionFontPx}px;
         font-weight: 700;
         line-height: 1.2;
+        overflow-wrap: break-word;
         text-shadow: 0 4px 20px rgba(0,0,0,0.65);
       }${wordCss}`,
         body: `${backdropMarkup}
     <div class="caption" id="caption">${captionInner}</div>`,
-        timeline
+        timeline: `${crossfadeTweens(scope, dur)}
+      ${kenBurnsTween(scope, dur)}
+      ${captionTween}`
       };
     }
     case "announcement": {
+      const fontSize = fitFontSize(headline, 160, 72, 22);
       return {
         css: `${scope} {
         position: absolute; inset: 0; width: 100%; height: 100%;
@@ -25865,6 +26163,7 @@ function buildPreset(input) {
         color: #fff; overflow: hidden; background: #000;
       }
       ${backdrop}
+      ${scope} .backdrop { transform-origin: center; }
       ${scope} .announce {
         position: absolute; inset: 0;
         display: flex; align-items: center; justify-content: center;
@@ -25873,10 +26172,11 @@ function buildPreset(input) {
       }
       ${scope} .announce h1 {
         margin: 0;
-        font-size: 160px;
+        font-size: ${fontSize}px;
         font-weight: 900;
         letter-spacing: -4px;
-        line-height: 1;
+        line-height: 1.05;
+        overflow-wrap: break-word;
         background: linear-gradient(90deg, #8e2de2, #00c9ff);
         -webkit-background-clip: text; background-clip: text; color: transparent;
         text-shadow: 0 8px 40px rgba(142,45,226,0.35);
@@ -25886,8 +26186,11 @@ function buildPreset(input) {
         // Faster, snappier entrance and no tail fade-out — see the
         // matching note in the `simple` case above. The headline stays
         // on screen until the producer cuts to the next clip; the next
-        // scene's own fade-in handles the visual transition.
-        timeline: `tl.from('${scope} #headline', { opacity: 0, scale: 0.92, duration: 0.55, ease: 'power3.out' }, 0.05);`
+        // scene's own fade-in handles the visual transition. Backdrop
+        // Ken-Burns fills what used to be 80% dead static frame.
+        timeline: `${crossfadeTweens(scope, dur)}
+      ${kenBurnsTween(scope, dur)}
+      tl.from('${scope} #headline', { opacity: 0, scale: 0.92, duration: 0.55, ease: 'power3.out' }, 0.05);`
       };
     }
     case "explainer": {
@@ -25899,6 +26202,7 @@ function buildPreset(input) {
       const wordCss = useWordSync ? `
       ${scope} #subtitle .word { display: inline-block; opacity: 0; }` : "";
       const subtitleTween = useWordSync ? buildTranscriptTweens(transcript, `${scope} #subtitle .word`) : sub ? `tl.from('${scope} #subtitle', { opacity: 0, y: 30, duration: 0.55, ease: 'power3.out' }, 0.55);` : "";
+      const titleFontPx = fitFontSize(headline, 110, 56, 30);
       return {
         css: `${scope} {
         position: absolute; inset: 0; width: 100%; height: 100%;
@@ -25906,6 +26210,7 @@ function buildPreset(input) {
         color: #fff; overflow: hidden; background: #000;
       }
       ${backdrop}
+      ${scope} .backdrop { transform-origin: center; }
       ${scope} .stage {
         position: absolute; inset: 0;
         display: flex; flex-direction: column; justify-content: center;
@@ -25916,11 +26221,13 @@ function buildPreset(input) {
         color: #00c9ff; font-weight: 600;
       }
       ${scope} .title {
-        font-size: 110px; font-weight: 800; letter-spacing: -2px;
+        font-size: ${titleFontPx}px; font-weight: 800; letter-spacing: -2px;
         line-height: 1.05; margin: 0;
+        overflow-wrap: break-word;
       }
       ${scope} .subtitle {
         font-size: 38px; font-weight: 300; color: #c0c0d0; max-width: 80%;
+        overflow-wrap: break-word;
       }${wordCss}`,
         body: `${backdropMarkup}
     <div class="stage">
@@ -25928,7 +26235,9 @@ function buildPreset(input) {
       <h1 class="title" id="title">${esc(headline)}</h1>${sub ? `
       <div class="subtitle" id="subtitle">${subtitleInner}</div>` : ""}
     </div>`,
-        timeline: `tl.from('${scope} #kicker', { opacity: 0, y: 16, duration: 0.4, ease: 'power2.out' }, 0.1);
+        timeline: `${crossfadeTweens(scope, dur)}
+      ${kenBurnsTween(scope, dur)}
+      tl.from('${scope} #kicker', { opacity: 0, y: 16, duration: 0.4, ease: 'power2.out' }, 0.1);
       tl.from('${scope} #title', { opacity: 0, y: 60, duration: 0.7, ease: 'power3.out' }, 0.25);
       ${subtitleTween}`
       };
@@ -25946,6 +26255,7 @@ function buildPreset(input) {
         const start = (0.05 + i * stagger).toFixed(2);
         return `tl.from('${scope} #w-${i}', { opacity: 0, y: 80, scale: 0.8, duration: 0.45, ease: 'back.out(1.8)' }, ${start});`;
       }).join("\n      ");
+      const kineticFontPx = fitKineticFontSize(words);
       return {
         css: `${scope} {
         position: absolute; inset: 0; width: 100%; height: 100%;
@@ -25953,21 +26263,27 @@ function buildPreset(input) {
         color: #fff; overflow: hidden; background: #000;
       }
       ${backdrop}
+      ${scope} .backdrop { transform-origin: center; }
       ${scope} .kinetic {
         position: absolute; inset: 0;
         display: flex; align-items: center; justify-content: center;
+        flex-wrap: wrap; gap: 8px 16px;
         text-align: center; padding: 0 6%;
-        font-size: 180px; font-weight: 900; letter-spacing: -6px;
+        font-size: ${kineticFontPx}px; font-weight: 900; letter-spacing: -6px;
         line-height: 1; text-shadow: 0 6px 30px rgba(0,0,0,0.6);
+        overflow-wrap: break-word;
       }
       ${scope} .kinetic .word { display: inline-block; margin: 0 12px; }`,
         body: `${backdropMarkup}
     <div class="kinetic">${wordSpans}</div>`,
-        timeline: tweens
+        timeline: `${crossfadeTweens(scope, dur)}
+      ${kenBurnsTween(scope, dur)}
+      ${tweens}`
       };
     }
     case "product-shot": {
       const label = kicker || humanise(id);
+      const headlineFontPx = fitFontSize(headline, 72, 40, 50);
       return {
         css: `${scope} {
         position: absolute; inset: 0; width: 100%; height: 100%;
@@ -25985,19 +26301,22 @@ function buildPreset(input) {
       }
       ${scope} .product-headline {
         position: absolute; left: 8%; right: 8%; bottom: 14%;
-        font-size: 72px; font-weight: 800; letter-spacing: -1px;
-        line-height: 1.1; text-shadow: 0 4px 20px rgba(0,0,0,0.7);
+        font-size: ${headlineFontPx}px; font-weight: 800; letter-spacing: -1px;
+        line-height: 1.1; overflow-wrap: break-word;
+        text-shadow: 0 4px 20px rgba(0,0,0,0.7);
       }${subhead ? `
       ${scope} .product-sub {
         position: absolute; left: 8%; right: 8%; bottom: 8%;
         font-size: 28px; font-weight: 400; color: #d0d0e0;
+        overflow-wrap: break-word;
         text-shadow: 0 2px 10px rgba(0,0,0,0.7);
       }` : ""}`,
         body: `${backdropMarkup}
     <div class="label" id="label">${esc(label)}</div>
     <div class="product-headline" id="headline">${esc(headline)}</div>${subhead ? `
     <div class="product-sub" id="subhead">${esc(subhead)}</div>` : ""}`,
-        timeline: `tl.fromTo('${scope} .backdrop', { scale: 1.0 }, { scale: 1.08, duration: ${dur.toFixed(2)}, ease: 'none' }, 0);
+        timeline: `${crossfadeTweens(scope, dur)}
+      tl.fromTo('${scope} .backdrop', { scale: 1.0 }, { scale: 1.12, duration: ${dur.toFixed(2)}, ease: 'none' }, 0);
       tl.from('${scope} #label', { opacity: 0, x: -30, duration: 0.5, ease: 'power3.out' }, 0.2);
       tl.from('${scope} #headline', { opacity: 0, y: 40, duration: 0.6, ease: 'power3.out' }, 0.4);${subhead ? `
       tl.from('${scope} #subhead', { opacity: 0, y: 20, duration: 0.5, ease: 'power3.out' }, 0.65);` : ""}`
@@ -26046,7 +26365,7 @@ ${audioBlock}
 </template>
 `;
 }
-function nextSceneStart(rootHtml) {
+function nextSceneStart(rootHtml, overlap = 0) {
   const clipRegex = /<div\s+class="clip"[^>]*?\sdata-start="([\d.]+)"[^>]*?\sdata-duration="([\d.]+)"/gi;
   let maxEnd = 0;
   let match;
@@ -26054,14 +26373,15 @@ function nextSceneStart(rootHtml) {
     const end = parseFloat(match[1]) + parseFloat(match[2]);
     if (Number.isFinite(end) && end > maxEnd) maxEnd = end;
   }
-  return maxEnd;
+  return Math.max(0, maxEnd - overlap);
 }
 function buildClipReference(opts) {
   const start = Number(opts.start.toFixed(3));
   const duration = Number(opts.duration.toFixed(3));
   const track = opts.trackIndex ?? 1;
   const src = opts.src ?? `compositions/scene-${opts.id}.html`;
-  return `<div class="clip" data-composition-id="${esc(opts.id)}" data-composition-src="${esc(src)}" data-start="${start}" data-duration="${duration}" data-track-index="${track}"></div>`;
+  const zIndex = Math.max(1, 1e6 - Math.floor(start * 1e3));
+  return `<div class="clip" data-composition-id="${esc(opts.id)}" data-composition-src="${esc(src)}" data-start="${start}" data-duration="${duration}" data-track-index="${track}" style="z-index: ${zIndex};"></div>`;
 }
 function insertClipIntoRoot(rootHtml, clip) {
   const clipDiv = buildClipReference(clip);
@@ -26094,7 +26414,7 @@ function readRootDims(rootHtml) {
   if (!widthMatch || !heightMatch) return null;
   return { width: parseInt(widthMatch[1], 10), height: parseInt(heightMatch[1], 10) };
 }
-var SCENE_PRESETS, GSAP_CDN;
+var SCENE_PRESETS, GSAP_CDN, SCENE_OVERLAP_SECONDS;
 var init_scene_html_emit = __esm({
   "src/commands/_shared/scene-html-emit.ts"() {
     "use strict";
@@ -26106,6 +26426,7 @@ var init_scene_html_emit = __esm({
       "product-shot"
     ];
     GSAP_CDN = "https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js";
+    SCENE_OVERLAP_SECONDS = 0.4;
   }
 });
 
@@ -26789,6 +27110,18 @@ function validatePreset(value) {
   }
   return value;
 }
+function validateVisualStyle(value) {
+  const found = getVisualStyle(value);
+  if (!found) {
+    exitWithError(
+      usageError(
+        `Unknown visual style: ${value}`,
+        `Valid: ${visualStyleNames()}. Browse details with \`vibe scene styles\`.`
+      )
+    );
+  }
+  return found;
+}
 async function pathExists2(p) {
   try {
     await access4(p);
@@ -27002,7 +27335,20 @@ async function executeSceneAdd(opts) {
   }
   const cfg = await loadVibeProjectConfig(projectDir);
   const fallback2 = cfg?.defaultSceneDuration ?? 5;
-  const duration = opts.duration ?? narrationDuration ?? fallback2;
+  const NARRATION_TAIL_BUFFER = 0.5;
+  const userDur = opts.duration;
+  const audioMinDur = narrationDuration !== void 0 ? narrationDuration + SCENE_OVERLAP_SECONDS + NARRATION_TAIL_BUFFER : void 0;
+  let duration;
+  if (userDur !== void 0 && audioMinDur !== void 0) {
+    duration = Math.max(userDur, audioMinDur);
+  } else if (audioMinDur !== void 0) {
+    duration = audioMinDur;
+  } else if (userDur !== void 0) {
+    duration = userDur;
+  } else {
+    duration = fallback2;
+  }
+  duration = Number(duration.toFixed(2));
   opts.onProgress?.("Emitting scene HTML...");
   const sceneHtml = emitSceneHtml({
     id,
@@ -27020,8 +27366,10 @@ async function executeSceneAdd(opts) {
   await mkdir4(dirname3(scenePath), { recursive: true });
   await writeFile6(scenePath, sceneHtml, "utf-8");
   opts.onProgress?.("Updating root composition...");
-  const start = nextSceneStart(rootHtmlBefore);
-  const updated = insertClipIntoRoot(rootHtmlBefore, { id, start, duration });
+  const start = nextSceneStart(rootHtmlBefore, SCENE_OVERLAP_SECONDS);
+  const existingClipCount = (rootHtmlBefore.match(/<div\s+class="clip"/g) || []).length;
+  const trackIndex = existingClipCount % 2 + 1;
+  const updated = insertClipIntoRoot(rootHtmlBefore, { id, start, duration, trackIndex });
   await writeFile6(rootPath, updated, "utf-8");
   const transcriptAbsPath = transcriptRelPath ? resolve10(projectDir, transcriptRelPath) : void 0;
   return {
@@ -27080,6 +27428,7 @@ var init_scene = __esm({
     init_dist2();
     init_tts_resolve();
     init_scene_project();
+    init_visual_styles();
     init_scene_html_emit();
     init_scene_lint();
     init_scene_render();
@@ -27104,21 +27453,28 @@ Examples:
 
 A scene project is bilingual: it works with both \`vibe\` and \`npx hyperframes\`.
 Run 'vibe schema scene.<command>' for structured parameter info.`);
-    sceneCommand.command("init").description("Scaffold a new scene project (or safely augment an existing Hyperframes project)").argument("<dir>", "Project directory (created if it doesn't exist)").option("-n, --name <name>", "Project name (defaults to directory basename)").option("-r, --ratio <ratio>", "Aspect ratio: 16:9, 9:16, 1:1, 4:5", "16:9").option("-d, --duration <sec>", "Default root composition duration (seconds)", "10").option("--dry-run", "Preview parameters without writing files").action(async (dir, options) => {
+    sceneCommand.command("init").description("Scaffold a new scene project (or safely augment an existing Hyperframes project)").argument("<dir>", "Project directory (created if it doesn't exist)").option("-n, --name <name>", "Project name (defaults to directory basename)").option("-r, --ratio <ratio>", "Aspect ratio: 16:9, 9:16, 1:1, 4:5", "16:9").option("-d, --duration <sec>", "Default root composition duration (seconds)", "10").option("--visual-style <name>", `Seed DESIGN.md from a named style (browse via \`vibe scene styles\`). E.g. "Swiss Pulse"`).option("--dry-run", "Preview parameters without writing files").action(async (dir, options) => {
       const aspect = validateAspect(options.ratio);
       const duration = validateDuration(options.duration);
       const name = options.name ?? basename4(dir.replace(/\/+$/, ""));
+      const visualStyle = options.visualStyle ? validateVisualStyle(options.visualStyle) : void 0;
       if (options.dryRun) {
         outputResult({
           dryRun: true,
           command: "scene init",
-          params: { dir, name, aspect, duration }
+          params: {
+            dir,
+            name,
+            aspect,
+            duration,
+            visualStyle: visualStyle?.name ?? null
+          }
         });
         return;
       }
       const spinner2 = isJsonMode() ? null : ora(`Scaffolding scene project at ${dir}...`).start();
       try {
-        const result = await scaffoldSceneProject({ dir, name, aspect, duration });
+        const result = await scaffoldSceneProject({ dir, name, aspect, duration, visualStyle });
         if (isJsonMode()) {
           outputResult({
             success: true,
@@ -27127,6 +27483,7 @@ Run 'vibe schema scene.<command>' for structured parameter info.`);
             name,
             aspect,
             duration,
+            visualStyle: visualStyle?.name ?? null,
             created: result.created,
             merged: result.merged,
             skipped: result.skipped
@@ -27143,7 +27500,13 @@ Run 'vibe schema scene.<command>' for structured parameter info.`);
         console.log();
         console.log(source_default.bold.cyan("Next steps"));
         console.log(source_default.dim("\u2500".repeat(60)));
-        console.log(`  ${source_default.cyan("vibe scene add")} <name>    ${source_default.dim("# author a scene via AI")}`);
+        if (visualStyle) {
+          console.log(`  ${source_default.dim("DESIGN.md seeded with")} ${source_default.bold(visualStyle.name)} ${source_default.dim("\u2014 review and customise.")}`);
+        } else {
+          console.log(`  ${source_default.cyan("vibe scene styles")}        ${source_default.dim("# pick a named style for DESIGN.md")}`);
+        }
+        console.log(`  ${source_default.cyan("npx skills add heygen-com/hyperframes")}  ${source_default.dim("# load the cinematic-craft skill set")}`);
+        console.log(`  ${source_default.cyan("vibe scene add")} <name>    ${source_default.dim("# fallback path: 5-preset emit")}`);
         console.log(`  ${source_default.cyan("vibe scene lint")}          ${source_default.dim("# validate HTML")}`);
         console.log(`  ${source_default.cyan("vibe scene render")}        ${source_default.dim("# render to MP4")}`);
       } catch (error) {
@@ -27152,6 +27515,69 @@ Run 'vibe schema scene.<command>' for structured parameter info.`);
         exitWithError(generalError(`Failed to scaffold: ${msg}`));
       }
     });
+    sceneCommand.command("styles").description("List vendored visual styles (or show one) for DESIGN.md seeding").argument("[name]", "Style name to inspect (omit to list all)").action((name) => {
+      if (!name) {
+        const all = listVisualStyles();
+        if (isJsonMode()) {
+          outputResult({
+            success: true,
+            command: "scene styles",
+            count: all.length,
+            styles: all.map((s) => ({
+              name: s.name,
+              slug: s.slug,
+              designer: s.designer,
+              mood: s.mood,
+              bestFor: s.bestFor
+            }))
+          });
+          return;
+        }
+        console.log();
+        console.log(source_default.bold.cyan("Visual styles"));
+        console.log(source_default.dim("\u2500".repeat(60)));
+        for (const s of all) {
+          console.log(
+            `  ${source_default.bold(s.name.padEnd(18))} ${source_default.dim(s.mood.padEnd(24))} ${source_default.dim(s.bestFor)}`
+          );
+        }
+        console.log();
+        console.log(source_default.dim("Show details: "), source_default.cyan('vibe scene styles "<name>"'));
+        console.log(source_default.dim("Seed DESIGN.md:"), source_default.cyan('vibe scene init <dir> --visual-style "<name>"'));
+        return;
+      }
+      const style = getVisualStyle(name);
+      if (!style) {
+        exitWithError(
+          usageError(
+            `Unknown visual style: ${name}`,
+            `Valid: ${visualStyleNames()}.`
+          )
+        );
+        return;
+      }
+      if (isJsonMode()) {
+        outputResult({ success: true, command: "scene styles", style });
+        return;
+      }
+      console.log();
+      console.log(source_default.bold.cyan(style.name), source_default.dim(`\u2014 ${style.designer}`));
+      console.log(source_default.dim("\u2500".repeat(60)));
+      console.log(`${source_default.bold("Mood:")}        ${style.mood}`);
+      console.log(`${source_default.bold("Best for:")}    ${style.bestFor}`);
+      console.log(`${source_default.bold("Palette:")}     ${style.palette.join(", ")}`);
+      console.log(source_default.dim("              ") + style.paletteNotes);
+      console.log(`${source_default.bold("Typography:")}  ${style.typography}`);
+      console.log(`${source_default.bold("Composition:")} ${style.composition}`);
+      console.log(`${source_default.bold("Motion:")}      ${style.motion}`);
+      console.log(`${source_default.bold("GSAP:")}        ${style.gsapSignature}`);
+      console.log(`${source_default.bold("Transition:")}  ${style.transition}`);
+      console.log();
+      console.log(source_default.bold("Avoid:"));
+      for (const a of style.avoid) console.log(`  ${source_default.red("\u2022")} ${a}`);
+      console.log();
+      console.log(source_default.dim("Seed DESIGN.md:"), source_default.cyan(`vibe scene init <dir> --visual-style "${style.name}"`));
+    });
     sceneCommand.command("add").description("Add a new scene to a project: AI narration + image + per-scene HTML").argument("<name>", "Scene name (slugified into the composition id)").option("--style <preset>", `Style preset: ${SCENE_PRESETS.join(", ")}`, "simple").option("--narration <text>", "Narration text (or path to a .txt file). Drives TTS + scene duration.").option("--narration-file <path>", "Existing narration audio file (.wav/.mp3). Skips TTS \u2014 useful with hyperframes tts, Mac say, or other external tools.").option("-d, --duration <sec>", "Explicit scene duration in seconds (overrides narration audio)").option("--visuals <prompt>", "Image prompt \u2014 generates assets/scene-<id>.png via the configured image provider").option("--headline <text>", "Visible headline (defaults to the humanised scene name)").option("--kicker <text>", "Small label above the headline (explainer / product-shot)").option("--insert-into <path>", "Root composition file to update", "index.html").option("--project <dir>", "Project directory", ".").option("--image-provider <name>", "Image provider: gemini, openai", "gemini").option("--tts <provider>", "TTS provider: auto, elevenlabs, kokoro (default auto \u2014 picks ElevenLabs when key set, else Kokoro local)", "auto").option("--voice <id>", "Voice id (ElevenLabs name/id, or Kokoro id like af_heart, am_michael)").option("--no-audio", "Skip TTS even when --narration is provided (useful for tests/agent dry runs)").option("--no-image", "Skip image generation even when --visuals is provided").option("--no-transcribe", "Skip Whisper word-level transcribe step (no transcript-<id>.json emitted)").option("--transcribe-language <code>", "BCP-47 language code passed to Whisper (e.g. en, ko)").option("--force", "Overwrite an existing compositions/scene-<id>.html").option("--dry-run", "Preview parameters without writing files or calling APIs").action(async (name, options) => {
       if (options.style) options.style = validatePreset(options.style);
       if (options.duration !== void 0) options.duration = validateDuration(options.duration);
@@ -28365,16 +28791,16 @@ async function prompt2(question) {
     input,
     output: process.stdout
   });
-  return new Promise((resolve53) => {
+  return new Promise((resolve54) => {
     rl.question(question, (answer) => {
       rl.close();
-      resolve53(answer);
+      resolve54(answer);
     });
   });
 }
 async function promptHidden(question) {
   const input = getTTYInputStream();
-  return new Promise((resolve53) => {
+  return new Promise((resolve54) => {
     process.stdout.write(question);
     let value = "";
     if (typeof input.setRawMode === "function") {
@@ -28386,7 +28812,7 @@ async function promptHidden(question) {
           input.setRawMode(false);
           input.removeListener("data", onData);
           process.stdout.write("\n");
-          resolve53(value);
+          resolve54(value);
         } else if (char === "") {
           input.setRawMode(false);
           process.stdout.write("\n");
@@ -28406,7 +28832,7 @@ async function promptHidden(question) {
       const rl = createInterface2({ input, output: process.stdout });
       rl.question("", (answer) => {
         rl.close();
-        resolve53(answer);
+        resolve54(answer);
       });
     }
   });
@@ -28414,7 +28840,7 @@ async function promptHidden(question) {
 async function promptSelect(_question, options, defaultIndex = 0) {
   const input = getTTYInputStream();
   if (typeof input.setRawMode === "function") {
-    return new Promise((resolve53) => {
+    return new Promise((resolve54) => {
       let selected = defaultIndex;
       const render = () => {
         if (renderCount > 0) {
@@ -28438,7 +28864,7 @@ async function promptSelect(_question, options, defaultIndex = 0) {
           input.setRawMode(false);
           input.removeListener("data", onData);
           process.stdout.write("\n");
-          resolve53(selected);
+          resolve54(selected);
         } else if (char === "") {
           input.setRawMode(false);
           process.stdout.write("\n");
@@ -28455,7 +28881,7 @@ async function promptSelect(_question, options, defaultIndex = 0) {
           input.removeListener("data", onData);
           render();
           process.stdout.write("\n");
-          resolve53(selected);
+          resolve54(selected);
         }
       };
       input.on("data", onData);
@@ -28625,13 +29051,10 @@ var init_subtitle = __esm({
 // src/utils/remotion.ts
 var remotion_exports = {};
 __export(remotion_exports, {
-  compositeOverlay: () => compositeOverlay,
-  compositeWithImage: () => compositeWithImage,
   ensureRemotionInstalled: () => ensureRemotionInstalled,
   generateAnimatedCaptionComponent: () => generateAnimatedCaptionComponent,
   generateCaptionComponent: () => generateCaptionComponent,
   generateTextOverlayComponent: () => generateTextOverlayComponent,
-  renderAndComposite: () => renderAndComposite,
   renderMotion: () => renderMotion,
   renderWithEmbeddedImage: () => renderWithEmbeddedImage,
   renderWithEmbeddedVideo: () => renderWithEmbeddedVideo,
@@ -29379,92 +29802,6 @@ export const ${name} = () => {
 `;
   return { code, name };
 }
-async function compositeOverlay(options) {
-  try {
-    await execSafe("ffmpeg", [
-      "-y",
-      "-i",
-      options.baseVideo,
-      "-i",
-      options.overlayPath,
-      "-filter_complex",
-      "[0:v][1:v]overlay=0:0:shortest=1[out]",
-      "-map",
-      "[out]",
-      "-map",
-      "0:a?",
-      "-c:a",
-      "copy",
-      "-c:v",
-      "libx264",
-      "-crf",
-      "18",
-      "-pix_fmt",
-      "yuv420p",
-      options.outputPath
-    ], { timeout: 3e5 });
-    return { success: true, outputPath: options.outputPath };
-  } catch (error) {
-    const msg = error instanceof Error ? error.message : String(error);
-    return { success: false, error: `FFmpeg composite failed: ${msg}` };
-  }
-}
-async function compositeWithImage(options) {
-  try {
-    const fps = options.fps || 30;
-    await execSafe("ffmpeg", [
-      "-y",
-      "-loop",
-      "1",
-      "-framerate",
-      String(fps),
-      "-i",
-      options.baseImage,
-      "-i",
-      options.overlayPath,
-      "-filter_complex",
-      "[0:v]scale=iw:ih[base];[base][1:v]overlay=0:0:shortest=1[out]",
-      "-map",
-      "[out]",
-      "-c:v",
-      "libx264",
-      "-crf",
-      "18",
-      "-pix_fmt",
-      "yuv420p",
-      "-t",
-      String(options.durationSeconds),
-      options.outputPath
-    ], { timeout: 3e5 });
-    return { success: true, outputPath: options.outputPath };
-  } catch (error) {
-    const msg = error instanceof Error ? error.message : String(error);
-    return { success: false, error: `FFmpeg image composite failed: ${msg}` };
-  }
-}
-async function renderAndComposite(motionOpts, baseVideo, finalOutput) {
-  const renderOpts = {
-    ...motionOpts,
-    transparent: !!baseVideo,
-    outputPath: baseVideo ? motionOpts.outputPath.replace(/\.\w+$/, "_overlay.webm") : motionOpts.outputPath
-  };
-  const renderResult = await renderMotion(renderOpts);
-  if (!renderResult.success || !renderResult.outputPath) {
-    return renderResult;
-  }
-  if (!baseVideo) {
-    return renderResult;
-  }
-  const output = finalOutput || motionOpts.outputPath;
-  const compositeResult = await compositeOverlay({
-    baseVideo,
-    overlayPath: renderResult.outputPath,
-    outputPath: output
-  });
-  await rm(renderResult.outputPath, { force: true }).catch(() => {
-  });
-  return compositeResult;
-}
 var REMOTION_VERSION, REMOTION_CACHE_DIR;
 var init_remotion = __esm({
   "src/utils/remotion.ts"() {
@@ -30822,7 +31159,12 @@ async function executeSegmentsToScenes(opts) {
   const dims = aspectToDims(aspect);
   const preset = opts.scenePreset ?? DEFAULT_PRESET;
   const projectName = opts.projectName ?? basename7(outputDir);
-  const totalDuration = opts.segments.reduce((sum, s) => sum + (s.duration || 0), 0) || 10;
+  const totalDuration = (() => {
+    const sum = opts.segments.reduce((acc, s) => acc + (s.duration || 0), 0);
+    if (sum <= 0) return 10;
+    const joins = Math.max(0, opts.segments.length - 1);
+    return Math.max(0.1, sum - joins * SCENE_OVERLAP_SECONDS);
+  })();
   const baseError = (error) => ({
     success: false,
     outputDir,
@@ -30895,9 +31237,10 @@ async function executeSegmentsToScenes(opts) {
       id,
       start: clipStart,
       duration,
+      trackIndex: i % 2 + 1,
       src: `compositions/${id}.html`
     });
-    clipStart += duration;
+    clipStart += duration - SCENE_OVERLAP_SECONDS;
   }
   await writeFile10(rootAbs, rootHtml, "utf-8");
   let lintResult;
@@ -30957,7 +31300,7 @@ import { readFile as readFile13, writeFile as writeFile11, mkdir as mkdir8, unli
 import { resolve as resolve15, basename as basename8, dirname as dirname6, extname as extname4 } from "node:path";
 import { existsSync as existsSync9 } from "node:fs";
 function sleep(ms) {
-  return new Promise((resolve53) => setTimeout(resolve53, ms));
+  return new Promise((resolve54) => setTimeout(resolve54, ms));
 }
 async function uploadToImgbb(imageBuffer, apiKey) {
   try {
@@ -31322,7 +31665,6 @@ async function executeScriptToVideo(options) {
       outputDir: absOutputDir,
       scenes: segments.length,
       storyboardPath,
-      narrations: [],
       narrationEntries: [],
       images: [],
       videos: [],
@@ -31383,7 +31725,6 @@ async function executeScriptToVideo(options) {
             );
           }
           segment.duration = actualDuration;
-          result.narrations.push(audioPath);
           result.narrationEntries.push({
             path: audioPath,
             duration: actualDuration,
@@ -32366,6 +32707,34 @@ var init_provider_resolver = __esm({
   }
 });
 
+// src/commands/_shared/openai-image.ts
+function resolveOpenAIImageModel(modelAlias) {
+  const isGptImage2 = modelAlias === "2" || modelAlias === "gpt-image-2";
+  return {
+    openaiModel: isGptImage2 ? "gpt-image-2" : void 0,
+    modelLabel: isGptImage2 ? "GPT Image 2" : "GPT Image 1.5"
+  };
+}
+async function executeOpenAIImageGenerate(prompt3, options, ctx) {
+  const provider = new OpenAIImageProvider();
+  await provider.initialize({ apiKey: ctx.apiKey });
+  const { openaiModel, modelLabel } = resolveOpenAIImageModel(options.model);
+  const result = await provider.generateImage(prompt3, {
+    model: openaiModel,
+    size: options.size,
+    quality: options.quality,
+    style: options.style,
+    n: options.count !== void 0 ? parseInt(options.count, 10) : void 0
+  });
+  return { result, openaiModel, modelLabel };
+}
+var init_openai_image2 = __esm({
+  "src/commands/_shared/openai-image.ts"() {
+    "use strict";
+    init_dist2();
+  }
+});
+
 // src/commands/ai-image.ts
 var ai_image_exports = {};
 __export(ai_image_exports, {
@@ -32418,22 +32787,11 @@ function _registerImageCommands(aiCommand) {
       }
       const spinner2 = ora(`Generating image with ${providerName}...`).start();
       if (provider === "dalle" || provider === "openai") {
-        const openaiImage = new OpenAIImageProvider();
-        await openaiImage.initialize({ apiKey });
-        const modelAlias = options.model;
-        const openaiModel = modelAlias === "2" || modelAlias === "gpt-image-2" ? "gpt-image-2" : void 0;
-        const result = await openaiImage.generateImage(prompt3, {
-          model: openaiModel,
-          size: options.size,
-          quality: options.quality,
-          style: options.style,
-          n: parseInt(options.count)
-        });
+        const { result, modelLabel } = await executeOpenAIImageGenerate(prompt3, options, { apiKey });
         if (!result.success || !result.images) {
           spinner2.fail("Image generation failed");
           exitWithError(apiError(result.error || "Image generation failed", true));
         }
-        const modelLabel = openaiModel === "gpt-image-2" ? "GPT Image 2" : "GPT Image 1.5";
         spinner2.succeed(source_default.green(`Generated ${result.images.length} image(s) with OpenAI ${modelLabel}`));
         console.log();
         console.log(source_default.bold.cyan("Generated Images"));
@@ -33120,6 +33478,7 @@ var init_ai_image = __esm({
     init_exec_safe();
     init_output();
     init_validate();
+    init_openai_image2();
   }
 });
 
@@ -33560,6 +33919,7 @@ var init_generate = __esm({
     init_provider_resolver();
     init_ai_image();
     init_ai_motion();
+    init_openai_image2();
     generateCommand = new Command("generate").alias("gen").description(
       "Generate assets using AI (images, videos, speech, music, motion)"
     ).addHelpText(
@@ -33659,22 +34019,11 @@ Examples:
         const apiKey = await requireApiKey(envKey, providerName, options.apiKey);
         const spinner2 = ora(`Generating image with ${providerName}...`).start();
         if (provider === "dalle" || provider === "openai") {
-          const openaiImage = new OpenAIImageProvider();
-          await openaiImage.initialize({ apiKey });
-          const modelAlias = options.model;
-          const openaiModel = modelAlias === "2" || modelAlias === "gpt-image-2" ? "gpt-image-2" : void 0;
-          const result = await openaiImage.generateImage(prompt3, {
-            model: openaiModel,
-            size: options.size,
-            quality: options.quality,
-            style: options.style,
-            n: parseInt(options.count)
-          });
+          const { result, modelLabel } = await executeOpenAIImageGenerate(prompt3, options, { apiKey });
           if (!result.success || !result.images) {
             spinner2.fail(result.error || "Image generation failed");
             exitWithError(apiError(result.error || "Image generation failed", true));
           }
-          const modelLabel = openaiModel === "gpt-image-2" ? "GPT Image 2" : "GPT Image 1.5";
           spinner2.succeed(source_default.green(`Generated ${result.images.length} image(s) with OpenAI ${modelLabel}`));
           if (isJsonMode()) {
             const outputPath = options.output ? resolve18(process.cwd(), options.output) : void 0;
@@ -48740,7 +49089,7 @@ function buildFFmpegArgs(clips, sources, presetSettings, outputPath, options, so
   return args;
 }
 function runFFmpegProcess(ffmpegPath, args, onProgress) {
-  return new Promise((resolve53, reject) => {
+  return new Promise((resolve54, reject) => {
     const ffmpeg = spawn(ffmpegPath, args, {
       stdio: ["pipe", "pipe", "pipe"]
     });
@@ -48764,7 +49113,7 @@ function runFFmpegProcess(ffmpegPath, args, onProgress) {
     });
     ffmpeg.on("close", (code) => {
       if (code === 0) {
-        resolve53();
+        resolve54();
       } else {
         const errorMatch = stderr.match(/Error.*$/m);
         const errorMsg = errorMatch ? errorMatch[0] : `FFmpeg exited with code ${code}`;
@@ -48900,17 +49249,17 @@ function getPresetSettings(preset, aspectRatio) {
 }
 async function runHyperframesExport(projectPath, options, spinner2) {
   spinner2.text = "Loading project...";
-  const { readFile: readFile43 } = await import("node:fs/promises");
-  const { resolve: resolve53, basename: basename28 } = await import("node:path");
+  const { readFile: readFile44 } = await import("node:fs/promises");
+  const { resolve: resolve54, basename: basename28 } = await import("node:path");
   const { Project: Project2 } = await Promise.resolve().then(() => (init_engine(), engine_exports));
   const { createHyperframesBackend: createHyperframesBackend2 } = await Promise.resolve().then(() => (init_hyperframes(), hyperframes_exports));
   const { exitWithError: exitWithError2, generalError: generalError2, outputResult: outputResult2 } = await Promise.resolve().then(() => (init_output(), output_exports));
   const chalk2 = (await Promise.resolve().then(() => (init_source(), source_exports))).default;
-  const filePath = resolve53(process.cwd(), projectPath);
-  const content = await readFile43(filePath, "utf-8");
+  const filePath = resolve54(process.cwd(), projectPath);
+  const content = await readFile44(filePath, "utf-8");
   const project = Project2.fromJSON(JSON.parse(content));
   const state = project.getState();
-  const outputPath = options.output ? resolve53(process.cwd(), options.output) : resolve53(process.cwd(), `${basename28(projectPath, ".vibe.json")}.${options.format ?? "mp4"}`);
+  const outputPath = options.output ? resolve54(process.cwd(), options.output) : resolve54(process.cwd(), `${basename28(projectPath, ".vibe.json")}.${options.format ?? "mp4"}`);
   const quality = ["draft", "standard", "high"].includes(options.preset ?? "") ? options.preset : "standard";
   const backend = createHyperframesBackend2();
   spinner2.text = "Rendering with Hyperframes...";
@@ -51439,6 +51788,1295 @@ var init_ai_audio = __esm({
   }
 });
 
+// src/commands/_shared/hf-skill-bundle/bundle-content.ts
+var SKILL_MD, HOUSE_STYLE_MD, MOTION_PRINCIPLES_MD, TYPOGRAPHY_MD, TRANSITIONS_MD;
+var init_bundle_content = __esm({
+  "src/commands/_shared/hf-skill-bundle/bundle-content.ts"() {
+    "use strict";
+    SKILL_MD = `---
+name: hyperframes
+description: Create video compositions, animations, title cards, overlays, captions, voiceovers, audio-reactive visuals, and scene transitions in HyperFrames HTML. Use when asked to build any HTML-based video content, add captions or subtitles synced to audio, generate text-to-speech narration, create audio-reactive animation (beat sync, glow, pulse driven by music), add animated text highlighting (marker sweeps, hand-drawn circles, burst lines, scribble, sketchout), or add transitions between scenes (crossfades, wipes, reveals, shader transitions). Covers composition authoring, timing, media, and the full video production workflow. For CLI commands (init, lint, preview, render, transcribe, tts) see the hyperframes-cli skill.
+---
+
+# HyperFrames
+
+HTML is the source of truth for video. A composition is an HTML file with \`data-*\` attributes for timing, a GSAP timeline for animation, and CSS for appearance. The framework handles clip visibility, media playback, and timeline sync.
+
+## Approach
+
+Before writing HTML, think at a high level:
+
+1. **What** \u2014 what should the viewer experience? Identify the narrative arc, key moments, and emotional beats.
+2. **Structure** \u2014 how many compositions, which are sub-compositions vs inline, what tracks carry what (video, audio, overlays, captions).
+3. **Timing** \u2014 which clips drive the duration, where do transitions land, what's the pacing.
+4. **Layout** \u2014 build the end-state first. See "Layout Before Animation" below.
+5. **Animate** \u2014 then add motion using the rules below.
+
+For small edits (fix a color, adjust timing, add one element), skip straight to the rules.
+
+### Visual Identity Gate
+
+<HARD-GATE>
+Before writing ANY composition HTML, you MUST have a visual identity defined. Do NOT write compositions with default or generic colors.
+
+Check in this order:
+
+1. **DESIGN.md exists in the project?** \u2192 Read it. Use its exact colors, fonts, motion rules, and "What NOT to Do" constraints.
+2. **visual-style.md exists?** \u2192 Read it. Apply its \`style_prompt_full\` and structured fields. (Note: \`visual-style.md\` is a project-specific file. \`visual-styles.md\` is the style library with 8 named presets \u2014 different files.)
+3. **User named a style** (e.g., "Swiss Pulse", "dark and techy", "luxury brand")? \u2192 Read [visual-styles.md](./visual-styles.md) for the 8 named presets. Generate a minimal DESIGN.md with: \`## Style Prompt\` (one paragraph), \`## Colors\` (3-5 hex values with roles), \`## Typography\` (1-2 font families), \`## What NOT to Do\` (3-5 anti-patterns).
+4. **None of the above?** \u2192 Ask 3 questions before writing any HTML:
+   - What's the mood? (explosive / cinematic / fluid / technical / chaotic / warm)
+   - Light or dark canvas?
+   - Any specific brand colors, fonts, or visual references?
+     Then generate a minimal DESIGN.md from the answers.
+
+Every composition must trace its palette and typography back to a DESIGN.md, visual-style.md, or explicit user direction. If you're reaching for \`#333\`, \`#3b82f6\`, or \`Roboto\` \u2014 you skipped this step.
+</HARD-GATE>
+
+For motion defaults, sizing, entrance patterns, and easing \u2014 follow [house-style.md](./house-style.md). The house style handles HOW things move. The DESIGN.md handles WHAT things look like.
+
+## Layout Before Animation
+
+Position every element where it should be at its **most visible moment** \u2014 the frame where it's fully entered, correctly placed, and not yet exiting. Write this as static HTML+CSS first. No GSAP yet.
+
+**Why this matters:** If you position elements at their animated start state (offscreen, scaled to 0, opacity 0) and tween them to where you think they should land, you're guessing the final layout. Overlaps are invisible until the video renders. By building the end state first, you can see and fix layout problems before adding any motion.
+
+### The process
+
+1. **Identify the hero frame** for each scene \u2014 the moment when the most elements are simultaneously visible. This is the layout you build.
+2. **Write static CSS** for that frame. The \`.scene-content\` container MUST fill the full scene using \`width: 100%; height: 100%; padding: Npx;\` with \`display: flex; flex-direction: column; gap: Npx; box-sizing: border-box\`. Use padding to push content inward \u2014 NEVER \`position: absolute; top: Npx\` on a content container. Absolute-positioned content containers overflow when content is taller than the remaining space. Reserve \`position: absolute\` for decoratives only.
+3. **Add entrances with \`gsap.from()\`** \u2014 animate FROM offscreen/invisible TO the CSS position. The CSS position is the ground truth; the tween describes the journey to get there.
+4. **Add exits with \`gsap.to()\`** \u2014 animate TO offscreen/invisible FROM the CSS position.
+
+### Example
+
+\`\`\`css
+/* scene-content fills the scene, padding positions content */
+.scene-content {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  padding: 120px 160px;
+  gap: 24px;
+  box-sizing: border-box;
+}
+.title {
+  font-size: 120px;
+}
+.subtitle {
+  font-size: 42px;
+}
+/* Container fills any scene size (1920x1080, 1080x1920, etc).
+   Padding positions content. Flex + gap handles spacing. */
+\`\`\`
+
+**WRONG \u2014 hardcoded dimensions and absolute positioning:**
+
+\`\`\`css
+.scene-content {
+  position: absolute;
+  top: 200px;
+  left: 160px;
+  width: 1920px;
+  height: 1080px;
+  display: flex; /* ... */
+}
+\`\`\`
+
+\`\`\`js
+// Step 3: Animate INTO those positions
+tl.from(".title", { y: 60, opacity: 0, duration: 0.6, ease: "power3.out" }, 0);
+tl.from(".subtitle", { y: 40, opacity: 0, duration: 0.5, ease: "power3.out" }, 0.2);
+tl.from(".logo", { scale: 0.8, opacity: 0, duration: 0.4, ease: "power2.out" }, 0.3);
+
+// Step 4: Animate OUT from those positions
+tl.to(".title", { y: -40, opacity: 0, duration: 0.4, ease: "power2.in" }, 3);
+tl.to(".subtitle", { y: -30, opacity: 0, duration: 0.3, ease: "power2.in" }, 3.1);
+tl.to(".logo", { scale: 0.9, opacity: 0, duration: 0.3, ease: "power2.in" }, 3.2);
+\`\`\`
+
+### When elements share space across time
+
+If element A exits before element B enters in the same area, both should have correct CSS positions for their respective hero frames. The timeline ordering guarantees they never visually coexist \u2014 but if you skip the layout step, you won't catch the case where they accidentally overlap due to a timing error.
+
+### What counts as intentional overlap
+
+Layered effects (glow behind text, shadow elements, background patterns) and z-stacked designs (card stacks, depth layers) are intentional. The layout step is about catching **unintentional** overlap \u2014 two headlines landing on top of each other, a stat covering a label, content bleeding off-frame.
+
+## Data Attributes
+
+### All Clips
+
+| Attribute          | Required                          | Values                                                 |
+| ------------------ | --------------------------------- | ------------------------------------------------------ |
+| \`id\`               | Yes                               | Unique identifier                                      |
+| \`data-start\`       | Yes                               | Seconds or clip ID reference (\`"el-1"\`, \`"intro + 2"\`) |
+| \`data-duration\`    | Required for img/div/compositions | Seconds. Video/audio defaults to media duration.       |
+| \`data-track-index\` | Yes                               | Integer. Same-track clips cannot overlap.              |
+| \`data-media-start\` | No                                | Trim offset into source (seconds)                      |
+| \`data-volume\`      | No                                | 0-1 (default 1)                                        |
+
+\`data-track-index\` does **not** affect visual layering \u2014 use CSS \`z-index\`.
+
+### Composition Clips
+
+| Attribute                    | Required | Values                                       |
+| ---------------------------- | -------- | -------------------------------------------- |
+| \`data-composition-id\`        | Yes      | Unique composition ID                        |
+| \`data-start\`                 | Yes      | Start time (root composition: use \`"0"\`)     |
+| \`data-duration\`              | Yes      | Takes precedence over GSAP timeline duration |
+| \`data-width\` / \`data-height\` | Yes      | Pixel dimensions (1920x1080 or 1080x1920)    |
+| \`data-composition-src\`       | No       | Path to external HTML file                   |
+
+## Composition Structure
+
+Sub-compositions loaded via \`data-composition-src\` use a \`<template>\` wrapper. **Standalone compositions (the main index.html) do NOT use \`<template>\`** \u2014 they put the \`data-composition-id\` div directly in \`<body>\`. Using \`<template>\` on a standalone file hides all content from the browser and breaks rendering.
+
+Sub-composition structure:
+
+\`\`\`html
+<template id="my-comp-template">
+  <div data-composition-id="my-comp" data-width="1920" data-height="1080">
+    <!-- content -->
+    <style>
+      [data-composition-id="my-comp"] {
+        /* scoped styles */
+      }
+    </style>
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+      const tl = gsap.timeline({ paused: true });
+      // tweens...
+      window.__timelines["my-comp"] = tl;
+    </script>
+  </div>
+</template>
+\`\`\`
+
+Load in root: \`<div id="el-1" data-composition-id="my-comp" data-composition-src="compositions/my-comp.html" data-start="0" data-duration="10" data-track-index="1"></div>\`
+
+## Video and Audio
+
+Video must be \`muted playsinline\`. Audio is always a separate \`<audio>\` element:
+
+\`\`\`html
+<video
+  id="el-v"
+  data-start="0"
+  data-duration="30"
+  data-track-index="0"
+  src="video.mp4"
+  muted
+  playsinline
+></video>
+<audio
+  id="el-a"
+  data-start="0"
+  data-duration="30"
+  data-track-index="2"
+  src="video.mp4"
+  data-volume="1"
+></audio>
+\`\`\`
+
+## Timeline Contract
+
+- All timelines start \`{ paused: true }\` \u2014 the player controls playback
+- Register every timeline: \`window.__timelines["<composition-id>"] = tl\`
+- Framework auto-nests sub-timelines \u2014 do NOT manually add them
+- Duration comes from \`data-duration\`, not from GSAP timeline length
+- Never create empty tweens to set duration
+
+## Rules (Non-Negotiable)
+
+**Deterministic:** No \`Math.random()\`, \`Date.now()\`, or time-based logic. Use a seeded PRNG if you need pseudo-random values (e.g. mulberry32).
+
+**GSAP:** Only animate visual properties (\`opacity\`, \`x\`, \`y\`, \`scale\`, \`rotation\`, \`color\`, \`backgroundColor\`, \`borderRadius\`, transforms). Do NOT animate \`visibility\`, \`display\`, or call \`video.play()\`/\`audio.play()\`.
+
+**Animation conflicts:** Never animate the same property on the same element from multiple timelines simultaneously.
+
+**No \`repeat: -1\`:** Infinite-repeat timelines break the capture engine. Calculate the exact repeat count from composition duration: \`repeat: Math.ceil(duration / cycleDuration) - 1\`.
+
+**Synchronous timeline construction:** Never build timelines inside \`async\`/\`await\`, \`setTimeout\`, or Promises. The capture engine reads \`window.__timelines\` synchronously after page load. Fonts are embedded by the compiler, so they're available immediately \u2014 no need to wait for font loading.
+
+**Never do:**
+
+1. Forget \`window.__timelines\` registration
+2. Use video for audio \u2014 always muted video + separate \`<audio>\`
+3. Nest video inside a timed div \u2014 use a non-timed wrapper
+4. Use \`data-layer\` (use \`data-track-index\`) or \`data-end\` (use \`data-duration\`)
+5. Animate video element dimensions \u2014 animate a wrapper div
+6. Call play/pause/seek on media \u2014 framework owns playback
+7. Create a top-level container without \`data-composition-id\`
+8. Use \`repeat: -1\` on any timeline or tween \u2014 always finite repeats
+9. Build timelines asynchronously (inside \`async\`, \`setTimeout\`, \`Promise\`)
+10. Use \`gsap.set()\` on clip elements from later scenes \u2014 they don't exist in the DOM at page load. Use \`tl.set(selector, vars, timePosition)\` inside the timeline at or after the clip's \`data-start\` time instead.
+11. Use \`<br>\` in content text \u2014 forced line breaks don't account for actual rendered font width. Text that wraps naturally + a \`<br>\` produces an extra unwanted break, causing overlap. Let text wrap via \`max-width\` instead. Exception: short display titles where each word is deliberately on its own line (e.g., "THE\\nIMMORTAL\\nGAME" at 130px).
+
+## Scene Transitions (Non-Negotiable)
+
+Every multi-scene composition MUST follow ALL of these rules. Violating any one of them is a broken composition.
+
+1. **ALWAYS use transitions between scenes.** No jump cuts. No exceptions.
+2. **ALWAYS use entrance animations on every scene.** Every element animates IN via \`gsap.from()\`. No element may appear fully-formed. If a scene has 5 elements, it needs 5 entrance tweens.
+3. **NEVER use exit animations** except on the final scene. This means: NO \`gsap.to()\` that animates opacity to 0, y offscreen, scale to 0, or any other "out" animation before a transition fires. The transition IS the exit. The outgoing scene's content MUST be fully visible at the moment the transition starts.
+4. **Final scene only:** The last scene may fade elements out (e.g., fade to black). This is the ONLY scene where \`gsap.to(..., { opacity: 0 })\` is allowed.
+
+**WRONG \u2014 exit animation before transition:**
+
+\`\`\`js
+// BANNED \u2014 this empties the scene before the transition can use it
+tl.to("#s1-title", { opacity: 0, y: -40, duration: 0.4 }, 6.5);
+tl.to("#s1-subtitle", { opacity: 0, duration: 0.3 }, 6.7);
+// transition fires on empty frame
+\`\`\`
+
+**RIGHT \u2014 entrance only, transition handles exit:**
+
+\`\`\`js
+// Scene 1 entrance animations
+tl.from("#s1-title", { y: 50, opacity: 0, duration: 0.7, ease: "power3.out" }, 0.3);
+tl.from("#s1-subtitle", { y: 30, opacity: 0, duration: 0.5, ease: "power2.out" }, 0.6);
+// NO exit tweens \u2014 transition at 7.2s handles the scene change
+// Scene 2 entrance animations
+tl.from("#s2-heading", { x: -40, opacity: 0, duration: 0.6, ease: "expo.out" }, 8.0);
+\`\`\`
+
+## Animation Guardrails
+
+- Offset first animation 0.1-0.3s (not t=0)
+- Vary eases across entrance tweens \u2014 use at least 3 different eases per scene
+- Don't repeat an entrance pattern within a scene
+- Avoid full-screen linear gradients on dark backgrounds (H.264 banding \u2014 use radial or solid + localized glow)
+- 60px+ headlines, 20px+ body, 16px+ data labels for rendered video
+- \`font-variant-numeric: tabular-nums\` on number columns
+
+When no \`visual-style.md\` or animation direction is provided, follow [house-style.md](./house-style.md) for aesthetic defaults.
+
+## Typography and Assets
+
+- **Fonts:** Just write the \`font-family\` you want in CSS \u2014 the compiler embeds supported fonts automatically. If a font isn't supported, the compiler warns.
+- Add \`crossorigin="anonymous"\` to external media
+- For dynamic text overflow, use \`window.__hyperframes.fitTextFontSize(text, { maxWidth, fontFamily, fontWeight })\`
+- All files live at the project root alongside \`index.html\`; sub-compositions use \`../\`
+
+## Editing Existing Compositions
+
+- Read the full composition first \u2014 match existing fonts, colors, animation patterns
+- Only change what was requested
+- Preserve timing of unrelated clips
+
+## Output Checklist
+
+- [ ] \`npx hyperframes lint\` and \`npx hyperframes validate\` both pass
+- [ ] \`npx hyperframes inspect\` passes, or every reported overflow is intentionally marked
+- [ ] Contrast warnings addressed (see Quality Checks below)
+- [ ] Layout issues addressed (see Quality Checks below)
+- [ ] Animation choreography verified (see Quality Checks below)
+
+## Quality Checks
+
+### Visual Inspect
+
+\`hyperframes inspect\` runs the composition in headless Chrome, seeks through the timeline, and maps visual layout issues with timestamps, selectors, bounding boxes, and fix hints. Run it after \`lint\` and \`validate\`:
+
+\`\`\`bash
+npx hyperframes inspect
+npx hyperframes inspect --json
+\`\`\`
+
+Failures usually mean text is spilling out of a bubble/card, a fixed-size label is clipping dynamic copy, or text has moved off the canvas. Fix by increasing container size or padding, reducing font size or letter spacing, adding a real \`max-width\` so text wraps inside the container, or using \`window.__hyperframes.fitTextFontSize(...)\` for dynamic copy.
+
+Use \`--samples 15\` for dense videos and \`--at 1.5,4,7.25\` for specific hero frames. Repeated static issues are collapsed by default to avoid flooding agent context. If overflow is intentional for an entrance/exit animation, mark the element or ancestor with \`data-layout-allow-overflow\`. If a decorative element should never be audited, mark it with \`data-layout-ignore\`.
+
+\`hyperframes layout\` is the compatibility alias for the same check.
+
+### Contrast
+
+\`hyperframes validate\` runs a WCAG contrast audit by default. It seeks to 5 timestamps, screenshots the page, samples background pixels behind every text element, and computes contrast ratios. Failures appear as warnings:
+
+\`\`\`
+\u26A0 WCAG AA contrast warnings (3):
+  \xB7 .subtitle "secondary text" \u2014 2.67:1 (need 4.5:1, t=5.3s)
+\`\`\`
+
+If warnings appear:
+
+- On dark backgrounds: brighten the failing color until it clears 4.5:1 (normal text) or 3:1 (large text, 24px+ or 19px+ bold)
+- On light backgrounds: darken it
+- Stay within the palette family \u2014 don't invent a new color, adjust the existing one
+- Re-run \`hyperframes validate\` until clean
+
+Use \`--no-contrast\` to skip if iterating rapidly and you'll check later.
+
+### Animation Map
+
+After authoring animations, run the animation map to verify choreography:
+
+\`\`\`bash
+node skills/hyperframes/scripts/animation-map.mjs <composition-dir> \\
+  --out <composition-dir>/.hyperframes/anim-map
+\`\`\`
+
+Outputs a single \`animation-map.json\` with:
+
+- **Per-tween summaries**: \`"#card1 animates opacity+y over 0.50s. moves 23px up. fades in. ends at (120, 200)"\`
+- **ASCII timeline**: Gantt chart of all tweens across the composition duration
+- **Stagger detection**: reports actual intervals (\`"3 elements stagger at 120ms"\`)
+- **Dead zones**: periods over 1s with no animation \u2014 intentional hold or missing entrance?
+- **Element lifecycles**: first/last animation time, final visibility
+- **Scene snapshots**: visible element state at 5 key timestamps
+- **Flags**: \`offscreen\`, \`collision\`, \`invisible\`, \`paced-fast\` (under 0.2s), \`paced-slow\` (over 2s)
+
+Read the JSON. Scan summaries for anything unexpected. Check every flag \u2014 fix or justify. Verify the timeline shows the intended choreography rhythm. Re-run after fixes.
+
+Skip on small edits (fixing a color, adjusting one duration). Run on new compositions and significant animation changes.
+
+---
+
+## References (loaded on demand)
+
+- **[references/captions.md](references/captions.md)** \u2014 Captions, subtitles, lyrics, karaoke synced to audio. Tone-adaptive style detection, per-word styling, text overflow prevention, caption exit guarantees, word grouping. Read when adding any text synced to audio timing.
+- **[references/tts.md](references/tts.md)** \u2014 Text-to-speech with Kokoro-82M. Voice selection, speed tuning, TTS+captions workflow. Read when generating narration or voiceover.
+- **[references/audio-reactive.md](references/audio-reactive.md)** \u2014 Audio-reactive animation: map frequency bands and amplitude to GSAP properties. Read when visuals should respond to music, voice, or sound.
+- **[references/css-patterns.md](references/css-patterns.md)** \u2014 CSS+GSAP marker highlighting: highlight, circle, burst, scribble, sketchout. Deterministic, fully seekable. Read when adding visual emphasis to text.
+- **[references/typography.md](references/typography.md)** \u2014 Typography: font pairing, OpenType features, dark-background adjustments, font discovery script. **Always read** \u2014 every composition has text.
+- **[references/motion-principles.md](references/motion-principles.md)** \u2014 Motion design principles: easing as emotion, timing as weight, choreography as hierarchy, scene pacing, ambient motion, anti-patterns. Read when choreographing GSAP animations.
+- **[visual-styles.md](visual-styles.md)** \u2014 8 named visual styles (Swiss Pulse, Velvet Standard, Deconstructed, Maximalist Type, Data Drift, Soft Signal, Folk Frequency, Shadow Cut) with hex palettes, GSAP easing signatures, and shader pairings. Read when user names a style or when generating DESIGN.md.
+- **[house-style.md](house-style.md)** \u2014 Default motion, sizing, and color palettes when no style is specified.
+- **[patterns.md](patterns.md)** \u2014 PiP, title cards, slide show patterns.
+- **[data-in-motion.md](data-in-motion.md)** \u2014 Data, stats, and infographic patterns.
+- **[references/transcript-guide.md](references/transcript-guide.md)** \u2014 Transcription commands, whisper models, external APIs, troubleshooting.
+- **[references/dynamic-techniques.md](references/dynamic-techniques.md)** \u2014 Dynamic caption animation techniques (karaoke, clip-path, slam, scatter, elastic, 3D).
+
+- **[references/transitions.md](references/transitions.md)** \u2014 Scene transitions: crossfades, wipes, reveals, shader transitions. Energy/mood selection, CSS vs WebGL guidance. **Always read for multi-scene compositions** \u2014 scenes without transitions feel like jump cuts.
+  - [transitions/catalog.md](references/transitions/catalog.md) \u2014 Hard rules, scene template, and routing to per-type implementation code.
+  - Shader transitions are in \`@hyperframes/shader-transitions\` (\`packages/shader-transitions/\`) \u2014 read package source, not skill files.
+
+GSAP patterns and effects are in the \`/gsap\` skill.
+`;
+    HOUSE_STYLE_MD = `# House Style
+
+Creative direction for compositions when no \`visual-style.md\` is provided. These are starting points \u2014 override anything that doesn't serve the content.
+
+## Before Writing HTML
+
+1. **Interpret the prompt.** Generate real content. A recipe lists real ingredients. A HUD has real readouts.
+2. **Pick a palette.** Light or dark? Declare bg, fg, accent before writing code.
+3. **Pick typefaces.** Run the font discovery script in [references/typography.md](references/typography.md) \u2014 or pick a font you already know that fits the theme. The script broadens your options; it's not the only source.
+
+## Lazy Defaults to Question
+
+These patterns are AI design tells \u2014 the first thing every LLM reaches for. If you're about to use one, pause and ask: is this a deliberate choice for THIS content, or am I defaulting?
+
+- Gradient text (\`background-clip: text\` + gradient)
+- Left-edge accent stripes on cards/callouts
+- Cyan-on-dark / purple-to-blue gradients / neon accents
+- Pure \`#000\` or \`#fff\` (tint toward your accent hue instead)
+- Identical card grids (same-size cards repeated)
+- Everything centered with equal weight (lead the eye somewhere)
+- Banned fonts (see [references/typography.md](references/typography.md) for full list)
+
+If the content genuinely calls for one of these \u2014 centered layout for a solemn closing, cards for a real product UI mockup, a banned font because it's the perfect thematic match \u2014 use it. The goal is intentionality, not avoidance.
+
+## Color
+
+- Match light/dark to content: food, wellness, kids \u2192 light. Tech, cinema, finance \u2192 dark.
+- One accent hue. Same background across all scenes.
+- Tint neutrals toward your accent (even subtle warmth/coolness beats dead gray).
+- **Contrast:** enforced by \`hyperframes validate\` (WCAG AA). Text must be readable with decoratives removed.
+- Declare palette up front. Don't invent colors per-element.
+
+## Background Layer
+
+Every scene needs visual depth \u2014 persistent decorative elements that stay visible while content animates in. Without these, scenes feel empty during entrance staggering.
+
+Ideas (mix and match, 2-5 per scene):
+
+- Radial glows (accent-tinted, low opacity, breathing scale)
+- Ghost text (theme words at 3-8% opacity, very large, slow drift)
+- Accent lines (hairline rules, subtle pulse)
+- Grain/noise overlay, geometric shapes, grid patterns
+- Thematic decoratives (orbit rings for space, vinyl grooves for music, grid lines for data)
+
+All decoratives should have slow ambient GSAP animation \u2014 breathing, drift, pulse. Static decoratives feel dead.
+
+## Motion
+
+See [references/motion-principles.md](references/motion-principles.md) for full rules. Quick: 0.3\u20130.6s, vary eases, combine transforms on entrances, overlap entries.
+
+## Typography
+
+See [references/typography.md](references/typography.md) for full rules. Quick: 700-900 headlines / 300-400 body, serif + sans (not two sans), 60px+ headlines / 20px+ body.
+
+## Palettes
+
+Declare one background, one foreground, one accent before writing HTML.
+
+| Category          | Use for                                       | File                                                       |
+| ----------------- | --------------------------------------------- | ---------------------------------------------------------- |
+| Bold / Energetic  | Product launches, social media, announcements | [palettes/bold-energetic.md](palettes/bold-energetic.md)   |
+| Warm / Editorial  | Storytelling, documentaries, case studies     | [palettes/warm-editorial.md](palettes/warm-editorial.md)   |
+| Dark / Premium    | Tech, finance, luxury, cinematic              | [palettes/dark-premium.md](palettes/dark-premium.md)       |
+| Clean / Corporate | Explainers, tutorials, presentations          | [palettes/clean-corporate.md](palettes/clean-corporate.md) |
+| Nature / Earth    | Sustainability, outdoor, organic              | [palettes/nature-earth.md](palettes/nature-earth.md)       |
+| Neon / Electric   | Gaming, tech, nightlife                       | [palettes/neon-electric.md](palettes/neon-electric.md)     |
+| Pastel / Soft     | Fashion, beauty, lifestyle, wellness          | [palettes/pastel-soft.md](palettes/pastel-soft.md)         |
+| Jewel / Rich      | Luxury, events, sophisticated                 | [palettes/jewel-rich.md](palettes/jewel-rich.md)           |
+| Monochrome        | Dramatic, typography-focused                  | [palettes/monochrome.md](palettes/monochrome.md)           |
+
+Or derive from OKLCH \u2014 pick a hue, build bg/fg/accent at different lightnesses, tint everything toward that hue.
+`;
+    MOTION_PRINCIPLES_MD = `# Motion Principles
+
+## Guardrails
+
+You know these rules but you violate them. Stop.
+
+- **Don't use the same ease on every tween.** You default to \`power2.out\` on everything. Vary eases like you vary font weights \u2014 no more than 2 independent tweens with the same ease in a scene.
+- **Don't use the same speed on everything.** You default to 0.4-0.5s for everything. The slowest scene should be 3\xD7 slower than the fastest. Vary duration deliberately.
+- **Don't enter everything from the same direction.** You default to \`y: 30, opacity: 0\` on every element. Vary: from left, from right, from scale, opacity-only, letter-spacing.
+- **Don't use the same stagger on every scene.** Each scene needs its own rhythm.
+- **Don't use ambient zoom on every scene.** Pick different ambient motion per scene: slow pan, subtle rotation, scale push, color shift, or nothing. Stillness after motion is powerful.
+- **Don't start at t=0.** Offset the first animation 0.1-0.3s. Zero-delay feels like a jump cut.
+
+## What You Don't Do Without Being Told
+
+### Easing is emotion, not technique
+
+The transition is the verb. The easing is the adverb. A slide-in with \`expo.out\` = confident. With \`sine.inOut\` = dreamy. With \`elastic.out\` = playful. Same motion, different meaning. Choose the adverb deliberately.
+
+**Direction rules \u2014 these are not optional:**
+
+- \`.out\` for elements entering. Starts fast, decelerates. Feels responsive. This is your default.
+- \`.in\` for elements leaving. Starts slow, accelerates away. Throws them off.
+- \`.inOut\` for elements moving between positions.
+
+You get this backwards constantly. Ease-in for entrances feels sluggish. Ease-out for exits feels reluctant.
+
+### Speed communicates weight
+
+- Fast (0.15-0.3s) \u2014 energy, urgency, confidence
+- Medium (0.3-0.5s) \u2014 professional, most content
+- Slow (0.5-0.8s) \u2014 gravity, luxury, contemplation
+- Very slow (0.8-2.0s) \u2014 cinematic, emotional, atmospheric
+
+### Scene structure: build / breathe / resolve
+
+Every scene has three phases. You dump everything in the build and leave nothing for breathe or resolve.
+
+- **Build (0-30%)** \u2014 elements enter, staggered. Don't dump everything at once.
+- **Breathe (30-70%)** \u2014 content visible, alive with ONE ambient motion.
+- **Resolve (70-100%)** \u2014 exit or decisive end. Exits are faster than entrances.
+
+### Transitions are meaning
+
+- **Crossfade** = "this continues"
+- **Hard cut** = "wake up" / disruption
+- **Slow dissolve** = "drift with me"
+
+You crossfade everything. Use hard cuts for disruption and register shifts.
+
+### Choreography is hierarchy
+
+The element that moves first is perceived as most important. Stagger in order of importance, not DOM order. Don't wait for completion \u2014 overlap entries. Total stagger sequence under 500ms regardless of item count.
+
+### Asymmetry
+
+Entrances need longer than exits. A card takes 0.4s to appear but 0.25s to disappear.
+
+## Visual Composition
+
+You build for the web. Video frames are not pages.
+
+- **Two focal points minimum per scene.** The eye needs somewhere to travel. Never a single text block floating in empty space.
+- **Fill the frame.** Hero text: 60-80% of width. You will try to use web-sized elements. Don't.
+- **Three layers minimum per scene.** Background treatment (glow, oversized faded type, color panel). Foreground content. Accent elements (dividers, labels, data bars).
+- **Background is not empty.** Radial glows, oversized faded type bleeding off-frame, subtle border panels, hairline rules. Pure solid #000 reads as "nothing loaded."
+- **Anchor to edges.** Pin content to left/top or right/bottom. Centered-and-floating is a web pattern.
+- **Split frames.** Data panel on the left, content on the right. Top bar with metadata, full-width below. Zone-based layouts, not centered stacks.
+- **Use structural elements.** Rules, dividers, border panels. They create paths for the eye and animate well (scaleX from 0).
+`;
+    TYPOGRAPHY_MD = `# Typography
+
+The compiler embeds supported fonts \u2014 just write \`font-family\` in CSS.
+
+## Banned
+
+Training-data defaults that every LLM reaches for. These produce monoculture across compositions.
+
+Inter, Roboto, Open Sans, Noto Sans, Arimo, Lato, Source Sans, PT Sans, Nunito, Poppins, Outfit, Sora, Playfair Display, Cormorant Garamond, Bodoni Moda, EB Garamond, Cinzel, Prata, Syne
+
+**Syne in particular** is the most overused "distinctive" display font. It is an instant AI design tell.
+
+## Guardrails
+
+You know these rules but you violate them. Stop.
+
+- **Don't pair two sans-serifs.** You do this constantly \u2014 one for headlines, one for body. Cross the boundary: serif + sans, or sans + mono.
+- **One expressive font per scene.** You pick two interesting fonts trying to make it "better." One performs, one recedes.
+- **Weight contrast must be extreme.** You default to 400 vs 700. Video needs 300 vs 900. The difference must be visible in motion at a glance.
+- **Video sizes, not web sizes.** Body: 20px minimum. Headlines: 60px+. Data labels: 16px. You will try to use 14px. Don't.
+
+## What You Don't Do Without Being Told
+
+- **Tension should mean something.** Don't pattern-match pairings. Ask WHY these two fonts disagree. The pairing should embody the content's contradiction \u2014 mechanical vs human, public vs private, institutional vs personal. If you can't articulate the tension, it's arbitrary.
+- **Register switching.** Assign different fonts to different communicative modes \u2014 one voice for statements, another for data, another for attribution. Not hierarchy on a page. Voices in a conversation.
+- **Tension can live inside a single font.** A font that looks familiar but is secretly strange creates tension with the viewer's expectations, not with another font.
+- **One variable changed = dramatic contrast.** Same letterforms, monospaced vs proportional. Same family at different optical sizes. Changing only rhythm while everything else stays constant.
+- **Double personality works.** Two expressive fonts can coexist if they share an attitude (both irreverent, both precise) even when their forms are completely different.
+- **Time is hierarchy.** The first element to appear is the most important. In video, sequence replaces position.
+- **Motion is typography.** How a word enters carries as much meaning as the font. A 0.1s slam vs a 2s fade \u2014 same font, completely different message.
+- **Fixed reading time.** 3 seconds on screen = must be readable in 2. Fewer words, larger type.
+- **Tracking tighter than web.** -0.03em to -0.05em on display sizes. Video encoding compresses letter detail.
+
+## Finding Fonts
+
+Don't default to what you know. If the content is luxury, a grotesque sans might create more tension than the expected Didone serif. Decide the register first, then search.
+
+Save this script to \`/tmp/fontquery.py\` and run with \`curl -s 'https://fonts.google.com/metadata/fonts' > /tmp/gfonts.json && python3 /tmp/fontquery.py /tmp/gfonts.json\`:
+
+\`\`\`python
+import json, sys, random
+from collections import OrderedDict
+
+random.seed()  # true random each run
+
+with open(sys.argv[1]) as f:
+    data = json.load(f)
+fonts = data.get("familyMetadataList", [])
+
+ban = {"Inter","Roboto","Open Sans","Noto Sans","Lato","Poppins","Source Sans 3",
+       "PT Sans","Nunito","Outfit","Sora","Playfair Display","Cormorant Garamond",
+       "Bodoni Moda","EB Garamond","Cinzel","Prata","Arimo","Source Sans Pro","Syne"}
+skip_pfx = ("Roboto","Noto ","Google Sans","Bpmf","Playwrite","Anek","BIZ ",
+            "Nanum","Shippori","Sawarabi","Zen ","Kaisei","Kiwi ","Yuji ","Radio ")
+
+def ok(f):
+    if f["family"] in ban: return False
+    if any(f["family"].startswith(b) for b in skip_pfx): return False
+    if "latin" not in (f.get("subsets") or []): return False
+    return True
+
+seen = set()
+R = OrderedDict()
+
+# Trending Sans \u2014 recent (2022+), popular (<300)
+R["Trending Sans"] = []
+for f in fonts:
+    if not ok(f) or f["family"] in seen: continue
+    if f.get("category") in ("Sans Serif","Display") and f.get("dateAdded","") >= "2022-01-01" and f.get("popularity",9999) < 300:
+        R["Trending Sans"].append(f); seen.add(f["family"])
+
+# Trending Serif \u2014 recent (2018+), popular (<600)
+R["Trending Serif"] = []
+for f in fonts:
+    if not ok(f) or f["family"] in seen: continue
+    if f.get("category") == "Serif" and f.get("dateAdded","") >= "2018-01-01" and f.get("popularity",9999) < 600:
+        R["Trending Serif"].append(f); seen.add(f["family"])
+
+# Monospace \u2014 recent (2018+), popular (<600)
+R["Monospace"] = []
+for f in fonts:
+    if not ok(f) or f["family"] in seen: continue
+    if f.get("category") == "Monospace" and f.get("dateAdded","") >= "2018-01-01" and f.get("popularity",9999) < 600:
+        R["Monospace"].append(f); seen.add(f["family"])
+
+# Impact & Condensed \u2014 heavy display fonts with 800+ weight
+R["Impact & Condensed"] = []
+for f in fonts:
+    if not ok(f) or f["family"] in seen: continue
+    has_heavy = any(k in list(f.get("fonts",{}).keys()) for k in ("800","900"))
+    is_display = f.get("category") in ("Sans Serif","Display")
+    if has_heavy and is_display and f.get("popularity",9999) < 400:
+        R["Impact & Condensed"].append(f); seen.add(f["family"])
+
+# Script & Handwriting \u2014 popular (<300)
+R["Script & Handwriting"] = []
+for f in fonts:
+    if not ok(f) or f["family"] in seen: continue
+    if f.get("category") == "Handwriting" and f.get("popularity",9999) < 300:
+        R["Script & Handwriting"].append(f); seen.add(f["family"])
+
+
+# Randomize the top 5 in each category so the LLM doesn't always pick the same first result
+for cat in R:
+    R[cat].sort(key=lambda x: x.get("popularity",9999))
+    top5 = R[cat][:5]
+    rest = R[cat][5:]
+    random.shuffle(top5)
+    R[cat] = top5 + rest
+limits = {"Trending Sans":15,"Trending Serif":12,"Monospace":8,
+          "Impact & Condensed":12,"Script & Handwriting":10}
+for cat in R:
+    items = R[cat][:limits.get(cat,10)]
+    if not items: continue
+    print(f"--- {cat} ({len(items)}) ---")
+    for ff in items:
+        var = "VAR" if ff.get("axes") else "   "
+        print(f'  {ff.get("popularity"):4d} | {var} | {ff["family"]}')
+    print()
+\`\`\`
+
+Five categories: trending sans, trending serif, monospace, impact/condensed, script/handwriting. All dynamically filtered from Google Fonts metadata \u2014 no hardcoded font names. Cross classification boundaries when pairing.
+
+## Selection Thinking
+
+Don't pick fonts by category reflex (editorial \u2192 serif, tech \u2192 mono, modern \u2192 geometric sans). That's pattern matching, not design.
+
+1. **Name the register.** What voice is the content speaking in? Institutional authority? Personal confession? Technical precision? Casual irreverence? The register narrows the field more than the category.
+2. **Think physically.** Imagine the font as a physical object the brand could ship \u2014 a museum exhibit caption, a hand-painted shop sign, a 1970s mainframe terminal manual, a fabric label inside a coat, a children's book printed on cheap newsprint, a tax form. Whichever physical object fits the register is pointing at the right _kind_ of typeface.
+3. **Reject your first instinct.** The first font that feels right is usually your training-data default for that register. If you picked it last time too, find something else.
+4. **Cross-check the assumption.** An editorial brief does NOT need a serif. A technical brief does NOT need a sans. A children's product does NOT need a rounded display font. The most distinctive choice often contradicts the category expectation.
+
+## Similar-Font Pairing
+
+Never pair two fonts that are similar but not identical \u2014 two geometric sans-serifs, two transitional serifs, two humanist sans. They create visual friction without clear hierarchy. The viewer senses something is "off" but can't articulate it. Either use one font at two weights, or pair fonts that contrast on multiple axes: serif + sans, condensed + wide, geometric + humanist.
+
+## Dark Backgrounds
+
+Light text on dark backgrounds creates two optical illusions you need to compensate for:
+
+- **Increased apparent weight.** Light-on-dark reads heavier than dark-on-light at the same \`font-weight\`. Use 350 instead of 400 for body text. Headlines are less affected because size compensates.
+- **Tighter apparent spacing.** Light halos around letterforms reduce perceived gaps. Increase \`line-height\` by 0.05-0.1 beyond your light-background value. For display sizes, add 0.01em \`letter-spacing\` to counteract.
+
+## OpenType Features for Data
+
+Most fonts ship with OpenType features that are off by default. Turn them on for data compositions:
+
+\`\`\`css
+/* Tabular numbers \u2014 digits align vertically in columns */
+.stat-value,
+.timer,
+.data-column {
+  font-variant-numeric: tabular-nums;
+}
+
+/* Diagonal fractions \u2014 renders 1/2 as \xBD */
+.recipe-amount,
+.ratio {
+  font-variant-numeric: diagonal-fractions;
+}
+
+/* Small caps for abbreviations \u2014 less visual shouting */
+.abbreviation,
+.unit {
+  font-variant-caps: all-small-caps;
+}
+
+/* Disable ligatures in code \u2014 fi, fl, ffi should stay separate */
+code,
+.code {
+  font-variant-ligatures: none;
+}
+\`\`\`
+
+\`tabular-nums\` is essential any time numbers are stacked vertically \u2014 stat callouts, timers, scoreboards, data tables. Without it, digits have proportional widths and columns don't align.
+`;
+    TRANSITIONS_MD = `# Scene Transitions
+
+A transition tells the viewer how two scenes relate. A crossfade says "this continues." A push slide says "next point." A blur crossfade says "drift with me." Choose transitions that match what the content is doing emotionally, not just technically.
+
+## Animation Rules for Multi-Scene Compositions
+
+These are non-negotiable for every multi-scene composition:
+
+1. **Every composition uses transitions.** No exceptions. Scenes without transitions feel like jump cuts.
+2. **Every scene uses entrance animations.** Elements animate IN via \`gsap.from()\` \u2014 opacity, position, scale, etc. No scene should pop fully-formed onto screen.
+3. **Exit animations are BANNED** except on the final scene. Do NOT use \`gsap.to()\` to animate elements out before a transition fires. The transition IS the exit. Outgoing scene content must be fully visible when the transition starts \u2014 the transition handles the visual handoff.
+4. **Final scene exception:** The last scene MAY fade elements out (e.g., fade to black at the end of the composition). This is the only scene where exit animations are allowed.
+
+## Energy \u2192 Primary Transition
+
+| Energy                                   | CSS Primary                  | Shader Primary                       | Accent                         | Duration  | Easing                 |
+| ---------------------------------------- | ---------------------------- | ------------------------------------ | ------------------------------ | --------- | ---------------------- |
+| **Calm** (wellness, brand story, luxury) | Blur crossfade, focus pull   | Cross-warp morph, thermal distortion | Light leak, circle iris        | 0.5-0.8s  | \`sine.inOut\`, \`power1\` |
+| **Medium** (corporate, SaaS, explainer)  | Push slide, staggered blocks | Whip pan, cinematic zoom             | Squeeze, vertical push         | 0.3-0.5s  | \`power2\`, \`power3\`     |
+| **High** (promos, sports, music, launch) | Zoom through, overexposure   | Ridged burn, glitch, chromatic split | Staggered blocks, gravity drop | 0.15-0.3s | \`power4\`, \`expo\`       |
+
+Pick ONE primary (60-70% of scene changes) + 1-2 accents. Never use a different transition for every scene.
+
+## Mood \u2192 Transition Type
+
+Think about what the transition _communicates_, not just what it looks like.
+
+| Mood                     | Transitions                                                                                                                          | Why it works                                                                                |
+| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------- |
+| **Warm / inviting**      | Light leak, blur crossfade, focus pull, film burn \xB7 **Shader:** thermal distortion, light leak, cross-warp morph                     | Soft edges, warm color washes. Nothing sharp or mechanical.                                 |
+| **Cold / clinical**      | Squeeze, zoom out, blinds, shutter, grid dissolve \xB7 **Shader:** gravitational lens                                                   | Content transforms mechanically \u2014 compressed, shrunk, sliced, gridded.                      |
+| **Editorial / magazine** | Push slide, vertical push, diagonal split, shutter \xB7 **Shader:** whip pan                                                            | Like turning a page or slicing a layout. Clean directional movement.                        |
+| **Tech / futuristic**    | Grid dissolve, staggered blocks, blinds, chromatic aberration \xB7 **Shader:** glitch, chromatic split                                  | Grid dissolve is the core "data" transition. Shader glitch adds posterization + scan lines. |
+| **Tense / edgy**         | Glitch, VHS, chromatic aberration, ripple \xB7 **Shader:** ridged burn, glitch, domain warp                                             | Instability, distortion, digital breakdown. Ridged burn adds sharp lightning-crack edges.   |
+| **Playful / fun**        | Elastic push, 3D flip, circle iris, morph circle, clock wipe \xB7 **Shader:** ripple waves, swirl vortex                                | Overshoot, bounce, rotation, expansion. Swirl vortex adds organic spiral distortion.        |
+| **Dramatic / cinematic** | Zoom through, zoom out, gravity drop, overexposure, color dip to black \xB7 **Shader:** cinematic zoom, gravitational lens, domain warp | Scale, weight, light extremes. Shader transitions add per-pixel depth.                      |
+| **Premium / luxury**     | Focus pull, blur crossfade, color dip to black \xB7 **Shader:** cross-warp morph, thermal distortion                                    | Restraint. Cross-warp morph flows both scenes into each other organically.                  |
+| **Retro / analog**       | Film burn, light leak, VHS, clock wipe \xB7 **Shader:** light leak                                                                      | Organic imperfection. Warm color bleeds, scan line displacement.                            |
+
+## Narrative Position
+
+| Position                   | Use                                                                        | Why                                                   |
+| -------------------------- | -------------------------------------------------------------------------- | ----------------------------------------------------- |
+| **Opening**                | Your most distinctive transition. Match the mood. 0.4-0.6s                 | Sets the visual language for the entire piece.        |
+| **Between related points** | Your primary transition. Consistent. 0.3s                                  | Don't distract \u2014 the content is continuing.           |
+| **Topic change**           | Something different from your primary. Staggered blocks, shutter, squeeze. | Signals "new section" \u2014 the viewer's brain resets.    |
+| **Climax / hero reveal**   | Your boldest accent. Fastest or most dramatic.                             | This is the payoff \u2014 spend your best transition here. |
+| **Wind-down**              | Return to gentle. Blur crossfade, crossfade. 0.5-0.7s                      | Let the viewer exhale after the climax.               |
+| **Outro**                  | Slowest, simplest. Crossfade, color dip to black. 0.6-1.0s                 | Closure. Don't introduce new energy at the end.       |
+
+## Blur Intensity by Energy
+
+| Energy     | Blur    | Duration | Hold at peak |
+| ---------- | ------- | -------- | ------------ |
+| **Calm**   | 20-30px | 0.8-1.2s | 0.3-0.5s     |
+| **Medium** | 8-15px  | 0.4-0.6s | 0.1-0.2s     |
+| **High**   | 3-6px   | 0.2-0.3s | 0s           |
+
+## Presets
+
+| Preset     | Duration | Easing            |
+| ---------- | -------- | ----------------- |
+| \`snappy\`   | 0.2s     | \`power4.inOut\`    |
+| \`smooth\`   | 0.4s     | \`power2.inOut\`    |
+| \`gentle\`   | 0.6s     | \`sine.inOut\`      |
+| \`dramatic\` | 0.5s     | \`power3.in\` \u2192 out |
+| \`instant\`  | 0.15s    | \`expo.inOut\`      |
+| \`luxe\`     | 0.7s     | \`power1.inOut\`    |
+
+## Implementation
+
+Read [transitions/catalog.md](transitions/catalog.md) for GSAP code and hard rules for every transition type.
+
+| Category    | CSS                                                            | Shader (WebGL)                                                            |
+| ----------- | -------------------------------------------------------------- | ------------------------------------------------------------------------- |
+| Push/slide  | Push slide, vertical push, elastic push, squeeze               | Whip pan                                                                  |
+| Scale/zoom  | Zoom through, zoom out, gravity drop, 3D flip                  | Cinematic zoom, gravitational lens                                        |
+| Reveal/mask | Circle iris, diamond iris, diagonal split, clock wipe, shutter | SDF iris                                                                  |
+| Dissolve    | Crossfade, blur crossfade, focus pull, color dip               | Cross-warp morph, domain warp                                             |
+| Cover       | Staggered blocks, horizontal blinds, vertical blinds           | \u2014                                                                         |
+| Light       | Light leak, overexposure burn, film burn                       | Light leak (shader), thermal distortion                                   |
+| Distortion  | Glitch, chromatic aberration, ripple, VHS tape                 | Glitch (shader), chromatic split, ridged burn, ripple waves, swirl vortex |
+| Pattern     | Grid dissolve, morph circle                                    | \u2014                                                                         |
+
+## Transitions That Don't Work in CSS
+
+Avoid: star iris, tilt-shift, lens flare, hinge/door. See catalog.md for why.
+
+## CSS vs Shader
+
+CSS transitions animate scene containers with opacity, transforms, clip-path, and filters. Shader transitions composite both scene textures per-pixel on a WebGL canvas \u2014 they can warp, dissolve, and morph in ways CSS cannot.
+
+**Both are first-class options.** Shaders are provided by the \`@hyperframes/shader-transitions\` package \u2014 import from the package instead of writing raw GLSL. CSS transitions are simpler to set up. Choose based on the effect you want, not based on which is easier.
+
+When a composition uses shader transitions, ALL transitions in that composition should be shader-based (the WebGL canvas replaces DOM-based scene switching). Don't mix CSS and shader transitions in the same composition.
+
+## Shader-Compatible CSS Rules
+
+Shader transitions capture DOM scenes to WebGL textures via html2canvas. The canvas 2D rendering pipeline doesn't match CSS exactly. Follow these rules to avoid visible artifacts at transition boundaries:
+
+1. **No \`transparent\` keyword in gradients.** Canvas interpolates \`transparent\` as \`rgba(0,0,0,0)\` (black at zero alpha), creating dark fringes. Always use the target color at zero alpha: \`rgba(200,117,51,0)\` not \`transparent\`.
+2. **No gradient backgrounds on elements thinner than 4px.** Canvas can't match CSS gradient rendering on 1-2px elements. Use solid \`background-color\` on thin accent lines.
+3. **No CSS variables (\`var()\`) on elements visible during capture.** html2canvas doesn't reliably resolve custom properties. Use literal color values in inline styles.
+4. **Mark uncapturable decorative elements with \`data-no-capture\`.** The capture function skips these. They're present on the live DOM but absent from the shader texture. Use for elements that can't follow the rules above.
+5. **No gradient opacity below 0.15.** Gradient elements below 10% opacity render differently in canvas vs CSS. Increase to 0.15+ or use a solid color at equivalent brightness.
+6. **Every \`.scene\` div must have explicit \`background-color\`, AND pass the same color as \`bgColor\` in the \`init()\` config.** The package captures scene elements via html2canvas. Both the CSS \`background-color\` on \`.scene\` and the \`bgColor\` config must match. Without either, the texture renders as black.
+
+These rules only apply to shader transition compositions. CSS-only compositions have no restrictions.
+
+## Visual Pattern Warning
+
+Avoid transitions that create visible repeating geometric patterns \u2014 grids of tiles, hexagonal cells, uniform dot arrays, evenly-spaced blob circles. These look cheap and artificial regardless of the math behind them. Organic noise (FBM, domain warping) is good because it's irregular. Geometric repetition is bad because the eye instantly sees the grid.
+`;
+  }
+});
+
+// src/commands/_shared/hf-skill-bundle/bundle.ts
+import { readFileSync, existsSync as existsSync27, statSync } from "node:fs";
+import { join as join7 } from "node:path";
+import { homedir as homedir3 } from "node:os";
+import { createHash as createHash2 } from "node:crypto";
+function installedSkillPath() {
+  const candidate = join7(homedir3(), ".claude", "skills", "hyperframes");
+  if (!existsSync27(candidate)) return null;
+  if (!statSync(candidate).isDirectory()) return null;
+  return candidate;
+}
+function joinSections(sections) {
+  return sections.map((s) => `
+
+=== ${s.label} ===
+
+${s.content}`).join("\n");
+}
+function buildVendored() {
+  return {
+    content: joinSections(VENDORED_SECTIONS),
+    hint: `[skill] using vendored Hyperframes snapshot ${BUNDLE_VERSION}. For latest, run \`npx skills add heygen-com/hyperframes\`.`
+  };
+}
+function buildInstalled(skillRoot) {
+  const installedPaths = {
+    "hyperframes/SKILL.md": join7(skillRoot, "SKILL.md"),
+    "hyperframes/house-style.md": join7(skillRoot, "house-style.md"),
+    "hyperframes/motion-principles.md": join7(skillRoot, "references", "motion-principles.md"),
+    "hyperframes/typography.md": join7(skillRoot, "references", "typography.md"),
+    "hyperframes/transitions.md": join7(skillRoot, "references", "transitions.md")
+  };
+  const sections = [];
+  for (const [label, path2] of Object.entries(installedPaths)) {
+    if (!existsSync27(path2)) return null;
+    sections.push({ label, content: readFileSync(path2, "utf-8") });
+  }
+  return {
+    content: joinSections(sections),
+    hint: `[skill] using installed Hyperframes skill from ${skillRoot}.`
+  };
+}
+function loadHyperframesSkillBundle() {
+  const installedRoot = installedSkillPath();
+  if (installedRoot) {
+    const r = buildInstalled(installedRoot);
+    if (r) {
+      return {
+        content: r.content,
+        source: "installed",
+        hint: r.hint,
+        hash: hashBundle(BUNDLE_VERSION, r.content)
+      };
+    }
+  }
+  const v = buildVendored();
+  return {
+    content: v.content,
+    source: "vendored",
+    hint: v.hint,
+    hash: hashBundle(BUNDLE_VERSION, v.content)
+  };
+}
+function hashBundle(version, content) {
+  return createHash2("sha256").update(version).update(" ").update(content).digest("hex");
+}
+var BUNDLE_VERSION, VENDORED_SECTIONS;
+var init_bundle = __esm({
+  "src/commands/_shared/hf-skill-bundle/bundle.ts"() {
+    "use strict";
+    init_bundle_content();
+    BUNDLE_VERSION = "970367f-2026-04-25";
+    VENDORED_SECTIONS = [
+      { label: "hyperframes/SKILL.md", content: SKILL_MD },
+      { label: "hyperframes/house-style.md", content: HOUSE_STYLE_MD },
+      { label: "hyperframes/motion-principles.md", content: MOTION_PRINCIPLES_MD },
+      { label: "hyperframes/typography.md", content: TYPOGRAPHY_MD },
+      { label: "hyperframes/transitions.md", content: TRANSITIONS_MD }
+    ];
+  }
+});
+
+// src/commands/_shared/storyboard-parse.ts
+function parseStoryboard(md) {
+  const text = md.replace(/\r\n/g, "\n");
+  const headings = [];
+  HEADING_RE.lastIndex = 0;
+  let m;
+  while ((m = HEADING_RE.exec(text)) !== null) {
+    headings.push({
+      start: m.index,
+      end: m.index + m[0].length,
+      line: m[1].trim()
+    });
+  }
+  if (headings.length === 0) {
+    return { global: text.trim(), beats: [] };
+  }
+  const global2 = text.slice(0, headings[0].start).trim();
+  const beats = headings.map((h, i) => {
+    const bodyStart = h.end;
+    const bodyEnd = i + 1 < headings.length ? headings[i + 1].start : text.length;
+    const body = text.slice(bodyStart, bodyEnd).trim();
+    const id = deriveBeatId(h.line);
+    const duration = parseBeatDuration(body);
+    return {
+      id,
+      heading: h.line,
+      body,
+      ...duration !== void 0 ? { duration } : {}
+    };
+  });
+  return { global: global2, beats };
+}
+function deriveBeatId(headingLine) {
+  const beatPrefix = headingLine.match(BEAT_PREFIX_RE);
+  if (beatPrefix) {
+    return slugify(beatPrefix[1]);
+  }
+  return slugify(headingLine);
+}
+function slugify(s) {
+  return s.toLowerCase().normalize("NFKD").replace(/[̀-ͯ]/g, "").replace(/\([^)]*\)/g, "").replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "") || "beat";
+}
+function parseBeatDuration(body) {
+  const sub = body.match(DURATION_SUBSECTION_RE);
+  if (!sub) return void 0;
+  const valueMatch = sub[1].match(DURATION_VALUE_RE);
+  if (!valueMatch) return void 0;
+  const n = parseFloat(valueMatch[1]);
+  return Number.isFinite(n) && n > 0 ? n : void 0;
+}
+var HEADING_RE, BEAT_PREFIX_RE, DURATION_SUBSECTION_RE, DURATION_VALUE_RE;
+var init_storyboard_parse = __esm({
+  "src/commands/_shared/storyboard-parse.ts"() {
+    "use strict";
+    HEADING_RE = /^##\s+(.+?)\s*$/gm;
+    BEAT_PREFIX_RE = /^Beat\s+(.+?)\s+(?:—|:|-)\s+(.+)$/i;
+    DURATION_SUBSECTION_RE = /###\s+Beat\s+duration\s*\n([\s\S]*?)(?=\n###\s|\n##\s|$)/i;
+    DURATION_VALUE_RE = /(-?\d+(?:\.\d+)?)\s*(?:s|sec|seconds?)?/i;
+  }
+});
+
+// src/commands/_shared/compose-scenes-skills.ts
+var compose_scenes_skills_exports = {};
+__export(compose_scenes_skills_exports, {
+  ComposeBeatError: () => ComposeBeatError,
+  buildSystemPrompt: () => buildSystemPrompt,
+  buildUserPrompt: () => buildUserPrompt,
+  composeBeatHtml: () => composeBeatHtml,
+  composeBeatWithRetry: () => composeBeatWithRetry,
+  computeCacheKey: () => computeCacheKey,
+  defaultCacheDir: () => defaultCacheDir,
+  executeComposeScenesWithSkills: () => executeComposeScenesWithSkills,
+  extractHtml: () => extractHtml,
+  formatLintFeedback: () => formatLintFeedback,
+  lintBeatHtml: () => lintBeatHtml
+});
+import Anthropic from "@anthropic-ai/sdk";
+import { createHash as createHash3 } from "node:crypto";
+import { existsSync as existsSync28, mkdirSync } from "node:fs";
+import { mkdir as mkdir19, readFile as readFile35, writeFile as writeFile31 } from "node:fs/promises";
+import { homedir as homedir4 } from "node:os";
+import { dirname as dirname20, join as join8, resolve as resolve42 } from "node:path";
+import {
+  runHyperframeLint as runHyperframeLint2
+} from "@hyperframes/producer";
+function buildSystemPrompt(ctx) {
+  return `You are a Hyperframes composition author. The skill content below
+defines the framework rules, motion principles, and quality standards.
+Read it thoroughly before writing any HTML.
+
+${ctx.skillBundle.content}
+
+=== DESIGN.md (project-specific visual identity \u2014 HARD-GATE, every decision must trace back) ===
+
+${ctx.designMd}`;
+}
+function buildUserPrompt(ctx) {
+  const compositionId = `scene-${ctx.beat.id}`;
+  const baseRequirements = `Build the Hyperframes sub-composition HTML for this beat. The composition
+will be loaded into a root index.html via
+\`data-composition-src="compositions/${compositionId}.html"\`.
+
+Requirements (non-negotiable):
+- Use the \`<template>\` wrapper (this is a sub-composition, not standalone)
+- Composition id: \`${compositionId}\`
+- One paused GSAP timeline registered on \`window.__timelines["${compositionId}"]\`
+- All timed elements have \`class="clip"\` and \`data-start\`, \`data-duration\`, \`data-track-index\`
+- No \`Math.random()\`, \`Date.now()\`, \`repeat: -1\`, or \`<br>\` in content
+- Layout-before-animation: position elements at hero-frame state in CSS, animate FROM
+- No exit animations (transitions handle scene exits, except the final beat)
+- Strictly follow DESIGN.md palette, typography, motion signature
+
+=== Storyboard \u2014 global direction ===
+
+${ctx.storyboardGlobal || "(no global direction)"}
+
+=== Beat to build ===
+
+## ${ctx.beat.heading}
+
+${ctx.beat.body}
+
+=== Output format ===
+
+Return ONE complete HTML file in a single \`\`\`html\`\`\` fenced code block.
+No prose, no explanations, no commentary outside the code block. Just the HTML.`;
+  if (ctx.retryFeedback && ctx.retryFeedback.trim().length > 0) {
+    return `${baseRequirements}
+
+=== Previous attempt failed lint with the following findings \u2014 fix them ===
+
+${ctx.retryFeedback.trim()}`;
+  }
+  return baseRequirements;
+}
+function computeCacheKey(parts) {
+  return createHash3("sha256").update(parts.model).update("\u241E").update(parts.systemPrompt).update("\u241E").update(parts.userPrompt).digest("hex");
+}
+function defaultCacheDir() {
+  return join8(homedir4(), ".vibeframe", "cache", "compose-scenes");
+}
+function extractHtml(responseText) {
+  const fenced = responseText.match(/```html\s*\n([\s\S]*?)\n```/);
+  if (fenced) return fenced[1].trim();
+  const trimmed = responseText.trim();
+  if (trimmed.startsWith("<")) return trimmed;
+  throw new ComposeBeatError(
+    "no-html-in-response",
+    `Could not extract HTML from response. First 200 chars: ${trimmed.slice(0, 200)}`
+  );
+}
+async function composeBeatHtml(ctx, overrides) {
+  const effort = ctx.effort ?? "medium";
+  const settings = MODEL_SETTINGS[effort];
+  const systemPrompt = buildSystemPrompt(ctx);
+  const userPrompt = buildUserPrompt(ctx);
+  const cacheKey = computeCacheKey({
+    systemPrompt,
+    userPrompt,
+    model: settings.model
+  });
+  const cacheDir = ctx.cacheDir ?? defaultCacheDir();
+  const cachePath = join8(cacheDir, `${cacheKey}.html`);
+  if (existsSync28(cachePath)) {
+    const html2 = await readFile35(cachePath, "utf-8");
+    return { html: html2, cached: true, cacheKey, model: settings.model };
+  }
+  if (!ctx.apiKey) {
+    throw new ComposeBeatError(
+      "missing-api-key",
+      "ANTHROPIC_API_KEY required for compose-scenes-with-skills (set it in env or .env)."
+    );
+  }
+  const client = overrides?.client ?? new Anthropic({ apiKey: ctx.apiKey });
+  const now = overrides?.now ?? (() => Date.now());
+  const t0 = now();
+  let response;
+  try {
+    response = await client.messages.create({
+      model: settings.model,
+      max_tokens: settings.maxTokens,
+      system: systemPrompt,
+      messages: [{ role: "user", content: userPrompt }]
+    });
+  } catch (err) {
+    throw new ComposeBeatError(
+      "api-call-failed",
+      `Anthropic API call failed: ${err instanceof Error ? err.message : String(err)}`,
+      err
+    );
+  }
+  const latencyMs = now() - t0;
+  if (!("content" in response) || !Array.isArray(response.content)) {
+    throw new ComposeBeatError("unexpected-response-shape", "Anthropic response missing `content` array.");
+  }
+  const textBlock = response.content.find((b) => b.type === "text");
+  if (!textBlock || textBlock.type !== "text") {
+    throw new ComposeBeatError("no-text-block", "Anthropic response had no text block.");
+  }
+  const html = extractHtml(textBlock.text);
+  try {
+    mkdirSync(cacheDir, { recursive: true });
+    await writeFile31(cachePath, html, "utf-8");
+  } catch {
+  }
+  const inputTokens = response.usage?.input_tokens ?? 0;
+  const outputTokens = response.usage?.output_tokens ?? 0;
+  const costUsd = inputTokens / 1e6 * settings.costPerMTokIn + outputTokens / 1e6 * settings.costPerMTokOut;
+  return {
+    html,
+    cached: false,
+    cacheKey,
+    inputTokens,
+    outputTokens,
+    costUsd: Number(costUsd.toFixed(4)),
+    latencyMs,
+    model: settings.model
+  };
+}
+function lintBeatHtml(html, beatId) {
+  const prepared = {
+    html,
+    entryFile: `compositions/scene-${beatId}.html`,
+    source: "projectDir"
+  };
+  const raw = runHyperframeLint2(prepared);
+  const findings = filterSubCompFalsePositives(raw.findings, true);
+  return {
+    errorCount: findings.filter((f) => f.severity === "error").length,
+    warningCount: findings.filter((f) => f.severity === "warning").length,
+    findings
+  };
+}
+function formatLintFeedback(findings) {
+  const errors = findings.filter((f) => f.severity === "error");
+  if (errors.length === 0) return "";
+  return errors.map((f) => {
+    const fix = f.fixHint ? `
+  Fix hint: ${f.fixHint}` : "";
+    return `ERROR [${f.code}] ${f.message}${fix}`;
+  }).join("\n");
+}
+async function composeBeatWithRetry(ctx, overrides) {
+  const first = await composeBeatHtml(ctx, overrides);
+  const lint1 = lintBeatHtml(first.html, ctx.beat.id);
+  if (lint1.errorCount === 0) {
+    return { ...first, lintAttempts: 1, lint: lint1 };
+  }
+  const feedback = formatLintFeedback(lint1.findings);
+  const second = await composeBeatHtml({ ...ctx, retryFeedback: feedback }, overrides);
+  const lint2 = lintBeatHtml(second.html, ctx.beat.id);
+  if (lint2.errorCount === 0) {
+    return { ...second, lintAttempts: 2, lint: lint2 };
+  }
+  throw new ComposeBeatError(
+    "lint-failed-after-retry",
+    `Beat "${ctx.beat.id}" failed lint after retry. Final findings:
+${formatLintFeedback(lint2.findings)}`
+  );
+}
+async function executeComposeScenesWithSkills(params, outputDir, overrides) {
+  const projectRoot = params.project ? resolve42(outputDir, params.project) : resolve42(outputDir);
+  const designPath = resolve42(projectRoot, params.design ?? "DESIGN.md");
+  const storyboardPath = resolve42(projectRoot, params.storyboard ?? "STORYBOARD.md");
+  if (!existsSync28(designPath)) {
+    return { success: false, error: `DESIGN.md not found at ${designPath}` };
+  }
+  if (!existsSync28(storyboardPath)) {
+    return { success: false, error: `STORYBOARD.md not found at ${storyboardPath}` };
+  }
+  const designMd = await readFile35(designPath, "utf-8");
+  const storyboardMd = await readFile35(storyboardPath, "utf-8");
+  const { global: storyboardGlobal, beats } = parseStoryboard(storyboardMd);
+  if (beats.length === 0) {
+    return {
+      success: false,
+      error: `STORYBOARD.md at ${storyboardPath} contains no \`## Beat \u2026\` headings.`
+    };
+  }
+  const skillBundleLoaded = loadHyperframesSkillBundle();
+  const skillBundle = { content: skillBundleLoaded.content, hash: skillBundleLoaded.hash };
+  const apiKey = process.env.ANTHROPIC_API_KEY ?? "";
+  const compositionsDir = join8(projectRoot, "compositions");
+  await mkdir19(compositionsDir, { recursive: true });
+  const onProgress = params.onProgress ?? (() => {
+  });
+  const totalBeats = beats.length;
+  const tasks = beats.map(async (beat, beatIndex) => {
+    onProgress({ type: "beat-start", beatId: beat.id, beatIndex, totalBeats });
+    try {
+      const result = await composeBeatWithRetry(
+        {
+          beat,
+          designMd,
+          storyboardGlobal,
+          skillBundle,
+          apiKey,
+          effort: params.effort,
+          cacheDir: params.cacheDir
+        },
+        overrides
+      );
+      const compositionPath = join8(compositionsDir, `scene-${beat.id}.html`);
+      await mkdir19(dirname20(compositionPath), { recursive: true });
+      await writeFile31(compositionPath, result.html, "utf-8");
+      if (result.cached) {
+        onProgress({
+          type: "beat-cached",
+          beatId: beat.id,
+          beatIndex,
+          totalBeats,
+          lintAttempts: result.lintAttempts
+        });
+      } else {
+        onProgress({
+          type: "beat-fresh",
+          beatId: beat.id,
+          beatIndex,
+          totalBeats,
+          lintAttempts: result.lintAttempts,
+          costUsd: result.costUsd,
+          latencyMs: result.latencyMs
+        });
+      }
+      return { ok: true, beatId: beat.id, beatIndex, path: compositionPath, result };
+    } catch (err) {
+      const message = err instanceof Error ? err.message : String(err);
+      onProgress({ type: "beat-failed", beatId: beat.id, beatIndex, totalBeats, error: message });
+      return { ok: false, beatId: beat.id, beatIndex, error: message };
+    }
+  });
+  const outcomes = await Promise.all(tasks);
+  const written = [];
+  const failures = [];
+  let totalCostUsd = 0;
+  let totalTokensIn = 0;
+  let totalTokensOut = 0;
+  let cacheHits = 0;
+  for (const outcome of outcomes) {
+    if (!outcome.ok) {
+      failures.push({ beatId: outcome.beatId, error: outcome.error });
+      continue;
+    }
+    const r = outcome.result;
+    written.push({
+      beatId: outcome.beatId,
+      path: outcome.path,
+      cached: r.cached,
+      lintAttempts: r.lintAttempts,
+      costUsd: r.costUsd
+    });
+    if (r.cached) cacheHits++;
+    if (r.costUsd) totalCostUsd += r.costUsd;
+    if (r.inputTokens) totalTokensIn += r.inputTokens;
+    if (r.outputTokens) totalTokensOut += r.outputTokens;
+  }
+  const aggregateData = {
+    beats: beats.length,
+    written,
+    totalCostUsd: Number(totalCostUsd.toFixed(4)),
+    totalTokensIn,
+    totalTokensOut,
+    cacheHits
+  };
+  if (failures.length > 0) {
+    return {
+      success: false,
+      outputPath: projectRoot,
+      error: failures.length === 1 ? `compose-scenes-with-skills failed at beat "${failures[0].beatId}": ${failures[0].error}` : `compose-scenes-with-skills failed at ${failures.length} beats:
+${failures.map((f) => `  - ${f.beatId}: ${f.error}`).join("\n")}`,
+      data: aggregateData
+    };
+  }
+  return {
+    success: true,
+    outputPath: projectRoot,
+    data: aggregateData
+  };
+}
+var MODEL_SETTINGS, ComposeBeatError;
+var init_compose_scenes_skills = __esm({
+  "src/commands/_shared/compose-scenes-skills.ts"() {
+    "use strict";
+    init_bundle();
+    init_scene_lint();
+    init_storyboard_parse();
+    MODEL_SETTINGS = {
+      // Sonnet 4.6 — pre-flight validated default. $3/$15 per MTok.
+      low: { model: "claude-sonnet-4-6", maxTokens: 4e3, costPerMTokIn: 3, costPerMTokOut: 15 },
+      medium: { model: "claude-sonnet-4-6", maxTokens: 6e3, costPerMTokIn: 3, costPerMTokOut: 15 },
+      high: { model: "claude-sonnet-4-6", maxTokens: 8e3, costPerMTokIn: 3, costPerMTokOut: 15 }
+    };
+    ComposeBeatError = class extends Error {
+      constructor(code, message, cause) {
+        super(message);
+        this.code = code;
+        this.cause = cause;
+        this.name = "ComposeBeatError";
+      }
+    };
+  }
+});
+
 // src/agent/adapters/openai.ts
 var openai_exports = {};
 __export(openai_exports, {
@@ -51540,7 +53178,7 @@ var claude_exports = {};
 __export(claude_exports, {
   ClaudeAdapter: () => ClaudeAdapter
 });
-import Anthropic from "@anthropic-ai/sdk";
+import Anthropic2 from "@anthropic-ai/sdk";
 var ClaudeAdapter;
 var init_claude2 = __esm({
   "src/agent/adapters/claude.ts"() {
@@ -51550,7 +53188,7 @@ var init_claude2 = __esm({
       client = null;
       model = "claude-sonnet-4-6";
       async initialize(apiKey) {
-        this.client = new Anthropic({ apiKey });
+        this.client = new Anthropic2({ apiKey });
       }
       isInitialized() {
         return this.client !== null;
@@ -52169,14 +53807,14 @@ var project_exports = {};
 __export(project_exports, {
   registerProjectTools: () => registerProjectTools
 });
-import { readFile as readFile36, writeFile as writeFile32, stat as stat7 } from "node:fs/promises";
-import { resolve as resolve43 } from "node:path";
+import { readFile as readFile37, writeFile as writeFile33, stat as stat7 } from "node:fs/promises";
+import { resolve as resolve44 } from "node:path";
 async function resolveProjectPath3(inputPath, cwd) {
-  const filePath = resolve43(cwd, inputPath);
+  const filePath = resolve44(cwd, inputPath);
   try {
     const stats = await stat7(filePath);
     if (stats.isDirectory()) {
-      return resolve43(filePath, "project.vibe.json");
+      return resolve44(filePath, "project.vibe.json");
     }
   } catch {
   }
@@ -52299,9 +53937,9 @@ var init_project2 = __esm({
         const project = new Project(name);
         project.setAspectRatio(aspectRatio);
         project.setFrameRate(fps);
-        const outputPath = resolve43(context.workingDirectory, output);
+        const outputPath = resolve44(context.workingDirectory, output);
         const data = JSON.stringify(project.toJSON(), null, 2);
-        await writeFile32(outputPath, data, "utf-8");
+        await writeFile33(outputPath, data, "utf-8");
         context.projectPath = outputPath;
         return {
           toolCallId: "",
@@ -52324,7 +53962,7 @@ Frame Rate: ${fps} fps`
       const path2 = args.path || args.project;
       try {
         const filePath = await resolveProjectPath3(path2, context.workingDirectory);
-        const content = await readFile36(filePath, "utf-8");
+        const content = await readFile37(filePath, "utf-8");
         const data = JSON.parse(content);
         const project = Project.fromJSON(data);
         const summary = project.getSummary();
@@ -52359,7 +53997,7 @@ Frame Rate: ${fps} fps`
       const updates = [];
       try {
         const filePath = await resolveProjectPath3(path2, context.workingDirectory);
-        const content = await readFile36(filePath, "utf-8");
+        const content = await readFile37(filePath, "utf-8");
         const data = JSON.parse(content);
         const project = Project.fromJSON(data);
         if (args.name) {
@@ -52374,7 +54012,7 @@ Frame Rate: ${fps} fps`
           project.setFrameRate(args.fps);
           updates.push(`Frame Rate: ${args.fps} fps`);
         }
-        await writeFile32(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
+        await writeFile33(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
         return {
           toolCallId: "",
           success: true,
@@ -52394,7 +54032,7 @@ ${updates.join("\n")}`
       const path2 = args.path || args.project;
       try {
         const filePath = await resolveProjectPath3(path2, context.workingDirectory);
-        const content = await readFile36(filePath, "utf-8");
+        const content = await readFile37(filePath, "utf-8");
         const data = JSON.parse(content);
         const project = Project.fromJSON(data);
         context.projectPath = filePath;
@@ -52428,10 +54066,10 @@ Duration: ${summary.duration.toFixed(1)}s`
       }
       try {
         const filePath = await resolveProjectPath3(path2, context.workingDirectory);
-        const content = await readFile36(filePath, "utf-8");
+        const content = await readFile37(filePath, "utf-8");
         const data = JSON.parse(content);
         const project = Project.fromJSON(data);
-        await writeFile32(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
+        await writeFile33(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
         return {
           toolCallId: "",
           success: true,
@@ -52454,8 +54092,8 @@ var timeline_exports = {};
 __export(timeline_exports, {
   registerTimelineTools: () => registerTimelineTools
 });
-import { readFile as readFile37, writeFile as writeFile33, stat as stat8 } from "node:fs/promises";
-import { resolve as resolve44, basename as basename25, extname as extname15 } from "node:path";
+import { readFile as readFile38, writeFile as writeFile34, stat as stat8 } from "node:fs/promises";
+import { resolve as resolve45, basename as basename25, extname as extname15 } from "node:path";
 function detectMediaType4(path2) {
   const ext = extname15(path2).toLowerCase();
   const videoExts = [".mp4", ".mov", ".webm", ".avi", ".mkv"];
@@ -52478,11 +54116,11 @@ async function getMediaDuration2(filePath, mediaType) {
   }
 }
 async function resolveProjectPath4(inputPath, cwd) {
-  const filePath = resolve44(cwd, inputPath);
+  const filePath = resolve45(cwd, inputPath);
   try {
     const stats = await stat8(filePath);
     if (stats.isDirectory()) {
-      return resolve44(filePath, "project.vibe.json");
+      return resolve45(filePath, "project.vibe.json");
     }
   } catch {
   }
@@ -52490,13 +54128,13 @@ async function resolveProjectPath4(inputPath, cwd) {
 }
 async function loadProject(path2, cwd) {
   const filePath = await resolveProjectPath4(path2, cwd);
-  const content = await readFile37(filePath, "utf-8");
+  const content = await readFile38(filePath, "utf-8");
   const data = JSON.parse(content);
   const project = Project.fromJSON(data);
   return { project, filePath };
 }
 async function saveProject(project, filePath) {
-  await writeFile33(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
+  await writeFile34(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
 }
 function registerTimelineTools(registry) {
   registry.register(addSourceDef, addSource);
@@ -52801,7 +54439,7 @@ var init_timeline = __esm({
       const mediaPath = args.media;
       try {
         const { project, filePath } = await loadProject(projectPath, context.workingDirectory);
-        const absMediaPath = resolve44(context.workingDirectory, mediaPath);
+        const absMediaPath = resolve45(context.workingDirectory, mediaPath);
         const mediaName = args.name || basename25(mediaPath);
         const mediaType = args.type || detectMediaType4(mediaPath);
         const duration = args.duration || await getMediaDuration2(absMediaPath, mediaType);
@@ -53319,8 +54957,8 @@ var filesystem_exports = {};
 __export(filesystem_exports, {
   registerFilesystemTools: () => registerFilesystemTools
 });
-import { readFile as readFile38, writeFile as writeFile34, readdir as readdir5, stat as stat9, access as access8 } from "node:fs/promises";
-import { resolve as resolve45, join as join7 } from "node:path";
+import { readFile as readFile39, writeFile as writeFile35, readdir as readdir5, stat as stat9, access as access8 } from "node:fs/promises";
+import { resolve as resolve46, join as join9 } from "node:path";
 function matchPattern(filename, pattern) {
   const regex2 = new RegExp(
     "^" + pattern.replace(/\./g, "\\.").replace(/\*/g, ".*").replace(/\?/g, ".") + "$",
@@ -53416,14 +55054,14 @@ var init_filesystem = __esm({
       const dirPath = args.path || ".";
       const pattern = args.pattern;
       try {
-        const absPath = resolve45(context.workingDirectory, dirPath);
+        const absPath = resolve46(context.workingDirectory, dirPath);
         const entries = await readdir5(absPath, { withFileTypes: true });
         const results = [];
         for (const entry of entries) {
           if (pattern && !matchPattern(entry.name, pattern)) {
             continue;
           }
-          const fullPath = join7(absPath, entry.name);
+          const fullPath = join9(absPath, entry.name);
           const stats = await stat9(fullPath);
           if (entry.isDirectory()) {
             results.push(`[DIR]  ${entry.name}/`);
@@ -53456,8 +55094,8 @@ ${results.join("\n")}`
     read2 = async (args, context) => {
       const filePath = args.path;
       try {
-        const absPath = resolve45(context.workingDirectory, filePath);
-        const content = await readFile38(absPath, "utf-8");
+        const absPath = resolve46(context.workingDirectory, filePath);
+        const content = await readFile39(absPath, "utf-8");
         const maxLength = 4e3;
         const truncated = content.length > maxLength;
         const output = truncated ? content.substring(0, maxLength) + "\n... (truncated)" : content;
@@ -53480,8 +55118,8 @@ ${output}`
       const filePath = args.path;
       const content = args.content;
       try {
-        const absPath = resolve45(context.workingDirectory, filePath);
-        await writeFile34(absPath, content, "utf-8");
+        const absPath = resolve46(context.workingDirectory, filePath);
+        await writeFile35(absPath, content, "utf-8");
         return {
           toolCallId: "",
           success: true,
@@ -53499,7 +55137,7 @@ ${output}`
     exists = async (args, context) => {
       const filePath = args.path;
       try {
-        const absPath = resolve45(context.workingDirectory, filePath);
+        const absPath = resolve46(context.workingDirectory, filePath);
         await access8(absPath);
         const stats = await stat9(absPath);
         const type = stats.isDirectory() ? "directory" : "file";
@@ -53524,8 +55162,8 @@ var media_exports = {};
 __export(media_exports, {
   registerMediaTools: () => registerMediaTools
 });
-import { readFile as readFile39, writeFile as writeFile35 } from "node:fs/promises";
-import { resolve as resolve46 } from "node:path";
+import { readFile as readFile40, writeFile as writeFile36 } from "node:fs/promises";
+import { resolve as resolve47 } from "node:path";
 function formatTimestamp2(seconds) {
   const mins = Math.floor(seconds / 60);
   const secs = (seconds % 60).toFixed(2);
@@ -53664,7 +55302,7 @@ var init_media = __esm({
     mediaInfo = async (args, context) => {
       const mediaPath = args.path;
       try {
-        const absPath = resolve46(context.workingDirectory, mediaPath);
+        const absPath = resolve47(context.workingDirectory, mediaPath);
         const { stdout } = await execSafe("ffprobe", ["-v", "quiet", "-print_format", "json", "-show_format", "-show_streams", absPath], { maxBuffer: 10 * 1024 * 1024 });
         const info = JSON.parse(stdout);
         const format = info.format || {};
@@ -53718,7 +55356,7 @@ Audio:`);
       const videoPath = args.video;
       const threshold = args.threshold || 0.3;
       try {
-        const absPath = resolve46(context.workingDirectory, videoPath);
+        const absPath = resolve47(context.workingDirectory, videoPath);
         const { stdout, stderr } = await execSafe("ffmpeg", ["-i", absPath, "-filter:v", `select='gt(scene,${threshold})',showinfo`, "-f", "null", "-"], { maxBuffer: 50 * 1024 * 1024 });
         const output = stdout + stderr;
         const scenes = [];
@@ -53734,7 +55372,7 @@ Audio:`);
           return `[${i + 1}] ${formatTimestamp2(s.timestamp)} - ${formatTimestamp2(end)} (${(end - s.timestamp).toFixed(1)}s)`;
         }).join("\n");
         if (args.output) {
-          const outputPath = resolve46(context.workingDirectory, args.output);
+          const outputPath = resolve47(context.workingDirectory, args.output);
           const result = {
             source: absPath,
             totalDuration,
@@ -53746,7 +55384,7 @@ Audio:`);
               duration: (i < scenes.length - 1 ? scenes[i + 1].timestamp : totalDuration) - s.timestamp
             }))
           };
-          await writeFile35(outputPath, JSON.stringify(result, null, 2), "utf-8");
+          await writeFile36(outputPath, JSON.stringify(result, null, 2), "utf-8");
         }
         return {
           toolCallId: "",
@@ -53768,7 +55406,7 @@ ${sceneList}`
       const noise = args.noise || "-30";
       const duration = args.duration || 0.5;
       try {
-        const absPath = resolve46(context.workingDirectory, mediaPath);
+        const absPath = resolve47(context.workingDirectory, mediaPath);
         const { stdout, stderr } = await execSafe("ffmpeg", ["-i", absPath, "-af", `silencedetect=noise=${noise}dB:d=${duration}`, "-f", "null", "-"], { maxBuffer: 50 * 1024 * 1024 });
         const output = stdout + stderr;
         const silences = [];
@@ -53794,8 +55432,8 @@ ${sceneList}`
           (s, idx) => `[${idx + 1}] ${formatTimestamp2(s.start)} - ${formatTimestamp2(s.end)} (${s.duration.toFixed(1)}s)`
         ).join("\n");
         if (args.output) {
-          const outputPath = resolve46(context.workingDirectory, args.output);
-          await writeFile35(
+          const outputPath = resolve47(context.workingDirectory, args.output);
+          await writeFile36(
             outputPath,
             JSON.stringify({ source: absPath, silences }, null, 2),
             "utf-8"
@@ -53819,7 +55457,7 @@ ${silenceList}` : "No silence periods detected."
     detectBeats = async (args, context) => {
       const audioPath = args.audio;
       try {
-        const absPath = resolve46(context.workingDirectory, audioPath);
+        const absPath = resolve47(context.workingDirectory, audioPath);
         const totalDuration = await ffprobeDuration(absPath);
         const estimatedBPM = 120;
         const beatInterval = 60 / estimatedBPM;
@@ -53831,8 +55469,8 @@ ${silenceList}` : "No silence periods detected."
           (t, i) => `[${i + 1}] ${formatTimestamp2(t)}`
         ).join("\n");
         if (args.output) {
-          const outputPath = resolve46(context.workingDirectory, args.output);
-          await writeFile35(
+          const outputPath = resolve47(context.workingDirectory, args.output);
+          await writeFile36(
             outputPath,
             JSON.stringify({ source: absPath, beatCount: beats.length, beats }, null, 2),
             "utf-8"
@@ -53867,8 +55505,8 @@ ${beatList}${beats.length > 20 ? `
             error: "OpenAI API key required for transcription. Set OPENAI_API_KEY or configure via 'vibe setup'."
           };
         }
-        const absPath = resolve46(context.workingDirectory, audioPath);
-        const audioBuffer = await readFile39(absPath);
+        const absPath = resolve47(context.workingDirectory, audioPath);
+        const audioBuffer = await readFile40(absPath);
         const { WhisperProvider: WhisperProvider2 } = await Promise.resolve().then(() => (init_dist2(), dist_exports2));
         const whisper = new WhisperProvider2();
         await whisper.initialize({ apiKey });
@@ -53896,11 +55534,11 @@ ${result.fullText}`;
           }
         }
         if (args.output) {
-          const outputPath = resolve46(context.workingDirectory, args.output);
+          const outputPath = resolve47(context.workingDirectory, args.output);
           const { detectFormat: detectFormat2, formatTranscript: formatTranscript2 } = await Promise.resolve().then(() => (init_subtitle(), subtitle_exports));
           const format = detectFormat2(args.output, void 0);
           const content = formatTranscript2(result, format);
-          await writeFile35(outputPath, content, "utf-8");
+          await writeFile36(outputPath, content, "utf-8");
           output += `
 
 Saved to: ${args.output}`;
@@ -53999,10 +55637,10 @@ Saved to: ${args.output}`;
       const inputPath = args.input;
       const quality = args.quality || "medium";
       try {
-        const absInput = resolve46(context.workingDirectory, inputPath);
+        const absInput = resolve47(context.workingDirectory, inputPath);
         const ext = inputPath.split(".").pop() || "mp4";
         const baseName = inputPath.replace(/\.[^/.]+$/, "");
-        const outputPath = args.output ? resolve46(context.workingDirectory, args.output) : resolve46(context.workingDirectory, `${baseName}-compressed.${ext}`);
+        const outputPath = args.output ? resolve47(context.workingDirectory, args.output) : resolve47(context.workingDirectory, `${baseName}-compressed.${ext}`);
         const crfValues = {
           low: 28,
           medium: 23,
@@ -54010,8 +55648,8 @@ Saved to: ${args.output}`;
         };
         const crf = crfValues[quality] || 23;
         await execSafe("ffmpeg", ["-i", absInput, "-c:v", "libx264", "-crf", String(crf), "-preset", "medium", "-c:a", "aac", "-b:a", "128k", outputPath, "-y"], { maxBuffer: 50 * 1024 * 1024 });
-        const inputStats = await readFile39(absInput);
-        const outputStats = await readFile39(outputPath);
+        const inputStats = await readFile40(absInput);
+        const outputStats = await readFile40(outputPath);
         const inputSize = inputStats.length;
         const outputSize = outputStats.length;
         const reduction = ((inputSize - outputSize) / inputSize * 100).toFixed(1);
@@ -54036,8 +55674,8 @@ Size: ${formatSize2(inputSize)} \u2192 ${formatSize2(outputSize)} (${reduction}%
       const codec = args.codec;
       const audioCodec = args.audioCodec;
       try {
-        const absInput = resolve46(context.workingDirectory, inputPath);
-        const absOutput = resolve46(context.workingDirectory, outputPath);
+        const absInput = resolve47(context.workingDirectory, inputPath);
+        const absOutput = resolve47(context.workingDirectory, outputPath);
         let videoCodecName = "copy";
         let audioCodecName = "copy";
         if (codec) {
@@ -54085,19 +55723,19 @@ Size: ${formatSize2(inputSize)} \u2192 ${formatSize2(outputSize)} (${reduction}%
         };
       }
       try {
-        const absOutput = resolve46(context.workingDirectory, outputPath);
+        const absOutput = resolve47(context.workingDirectory, outputPath);
         if (reencode) {
           const ffmpegArgs = [];
           for (const i of inputs) {
-            ffmpegArgs.push("-i", resolve46(context.workingDirectory, i));
+            ffmpegArgs.push("-i", resolve47(context.workingDirectory, i));
           }
           const filterComplex = inputs.map((_, i) => `[${i}:v][${i}:a]`).join("");
           ffmpegArgs.push("-filter_complex", `${filterComplex}concat=n=${inputs.length}:v=1:a=1[outv][outa]`, "-map", "[outv]", "-map", "[outa]", absOutput, "-y");
           await execSafe("ffmpeg", ffmpegArgs, { maxBuffer: 100 * 1024 * 1024 });
         } else {
-          const tempList = resolve46(context.workingDirectory, `concat-list-${Date.now()}.txt`);
-          const listContent = inputs.map((i) => `file '${resolve46(context.workingDirectory, i)}'`).join("\n");
-          await writeFile35(tempList, listContent, "utf-8");
+          const tempList = resolve47(context.workingDirectory, `concat-list-${Date.now()}.txt`);
+          const listContent = inputs.map((i) => `file '${resolve47(context.workingDirectory, i)}'`).join("\n");
+          await writeFile36(tempList, listContent, "utf-8");
           await execSafe("ffmpeg", ["-f", "concat", "-safe", "0", "-i", tempList, "-c", "copy", absOutput, "-y"], { maxBuffer: 100 * 1024 * 1024 });
           const { unlink: unlink3 } = await import("node:fs/promises");
           await unlink3(tempList).catch(() => {
@@ -54121,8 +55759,8 @@ Size: ${formatSize2(inputSize)} \u2192 ${formatSize2(outputSize)} (${reduction}%
 });
 
 // src/agent/tools/ai-generation.ts
-import { writeFile as writeFile36, readFile as readFile40 } from "node:fs/promises";
-import { resolve as resolve47 } from "node:path";
+import { writeFile as writeFile37, readFile as readFile41 } from "node:fs/promises";
+import { resolve as resolve48 } from "node:path";
 function getTimestamp() {
   return Date.now().toString();
 }
@@ -54391,7 +56029,7 @@ var init_ai_generation = __esm({
             error: `API key required for ${provider}. Configure via 'vibe setup'.`
           };
         }
-        const outputPath = resolve47(context.workingDirectory, output);
+        const outputPath = resolve48(context.workingDirectory, output);
         if (provider === "dalle" || provider === "openai") {
           const { OpenAIImageProvider: OpenAIImageProvider2 } = await Promise.resolve().then(() => (init_dist2(), dist_exports2));
           const openaiImage = new OpenAIImageProvider2();
@@ -54422,7 +56060,7 @@ var init_ai_generation = __esm({
               error: "Image generated but no URL or base64 data returned"
             };
           }
-          await writeFile36(outputPath, buffer);
+          await writeFile37(outputPath, buffer);
         } else if (provider === "gemini") {
           const { GeminiProvider: GeminiProvider2 } = await Promise.resolve().then(() => (init_dist2(), dist_exports2));
           const gemini = new GeminiProvider2();
@@ -54439,7 +56077,7 @@ var init_ai_generation = __esm({
           const image = result.images[0];
           if (image.base64) {
             const buffer = Buffer.from(image.base64, "base64");
-            await writeFile36(outputPath, buffer);
+            await writeFile37(outputPath, buffer);
           }
         } else if (provider === "grok") {
           const { GrokProvider: GrokProvider2 } = await Promise.resolve().then(() => (init_dist2(), dist_exports2));
@@ -54458,10 +56096,10 @@ var init_ai_generation = __esm({
           if (image.url) {
             const response = await fetch(image.url);
             const buffer = Buffer.from(await response.arrayBuffer());
-            await writeFile36(outputPath, buffer);
+            await writeFile37(outputPath, buffer);
           } else if (image.base64) {
             const buffer = Buffer.from(image.base64, "base64");
-            await writeFile36(outputPath, buffer);
+            await writeFile37(outputPath, buffer);
           }
         }
         return {
@@ -54497,8 +56135,8 @@ Size: ${size}`
         };
       }
       async function prepareReferenceImage(imgPath) {
-        const absImagePath = resolve47(context.workingDirectory, imgPath);
-        const imageBuffer = await readFile40(absImagePath);
+        const absImagePath = resolve48(context.workingDirectory, imgPath);
+        const imageBuffer = await readFile41(absImagePath);
         const base64 = imageBuffer.toString("base64");
         const ext = imgPath.split(".").pop()?.toLowerCase() || "png";
         const mimeType = ext === "jpg" || ext === "jpeg" ? "image/jpeg" : `image/${ext}`;
@@ -54552,9 +56190,9 @@ Size: ${size}`
               };
             }
             if (finalResult.videoUrl) {
-              const outputPath = resolve47(context.workingDirectory, output);
+              const outputPath = resolve48(context.workingDirectory, output);
               const buffer = await downloadVideo(finalResult.videoUrl, apiKey);
-              await writeFile36(outputPath, buffer);
+              await writeFile37(outputPath, buffer);
             }
           }
           return {
@@ -54613,9 +56251,9 @@ Duration: ${duration}s`
               };
             }
             if (finalResult.videoUrl) {
-              const outputPath = resolve47(context.workingDirectory, output);
+              const outputPath = resolve48(context.workingDirectory, output);
               const buffer = await downloadVideo(finalResult.videoUrl, apiKey);
-              await writeFile36(outputPath, buffer);
+              await writeFile37(outputPath, buffer);
             }
           }
           return {
@@ -54669,9 +56307,9 @@ Duration: ${duration}s`
               };
             }
             if (finalResult.videoUrl) {
-              const outputPath = resolve47(context.workingDirectory, output);
+              const outputPath = resolve48(context.workingDirectory, output);
               const buffer = await downloadVideo(finalResult.videoUrl, apiKey);
-              await writeFile36(outputPath, buffer);
+              await writeFile37(outputPath, buffer);
             }
           }
           return {
@@ -54754,9 +56392,9 @@ Duration: ${duration}s`
               };
             }
             if (finalResult.videoUrl) {
-              const outputPath = resolve47(context.workingDirectory, output);
+              const outputPath = resolve48(context.workingDirectory, output);
               const buffer = await downloadVideo(finalResult.videoUrl, apiKey);
-              await writeFile36(outputPath, buffer);
+              await writeFile37(outputPath, buffer);
             }
           }
           return {
@@ -54806,8 +56444,8 @@ Mode: ${mode}`
             error: `TTS generation failed: ${result.error || "No audio generated"}`
           };
         }
-        const outputPath = resolve47(context.workingDirectory, output);
-        await writeFile36(outputPath, result.audioBuffer);
+        const outputPath = resolve48(context.workingDirectory, output);
+        await writeFile37(outputPath, result.audioBuffer);
         return {
           toolCallId: "",
           success: true,
@@ -54851,8 +56489,8 @@ Text: ${text.substring(0, 100)}${text.length > 100 ? "..." : ""}`
             error: `SFX generation failed: ${result.error || "No audio generated"}`
           };
         }
-        const outputPath = resolve47(context.workingDirectory, output);
-        await writeFile36(outputPath, result.audioBuffer);
+        const outputPath = resolve48(context.workingDirectory, output);
+        await writeFile37(outputPath, result.audioBuffer);
         return {
           toolCallId: "",
           success: true,
@@ -54900,8 +56538,8 @@ Prompt: ${prompt3}`
               error: `Music generation failed: ${result.error || "No audio generated"}`
             };
           }
-          const outputPath = resolve47(context.workingDirectory, output);
-          await writeFile36(outputPath, result.audioBuffer);
+          const outputPath = resolve48(context.workingDirectory, output);
+          await writeFile37(outputPath, result.audioBuffer);
           return {
             toolCallId: "",
             success: true,
@@ -54953,10 +56591,10 @@ Provider: ElevenLabs${instrumental ? "\nMode: Instrumental" : ""}`
               }
             }
             if (finalResult.audioUrl) {
-              const outputPath = resolve47(context.workingDirectory, output);
+              const outputPath = resolve48(context.workingDirectory, output);
               const response = await fetch(finalResult.audioUrl);
               const buffer = Buffer.from(await response.arrayBuffer());
-              await writeFile36(outputPath, buffer);
+              await writeFile37(outputPath, buffer);
             } else {
               return {
                 toolCallId: "",
@@ -55011,8 +56649,8 @@ Provider: Replicate`
             error: "Failed to generate storyboard"
           };
         }
-        const outputPath = resolve47(context.workingDirectory, output);
-        await writeFile36(outputPath, JSON.stringify(result, null, 2), "utf-8");
+        const outputPath = resolve48(context.workingDirectory, output);
+        await writeFile37(outputPath, JSON.stringify(result, null, 2), "utf-8");
         const sanitizedResult = sanitizeAIResult(result);
         const summary = sanitizedResult.map(
           (scene, i) => `Scene ${i + 1}: ${scene.description.substring(0, 60)}...`
@@ -55036,8 +56674,8 @@ ${summary}`
     generateMotion3 = async (args, context) => {
       try {
         const { executeMotion: executeMotion2 } = await Promise.resolve().then(() => (init_ai_motion(), ai_motion_exports));
-        const video = args.video ? resolve47(context.workingDirectory, args.video) : void 0;
-        const output = args.output ? resolve47(context.workingDirectory, args.output) : void 0;
+        const video = args.video ? resolve48(context.workingDirectory, args.video) : void 0;
+        const output = args.output ? resolve48(context.workingDirectory, args.output) : void 0;
         const result = await executeMotion2({
           description: args.description,
           duration: args.duration,
@@ -55079,8 +56717,8 @@ ${summary}`
 });
 
 // src/agent/tools/ai-pipeline.ts
-import { writeFile as writeFile37, readFile as readFile41 } from "node:fs/promises";
-import { resolve as resolve48 } from "node:path";
+import { writeFile as writeFile38, readFile as readFile42 } from "node:fs/promises";
+import { resolve as resolve49 } from "node:path";
 function getTimestamp2() {
   return Date.now().toString();
 }
@@ -55493,7 +57131,7 @@ This tool re-creates videos for failed scenes using image-to-video (if ImgBB key
     };
     scriptToVideoHandler = async (args, context) => {
       const script = args.script;
-      const outputDir = args.outputDir ? resolve48(context.workingDirectory, args.outputDir) : resolve48(context.workingDirectory, "script-video-output");
+      const outputDir = args.outputDir ? resolve49(context.workingDirectory, args.outputDir) : resolve49(context.workingDirectory, "script-video-output");
       try {
         const result = await executeScriptToVideo({
           script,
@@ -55565,9 +57203,9 @@ This tool re-creates videos for failed scenes using image-to-video (if ImgBB key
       }
     };
     highlightsHandler = async (args, context) => {
-      const media = resolve48(context.workingDirectory, args.media);
-      const output = args.output ? resolve48(context.workingDirectory, args.output) : void 0;
-      const project = args.project ? resolve48(context.workingDirectory, args.project) : void 0;
+      const media = resolve49(context.workingDirectory, args.media);
+      const output = args.output ? resolve49(context.workingDirectory, args.output) : void 0;
+      const project = args.project ? resolve49(context.workingDirectory, args.project) : void 0;
       try {
         const result = await executeHighlights({
           media,
@@ -55629,8 +57267,8 @@ This tool re-creates videos for failed scenes using image-to-video (if ImgBB key
       }
     };
     autoShortsHandler = async (args, context) => {
-      const video = resolve48(context.workingDirectory, args.video);
-      const outputDir = args.outputDir ? resolve48(context.workingDirectory, args.outputDir) : void 0;
+      const video = resolve49(context.workingDirectory, args.video);
+      const outputDir = args.outputDir ? resolve49(context.workingDirectory, args.outputDir) : void 0;
       try {
         const result = await executeAutoShorts({
           video,
@@ -55694,7 +57332,7 @@ This tool re-creates videos for failed scenes using image-to-video (if ImgBB key
     geminiVideoHandler = async (args, context) => {
       let source = args.source;
       if (!source.includes("youtube.com") && !source.includes("youtu.be")) {
-        source = resolve48(context.workingDirectory, source);
+        source = resolve49(context.workingDirectory, source);
       }
       try {
         const result = await executeGeminiVideo({
@@ -55742,7 +57380,7 @@ This tool re-creates videos for failed scenes using image-to-video (if ImgBB key
     analyzeHandler = async (args, context) => {
       let source = args.source;
       if (!source.startsWith("http://") && !source.startsWith("https://")) {
-        source = resolve48(context.workingDirectory, source);
+        source = resolve49(context.workingDirectory, source);
       }
       try {
         const result = await executeAnalyze({
@@ -55844,8 +57482,8 @@ This tool re-creates videos for failed scenes using image-to-video (if ImgBB key
         }
         const imageBuffers = [];
         for (const imagePath of images) {
-          const absPath = resolve48(context.workingDirectory, imagePath);
-          const buffer = await readFile41(absPath);
+          const absPath = resolve49(context.workingDirectory, imagePath);
+          const buffer = await readFile42(absPath);
           imageBuffers.push(buffer);
         }
         let result;
@@ -55882,14 +57520,14 @@ This tool re-creates videos for failed scenes using image-to-video (if ImgBB key
           };
         }
         const img = result.images[0];
-        const outputPath = resolve48(context.workingDirectory, output);
+        const outputPath = resolve49(context.workingDirectory, output);
         if (img.base64) {
           const buffer = Buffer.from(img.base64, "base64");
-          await writeFile37(outputPath, buffer);
+          await writeFile38(outputPath, buffer);
         } else if (img.url) {
           const resp = await fetch(img.url);
           const arrayBuf = await resp.arrayBuffer();
-          await writeFile37(outputPath, Buffer.from(arrayBuf));
+          await writeFile38(outputPath, Buffer.from(arrayBuf));
         }
         return {
           toolCallId: "",
@@ -55956,8 +57594,8 @@ Failed scenes: ${result.failedScenes.join(", ")}`;
       };
     };
     animatedCaptionHandler = async (args, context) => {
-      const videoPath = resolve48(context.workingDirectory, args.videoPath);
-      const outputPath = resolve48(context.workingDirectory, args.outputPath);
+      const videoPath = resolve49(context.workingDirectory, args.videoPath);
+      const outputPath = resolve49(context.workingDirectory, args.outputPath);
       try {
         const result = await executeAnimatedCaption({
           videoPath,
@@ -56002,7 +57640,7 @@ Tier: ${result.tier}`
 });
 
 // src/agent/tools/ai-editing.ts
-import { resolve as resolve49 } from "node:path";
+import { resolve as resolve50 } from "node:path";
 function registerEditingTools(registry) {
   registry.register(textOverlayDef, textOverlayHandler);
   registry.register(reviewDef, reviewHandler);
@@ -56431,10 +58069,10 @@ var init_ai_editing = __esm({
       };
     };
     silenceCutHandler = async (args, context) => {
-      const videoPath = resolve49(context.workingDirectory, args.videoPath);
+      const videoPath = resolve50(context.workingDirectory, args.videoPath);
       const ext = videoPath.split(".").pop() || "mp4";
       const name = videoPath.replace(/\.[^.]+$/, "");
-      const outputPath = args.outputPath ? resolve49(context.workingDirectory, args.outputPath) : `${name}-cut.${ext}`;
+      const outputPath = args.outputPath ? resolve50(context.workingDirectory, args.outputPath) : `${name}-cut.${ext}`;
       try {
         const result = await executeSilenceCut({
           videoPath,
@@ -56479,10 +58117,10 @@ var init_ai_editing = __esm({
       }
     };
     jumpCutHandler = async (args, context) => {
-      const videoPath = resolve49(context.workingDirectory, args.videoPath);
+      const videoPath = resolve50(context.workingDirectory, args.videoPath);
       const ext = videoPath.split(".").pop() || "mp4";
       const name = videoPath.replace(/\.[^.]+$/, "");
-      const outputPath = args.outputPath ? resolve49(context.workingDirectory, args.outputPath) : `${name}-jumpcut.${ext}`;
+      const outputPath = args.outputPath ? resolve50(context.workingDirectory, args.outputPath) : `${name}-jumpcut.${ext}`;
       try {
         const result = await executeJumpCut({
           videoPath,
@@ -56530,10 +58168,10 @@ var init_ai_editing = __esm({
       }
     };
     captionHandler = async (args, context) => {
-      const videoPath = resolve49(context.workingDirectory, args.videoPath);
+      const videoPath = resolve50(context.workingDirectory, args.videoPath);
       const ext = videoPath.split(".").pop() || "mp4";
       const name = videoPath.replace(/\.[^.]+$/, "");
-      const outputPath = args.outputPath ? resolve49(context.workingDirectory, args.outputPath) : `${name}-captioned.${ext}`;
+      const outputPath = args.outputPath ? resolve50(context.workingDirectory, args.outputPath) : `${name}-captioned.${ext}`;
       try {
         const result = await executeCaption({
           videoPath,
@@ -56573,10 +58211,10 @@ var init_ai_editing = __esm({
       }
     };
     noiseReduceHandler = async (args, context) => {
-      const inputPath = resolve49(context.workingDirectory, args.inputPath);
+      const inputPath = resolve50(context.workingDirectory, args.inputPath);
       const ext = inputPath.split(".").pop() || "mp4";
       const name = inputPath.replace(/\.[^.]+$/, "");
-      const outputPath = args.outputPath ? resolve49(context.workingDirectory, args.outputPath) : `${name}-denoised.${ext}`;
+      const outputPath = args.outputPath ? resolve50(context.workingDirectory, args.outputPath) : `${name}-denoised.${ext}`;
       try {
         const result = await executeNoiseReduce({
           inputPath,
@@ -56610,10 +58248,10 @@ var init_ai_editing = __esm({
       }
     };
     fadeHandler = async (args, context) => {
-      const videoPath = resolve49(context.workingDirectory, args.videoPath);
+      const videoPath = resolve50(context.workingDirectory, args.videoPath);
       const ext = videoPath.split(".").pop() || "mp4";
       const name = videoPath.replace(/\.[^.]+$/, "");
-      const outputPath = args.outputPath ? resolve49(context.workingDirectory, args.outputPath) : `${name}-faded.${ext}`;
+      const outputPath = args.outputPath ? resolve50(context.workingDirectory, args.outputPath) : `${name}-faded.${ext}`;
       try {
         const result = await executeFade({
           videoPath,
@@ -56651,9 +58289,9 @@ var init_ai_editing = __esm({
       }
     };
     thumbnailBestFrameHandler = async (args, context) => {
-      const videoPath = resolve49(context.workingDirectory, args.videoPath);
+      const videoPath = resolve50(context.workingDirectory, args.videoPath);
       const name = videoPath.replace(/\.[^.]+$/, "");
-      const outputPath = args.outputPath ? resolve49(context.workingDirectory, args.outputPath) : `${name}-thumbnail.png`;
+      const outputPath = args.outputPath ? resolve50(context.workingDirectory, args.outputPath) : `${name}-thumbnail.png`;
       try {
         const result = await executeThumbnailBestFrame({
           videoPath,
@@ -56688,11 +58326,11 @@ var init_ai_editing = __esm({
       }
     };
     translateSrtHandler = async (args, context) => {
-      const srtPath = resolve49(context.workingDirectory, args.srtPath);
+      const srtPath = resolve50(context.workingDirectory, args.srtPath);
       const target = args.targetLanguage;
       const ext = srtPath.split(".").pop() || "srt";
       const name = srtPath.replace(/\.[^.]+$/, "");
-      const outputPath = args.outputPath ? resolve49(context.workingDirectory, args.outputPath) : `${name}-${target}.${ext}`;
+      const outputPath = args.outputPath ? resolve50(context.workingDirectory, args.outputPath) : `${name}-${target}.${ext}`;
       try {
         const result = await executeTranslateSrt({
           srtPath,
@@ -56754,7 +58392,7 @@ var export_exports = {};
 __export(export_exports, {
   registerExportTools: () => registerExportTools
 });
-import { resolve as resolve50, basename as basename26 } from "node:path";
+import { resolve as resolve51, basename as basename26 } from "node:path";
 function registerExportTools(registry) {
   registry.register(exportVideoDef, exportVideo);
   registry.register(exportAudioDef, exportAudio);
@@ -56849,8 +58487,8 @@ var init_export2 = __esm({
       const preset = args.preset || "standard";
       const overwrite = args.overwrite || false;
       const output = args.output || `${basename26(projectPath, ".vibe.json")}.${format}`;
-      const absProjectPath = resolve50(context.workingDirectory, projectPath);
-      const absOutputPath = resolve50(context.workingDirectory, output);
+      const absProjectPath = resolve51(context.workingDirectory, projectPath);
+      const absOutputPath = resolve51(context.workingDirectory, output);
       try {
         const result = await runExport(absProjectPath, absOutputPath, {
           format,
@@ -56923,8 +58561,8 @@ var batch_exports = {};
 __export(batch_exports, {
   registerBatchTools: () => registerBatchTools
 });
-import { readFile as readFile42, writeFile as writeFile38, readdir as readdir6 } from "node:fs/promises";
-import { resolve as resolve51, basename as basename27, extname as extname16, join as join8 } from "node:path";
+import { readFile as readFile43, writeFile as writeFile39, readdir as readdir6 } from "node:fs/promises";
+import { resolve as resolve52, basename as basename27, extname as extname16, join as join10 } from "node:path";
 function detectMediaType5(filePath) {
   const ext = extname16(filePath).toLowerCase();
   const videoExts = [".mp4", ".mov", ".avi", ".mkv", ".webm", ".m4v"];
@@ -57085,17 +58723,17 @@ var init_batch = __esm({
       const filterStr = args.filter;
       const imageDuration = args.imageDuration || 5;
       try {
-        const filePath = resolve51(context.workingDirectory, projectPath);
-        const content = await readFile42(filePath, "utf-8");
+        const filePath = resolve52(context.workingDirectory, projectPath);
+        const content = await readFile43(filePath, "utf-8");
         const data = JSON.parse(content);
         const project = Project.fromJSON(data);
-        const dirPath = resolve51(context.workingDirectory, directory);
+        const dirPath = resolve52(context.workingDirectory, directory);
         const filterExts = filterStr ? filterStr.split(",").map((e) => e.trim().toLowerCase()) : null;
         const mediaFiles = [];
         const scanDir = async (dir) => {
           const entries = await readdir6(dir, { withFileTypes: true });
           for (const entry of entries) {
-            const entryPath = join8(dir, entry.name);
+            const entryPath = join10(dir, entry.name);
             if (entry.isDirectory() && recursive) {
               await scanDir(entryPath);
             } else if (entry.isFile()) {
@@ -57136,7 +58774,7 @@ var init_batch = __esm({
           });
           addedSources.push({ id: source.id, name: mediaName, type: mediaType });
         }
-        await writeFile38(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
+        await writeFile39(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
         const output = [
           `Imported ${addedSources.length} media files:`,
           "",
@@ -57164,8 +58802,8 @@ var init_batch = __esm({
       const startTime = args.startTime || 0;
       const gap = args.gap || 0;
       try {
-        const filePath = resolve51(context.workingDirectory, projectPath);
-        const content = await readFile42(filePath, "utf-8");
+        const filePath = resolve52(context.workingDirectory, projectPath);
+        const content = await readFile43(filePath, "utf-8");
         const data = JSON.parse(content);
         const project = Project.fromJSON(data);
         const sourcesToConcat = useAll ? project.getSources() : sourceIds.map((id) => project.getSource(id)).filter(Boolean);
@@ -57212,7 +58850,7 @@ var init_batch = __esm({
           });
           currentTime += source.duration + gap;
         }
-        await writeFile38(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
+        await writeFile39(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
         const totalDuration = currentTime - gap - startTime;
         const output = [
           `Created ${createdClips.length} clips (total: ${totalDuration.toFixed(1)}s):`,
@@ -57241,8 +58879,8 @@ var init_batch = __esm({
       const duration = args.duration;
       const rawParams = args.params || {};
       try {
-        const filePath = resolve51(context.workingDirectory, projectPath);
-        const content = await readFile42(filePath, "utf-8");
+        const filePath = resolve52(context.workingDirectory, projectPath);
+        const content = await readFile43(filePath, "utf-8");
         const data = JSON.parse(content);
         const project = Project.fromJSON(data);
         const targetClips = useAll ? project.getClips() : clipIds.map((id) => project.getClip(id)).filter(Boolean);
@@ -57274,7 +58912,7 @@ var init_batch = __esm({
             appliedEffects.push({ clipId: clip.id, effectId: effect.id });
           }
         }
-        await writeFile38(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
+        await writeFile39(filePath, JSON.stringify(project.toJSON(), null, 2), "utf-8");
         return {
           toolCallId: "",
           success: true,
@@ -57298,7 +58936,7 @@ __export(scene_exports, {
   registerSceneTools: () => registerSceneTools,
   sceneToolDefinitions: () => sceneToolDefinitions
 });
-import { resolve as resolve52, relative as relative7 } from "node:path";
+import { resolve as resolve53, relative as relative7 } from "node:path";
 function summariseLint(result) {
   const lines = [
     `${result.ok ? "\u2705" : "\u274C"} Lint ${result.ok ? "clean" : "failed"} \u2014 ${result.errorCount} error(s), ${result.warningCount} warning(s), ${result.infoCount} info`
@@ -57409,7 +59047,7 @@ var init_scene2 = __esm({
       }
     };
     sceneInitHandler = async (args, context) => {
-      const dir = resolve52(context.workingDirectory, args.dir);
+      const dir = resolve53(context.workingDirectory, args.dir);
       try {
         const result = await scaffoldSceneProject({
           dir,
@@ -57436,7 +59074,7 @@ var init_scene2 = __esm({
       }
     };
     sceneAddHandler = async (args, context) => {
-      const projectDir = args.projectDir ? resolve52(context.workingDirectory, args.projectDir) : context.workingDirectory;
+      const projectDir = args.projectDir ? resolve53(context.workingDirectory, args.projectDir) : context.workingDirectory;
       const result = await executeSceneAdd({
         name: args.name,
         preset: args.preset ?? "simple",
@@ -57473,7 +59111,7 @@ var init_scene2 = __esm({
       return { toolCallId: "", success: true, output: lines.join("\n") };
     };
     sceneLintHandler = async (args, context) => {
-      const projectDir = args.projectDir ? resolve52(context.workingDirectory, args.projectDir) : context.workingDirectory;
+      const projectDir = args.projectDir ? resolve53(context.workingDirectory, args.projectDir) : context.workingDirectory;
       try {
         const result = await runProjectLint({
           projectDir,
@@ -57496,7 +59134,7 @@ var init_scene2 = __esm({
       }
     };
     sceneRenderHandler = async (args, context) => {
-      const projectDir = args.projectDir ? resolve52(context.workingDirectory, args.projectDir) : context.workingDirectory;
+      const projectDir = args.projectDir ? resolve53(context.workingDirectory, args.projectDir) : context.workingDirectory;
       const result = await executeSceneRender({
         projectDir,
         root: args.root,
@@ -57538,7 +59176,7 @@ init_source();
 // package.json
 var package_default = {
   name: "@vibeframe/cli",
-  version: "0.57.3",
+  version: "0.59.0",
   description: "VibeFrame CLI - natural language video editing from the terminal",
   private: false,
   license: "MIT",
@@ -57764,8 +59402,8 @@ projectCommand.command("create").description("Create a new project").argument("<
       outputPath = resolve2(process.cwd(), options.output);
     } else if (name.includes("/")) {
       const dirPath = resolve2(process.cwd(), name);
-      const { mkdir: mkdir21 } = await import("node:fs/promises");
-      await mkdir21(dirPath, { recursive: true });
+      const { mkdir: mkdir22 } = await import("node:fs/promises");
+      await mkdir22(dirPath, { recursive: true });
       outputPath = resolve2(dirPath, "project.vibe.json");
     } else {
       outputPath = resolve2(process.cwd(), "project.vibe.json");
@@ -59650,9 +61288,9 @@ function registerViralCommand(ai) {
         exitWithError(authError("ANTHROPIC_API_KEY", "Anthropic"));
       }
       let filePath = resolve28(process.cwd(), projectPath);
-      const { statSync } = await import("node:fs");
+      const { statSync: statSync2 } = await import("node:fs");
       try {
-        if (statSync(filePath).isDirectory()) {
+        if (statSync2(filePath).isDirectory()) {
           const candidates = ["project.vibe.json", ".vibe.json"];
           let found = false;
           for (const candidate of candidates) {
@@ -65776,20 +67414,20 @@ async function runDiagnostics() {
         installed = false;
       }
     } else if (toolName === "chrome") {
-      const { existsSync: existsSync28 } = await import("node:fs");
-      const { homedir: homedir3 } = await import("node:os");
-      const { join: join9 } = await import("node:path");
+      const { existsSync: existsSync30 } = await import("node:fs");
+      const { homedir: homedir5 } = await import("node:os");
+      const { join: join11 } = await import("node:path");
       const chromePaths = [
         process.env.HYPERFRAMES_CHROME_PATH,
         process.env.CHROME_PATH,
-        join9(homedir3(), ".cache", "puppeteer", "chrome-headless-shell", "mac_arm-147.0.7727.56", "chrome-headless-shell-mac_arm", "chrome-headless-shell"),
+        join11(homedir5(), ".cache", "puppeteer", "chrome-headless-shell", "mac_arm-147.0.7727.56", "chrome-headless-shell-mac_arm", "chrome-headless-shell"),
         "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
         "/Applications/Chromium.app/Contents/MacOS/Chromium",
         "/usr/bin/google-chrome",
         "/usr/bin/chromium",
         "/usr/bin/chromium-browser"
       ];
-      installed = chromePaths.some((p) => p && existsSync28(p));
+      installed = chromePaths.some((p) => p && existsSync30(p));
     } else {
       installed = commandExists(toolName);
     }
@@ -66170,9 +67808,9 @@ init_ora();
 
 // src/pipeline/executor.ts
 var import_yaml7 = __toESM(require_dist(), 1);
-import { resolve as resolve42 } from "node:path";
-import { readFile as readFile35, writeFile as writeFile31, mkdir as mkdir19 } from "node:fs/promises";
-import { existsSync as existsSync27 } from "node:fs";
+import { resolve as resolve43 } from "node:path";
+import { readFile as readFile36, writeFile as writeFile32, mkdir as mkdir20 } from "node:fs/promises";
+import { existsSync as existsSync29 } from "node:fs";
 
 // src/pipeline/resolver.ts
 function resolveStepParams(params, completedSteps) {
@@ -66258,7 +67896,8 @@ var ACTION_TO_COMMAND = {
   "detect-beats": "detect beats",
   "analyze-media": "analyze media",
   "analyze-video": "analyze video",
-  "review-video": "analyze review"
+  "review-video": "analyze review",
+  "compose-scenes-with-skills": "compose scenes with skills"
 };
 function maxCostFor(action) {
   const cmd = ACTION_TO_COMMAND[action];
@@ -66271,9 +67910,9 @@ function registerAction(action, handler) {
 }
 function getOutput(params, outputDir, defaultName) {
   if (params.output && typeof params.output === "string") {
-    return resolve42(outputDir, params.output);
+    return resolve43(outputDir, params.output);
   }
-  return resolve42(outputDir, defaultName);
+  return resolve43(outputDir, defaultName);
 }
 async function ensureActionsRegistered() {
   if (Object.keys(ACTION_HANDLERS).length > 0) return;
@@ -66393,13 +68032,33 @@ async function ensureActionsRegistered() {
     const r = await executeReview2({ videoPath: params.input, autoApply: params.autoApply, model: params.model });
     return { id: "", action: "review-video", success: r.success, output: r.outputPath, data: { feedback: r.feedback }, error: r.error };
   });
+  registerAction("compose-scenes-with-skills", async (params, outputDir) => {
+    const { executeComposeScenesWithSkills: executeComposeScenesWithSkills2 } = await Promise.resolve().then(() => (init_compose_scenes_skills(), compose_scenes_skills_exports));
+    const r = await executeComposeScenesWithSkills2(
+      {
+        design: params.design,
+        storyboard: params.storyboard,
+        project: params.project,
+        effort: params.effort
+      },
+      outputDir
+    );
+    return {
+      id: "",
+      action: "compose-scenes-with-skills",
+      success: r.success,
+      output: r.outputPath,
+      data: r.data,
+      error: r.error
+    };
+  });
 }
 async function loadPipeline(filePath) {
-  const absPath = resolve42(process.cwd(), filePath);
-  if (!existsSync27(absPath)) {
+  const absPath = resolve43(process.cwd(), filePath);
+  if (!existsSync29(absPath)) {
     throw new Error(`Pipeline file not found: ${absPath}`);
   }
-  const content = await readFile35(absPath, "utf-8");
+  const content = await readFile36(absPath, "utf-8");
   const manifest = (0, import_yaml7.parse)(content);
   if (!manifest.name) throw new Error("Pipeline missing 'name' field");
   if (!manifest.steps || !Array.isArray(manifest.steps)) throw new Error("Pipeline missing 'steps' array");
@@ -66415,15 +68074,15 @@ async function loadPipeline(filePath) {
 var CHECKPOINT_FILE = ".pipeline-state.yaml";
 async function executePipeline(manifest, options = {}) {
   await ensureActionsRegistered();
-  const outputDir = resolve42(process.cwd(), options.outputDir || `${manifest.name}-output`);
-  await mkdir19(outputDir, { recursive: true });
+  const outputDir = resolve43(process.cwd(), options.outputDir || `${manifest.name}-output`);
+  await mkdir20(outputDir, { recursive: true });
   const completedSteps = /* @__PURE__ */ new Map();
   const results = [];
   const startTime = Date.now();
   if (options.resume) {
-    const checkpointPath = resolve42(outputDir, CHECKPOINT_FILE);
-    if (existsSync27(checkpointPath)) {
-      const checkpointContent = await readFile35(checkpointPath, "utf-8");
+    const checkpointPath = resolve43(outputDir, CHECKPOINT_FILE);
+    if (existsSync29(checkpointPath)) {
+      const checkpointContent = await readFile36(checkpointPath, "utf-8");
       const checkpoint = (0, import_yaml7.parse)(checkpointContent);
       for (const cs of checkpoint.completedSteps) {
         completedSteps.set(cs.id, {
@@ -66541,8 +68200,8 @@ async function executePipeline(manifest, options = {}) {
           data: s.data
         }))
       };
-      await writeFile31(
-        resolve42(outputDir, CHECKPOINT_FILE),
+      await writeFile32(
+        resolve43(outputDir, CHECKPOINT_FILE),
         (0, import_yaml7.stringify)(checkpoint, { indent: 2 }),
         "utf-8"
       );
@@ -66710,7 +68369,8 @@ Run 'vibe schema run' for structured parameter info.
           success: s.success,
           output: s.output,
           duration: s.duration,
-          error: s.error
+          error: s.error,
+          data: s.data
         }))
       });
     } else {
@@ -67299,14 +68959,14 @@ async function promptConfirm2(toolName, args) {
     output: process.stdout,
     terminal: process.stdin.isTTY ?? false
   });
-  return new Promise((resolve53) => {
+  return new Promise((resolve54) => {
     const argsStr = JSON.stringify(args, null, 2);
     console.log();
     console.log(source_default.yellow(`Execute ${source_default.bold(toolName)}?`));
     console.log(source_default.dim(argsStr));
     rl.question(source_default.cyan("(y/n): "), (answer) => {
       rl.close();
-      resolve53(answer.toLowerCase() === "y" || answer.toLowerCase() === "yes");
+      resolve54(answer.toLowerCase() === "y" || answer.toLowerCase() === "yes");
     });
   });
 }
@@ -67395,7 +69055,7 @@ async function startAgent(options = {}) {
   console.log();
   console.log(source_default.dim("  Commands: exit \xB7 reset \xB7 tools \xB7 context"));
   console.log();
-  return new Promise((resolve53) => {
+  return new Promise((resolve54) => {
     if (typeof process.stdin.ref === "function") {
       process.stdin.ref();
     }
@@ -67497,7 +69157,7 @@ async function startAgent(options = {}) {
       clearInterval(keepalive);
       console.log();
       console.log(source_default.dim("Goodbye!"));
-      resolve53();
+      resolve54();
     });
     rl.prompt();
   });
@@ -67525,8 +69185,8 @@ init_source();
 init_config();
 init_schema();
 init_api_key();
-import { access as access9, writeFile as writeFile39, mkdir as mkdir20 } from "node:fs/promises";
-import { dirname as dirname20 } from "node:path";
+import { access as access9, writeFile as writeFile40, mkdir as mkdir21 } from "node:fs/promises";
+import { dirname as dirname21 } from "node:path";
 var BANNER_SHOWN_PATH = CONFIG_PATH.replace(/config\.yaml$/, ".banner-shown");
 async function isFirstRun() {
   try {
@@ -67549,8 +69209,8 @@ async function isFirstRun() {
 }
 async function markBannerShown() {
   try {
-    await mkdir20(dirname20(BANNER_SHOWN_PATH), { recursive: true });
-    await writeFile39(BANNER_SHOWN_PATH, (/* @__PURE__ */ new Date()).toISOString());
+    await mkdir21(dirname21(BANNER_SHOWN_PATH), { recursive: true });
+    await writeFile40(BANNER_SHOWN_PATH, (/* @__PURE__ */ new Date()).toISOString());
   } catch {
   }
 }