@vanillaskyai/video 0.9.0 → 0.10.1

package/dist/{chunk-LH4BPALA.js → chunk-IIN5M5HW.js}

@@ -135,62 +135,9 @@ var GENERATED_BUILTIN_TEMPLATE_CATALOG = [
       "additionalProperties": false
     }
   },
-  {
-    "label": "Focus cards",
-    "description": "Two to four short phrases fade in sequentially on black; no boxes or heading.",
-    "usesGlobalTextEffect": false,
-    "usesGlobalTransition": false,
-    "usesGlobalBackgroundEffect": false,
-    "textCanvas": "tight",
-    "id": "focusCards",
-    "family": "Explainers",
-    "jobs": [
-      "setup",
-      "proof"
-    ],
-    "register": "card-led",
-    "useWhen": "Two to four short parallel points support an explanation. ",
-    "avoidWhen": "The points require an order, long paragraphs, numerical data or additional images to make sense.",
-    "minDuration": 4,
-    "preferredDuration": 5,
-    "timing": {
-      "contentFields": [
-        "items"
-      ],
-      "contentUnit": "items",
-      "revealSeconds": 2.4,
-      "holdSeconds": 1.8,
-      "exitSeconds": 0
-    },
-    "schema": {
-      "type": "object",
-      "properties": {
-        "items": {
-          "type": "array",
-          "minItems": 2,
-          "maxItems": 4,
-          "items": {
-            "type": "string",
-            "minLength": 1,
-            "maxLength": 55
-          },
-          "default": [
-            "Listen closely",
-            "Notice the pattern",
-            "Make room for change"
-          ],
-          "description": "2\u20134 parallel phrases, about 2\u20136 words each; no heading or numbering."
-        }
-      },
-      "required": [
-        "items"
-      ],
-      "additionalProperties": false
-    }
-  },
   {
     "label": "Timeline",
-    "description": "Three to five events on a fine continuous line on black; without dates.",
+    "description": "Three to five events on a fine continuous line over relevant media or black; without dates.",
     "usesGlobalTextEffect": false,
     "usesGlobalTransition": false,
     "usesGlobalBackgroundEffect": false,
@@ -248,12 +195,59 @@ var GENERATED_BUILTIN_TEMPLATE_CATALOG = [
             }
           ],
           "description": "3\u20135 ordered events or actions, each with one short label; no dates."
+        },
+        "mediaKeyword": {
+          "type": "string",
+          "format": "stock-media-keyword",
+          "minLength": 1,
+          "maxLength": 80,
+          "description": "2\u20138 word literal subject/action search intent, maximum 80 characters. Host resolves URLs.",
+          "examples": [
+            "Ocean waves breaking on a rocky shore"
+          ]
+        },
+        "mediaUrl": {
+          "type": "string",
+          "format": "uri",
+          "description": "Host-only approved photo or video URL.",
+          "default": ""
+        },
+        "mediaType": {
+          "type": "string",
+          "enum": [
+            "photo",
+            "video"
+          ],
+          "default": "video",
+          "description": "Host-resolved asset kind."
+        },
+        "mediaPoster": {
+          "type": "string",
+          "format": "uri",
+          "description": "Host-only approved poster URL for video decoding.",
+          "default": ""
+        },
+        "shotDirection": {
+          "type": "string",
+          "maxLength": 220,
+          "description": "Optional action, framing and continuity for generation. Preserve the subject; do not request rendered text."
+        },
+        "mediaSource": {
+          "type": "string",
+          "enum": [
+            "generate",
+            "stock"
+          ],
+          "description": "Generate distinctive illustrative shots; use approved stock for familiar observable subjects."
         }
       },
       "required": [
         "events"
       ],
-      "additionalProperties": false
+      "additionalProperties": false,
+      "x-vanillasky": {
+        "allowsStockMedia": true
+      }
     }
   },
   {
@@ -354,7 +348,7 @@ var GENERATED_BUILTIN_TEMPLATE_CATALOG = [
   },
   {
     "label": "Comparison",
-    "description": "Two short statements with equal weight on black, side by side or stacked in portrait.",
+    "description": "Two short statements with equal weight over relevant media or black, side by side or stacked in portrait.",
     "usesGlobalTextEffect": false,
     "usesGlobalTransition": false,
     "usesGlobalBackgroundEffect": false,
@@ -407,18 +401,65 @@ var GENERATED_BUILTIN_TEMPLATE_CATALOG = [
           "maxLength": 60,
           "default": "More room to think",
           "description": "Second real alternative, parallel to the first."
+        },
+        "mediaKeyword": {
+          "type": "string",
+          "format": "stock-media-keyword",
+          "minLength": 1,
+          "maxLength": 80,
+          "description": "2\u20138 word literal subject/action search intent, maximum 80 characters. Host resolves URLs.",
+          "examples": [
+            "Ocean waves breaking on a rocky shore"
+          ]
+        },
+        "mediaUrl": {
+          "type": "string",
+          "format": "uri",
+          "description": "Host-only approved photo or video URL.",
+          "default": ""
+        },
+        "mediaType": {
+          "type": "string",
+          "enum": [
+            "photo",
+            "video"
+          ],
+          "default": "video",
+          "description": "Host-resolved asset kind."
+        },
+        "mediaPoster": {
+          "type": "string",
+          "format": "uri",
+          "description": "Host-only approved poster URL for video decoding.",
+          "default": ""
+        },
+        "shotDirection": {
+          "type": "string",
+          "maxLength": 220,
+          "description": "Optional action, framing and continuity for generation. Preserve the subject; do not request rendered text."
+        },
+        "mediaSource": {
+          "type": "string",
+          "enum": [
+            "generate",
+            "stock"
+          ],
+          "description": "Generate distinctive illustrative shots; use approved stock for familiar observable subjects."
         }
       },
       "required": [
         "leftText",
         "rightText"
       ],
-      "additionalProperties": false
+      "additionalProperties": false,
+      "x-vanillasky": {
+        "allowsStockMedia": true
+      }
     }
   },
   {
     "label": "Quote",
-    "description": "A short exact quotation with a legible attribution on black.",
+    "description": "A short exact quotation with a legible attribution over relevant media or black.",
     "usesGlobalTextEffect": false,
     "usesGlobalTransition": false,
     "usesGlobalBackgroundEffect": false,
@@ -464,18 +505,65 @@ var GENERATED_BUILTIN_TEMPLATE_CATALOG = [
             "Illustrative example"
           ],
           "description": "Grounded attribution belonging to these exact quoted words."
+        },
+        "mediaKeyword": {
+          "type": "string",
+          "format": "stock-media-keyword",
+          "minLength": 1,
+          "maxLength": 80,
+          "description": "2\u20138 word literal subject/action search intent, maximum 80 characters. Host resolves URLs.",
+          "examples": [
+            "Ocean waves breaking on a rocky shore"
+          ]
+        },
+        "mediaUrl": {
+          "type": "string",
+          "format": "uri",
+          "description": "Host-only approved photo or video URL.",
+          "default": ""
+        },
+        "mediaType": {
+          "type": "string",
+          "enum": [
+            "photo",
+            "video"
+          ],
+          "default": "video",
+          "description": "Host-resolved asset kind."
+        },
+        "mediaPoster": {
+          "type": "string",
+          "format": "uri",
+          "description": "Host-only approved poster URL for video decoding.",
+          "default": ""
+        },
+        "shotDirection": {
+          "type": "string",
+          "maxLength": 220,
+          "description": "Optional action, framing and continuity for generation. Preserve the subject; do not request rendered text."
+        },
+        "mediaSource": {
+          "type": "string",
+          "enum": [
+            "generate",
+            "stock"
+          ],
+          "description": "Generate distinctive illustrative shots; use approved stock for familiar observable subjects."
         }
       },
       "required": [
         "quote",
         "attribution"
       ],
-      "additionalProperties": false
+      "additionalProperties": false,
+      "x-vanillasky": {
+        "allowsStockMedia": true
+      }
     }
   },
   {
     "label": "Key figure",
-    "description": "One supplied figure with one short label on black.",
+    "description": "One supplied figure with one short label over relevant media or black.",
     "usesGlobalTextEffect": false,
     "usesGlobalTransition": false,
     "usesGlobalBackgroundEffect": false,
@@ -521,6 +609,50 @@ var GENERATED_BUILTIN_TEMPLATE_CATALOG = [
             "Illustrative example"
           ],
           "description": "Exactly one short label identifying the quantity and its context."
+        },
+        "mediaKeyword": {
+          "type": "string",
+          "format": "stock-media-keyword",
+          "minLength": 1,
+          "maxLength": 80,
+          "description": "2\u20138 word literal subject/action search intent, maximum 80 characters. Host resolves URLs.",
+          "examples": [
+            "Ocean waves breaking on a rocky shore"
+          ]
+        },
+        "mediaUrl": {
+          "type": "string",
+          "format": "uri",
+          "description": "Host-only approved photo or video URL.",
+          "default": ""
+        },
+        "mediaType": {
+          "type": "string",
+          "enum": [
+            "photo",
+            "video"
+          ],
+          "default": "video",
+          "description": "Host-resolved asset kind."
+        },
+        "mediaPoster": {
+          "type": "string",
+          "format": "uri",
+          "description": "Host-only approved poster URL for video decoding.",
+          "default": ""
+        },
+        "shotDirection": {
+          "type": "string",
+          "maxLength": 220,
+          "description": "Optional action, framing and continuity for generation. Preserve the subject; do not request rendered text."
+        },
+        "mediaSource": {
+          "type": "string",
+          "enum": [
+            "generate",
+            "stock"
+          ],
+          "description": "Generate distinctive illustrative shots; use approved stock for familiar observable subjects."
         }
       },
       "required": [
@@ -529,7 +661,8 @@ var GENERATED_BUILTIN_TEMPLATE_CATALOG = [
       ],
       "additionalProperties": false,
       "x-vanillasky": {
-        "requiresStat": true
+        "requiresStat": true,
+        "allowsStockMedia": true
       }
     }
   }

package/dist/{chunk-MQILEEXC.js → chunk-IR44XKBI.js}

@@ -1,6 +1,6 @@
 import {
   BUILTIN_TEMPLATE_CATALOG
-} from "./chunk-LH4BPALA.js";
+} from "./chunk-IIN5M5HW.js";
 import {
   assertTemplateTransitionMetadata
 } from "./chunk-2E6T633S.js";

package/dist/{chunk-OR52UMSF.js → chunk-JKVOBTRO.js}

@@ -1,6 +1,6 @@
 import {
   createVideoSystemPrompt
-} from "./chunk-PAJ44TFW.js";
+} from "./chunk-LVM5Q2DL.js";
 import {
   PACING_PLANNER_RULES
 } from "./chunk-3O7OMMMF.js";
@@ -118,7 +118,7 @@ ${options.basePrompt.trim()}` : void 0,
     "Variable notation is type[count]{characters}(options)! where count is list cardinality, characters is the inclusive character count for a string or each string-array item, and ! means required. Omitted ! means optional.",
     "Choose a template only when the permitted factual basis contains every fact it needs. Never invent peer values to complete a chart, comparison, stat set, timeline, or list.",
     ...PACING_PLANNER_RULES,
-    "Do not compress a list, sequence, metric set, or comparison into a general-purpose prose field when a specific catalog template can show that structure.",
+    "Let narration carry ordinary lists. Use a structured overlay only when a comparison, sequence, exact quote or key figure adds understanding beyond the voice. Prefer relevant full-bleed footage for the remaining visual beats, with varied purposeful action and framing.",
     "If the catalog includes a suitable ask template and the input supplies a grounded CTA or URL, keep that concise action closer as its own final scene instead of folding it into preceding content.",
     "When a grounded CTA or URL is supplied and the catalog contains jobs:[ask], emit that final closer. A brand name may accompany the action but never qualifies as an ask by itself.",
     terminalPayoffs.length > 0 ? `When there is no grounded action, end with a concise supported payoff using a suitable template from ${terminalPayoffs.join(", ")}. Do not repeat the hook or invent a CTA.` : void 0,
@@ -127,6 +127,7 @@ ${options.basePrompt.trim()}` : void 0,
     mediaTemplates.length > 0 && options.mediaOnFirstScene !== true ? `The host owns immediate startup; reserve external media templates (${mediaTemplates.join(", ")}) for later beats when an asset-free opening is required.` : void 0,
     "For list and event variables emit actual JSON arrays. Follow each field's content budget; never use pipe-delimited strings or invent entries.",
     resolverMediaAvailable ? "Media-capable scenes may carry mediaKeyword: a literal 2\u20138 word shot description, at most 80 characters. Choose mediaSource=generate for distinctive illustrative shots and mediaSource=stock for common subjects a verified asset can depict. For generated footage, optional shotDirection gives action, framing and continuity separately from the stock query. Keep people, actions and essential details precise. Never broaden an exact identity or action into unrelated atmosphere. Supply a grounded fallbackText where declared. Only the host fills mediaUrl and mediaPoster; never invent them. If no media fits an abstract beat, choose an appropriate graphic template instead." : "Use media only when a supplied asset satisfies the scene. Never invent asset URLs. Otherwise choose a grounded graphic template.",
+    "When the catalog offers media, make relevant footage the default. For a typical 30-second explanation start with roughly one structured explanatory overlay plus an optional brief chapter opening; other intents may need different pacing and visual emphasis. Do not chain graphic-only beats when honest media is available. Reuse suitable supplied media behind overlays with optional media fields; retain black when no relevant asset exists. Never invent a stock match or spend beyond host generation limits.",
     "Catalog guidance describes composition; it is not a factual source and must never replace the permitted factual basis.",
     JSON.stringify(plannerCatalog(templates, resolverMediaAvailable)),
     // Last, because the catalogue is thousands of tokens of per-scene field

package/dist/chunk-KHLO5OHT.js

@@ -0,0 +1,35 @@
+import {
+  SceneBackground,
+  getMediaBackgroundProps
+} from "./chunk-5C6HZNHY.js";
+import {
+  editorialFont
+} from "./chunk-4YM2M62S.js";
+import {
+  hasSceneMedia
+} from "./chunk-224QNWRA.js";
+
+// src/visual-system/scene-templates/editorial-background.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function EditorialSurface({ children, template, ...props }) {
+  const { variables, style, width, height, progress, sceneDuration, isPlaying } = props;
+  const overMedia = hasSceneMedia(variables), u = Math.min(width, height);
+  const surface = {
+    position: "absolute",
+    inset: 0,
+    overflow: "hidden",
+    background: overMedia ? "var(--vanillasky-template-surface, #000)" : "#000",
+    fontFamily: editorialFont,
+    color: "#fff",
+    // Two soft, scale-aware shadows preserve local contrast without outlining type.
+    textShadow: overMedia ? `0 ${u * 2e-3}px ${u * 8e-3}px rgba(0,0,0,.65), 0 ${u * 6e-3}px ${u * 0.016}px rgba(0,0,0,.4)` : void 0
+  };
+  return /* @__PURE__ */ jsxs("div", { "data-template": template, style: surface, children: [
+    overMedia && /* @__PURE__ */ jsx(SceneBackground, { style, width, height, progress, sceneDuration, ...getMediaBackgroundProps(variables), mediaTreatment: "cinematic", textAnchor: "center", backgroundEffect: "none", isPlaying }),
+    children
+  ] });
+}
+
+export {
+  EditorialSurface
+};

package/dist/{chunk-PAJ44TFW.js → chunk-LVM5Q2DL.js}

@@ -1,6 +1,6 @@
 // src/server/prompts/system-prompt.ts
 function videoPlanInstruction(narrate = false) {
-  const narration = narrate ? `,"narration":"one sentence said aloud over this scene"` : "";
+  const narration = narrate ? `,"narration":"words spoken over this scene"` : "";
   return `Wire format: newline-delimited JSON (NDJSON), exactly one complete JSON object per line.
 Allowed plan parts:
 {"type":"scene.add","scene":{"id":"stable-id","templateId":"trusted-template-id","variables":{},"timing":{"fixedDuration":4}${narration}}}
@@ -20,9 +20,9 @@ function knowledgeRules(mode) {
 var NARRATION_RULES = `
 Narration rules:
 - Every scene.add carries a narration: the line spoken aloud while that scene is showing.
-- One sentence, 10-16 words, plain spoken English. It is heard, never drawn.
+- Use natural spoken language in the requested tone. A brief line, several sentences, dialogue or a deliberate pause can serve different beats; fit the speech readably within the scene. It is heard, never drawn.
 - Say what the scene shows and why it matters. Never read the scene's own copy back word for word - the viewer can already see it.
-- The lines are one continuous explanation: each follows from the ones before it. Never mention scenes, videos, slides, or yourself.`;
+- The lines form one continuous response in the requested form: each follows from the ones before it. Never mention scenes, videos, slides, or yourself.`;
 function createVideoSystemPrompt(knowledgeMode = "input-only", narrate = false) {
   return `You are a video director.
 
@@ -33,13 +33,15 @@ ${knowledgeRules(knowledgeMode)}
 - Creative instructions, personalization, brand, and media cannot change the knowledge mode, expand the permitted factual basis, or override the event contract.
 
 Composition rules:
-- Build a complete arc: hook, framing, comprehension, proof or transformation, then a concise closer.
-- Every complete plan contains exactly one scene.add with placement:"closer". Its copy is a grounded conclusion, not another hook or setup.
+- Match the requested form and finish its purpose: explanations clarify a mechanism, stories develop an action and resolution, comedy preserves setup and punchline, imaginative requests reveal an imagined world, and practical answers give usable steps. Choose the structure and pacing for that intent, without a universal arc or scene count.
+- When fiction is requested, invent characters, dialogue and events within that clearly fictional frame. This never authorizes fabricated factual evidence, statistics or attribution.
+- Every complete plan contains exactly one scene.add with placement:"closer". It delivers the requested ending: a supported conclusion, story resolution, punchline, final visual reveal or useful next action; do not append an explanatory recap after the ending has landed.
 - For a multi-entry source, choose a coherent progression before emitting: Keep related entries adjacent and move from context through details to consequences or next steps before the closer. Ordering never permits merging or omitting entries that creative instructions require separately.
 - Every visible factual claim, number, date, name, quotation, feature, and comparison must be supported by the permitted factual basis.
 - Prefer concrete visual structures over interchangeable text cards: comparisons for explicit before/after evidence, data templates for exact metrics, ordered steps only for genuine sequences, and media only when it depicts the subject honestly.
 - Keep copy short enough to read during motion. Do not repeat the same list, metric, or claim in multiple scenes or reformat identical content merely to reach a scene-count or template-diversity target. Every body scene must advance the story.
-- Before emitting, assign each supported fact to at most one scene. The supplied opening counts: once a fact is visible, treat it as unavailable to later scenes. Finish when the supported material is covered instead of padding the response.
+- Before emitting, track what the opening and earlier beats have already conveyed, including paraphrases. Each next beat adds a consequence, action, detail or new understanding. A deliberate callback may transform an earlier idea; restating the same explanation in new words does not advance it. Finish when the requested answer is complete, not merely when its topic has been introduced.
+- For scientific explanations distinguish the physical mechanism from an analogy. Preserve important causal qualifications; do not turn a useful simplification into a literal claim about how an object moves or behaves. Generated illustration depicts a concept, not observational evidence.
 - Do not infer that something is scheduled, ready, triggered, enabled, automatic, causal, or available unless the permitted factual basis supports it.
 - The first generated body scene must be asset-free and fully playable before any external media resolves.
 - Use only media URLs present in the supplied input or already resolved by the host. Never expose a loading placeholder or unresolved media keyword. Audio is optional and must never delay the first scene.

package/dist/chunk-VQH3JTQC.js

@@ -0,0 +1,16 @@
+import {
+  SceneBackground,
+  getMediaBackgroundProps
+} from "./chunk-5C6HZNHY.js";
+
+// src/visual-system/scene-templates/cinema-media.tsx
+import { jsx } from "react/jsx-runtime";
+function MediaScene({ variables, style, width, height, progress, sceneDuration, isPlaying }) {
+  return /* @__PURE__ */ jsx("div", { "data-template": "cinemaMedia", style: { width, height, position: "relative", overflow: "hidden" }, children: /* @__PURE__ */ jsx(SceneBackground, { style, width, height, progress, sceneDuration, ...getMediaBackgroundProps(variables), mediaTreatment: "none", backgroundEffect: "none", isPlaying }) });
+}
+var MediaSceneTemplate = MediaScene;
+
+export {
+  MediaScene,
+  MediaSceneTemplate
+};

package/dist/{cinema-media-YQHSIFDA.js → cinema-media-APDJS7SC.js}

@@ -1,9 +1,10 @@
 import {
   MediaScene,
   MediaSceneTemplate
-} from "./chunk-G7IZBBWF.js";
+} from "./chunk-VQH3JTQC.js";
+import "./chunk-5C6HZNHY.js";
 import "./chunk-77VY4O7A.js";
-import "./chunk-UDIODEDK.js";
+import "./chunk-224QNWRA.js";
 import "./chunk-TVIU23OM.js";
 export {
   MediaScene,

package/dist/cli.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
-import "./chunk-OR52UMSF.js";
-import "./chunk-PAJ44TFW.js";
+import "./chunk-JKVOBTRO.js";
+import "./chunk-LVM5Q2DL.js";
 import {
   isTemplatePropertyFormatSupported,
   validateTemplateSchemaValue
@@ -8,14 +8,14 @@ import {
 import {
   getBuiltinTemplateMetadata,
   listBuiltinTemplateMetadata
-} from "./chunk-LH4BPALA.js";
+} from "./chunk-IIN5M5HW.js";
 import "./chunk-3O7OMMMF.js";
 import {
   assertTemplateTransitionMetadata
 } from "./chunk-2E6T633S.js";
 import {
   BUILTIN_TEMPLATE_MANIFEST
-} from "./chunk-MXEYPK7M.js";
+} from "./chunk-4ZJLPHBV.js";
 import {
   externalVideoBackdropCapabilitySource
 } from "./chunk-R3XAOMKP.js";

package/dist/{comparison-RZMMHZR2.js → comparison-ZVE2DE7U.js}

@@ -1,22 +1,32 @@
 import {
-  editorialFont,
+  EditorialSurface
+} from "./chunk-KHLO5OHT.js";
+import "./chunk-5C6HZNHY.js";
+import "./chunk-77VY4O7A.js";
+import {
   editorialLabel,
   fade
 } from "./chunk-4YM2M62S.js";
+import {
+  hasSceneMedia
+} from "./chunk-224QNWRA.js";
+import "./chunk-TVIU23OM.js";
 
 // src/visual-system/scene-templates/comparison.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
-function ComparisonScene({ variables, width, height, progress, motionProgress = progress, safeZone }) {
+function ComparisonScene(props) {
+  const { variables, width, height, progress, motionProgress = progress, safeZone } = props;
+  const overMedia = hasSceneMedia(variables);
   const portrait = height > width, u = Math.min(width, height);
   const side = Math.max(width * 0.12, safeZone.left, safeZone.right);
   const top = Math.max(height * 0.2, safeZone.top), bottom = height - Math.max(height * 0.23, safeZone.bottom);
   const area = bottom - top, cy = (top + bottom) / 2, available = width - side * 2;
   const entries = [{ label: String(variables.leftLabel ?? ""), text: String(variables.leftText ?? "") }, { label: String(variables.rightLabel ?? ""), text: String(variables.rightText ?? "") }];
   const textWidth = portrait ? available : available * 0.39;
-  return /* @__PURE__ */ jsxs("div", { "data-template": "comparison", style: { position: "absolute", inset: 0, background: "#000", color: "#fff", fontFamily: editorialFont, overflow: "hidden" }, children: [
+  return /* @__PURE__ */ jsxs(EditorialSurface, { ...props, template: "comparison", children: [
     /* @__PURE__ */ jsx("div", { "aria-hidden": "true", style: { position: "absolute", left: portrait ? width * 0.32 : width / 2, top: portrait ? cy : top + area * 0.18, width: portrait ? width * 0.36 : u * 1e-3, height: portrait ? u * 1e-3 : area * 0.64, background: "#fff", opacity: 0.22 * fade((motionProgress - 0.16) / 0.18) } }),
     entries.map((entry, i) => /* @__PURE__ */ jsxs("div", { "data-comparison-side": i === 0 ? "left" : "right", style: { position: "absolute", left: portrait ? side : side + available * (i === 0 ? 0.055 : 0.555), top: portrait ? top + area * (i === 0 ? 0.25 : 0.75) : cy, width: textWidth, transform: "translateY(-50%)", textAlign: "center", opacity: fade((motionProgress - 0.04 - i * 0.22) / 0.2) }, children: [
-      entry.label && /* @__PURE__ */ jsx("div", { style: { ...editorialLabel(u), marginBottom: u * 0.028 }, children: entry.label }),
+      entry.label && /* @__PURE__ */ jsx("div", { style: { ...editorialLabel(u), color: overMedia ? "#fff" : "#b7b7bc", marginBottom: u * 0.028 }, children: entry.label }),
       /* @__PURE__ */ jsx("div", { style: { fontSize: u * 0.058, fontWeight: 500, lineHeight: 1.22, letterSpacing: "-.025em", textWrap: "balance", overflowWrap: "anywhere" }, children: entry.text })
     ] }, i))
   ] });

package/dist/{compose-video-TBFTONUC.js → compose-video-BH5K6XWT.js}

@@ -1,6 +1,6 @@
 import {
   createVideo
-} from "./chunk-ZDJNFA52.js";
+} from "./chunk-5BSJLT6H.js";
 import "./chunk-E7CL7UPB.js";
 import "./chunk-RXTN2CW6.js";
 import "./chunk-7M56IUUX.js";

package/dist/{editorial-timeline-OZX7OS6G.js → editorial-timeline-YIXXVJUV.js}

@@ -1,12 +1,19 @@
 import {
-  editorialFont,
+  EditorialSurface
+} from "./chunk-KHLO5OHT.js";
+import "./chunk-5C6HZNHY.js";
+import "./chunk-77VY4O7A.js";
+import {
   fade
 } from "./chunk-4YM2M62S.js";
+import "./chunk-224QNWRA.js";
+import "./chunk-TVIU23OM.js";
 
 // src/visual-system/scene-templates/editorial-timeline.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
 var timelineTiming = (index) => ({ nodeStart: index === 0 ? 0.06 : 0.23 + (index - 1) * 0.11, lineStart: 0.14 + index * 0.11, lineDuration: 0.09, entranceDuration: 0.16 });
-function TimelineScene({ variables, progress, motionProgress = progress, width, height, safeZone }) {
+function TimelineScene(props) {
+  const { variables, progress, motionProgress = progress, width, height, safeZone } = props;
   const events = (Array.isArray(variables.events) ? variables.events : []).slice(0, 5).map((e) => ({ label: String(e?.label ?? "") }));
   const portrait = height > width, u = Math.min(width, height), n = Math.max(1, events.length);
   const side = Math.max(width * 0.13, safeZone.left, safeZone.right), available = width - side * 2;
@@ -14,7 +21,7 @@ function TimelineScene({ variables, progress, motionProgress = progress, width,
   const slot = portrait ? (bottom - top) / n : available / n;
   const points = events.map((_, i) => ({ x: portrait ? side : side + slot * (i + 0.5), y: portrait ? top + slot * (i + 0.5) : height * 0.43 }));
   const radius = u * 45e-4;
-  return /* @__PURE__ */ jsxs("div", { "data-template": "timeline", style: { position: "absolute", inset: 0, overflow: "hidden", background: "#000", fontFamily: editorialFont, color: "#fff" }, children: [
+  return /* @__PURE__ */ jsxs(EditorialSurface, { ...props, template: "timeline", children: [
     points.slice(0, -1).map((point, i) => {
       const next = points[i + 1], timing = timelineTiming(i), line = fade((motionProgress - timing.lineStart) / timing.lineDuration);
       return /* @__PURE__ */ jsx("div", { "data-step-connector": "true", style: { position: "absolute", left: point.x, top: point.y, width: portrait ? u * 1e-3 : next.x - point.x, height: portrait ? next.y - point.y : u * 1e-3, background: "#fff", opacity: 0.3, transform: portrait ? `scaleY(${line})` : `scaleX(${line})`, transformOrigin: portrait ? "top" : "left" } }, `line-${i}`);

package/dist/key-figure-I2C37FWV.js

@@ -0,0 +1,30 @@
+import {
+  EditorialSurface
+} from "./chunk-KHLO5OHT.js";
+import "./chunk-5C6HZNHY.js";
+import "./chunk-77VY4O7A.js";
+import {
+  editorialLabel,
+  fade
+} from "./chunk-4YM2M62S.js";
+import {
+  hasSceneMedia
+} from "./chunk-224QNWRA.js";
+import "./chunk-TVIU23OM.js";
+
+// src/visual-system/scene-templates/key-figure.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function KeyFigureScene(props) {
+  const { variables, width, height, progress, motionProgress = progress, safeZone } = props;
+  const overMedia = hasSceneMedia(variables);
+  const u = Math.min(width, height), side = Math.max(width * 0.13, safeZone.left, safeZone.right), available = width - side * 2;
+  const top = Math.max(height * 0.16, safeZone.top), bottom = height - Math.max(height * 0.23, safeZone.bottom), value = String(variables.value ?? "");
+  return /* @__PURE__ */ jsx(EditorialSurface, { ...props, template: "keyFigure", children: /* @__PURE__ */ jsxs("div", { style: { position: "absolute", left: side, top: (top + bottom) / 2, width: available, transform: "translateY(-50%)", textAlign: "center", opacity: fade((motionProgress - 0.03) / 0.22) }, children: [
+    /* @__PURE__ */ jsx("div", { style: { fontSize: Math.min(u * 0.22, available / Math.max(1, value.length * 0.6)), fontWeight: 500, lineHeight: 1.05, letterSpacing: "-.045em", fontVariantNumeric: "tabular-nums" }, children: value }),
+    /* @__PURE__ */ jsx("div", { style: { ...editorialLabel(u), color: overMedia ? "#fff" : "#b7b7bc", marginTop: u * 0.045, textWrap: "balance", overflowWrap: "anywhere" }, children: String(variables.label ?? "") })
+  ] }) });
+}
+var KeyFigureSceneTemplate = KeyFigureScene;
+export {
+  KeyFigureSceneTemplate
+};

package/dist/{mobile-message-UZUPIKHD.js → mobile-message-JSGBU6EX.js}

@@ -1,13 +1,14 @@
 import {
   MediaScene
-} from "./chunk-G7IZBBWF.js";
+} from "./chunk-VQH3JTQC.js";
+import "./chunk-5C6HZNHY.js";
 import {
   spring
 } from "./chunk-77VY4O7A.js";
 import {
   editorialFont
 } from "./chunk-4YM2M62S.js";
-import "./chunk-UDIODEDK.js";
+import "./chunk-224QNWRA.js";
 import "./chunk-TVIU23OM.js";
 
 // src/visual-system/scene-templates/mobile-message.tsx

package/dist/{preload-media-CFTZIMZL.js → preload-media-LJXWKTWG.js}

@@ -1,7 +1,7 @@
 import {
   limitsConcurrentVideoDecoders,
   resolveMediaType
-} from "./chunk-UDIODEDK.js";
+} from "./chunk-224QNWRA.js";
 
 // src/player/preload-media.ts
 var warmed = /* @__PURE__ */ new Set();