@cueframe/kernel 0.2.1 → 0.2.3

package/dist/chunk-5DJ3IEJR.js

@@ -0,0 +1,4424 @@
+import {
+  DEVICE_GLASS_OPACITY_LINEAR,
+  DeviceMesh,
+  MeasuredPlaneGeometry,
+  PhotographicStudioRig,
+  SLAB_DEFAULTS,
+  SceneRuntimeAllocationBoundaryV1,
+  StudioRig,
+  UNLIT_COLOUR_MANAGED,
+  admitLightingProfile,
+  admitSceneRigV2,
+  assertNoObjectLightField,
+  deviceDimensions,
+  laptopLayout,
+  lidRotationX,
+  registerActualSceneResourcesV1,
+  slabBodyGeometry,
+  slabFinishMaterial,
+  slabTriangleCount,
+  takeSceneEnvironment,
+  useSceneActualResourceRegistrarV1
+} from "./chunk-VKATKWWR.js";
+import {
+  resolveCaptionFaces
+} from "./chunk-TARKDVP6.js";
+import {
+  PHOTOGRAPHIC_STUDIO_RIG_ID,
+  SCENE_SLAB_CONTENT_OFFSET,
+  STUDIO_SHADOW_MAP_BUDGET,
+  evaluateScene,
+  sceneCameraPlanesV2,
+  sceneFocusPreparationAllocationsV1,
+  sceneFullMipLevels,
+  sceneTextureBytes,
+  sceneVideoMidpointAddressV1,
+  selectSceneBakeScale
+} from "./chunk-MH3UPKWR.js";
+
+// ../execution/animate/src/easing/smooth.ts
+var sigmoid = (x) => 1 / (1 + Math.exp(-x));
+function smooth(t, inflection = 10) {
+  const error = sigmoid(-inflection / 2);
+  return (sigmoid(inflection * (t - 0.5)) - error) / (1 - 2 * error);
+}
+
+// ../execution/animate/src/easing/smootherstep.ts
+function smootherstep(t) {
+  return 6 * t ** 5 - 15 * t ** 4 + 10 * t ** 3;
+}
+
+// ../execution/animate/src/easing/rush.ts
+function rushInto(t, inflection = 10) {
+  return 2 * smooth(t / 2, inflection);
+}
+function rushFrom(t, inflection = 10) {
+  return 2 * smooth(t / 2 + 0.5, inflection) - 1;
+}
+
+// ../execution/animate/src/animations/Create.tsx
+import React2 from "react";
+import { useCurrentFrame, interpolate } from "remotion";
+import { evolvePath } from "@remotion/paths";
+var Create = ({
+  path,
+  stroke = "currentColor",
+  strokeWidth = 2,
+  fill = "none",
+  fillAfter = false,
+  width = "100%",
+  height = "100%",
+  viewBox = "0 0 1920 1080",
+  durationInFrames = 30,
+  delay = 0,
+  easing = smooth,
+  style
+}) => {
+  const frame = useCurrentFrame();
+  const t = Math.min(1, Math.max(0, frame - delay) / Math.max(1, durationInFrames));
+  const progress2 = easing(t);
+  const evolved = evolvePath(progress2, path);
+  const fillOpacity = fillAfter && fill !== "none" ? interpolate(progress2, [0.8, 1], [0, 1], { extrapolateLeft: "clamp", extrapolateRight: "clamp" }) : fill !== "none" ? 1 : 0;
+  return /* @__PURE__ */ React2.createElement("svg", { width, height, viewBox, style }, /* @__PURE__ */ React2.createElement(
+    "path",
+    {
+      d: path,
+      stroke,
+      strokeWidth,
+      fill,
+      fillOpacity,
+      strokeDasharray: evolved.strokeDasharray,
+      strokeDashoffset: evolved.strokeDashoffset,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+};
+
+// ../execution/animate/src/animations/GrowFromCenter.tsx
+import React3 from "react";
+import { useCurrentFrame as useCurrentFrame2, useVideoConfig, spring } from "remotion";
+var GrowFromCenter = ({
+  children,
+  delay = 0,
+  springConfig = { damping: 12, stiffness: 200, mass: 0.8 },
+  style
+}) => {
+  const frame = useCurrentFrame2();
+  const { fps } = useVideoConfig();
+  const adjustedFrame = Math.max(0, frame - delay);
+  const scale = spring({
+    frame: adjustedFrame,
+    fps,
+    config: springConfig
+  });
+  return /* @__PURE__ */ React3.createElement(
+    "div",
+    {
+      style: {
+        transform: `scale(${scale})`,
+        transformOrigin: "center center",
+        ...style
+      }
+    },
+    children
+  );
+};
+
+// ../execution/animate/src/animations/FadeIn.tsx
+import React4 from "react";
+import { useCurrentFrame as useCurrentFrame3, useVideoConfig as useVideoConfig2, spring as spring2 } from "remotion";
+var DIRECTION_TRANSFORM = {
+  up: (o) => `translateY(${o}px)`,
+  down: (o) => `translateY(${-o}px)`,
+  left: (o) => `translateX(${o}px)`,
+  right: (o) => `translateX(${-o}px)`,
+  none: () => ""
+};
+var FadeIn = ({
+  children,
+  direction = "up",
+  distance = 30,
+  durationInFrames = 20,
+  delay = 0,
+  easing = smooth,
+  useSpring: useSpringPhysics = false,
+  springConfig = { damping: 15, stiffness: 200, mass: 0.5 },
+  style
+}) => {
+  const frame = useCurrentFrame3();
+  const { fps } = useVideoConfig2();
+  const adjustedFrame = Math.max(0, frame - delay);
+  let progress2;
+  if (useSpringPhysics) {
+    progress2 = spring2({ frame: adjustedFrame, fps, config: springConfig });
+  } else {
+    const t = Math.min(1, adjustedFrame / Math.max(1, durationInFrames));
+    progress2 = easing(t);
+  }
+  const offset = (1 - progress2) * distance;
+  return /* @__PURE__ */ React4.createElement(
+    "div",
+    {
+      style: {
+        opacity: Math.min(1, progress2),
+        transform: DIRECTION_TRANSFORM[direction](offset),
+        ...style
+      }
+    },
+    children
+  );
+};
+
+// ../execution/animate/src/animations/Write.tsx
+import React5 from "react";
+import { useCurrentFrame as useCurrentFrame4 } from "remotion";
+var Write = ({
+  text,
+  durationInFrames = 60,
+  delay = 0,
+  easing = smooth,
+  color = "currentColor",
+  fontFamily,
+  fontSize,
+  fontWeight,
+  letterSpacing,
+  style
+}) => {
+  const frame = useCurrentFrame4();
+  const chars = text.split("");
+  const count = chars.length;
+  if (count === 0) return null;
+  const charAnimDuration = Math.max(4, durationInFrames * 0.4);
+  const stagger = count > 1 ? (durationInFrames - charAnimDuration) / (count - 1) : 0;
+  return /* @__PURE__ */ React5.createElement(
+    "span",
+    {
+      style: {
+        display: "inline-block",
+        color,
+        fontFamily,
+        fontSize,
+        fontWeight,
+        letterSpacing,
+        whiteSpace: "pre-wrap",
+        ...style
+      }
+    },
+    chars.map((char, i) => {
+      const charStart = delay + i * stagger;
+      const localFrame = frame - charStart;
+      const t = Math.min(1, Math.max(0, localFrame / charAnimDuration));
+      const progress2 = easing(t);
+      const yOffset = (1 - progress2) * 8;
+      return /* @__PURE__ */ React5.createElement(
+        "span",
+        {
+          key: i,
+          style: {
+            display: "inline-block",
+            opacity: progress2,
+            transform: `translateY(${yOffset}px)`,
+            minWidth: char === " " ? "0.25em" : void 0
+          }
+        },
+        char
+      );
+    })
+  );
+};
+
+// ../execution/animate/src/animations/Indicate.tsx
+import React6 from "react";
+import { useCurrentFrame as useCurrentFrame5 } from "remotion";
+var Indicate = ({
+  children,
+  color = "#FBBF24",
+  scaleFactor = 1.15,
+  durationInFrames = 30,
+  delay = 0,
+  pulses = 1,
+  style
+}) => {
+  const frame = useCurrentFrame5();
+  const localFrame = Math.max(0, frame - delay);
+  const pulseDuration = durationInFrames / pulses;
+  const pulseFrame = localFrame % pulseDuration;
+  const t = Math.min(1, pulseFrame / Math.max(1, pulseDuration));
+  const isActive = localFrame < durationInFrames;
+  const bellT = isActive ? Math.sin(t * Math.PI) : 0;
+  const easedBell = smooth(bellT);
+  const scale = 1 + (scaleFactor - 1) * easedBell;
+  const glowOpacity = easedBell * 0.6;
+  return /* @__PURE__ */ React6.createElement(
+    "div",
+    {
+      style: {
+        display: "inline-block",
+        transform: `scale(${scale})`,
+        transformOrigin: "center center",
+        filter: glowOpacity > 0.01 ? `drop-shadow(0 0 ${8 * glowOpacity}px ${color})` : void 0,
+        ...style
+      }
+    },
+    children
+  );
+};
+
+// ../execution/animate/src/animations/Wiggle.tsx
+import React7 from "react";
+import { useCurrentFrame as useCurrentFrame6 } from "remotion";
+var Wiggle = ({
+  children,
+  angle = 8,
+  xAmplitude = 4,
+  yAmplitude = 2,
+  durationInFrames = 30,
+  delay = 0,
+  cycles = 3,
+  style
+}) => {
+  const frame = useCurrentFrame6();
+  const localFrame = Math.max(0, frame - delay);
+  const t = Math.min(1, localFrame / Math.max(1, durationInFrames));
+  const decay = Math.exp(-4 * t);
+  const phase = t * cycles * Math.PI * 2;
+  const oscillation = Math.sin(phase);
+  const rotation = angle * oscillation * decay;
+  const dx = xAmplitude * oscillation * decay;
+  const dy = yAmplitude * Math.cos(phase * 1.3) * decay;
+  const isActive = localFrame < durationInFrames;
+  return /* @__PURE__ */ React7.createElement(
+    "div",
+    {
+      style: {
+        display: "inline-block",
+        transform: isActive ? `translate(${dx.toFixed(2)}px, ${dy.toFixed(2)}px) rotate(${rotation.toFixed(2)}deg)` : void 0,
+        transformOrigin: "center center",
+        ...style
+      }
+    },
+    children
+  );
+};
+
+// ../execution/animate/src/composition/LaggedStart.tsx
+import React8 from "react";
+import { useCurrentFrame as useCurrentFrame7 } from "remotion";
+var LaggedStart = ({
+  children,
+  lagRatio = 0.3,
+  durationInFrames = 60,
+  delay = 0,
+  easing = smooth,
+  style
+}) => {
+  const frame = useCurrentFrame7();
+  const childArray = React8.Children.toArray(children);
+  const count = childArray.length;
+  if (count === 0) return null;
+  const staggerDelay = count > 1 ? lagRatio * durationInFrames / (count - 1) : 0;
+  const childDuration = durationInFrames - staggerDelay * Math.max(0, count - 1);
+  const effectiveChildDuration = Math.max(1, childDuration);
+  return /* @__PURE__ */ React8.createElement("div", { style }, childArray.map((child, index) => {
+    const childStart = delay + index * staggerDelay;
+    const localFrame = frame - childStart;
+    const t = Math.min(1, Math.max(0, localFrame / effectiveChildDuration));
+    const progress2 = easing(t);
+    return /* @__PURE__ */ React8.createElement(
+      "div",
+      {
+        key: index,
+        style: {
+          opacity: progress2,
+          transform: `scale(${0.8 + 0.2 * progress2})`,
+          transformOrigin: "center center"
+        }
+      },
+      child
+    );
+  }));
+};
+
+// ../execution/animate/src/composition/AnimationGroup.tsx
+import React9 from "react";
+import { useCurrentFrame as useCurrentFrame8 } from "remotion";
+var AnimationGroup = ({
+  children,
+  stagger = 0,
+  delay = 0,
+  durationInFrames = 30,
+  easing = smooth,
+  style
+}) => {
+  const frame = useCurrentFrame8();
+  const childArray = React9.Children.toArray(children);
+  if (childArray.length === 0) return null;
+  return /* @__PURE__ */ React9.createElement("div", { style }, childArray.map((child, index) => {
+    const childStart = delay + index * stagger;
+    const localFrame = frame - childStart;
+    const t = Math.min(1, Math.max(0, localFrame / Math.max(1, durationInFrames)));
+    const progress2 = easing(t);
+    return /* @__PURE__ */ React9.createElement(
+      "div",
+      {
+        key: index,
+        style: {
+          opacity: progress2
+        }
+      },
+      child
+    );
+  }));
+};
+
+// ../execution/animate/src/composition/Succession.tsx
+import React10 from "react";
+import { useCurrentFrame as useCurrentFrame9 } from "remotion";
+var Succession = ({
+  children,
+  durationPerChild = 30,
+  delay = 0,
+  easing = smooth,
+  style
+}) => {
+  const frame = useCurrentFrame9();
+  const childArray = React10.Children.toArray(children);
+  if (childArray.length === 0) return null;
+  return /* @__PURE__ */ React10.createElement("div", { style }, childArray.map((child, index) => {
+    const childStart = delay + index * durationPerChild;
+    const localFrame = frame - childStart;
+    const t = Math.min(1, Math.max(0, localFrame / Math.max(1, durationPerChild)));
+    const progress2 = easing(t);
+    return /* @__PURE__ */ React10.createElement(
+      "div",
+      {
+        key: index,
+        style: {
+          opacity: progress2
+        }
+      },
+      child
+    );
+  }));
+};
+
+// ../execution/animate/src/animations/Transform.tsx
+import React11 from "react";
+import { useCurrentFrame as useCurrentFrame10, interpolate as interpolate2 } from "remotion";
+import { interpolatePath } from "@remotion/paths";
+var Transform = ({
+  fromPath,
+  toPath,
+  stroke = "currentColor",
+  strokeWidth = 2,
+  fill = "none",
+  width = "100%",
+  height = "100%",
+  viewBox = "0 0 1920 1080",
+  durationInFrames = 30,
+  delay = 0,
+  easing = smooth,
+  fadeEdges = false,
+  style
+}) => {
+  const frame = useCurrentFrame10();
+  const t = Math.min(1, Math.max(0, (frame - delay) / Math.max(1, durationInFrames)));
+  const progress2 = easing(t);
+  const currentPath = interpolatePath(progress2, fromPath, toPath);
+  const opacity = fadeEdges ? interpolate2(t, [0, 0.1, 0.9, 1], [0, 1, 1, 0], {
+    extrapolateLeft: "clamp",
+    extrapolateRight: "clamp"
+  }) : progress2;
+  return /* @__PURE__ */ React11.createElement("svg", { width, height, viewBox, style: { ...style, opacity } }, /* @__PURE__ */ React11.createElement(
+    "path",
+    {
+      d: currentPath,
+      stroke,
+      strokeWidth,
+      fill,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+};
+
+// ../execution/animate/src/animations/MoveAlongPath.tsx
+import React12 from "react";
+import { useCurrentFrame as useCurrentFrame11 } from "remotion";
+import { getLength, getPointAtLength, getTangentAtLength } from "@remotion/paths";
+var MoveAlongPath = ({
+  children,
+  path,
+  durationInFrames = 60,
+  delay = 0,
+  easing = smooth,
+  rotate = false,
+  style
+}) => {
+  const frame = useCurrentFrame11();
+  const t = Math.min(1, Math.max(0, (frame - delay) / Math.max(1, durationInFrames)));
+  const progress2 = easing(t);
+  const pathLength = getLength(path);
+  const distance = progress2 * pathLength;
+  const point = getPointAtLength(path, distance);
+  let rotation = 0;
+  if (rotate) {
+    const tangent = getTangentAtLength(path, distance);
+    rotation = Math.atan2(tangent.y - point.y, tangent.x - point.x) * (180 / Math.PI);
+  }
+  return /* @__PURE__ */ React12.createElement(
+    "div",
+    {
+      style: {
+        position: "absolute",
+        left: 0,
+        top: 0,
+        transform: `translate(${point.x}px, ${point.y}px) translate(-50%, -50%)${rotate ? ` rotate(${rotation}deg)` : ""}`,
+        ...style
+      }
+    },
+    children
+  );
+};
+
+// ../execution/animate/src/animations/GrowArrow.tsx
+import React13 from "react";
+import { useCurrentFrame as useCurrentFrame12 } from "remotion";
+import { evolvePath as evolvePath2 } from "@remotion/paths";
+var GrowArrow = ({
+  from,
+  to,
+  color = "currentColor",
+  strokeWidth = 2,
+  tipSize = 12,
+  width = "100%",
+  height = "100%",
+  viewBox = "0 0 1920 1080",
+  durationInFrames = 30,
+  delay = 0,
+  easing = smooth,
+  style
+}) => {
+  const frame = useCurrentFrame12();
+  const t = Math.min(1, Math.max(0, (frame - delay) / Math.max(1, durationInFrames)));
+  const progress2 = easing(t);
+  const markerId = React13.useId();
+  const endId = `grow-arrow-${markerId}`;
+  const markerW = tipSize;
+  const markerH = tipSize * 0.7;
+  const path = `M ${from[0]},${from[1]} L ${to[0]},${to[1]}`;
+  const evolved = evolvePath2(progress2, path);
+  const tipOpacity = Math.min(1, Math.max(0, (progress2 - 0.8) / 0.2));
+  return /* @__PURE__ */ React13.createElement("svg", { width, height, viewBox, style }, /* @__PURE__ */ React13.createElement("defs", null, /* @__PURE__ */ React13.createElement(
+    "marker",
+    {
+      id: endId,
+      markerWidth: markerW,
+      markerHeight: markerH,
+      refX: markerW,
+      refY: markerH / 2,
+      orient: "auto",
+      markerUnits: "userSpaceOnUse"
+    },
+    /* @__PURE__ */ React13.createElement(
+      "polygon",
+      {
+        points: `0,0 ${markerW},${markerH / 2} 0,${markerH}`,
+        fill: color,
+        opacity: tipOpacity
+      }
+    )
+  )), /* @__PURE__ */ React13.createElement(
+    "path",
+    {
+      d: path,
+      stroke: color,
+      strokeWidth,
+      fill: "none",
+      strokeLinecap: "round",
+      strokeDasharray: evolved.strokeDasharray,
+      strokeDashoffset: evolved.strokeDashoffset,
+      markerEnd: `url(#${endId})`
+    }
+  ));
+};
+
+// ../execution/animate/src/mobjects/Arrow.tsx
+import React14 from "react";
+var Arrow = ({
+  from,
+  to,
+  color = "currentColor",
+  strokeWidth = 2,
+  tipSize = 12,
+  width = "100%",
+  height = "100%",
+  viewBox = "0 0 1920 1080",
+  doubleEnded = false,
+  style
+}) => {
+  const markerId = React14.useId();
+  const endId = `arrow-end-${markerId}`;
+  const startId = `arrow-start-${markerId}`;
+  const markerW = tipSize;
+  const markerH = tipSize * 0.7;
+  return /* @__PURE__ */ React14.createElement("svg", { width, height, viewBox, style }, /* @__PURE__ */ React14.createElement("defs", null, /* @__PURE__ */ React14.createElement(
+    "marker",
+    {
+      id: endId,
+      markerWidth: markerW,
+      markerHeight: markerH,
+      refX: markerW,
+      refY: markerH / 2,
+      orient: "auto",
+      markerUnits: "userSpaceOnUse"
+    },
+    /* @__PURE__ */ React14.createElement(
+      "polygon",
+      {
+        points: `0,0 ${markerW},${markerH / 2} 0,${markerH}`,
+        fill: color
+      }
+    )
+  ), doubleEnded && /* @__PURE__ */ React14.createElement(
+    "marker",
+    {
+      id: startId,
+      markerWidth: markerW,
+      markerHeight: markerH,
+      refX: 0,
+      refY: markerH / 2,
+      orient: "auto-start-reverse",
+      markerUnits: "userSpaceOnUse"
+    },
+    /* @__PURE__ */ React14.createElement(
+      "polygon",
+      {
+        points: `0,0 ${markerW},${markerH / 2} 0,${markerH}`,
+        fill: color
+      }
+    )
+  )), /* @__PURE__ */ React14.createElement(
+    "line",
+    {
+      x1: from[0],
+      y1: from[1],
+      x2: to[0],
+      y2: to[1],
+      stroke: color,
+      strokeWidth,
+      strokeLinecap: "round",
+      markerEnd: `url(#${endId})`,
+      markerStart: doubleEnded ? `url(#${startId})` : void 0
+    }
+  ));
+};
+function makeArrowPath(from, to) {
+  return `M ${from[0]},${from[1]} L ${to[0]},${to[1]}`;
+}
+
+// ../execution/animate/src/mobjects/BrandBox.tsx
+import React15 from "react";
+var BrandBox = ({
+  label,
+  color = "#1a1a2e",
+  width = 160,
+  height = 80,
+  borderRadius = 12,
+  fontFamily,
+  fontSize = 18,
+  fontWeight = 600,
+  textColor = "#fff",
+  border,
+  shadow,
+  children,
+  style
+}) => {
+  return /* @__PURE__ */ React15.createElement(
+    "div",
+    {
+      style: {
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        width,
+        height,
+        borderRadius,
+        background: color,
+        border,
+        boxShadow: shadow,
+        ...style
+      }
+    },
+    children ?? /* @__PURE__ */ React15.createElement(
+      "span",
+      {
+        style: {
+          fontFamily,
+          fontSize,
+          fontWeight,
+          color: textColor,
+          letterSpacing: "0.02em",
+          userSelect: "none"
+        }
+      },
+      label
+    )
+  );
+};
+
+// ../execution/animate/src/mobjects/Graph.tsx
+import React16, { useMemo } from "react";
+import { useCurrentFrame as useCurrentFrame13 } from "remotion";
+import {
+  forceSimulation,
+  forceLink,
+  forceManyBody,
+  forceCenter,
+  forceCollide
+} from "d3-force";
+var Graph = ({
+  nodes,
+  edges,
+  directed = false,
+  width = 800,
+  height = 500,
+  nodeRadius = 24,
+  nodeColor = "#3b82f6",
+  edgeColor = "#666",
+  edgeWidth = 2,
+  fontFamily,
+  fontSize = 14,
+  textColor = "#fff",
+  chargeStrength = -300,
+  durationInFrames = 60,
+  delay = 0,
+  easing = smooth,
+  style
+}) => {
+  const frame = useCurrentFrame13();
+  const nodesKey = JSON.stringify(nodes);
+  const edgesKey = JSON.stringify(edges);
+  const nodeMap = useMemo(() => {
+    const parsedNodes = JSON.parse(nodesKey);
+    const parsedEdges = JSON.parse(edgesKey);
+    const simNodes = parsedNodes.map((n) => ({
+      id: n.id,
+      x: n.position ? n.position[0] : void 0,
+      y: n.position ? n.position[1] : void 0,
+      fx: n.position ? n.position[0] : void 0,
+      fy: n.position ? n.position[1] : void 0
+    }));
+    const simLinks = parsedEdges.map((e) => ({
+      source: e.source,
+      target: e.target
+    }));
+    const sim = forceSimulation(simNodes).force("link", forceLink(simLinks).id((d) => d.id).distance(120)).force("charge", forceManyBody().strength(chargeStrength)).force("center", forceCenter(width / 2, height / 2)).force("collide", forceCollide(nodeRadius * 2)).stop();
+    for (let i = 0; i < 300; i++) sim.tick();
+    const map = /* @__PURE__ */ new Map();
+    for (const n of simNodes) {
+      map.set(n.id, { x: n.x ?? 0, y: n.y ?? 0 });
+    }
+    return map;
+  }, [nodesKey, edgesKey, width, height, nodeRadius, chargeStrength]);
+  const nodeCount = nodes.length;
+  const edgeCount = edges.length;
+  const totalItems = edgeCount + nodeCount;
+  const markerId = React16.useId();
+  const uniqueEdgeColors = useMemo(() => {
+    if (!directed) return [];
+    const colors = /* @__PURE__ */ new Set();
+    colors.add(edgeColor);
+    for (const e of edges) {
+      if (e.color) colors.add(e.color);
+    }
+    return Array.from(colors);
+  }, [directed, edgeColor, edgesKey]);
+  const markerIdFor = (color) => `graph-arrow-${markerId}-${color.replace(/[^a-zA-Z0-9]/g, "")}`;
+  return /* @__PURE__ */ React16.createElement("svg", { width, height, style }, directed && /* @__PURE__ */ React16.createElement("defs", null, uniqueEdgeColors.map((c) => /* @__PURE__ */ React16.createElement(
+    "marker",
+    {
+      key: c,
+      id: markerIdFor(c),
+      markerWidth: 10,
+      markerHeight: 7,
+      refX: nodeRadius + 10,
+      refY: 3.5,
+      orient: "auto",
+      markerUnits: "userSpaceOnUse"
+    },
+    /* @__PURE__ */ React16.createElement("polygon", { points: "0,0 10,3.5 0,7", fill: c })
+  ))), edges.map((edge, i) => {
+    const s = nodeMap.get(edge.source);
+    const t = nodeMap.get(edge.target);
+    if (!s || !t) return null;
+    const stagger = totalItems > 1 ? durationInFrames * 0.6 / totalItems : 0;
+    const edgeStart = delay + i * stagger;
+    const localFrame = frame - edgeStart;
+    const edgeDur = Math.max(4, durationInFrames * 0.3);
+    const tVal = Math.min(1, Math.max(0, localFrame / edgeDur));
+    const progress2 = easing(tVal);
+    const eColor = edge.color ?? edgeColor;
+    return /* @__PURE__ */ React16.createElement("g", { key: `e-${i}` }, /* @__PURE__ */ React16.createElement(
+      "line",
+      {
+        x1: s.x,
+        y1: s.y,
+        x2: s.x + (t.x - s.x) * progress2,
+        y2: s.y + (t.y - s.y) * progress2,
+        stroke: eColor,
+        strokeWidth: edgeWidth,
+        strokeLinecap: "round",
+        markerEnd: directed && progress2 > 0.9 ? `url(#${markerIdFor(eColor)})` : void 0
+      }
+    ), edge.label && progress2 > 0.5 && /* @__PURE__ */ React16.createElement(
+      "text",
+      {
+        x: (s.x + t.x) / 2,
+        y: (s.y + t.y) / 2 - 8,
+        textAnchor: "middle",
+        fill: eColor,
+        fontSize: fontSize * 0.85,
+        fontFamily,
+        opacity: Math.min(1, (progress2 - 0.5) * 2)
+      },
+      edge.label
+    ));
+  }), nodes.map((node, i) => {
+    const pos = nodeMap.get(node.id);
+    if (!pos) return null;
+    const itemIndex = edgeCount + i;
+    const stagger = totalItems > 1 ? durationInFrames * 0.6 / totalItems : 0;
+    const nodeStart = delay + itemIndex * stagger;
+    const localFrame = frame - nodeStart;
+    const nodeDur = Math.max(4, durationInFrames * 0.3);
+    const tVal = Math.min(1, Math.max(0, localFrame / nodeDur));
+    const progress2 = easing(tVal);
+    const nColor = node.color ?? nodeColor;
+    return /* @__PURE__ */ React16.createElement(
+      "g",
+      {
+        key: `n-${node.id}`,
+        transform: `translate(${pos.x}, ${pos.y}) scale(${progress2})`
+      },
+      /* @__PURE__ */ React16.createElement(
+        "circle",
+        {
+          r: nodeRadius,
+          fill: nColor,
+          opacity: progress2
+        }
+      ),
+      node.label && /* @__PURE__ */ React16.createElement(
+        "text",
+        {
+          textAnchor: "middle",
+          dominantBaseline: "central",
+          fill: textColor,
+          fontSize,
+          fontFamily,
+          fontWeight: 600
+        },
+        node.label
+      )
+    );
+  }));
+};
+
+// ../execution/animate/src/mobjects/DiGraph.tsx
+import React17 from "react";
+var DiGraph = (props) => {
+  return /* @__PURE__ */ React17.createElement(Graph, { ...props, directed: true });
+};
+
+// ../execution/animate/src/stage/camera.ts
+import { Euler, Matrix4, Quaternion, Vector3 } from "three";
+var DEFAULT_CAMERA = { x: 0, y: 0, z: 0, rotX: 0, rotY: 0, rotZ: 0, fov: 40 };
+var DEG = Math.PI / 180;
+function perspectiveFor(fov, height) {
+  return height / 2 / Math.tan(fov * DEG / 2);
+}
+function cameraOps(c) {
+  return [
+    { kind: "translate3d", x: -c.x, y: -c.y, z: -c.z },
+    { kind: "rotateX", deg: -c.rotX },
+    { kind: "rotateY", deg: -c.rotY },
+    { kind: "rotateZ", deg: -c.rotZ }
+  ];
+}
+function opCss(op) {
+  return op.kind === "translate3d" ? `translate3d(${op.x}px, ${op.y}px, ${op.z}px)` : `${op.kind}(${op.deg}deg)`;
+}
+function opMatrix(op) {
+  switch (op.kind) {
+    case "translate3d":
+      return new Matrix4().makeTranslation(op.x, op.y, op.z);
+    case "rotateX":
+      return new Matrix4().makeRotationX(op.deg * DEG);
+    case "rotateY":
+      return new Matrix4().makeRotationY(op.deg * DEG);
+    case "rotateZ":
+      return new Matrix4().makeRotationZ(op.deg * DEG);
+  }
+}
+function worldTransform(c) {
+  return cameraOps(c).map(opCss).join(" ");
+}
+var KEYS = ["x", "y", "z", "rotX", "rotY", "rotZ", "fov"];
+function resolveCamera(keyframes, frame, base = DEFAULT_CAMERA) {
+  if (keyframes.length === 0) return { ...base };
+  const sorted = [...keyframes].sort((a2, b2) => a2.frame - b2.frame);
+  const full = [];
+  for (let i2 = 0; i2 < sorted.length; i2++) {
+    full.push({ ...i2 === 0 ? base : full[i2 - 1], ...sorted[i2].camera });
+  }
+  if (frame <= sorted[0].frame) return { ...full[0] };
+  const last = sorted.length - 1;
+  if (frame >= sorted[last].frame) return { ...full[last] };
+  let i = 0;
+  while (frame > sorted[i + 1].frame) i++;
+  const a = sorted[i], b = sorted[i + 1];
+  const span = Math.max(1, b.frame - a.frame);
+  const t = (b.easing ?? ((v) => v))((frame - a.frame) / span);
+  const out = { ...full[i] };
+  for (const k of KEYS) out[k] = full[i][k] + (full[i + 1][k] - full[i][k]) * t;
+  return out;
+}
+function cameraOpsMatrix(c) {
+  const m = new Matrix4();
+  for (const op of cameraOps(c)) m.multiply(opMatrix(op));
+  return m;
+}
+var FLIP_Y = new Matrix4().makeScale(1, -1, 1);
+function cameraToThree(c, width, height) {
+  const P = perspectiveFor(c.fov, height);
+  const pose = cameraOpsMatrix(c).invert().multiply(new Matrix4().makeTranslation(0, 0, P));
+  const three = FLIP_Y.clone().multiply(pose).multiply(FLIP_Y);
+  const position = new Vector3(), quaternion = new Quaternion(), scale = new Vector3();
+  three.decompose(position, quaternion, scale);
+  return {
+    position: [position.x, position.y, position.z],
+    quaternion: [quaternion.x, quaternion.y, quaternion.z, quaternion.w],
+    fov: c.fov,
+    aspect: width / height,
+    near: P / 100,
+    far: P * 40
+  };
+}
+var SCENE_DEFAULT_FOV = 40 * Math.PI / 180;
+var SCENE_FOV_MIN = 18 * Math.PI / 180;
+var SCENE_FOV_MAX = 80 * Math.PI / 180;
+function sceneEyeDistance(referenceHeight, fov) {
+  return referenceHeight / (2 * Math.tan(fov / 2));
+}
+function defaultSceneCamera(referenceHeight, fov = SCENE_DEFAULT_FOV) {
+  return { position: [0, 0, sceneEyeDistance(referenceHeight, fov)], rotation: [0, 0, 0], fov };
+}
+var sceneCameraPlanes = sceneCameraPlanesV2;
+function sceneCameraPose(camera, referenceHeight, scale, frame) {
+  const q = new Quaternion().setFromEuler(new Euler(camera.rotation[0], camera.rotation[1], camera.rotation[2], "XYZ"));
+  return {
+    position: [camera.position[0] * scale, camera.position[1] * scale, camera.position[2] * scale],
+    quaternion: [q.x, q.y, q.z, q.w],
+    fov: camera.fov,
+    aspect: frame.width / frame.height,
+    ...sceneCameraPlanes(referenceHeight, camera.fov, scale)
+  };
+}
+function sceneCameraPoseFromV1(camera, referenceHeight, scale, frame) {
+  const fov = camera.fov * DEG;
+  const p = sceneEyeDistance(referenceHeight, fov) * scale;
+  const q = new Quaternion().setFromEuler(new Euler(-camera.rotX * DEG, camera.rotY * DEG, -camera.rotZ * DEG, "ZYX"));
+  const position = new Vector3(camera.x, -camera.y, camera.z + p).applyQuaternion(q);
+  return {
+    position: [position.x, position.y, position.z],
+    quaternion: [q.x, q.y, q.z, q.w],
+    fov,
+    aspect: frame.width / frame.height,
+    near: p / 100,
+    far: p * 40
+  };
+}
+
+// ../execution/animate/src/three/StageCameraRig.tsx
+import { useLayoutEffect } from "react";
+import { useThree } from "@react-three/fiber";
+import { PerspectiveCamera } from "three";
+function StageCameraRig({ camera, width, height }) {
+  const three = useThree((s) => s.camera);
+  const { x, y, z, rotX, rotY, rotZ, fov } = camera;
+  useLayoutEffect(() => {
+    if (!(three instanceof PerspectiveCamera)) return;
+    const pose = cameraToThree({ x, y, z, rotX, rotY, rotZ, fov }, width, height);
+    three.position.set(...pose.position);
+    three.quaternion.set(...pose.quaternion);
+    three.fov = pose.fov;
+    three.aspect = pose.aspect;
+    three.near = pose.near;
+    three.far = pose.far;
+    three.updateProjectionMatrix();
+    three.updateMatrixWorld(true);
+  }, [three, x, y, z, rotX, rotY, rotZ, fov, width, height]);
+  return null;
+}
+
+// ../execution/animate/src/three/ThreeCanvas.tsx
+import React18, { useMemo as useMemo2 } from "react";
+import { ThreeCanvas as RemotionThreeCanvas } from "@remotion/three";
+
+// ../execution/animate/src/three/SceneCameraRig.tsx
+import { useLayoutEffect as useLayoutEffect2 } from "react";
+import { useThree as useThree2 } from "@react-three/fiber";
+import { PerspectiveCamera as PerspectiveCamera2 } from "three";
+function SceneCameraRig({ pose }) {
+  const three = useThree2((s) => s.camera);
+  const [px, py, pz] = pose.position;
+  const [qx, qy, qz, qw] = pose.quaternion;
+  const { fov, aspect, near, far } = pose;
+  useLayoutEffect2(() => {
+    if (!(three instanceof PerspectiveCamera2)) return;
+    three.position.set(px, py, pz);
+    three.quaternion.set(qx, qy, qz, qw);
+    three.fov = fov * 180 / Math.PI;
+    three.aspect = aspect;
+    three.near = near;
+    three.far = far;
+    three.updateProjectionMatrix();
+    three.updateMatrixWorld(true);
+  }, [three, px, py, pz, qx, qy, qz, qw, fov, aspect, near, far]);
+  return null;
+}
+
+// ../execution/animate/src/three/ThreeCanvas.tsx
+var ThreeCanvas = ({
+  children,
+  width = 1920,
+  height = 1080,
+  fov = 75,
+  near,
+  far,
+  cameraPosition,
+  orthographic = false,
+  stageCamera,
+  sceneCamera,
+  shadows,
+  dpr,
+  gl,
+  style
+}) => {
+  const isOrthographic = orthographic && !stageCamera && !sceneCamera;
+  const position = cameraPosition ?? (isOrthographic ? [0, 0, 100] : [0, 0, 5]);
+  const sceneFov = sceneCamera ? sceneCamera.fov * 180 / Math.PI : null;
+  const camera = useMemo2(
+    () => {
+      if (sceneCamera) {
+        return { fov: sceneFov, near: sceneCamera.near, far: sceneCamera.far, position: sceneCamera.position };
+      }
+      if (stageCamera) {
+        const pose = cameraToThree(stageCamera, width, height);
+        return { fov: pose.fov, near: pose.near, far: pose.far, position: pose.position };
+      }
+      return isOrthographic ? {
+        left: -width / 2,
+        right: width / 2,
+        top: height / 2,
+        bottom: -height / 2,
+        near: near ?? -5e3,
+        far: far ?? 5e3,
+        position
+      } : {
+        fov,
+        near: near ?? 0.1,
+        far: far ?? 1e3,
+        position
+      };
+    },
+    [sceneCamera, sceneFov, stageCamera, isOrthographic, width, height, fov, near, far, position[0], position[1], position[2]]
+  );
+  return /* @__PURE__ */ React18.createElement(
+    RemotionThreeCanvas,
+    {
+      width,
+      height,
+      orthographic: isOrthographic,
+      camera,
+      shadows,
+      dpr: dpr ?? 1,
+      gl,
+      style: {
+        width: "100%",
+        height: "100%",
+        ...style
+      }
+    },
+    sceneCamera ? /* @__PURE__ */ React18.createElement(SceneCameraRig, { pose: sceneCamera }) : null,
+    !sceneCamera && stageCamera ? /* @__PURE__ */ React18.createElement(StageCameraRig, { camera: stageCamera, width, height }) : null,
+    children
+  );
+};
+
+// ../execution/animate/src/three/useImageTexture.ts
+import { useLayoutEffect as useLayoutEffect3, useRef, useState } from "react";
+import { cancelRender, continueRender, delayRender } from "remotion";
+import { SRGBColorSpace, TextureLoader } from "three";
+
+// ../execution/animate/src/three/textureLifecycle.ts
+var NO_TEXTURE = { drawn: null };
+function commitImageTexture(held, next) {
+  if (held.drawn && held.drawn !== next) held.drawn.dispose();
+  return { drawn: next };
+}
+function releaseImageTexture(held) {
+  held.drawn?.dispose();
+  return NO_TEXTURE;
+}
+function discardStaleTexture(texture) {
+  texture.dispose();
+}
+
+// ../execution/animate/src/three/useImageTexture.ts
+function useImageTexture(src) {
+  const [texture, setTexture] = useState(null);
+  const held = useRef(NO_TEXTURE);
+  const [firstHandle] = useState(() => src ? delayRender(`three: load texture ${src}`) : null);
+  const firstHandleSpent = useRef(false);
+  useLayoutEffect3(() => {
+    const takeHandle = () => {
+      if (firstHandle !== null && !firstHandleSpent.current) {
+        firstHandleSpent.current = true;
+        return firstHandle;
+      }
+      return null;
+    };
+    if (!src) {
+      const orphan = takeHandle();
+      if (orphan !== null) continueRender(orphan);
+      setTexture(null);
+      return;
+    }
+    const handle = takeHandle() ?? delayRender(`three: load texture ${src}`);
+    let disposed = false;
+    new TextureLoader().load(
+      src,
+      (t) => {
+        if (disposed) {
+          discardStaleTexture(t);
+          continueRender(handle);
+          return;
+        }
+        t.colorSpace = SRGBColorSpace;
+        t.anisotropy = 4;
+        setTexture(t);
+        continueRender(handle);
+      },
+      void 0,
+      (err) => {
+        if (disposed) {
+          continueRender(handle);
+          return;
+        }
+        cancelRender(err instanceof Error ? err : new Error(`texture failed: ${src}`));
+      }
+    );
+    return () => {
+      disposed = true;
+      continueRender(handle);
+    };
+  }, [src, firstHandle]);
+  useLayoutEffect3(() => {
+    held.current = commitImageTexture(held.current, texture);
+  }, [texture]);
+  useLayoutEffect3(() => () => {
+    held.current = releaseImageTexture(held.current);
+  }, []);
+  return texture;
+}
+
+// ../execution/animate/src/three/defaultScreen.ts
+import { CanvasTexture, SRGBColorSpace as SRGBColorSpace2 } from "three";
+function defaultScreenLayout(w, h) {
+  const pad = Math.round(w * 0.025);
+  const sidebar = { x: pad, y: pad, w: Math.round(w * 0.18), h: h - pad * 2 };
+  const contentX = sidebar.x + sidebar.w + pad;
+  const contentW = w - contentX - pad;
+  const cardW = Math.round((contentW - pad * 2) / 3);
+  const cardH = Math.round(h * 0.18);
+  const cards = [0, 1, 2].map((i) => ({ x: contentX + i * (cardW + pad), y: pad * 3, w: cardW, h: cardH }));
+  const chartTop = cards[0].y + cardH + pad * 2;
+  const chartH = h - chartTop - pad * 2;
+  const chart = [];
+  const n = 24;
+  for (let i = 0; i <= n; i++) {
+    const t = i / n;
+    const v = 0.25 + 0.55 * (t * t * (3 - 2 * t)) + 0.08 * Math.sin(t * 9);
+    chart.push({ x: contentX + t * contentW, y: chartTop + chartH * (1 - v) });
+  }
+  return { sidebar, cards, chart };
+}
+function makeDefaultScreenTexture(accent, w = 1600, h = 1e3) {
+  const canvas = document.createElement("canvas");
+  canvas.width = w;
+  canvas.height = h;
+  const ctx = canvas.getContext("2d");
+  const L = defaultScreenLayout(w, h);
+  ctx.fillStyle = "#0b0b0e";
+  ctx.fillRect(0, 0, w, h);
+  ctx.fillStyle = "#141418";
+  ctx.fillRect(L.sidebar.x, L.sidebar.y, L.sidebar.w, L.sidebar.h);
+  ctx.fillStyle = accent;
+  ctx.fillRect(L.sidebar.x + 24, L.sidebar.y + 32, L.sidebar.w * 0.5, 14);
+  ctx.fillStyle = "rgba(255,255,255,0.10)";
+  for (let i = 0; i < 6; i++) ctx.fillRect(L.sidebar.x + 24, L.sidebar.y + 80 + i * 36, L.sidebar.w * (0.55 + i % 3 * 0.1), 10);
+  for (const c of L.cards) {
+    ctx.fillStyle = "#141418";
+    ctx.fillRect(c.x, c.y, c.w, c.h);
+    ctx.fillStyle = "rgba(255,255,255,0.85)";
+    ctx.fillRect(c.x + 24, c.y + 28, c.w * 0.35, 16);
+    ctx.fillStyle = "rgba(255,255,255,0.25)";
+    ctx.fillRect(c.x + 24, c.y + 60, c.w * 0.55, 10);
+  }
+  ctx.strokeStyle = accent;
+  ctx.lineWidth = 6;
+  ctx.lineJoin = "round";
+  ctx.beginPath();
+  L.chart.forEach((p, i) => i ? ctx.lineTo(p.x, p.y) : ctx.moveTo(p.x, p.y));
+  ctx.stroke();
+  const tex = new CanvasTexture(canvas);
+  tex.colorSpace = SRGBColorSpace2;
+  return tex;
+}
+
+// ../execution/animate/src/layout/solveFlex.ts
+import { loadYoga } from "yoga-layout/load";
+var Y = null;
+var flexReady = loadYoga().then((y) => {
+  Y = y;
+});
+function isFlexReady() {
+  return Y !== null;
+}
+function leafIds(cell) {
+  if (!cell.children || cell.children.length === 0) return [cell.id];
+  return cell.children.flatMap(leafIds);
+}
+function solveFlex(root, size, weights = {}) {
+  if (Y === null) {
+    throw new Error("solveFlex: layout engine not loaded \u2014 await flexReady first");
+  }
+  const out = {};
+  const build = (cell, parentDir) => {
+    const n = Y.Node.create();
+    const grow = Math.max(0, weights[cell.id] ?? cell.grow ?? 1);
+    const basis = Math.max(0, cell.basis ?? 0);
+    const min = Math.max(0, cell.min ?? 0);
+    const along = parentDir === "column" ? "Height" : "Width";
+    n.setFlexGrow(grow);
+    n.setFlexShrink(cell.shrink ?? (grow > 0 ? 1 : 0));
+    n.setFlexBasis(basis);
+    if (min > 0) n[`setMin${along}`](min);
+    if (cell.max != null) n[`setMax${along}`](Math.max(0, cell.max));
+    if (grow === 0 && basis === 0 && min === 0) n.setDisplay(Y.DISPLAY_NONE);
+    const dir = cell.dir ?? "row";
+    n.setFlexDirection(dir === "column" ? Y.FLEX_DIRECTION_COLUMN : Y.FLEX_DIRECTION_ROW);
+    if (cell.gap) n.setGap(Y.GUTTER_ALL, cell.gap);
+    if (cell.padding) n.setPadding(Y.EDGE_ALL, cell.padding);
+    (cell.children ?? []).forEach((ch, i) => n.insertChild(build(ch, dir), i));
+    return n;
+  };
+  const walk = (n, cell, ox, oy) => {
+    const l = n.getComputedLayout();
+    const x = ox + l.left;
+    const y = oy + l.top;
+    out[cell.id] = { x, y, w: l.width, h: l.height };
+    (cell.children ?? []).forEach((ch, i) => walk(n.getChild(i), ch, x, y));
+  };
+  const node = build(root, "row");
+  try {
+    node.setWidth(size.w);
+    node.setHeight(size.h);
+    node.calculateLayout(size.w, size.h, Y.DIRECTION_LTR);
+    walk(node, root, 0, 0);
+  } finally {
+    node.freeRecursive();
+  }
+  return out;
+}
+function flexBoxToThree(box2, size) {
+  return {
+    x: box2.x + box2.w / 2 - size.w / 2 || 0,
+    y: -(box2.y + box2.h / 2 - size.h / 2) || 0
+  };
+}
+
+// ../execution/animate/src/layout/fit.ts
+var STRETCH = { mode: "stretch" };
+function anchored(cell, w, h, anchor) {
+  const ax = anchor?.x ?? 0.5;
+  const ay = anchor?.y ?? 0.5;
+  return { x: cell.x + (cell.w - w) * ax, y: cell.y + (cell.h - h) * ay, w, h };
+}
+function aspectBox(cell, aspect, cover, anchor) {
+  if (cell.w <= 0 || cell.h <= 0) return { ...cell };
+  const byWidth = cell.w;
+  const byHeight = cell.h * aspect;
+  const w = cover ? Math.max(byWidth, byHeight) : Math.min(byWidth, byHeight);
+  return anchored(cell, w, w / aspect, anchor);
+}
+function fitBox(cell, fit = STRETCH) {
+  const aspect = fit.aspect ?? (cell.h > 0 ? cell.w / cell.h : 1);
+  switch (fit.mode) {
+    case "contain":
+      return { box: aspectBox(cell, aspect, false, fit.anchor), scale: 1, clip: null };
+    case "cover":
+      return { box: aspectBox(cell, aspect, true, fit.anchor), scale: 1, clip: null };
+    case "scale": {
+      if (!fit.size || fit.size.w <= 0 || fit.size.h <= 0) return { box: { ...cell }, scale: 1, clip: null };
+      const s = Math.min(cell.w / fit.size.w, cell.h / fit.size.h);
+      return { box: anchored(cell, fit.size.w * s, fit.size.h * s, fit.anchor), scale: s, clip: null };
+    }
+    case "matte": {
+      const inner = aspectBox(cell, aspect, false, fit.anchor);
+      return {
+        box: { ...cell },
+        scale: 1,
+        clip: {
+          top: inner.y - cell.y,
+          left: inner.x - cell.x,
+          right: cell.x + cell.w - (inner.x + inner.w),
+          bottom: cell.y + cell.h - (inner.y + inner.h)
+        }
+      };
+    }
+    case "position":
+    case "stretch":
+    default:
+      return { box: { ...cell }, scale: 1, clip: null };
+  }
+}
+
+// ../execution/animate/src/layout/FlexLayout.tsx
+import React19 from "react";
+import {
+  AbsoluteFill,
+  Easing,
+  continueRender as continueRender2,
+  delayRender as delayRender2,
+  interpolate as interpolate3,
+  useCurrentFrame as useCurrentFrame14,
+  useVideoConfig as useVideoConfig3
+} from "remotion";
+var crossOf = (d) => d === "row" ? "column" : "row";
+var spec = (t) => typeof t === "number" ? { weight: t } : t ?? { weight: 0 };
+var splitOf = (t) => typeof t === "object" && t !== null ? t.split : void 0;
+function unionTracks(a, b = []) {
+  const n = Math.max(a.length, b.length);
+  const out = [];
+  for (let i = 0; i < n; i++) {
+    const sa = spec(a[i]);
+    const splitA = splitOf(a[i]);
+    const splitB = splitOf(b[i]);
+    if (!splitA && !splitB) {
+      out.push({ ...sa, split: void 0 });
+      continue;
+    }
+    const m = Math.max(splitA?.length ?? 1, splitB?.length ?? 1);
+    const base = splitA ?? [sa.weight];
+    const split = [];
+    for (let j = 0; j < m; j++) split.push(base[j] ?? 0);
+    out.push({ ...sa, split });
+  }
+  return out;
+}
+function weightIn(state, i, j) {
+  const t = state[i];
+  if (t === void 0) return 0;
+  if (j === void 0) return spec(t).weight;
+  const sp = splitOf(t);
+  if (!sp) return j === 0 ? spec(t).weight : 0;
+  const c = sp[j];
+  return c === void 0 ? 0 : typeof c === "number" ? c : c.weight;
+}
+function weightsAt(tracks, tracksEnd, p) {
+  const end2 = tracksEnd ?? tracks;
+  const shape = unionTracks(tracks, tracksEnd);
+  const mix = (a, b) => a + (b - a) * p;
+  const out = {};
+  shape.forEach((s, i) => {
+    out[`t${i}`] = mix(weightIn(tracks, i), weightIn(end2, i));
+    s.split?.forEach((_, j) => {
+      out[`t${i}.${j}`] = mix(weightIn(tracks, i, j), weightIn(end2, i, j));
+    });
+  });
+  return out;
+}
+function buildTree(tracks, direction, gap, padding, tracksEnd) {
+  const shape = unionTracks(tracks, tracksEnd);
+  return {
+    id: "root",
+    dir: direction,
+    gap,
+    padding,
+    children: shape.map((s, i) => {
+      const base = { id: `t${i}`, grow: s.weight, basis: s.basis, min: s.min, max: s.max, shrink: s.shrink };
+      if (!s.split) return base;
+      return {
+        ...base,
+        dir: crossOf(direction),
+        gap,
+        children: s.split.map((c, j) => {
+          const cs = typeof c === "number" ? { weight: c } : c;
+          return { id: `t${i}.${j}`, grow: cs.weight, basis: cs.basis, min: cs.min, max: cs.max, shrink: cs.shrink };
+        })
+      };
+    })
+  };
+}
+function useFlexReady() {
+  const [ready, setReady] = React19.useState(isFlexReady);
+  const [handle] = React19.useState(() => isFlexReady() ? null : delayRender2("flex-layout: load engine"));
+  React19.useEffect(() => {
+    if (handle === null) return;
+    flexReady.then(() => {
+      setReady(true);
+      continueRender2(handle);
+    });
+  }, [handle]);
+  return ready;
+}
+var pct = (v, total) => `${total > 0 ? v / total * 100 : 0}%`;
+var LeafCell = ({ box: box2, fit, W, H, children }) => {
+  if (box2.w <= 0 || box2.h <= 0) return null;
+  const f = fitBox(box2, fit);
+  const mode = fit?.mode ?? "stretch";
+  const outer = {
+    position: "absolute",
+    left: pct(box2.x, W),
+    top: pct(box2.y, H),
+    width: pct(box2.w, W),
+    height: pct(box2.h, H),
+    overflow: "hidden",
+    boxSizing: "border-box",
+    ...f.clip ? { clipPath: `inset(${pct(f.clip.top, box2.h)} ${pct(f.clip.right, box2.w)} ${pct(f.clip.bottom, box2.h)} ${pct(f.clip.left, box2.w)})` } : {}
+  };
+  if (mode === "position") {
+    return /* @__PURE__ */ React19.createElement("div", { style: { ...outer, display: "flex", alignItems: "center", justifyContent: "center" } }, children);
+  }
+  if (mode === "stretch" || mode === "matte") {
+    return /* @__PURE__ */ React19.createElement("div", { style: outer }, children);
+  }
+  const inner = {
+    position: "absolute",
+    left: pct(f.box.x - box2.x, box2.w),
+    top: pct(f.box.y - box2.y, box2.h),
+    width: pct(f.box.w, box2.w),
+    height: pct(f.box.h, box2.h)
+  };
+  if (mode === "scale" && fit?.size) {
+    return /* @__PURE__ */ React19.createElement("div", { style: outer }, /* @__PURE__ */ React19.createElement("div", { style: { ...inner, width: fit.size.w, height: fit.size.h, transform: `scale(${f.scale})`, transformOrigin: "top left" } }, children));
+  }
+  return /* @__PURE__ */ React19.createElement("div", { style: outer }, /* @__PURE__ */ React19.createElement("div", { style: inner }, children));
+};
+var FlexLayout = ({
+  direction = "row",
+  gap = 24,
+  padding = 0,
+  tracks = [1, 1],
+  tracksEnd,
+  fits,
+  progress: progress2,
+  outline = false,
+  outlineColor = "rgba(244,236,224,0.10)",
+  width,
+  height,
+  children
+}) => {
+  const frame = useCurrentFrame14();
+  const { width: vw, height: vh, durationInFrames } = useVideoConfig3();
+  const W = width ?? vw;
+  const H = height ?? vh;
+  const ready = useFlexReady();
+  if (!ready) return null;
+  const p = progress2 !== void 0 ? Math.min(1, Math.max(0, progress2)) : tracksEnd ? interpolate3(frame, [0, Math.max(1, durationInFrames - 1)], [0, 1], {
+    easing: Easing.inOut(Easing.cubic),
+    extrapolateLeft: "clamp",
+    extrapolateRight: "clamp"
+  }) : 0;
+  const tree = buildTree(tracks, direction, gap, padding, tracksEnd);
+  const boxes = solveFlex(tree, { w: W, h: H }, weightsAt(tracks, tracksEnd, p));
+  const leaves = leafIds(tree);
+  const kids = React19.Children.toArray(children);
+  return /* @__PURE__ */ React19.createElement(AbsoluteFill, null, leaves.map((id, i) => /* @__PURE__ */ React19.createElement(LeafCell, { key: id, box: boxes[id], fit: fits?.[i], W, H }, kids[i] ?? null)), outline && Object.entries(boxes).filter(([id, b]) => id !== "root" && b.w > 0 && b.h > 0).map(([id, b]) => /* @__PURE__ */ React19.createElement("div", { key: `o-${id}`, style: {
+    position: "absolute",
+    left: pct(b.x, W),
+    top: pct(b.y, H),
+    width: pct(b.w, W),
+    height: pct(b.h, H),
+    border: `1.5px solid ${outlineColor}`,
+    boxSizing: "border-box",
+    pointerEvents: "none"
+  } })));
+};
+
+// ../execution/animate/src/stage/presets.ts
+var end = (d) => Math.max(1, d - 1);
+var fovOf = (o) => o?.fov === void 0 ? {} : { fov: o.fov };
+var dollyIn = (d, o) => [
+  { frame: 0, camera: { z: o?.amount ?? 600, ...fovOf(o) } },
+  { frame: end(d), camera: { z: 0 }, easing: o?.easing ?? smooth }
+];
+var dollyOut = (d, o) => [
+  { frame: 0, camera: { z: 0, ...fovOf(o) } },
+  { frame: end(d), camera: { z: o?.amount ?? 600 }, easing: o?.easing ?? smooth }
+];
+var drift = (d, o) => {
+  const a = o?.amount ?? 40;
+  return [
+    { frame: 0, camera: { x: -a, rotY: -a / 12, ...fovOf(o) } },
+    { frame: end(d), camera: { x: a, rotY: a / 12 }, easing: o?.easing ?? ((t) => t) }
+  ];
+};
+var tiltReveal = (d, o) => [
+  { frame: 0, camera: { rotX: -(o?.amount ?? 18), z: 300, ...fovOf(o) } },
+  { frame: end(d), camera: { rotX: 0, z: 0 }, easing: o?.easing ?? smooth }
+];
+var orbit = (d, o) => {
+  const a = o?.amount ?? 25;
+  return [
+    { frame: 0, camera: { rotY: -a, ...fovOf(o) } },
+    { frame: end(d), camera: { rotY: a }, easing: o?.easing ?? smooth }
+  ];
+};
+var CAMERA_PRESETS = {
+  static: () => [],
+  "dolly-in": dollyIn,
+  "dolly-out": dollyOut,
+  drift,
+  "tilt-reveal": tiltReveal,
+  orbit
+};
+
+// ../execution/animate/src/stage/dof.ts
+function dofBlur(layerZ, focus) {
+  if (!focus || focus.range <= 0 || focus.maxBlur <= 0) return 0;
+  const t = Math.min(1, Math.abs(layerZ - focus.z) / focus.range);
+  return focus.maxBlur * t;
+}
+
+// ../execution/animate/src/stage/PerspectiveStage.tsx
+import React20, { createContext, useContext, useMemo as useMemo3 } from "react";
+import { Internals } from "remotion";
+var StageContext = createContext(null);
+function useStage() {
+  const ctx = useContext(StageContext);
+  if (!ctx) throw new Error("StageLayer and ContactShadow must be rendered inside <PerspectiveStage>.");
+  return ctx;
+}
+function useFrameSize(width, height) {
+  const cfg = Internals.useUnsafeVideoConfig();
+  const w = width ?? cfg?.width;
+  const h = height ?? cfg?.height;
+  if (w === void 0 || h === void 0) throw new Error("PerspectiveStage needs width/height outside a Remotion composition.");
+  return { width: w, height: h };
+}
+var PerspectiveStage = ({ camera, width: w, height: h, focus, style, children }) => {
+  const { width, height } = useFrameSize(w, h);
+  const cam = useMemo3(() => ({ ...DEFAULT_CAMERA, ...camera }), [camera]);
+  const value = useMemo3(() => ({ camera: cam, width, height, focus }), [cam, width, height, focus]);
+  const perspective = Math.round(perspectiveFor(cam.fov, height) * 100) / 100;
+  return /* @__PURE__ */ React20.createElement(StageContext.Provider, { value }, /* @__PURE__ */ React20.createElement(
+    "div",
+    {
+      style: {
+        position: "absolute",
+        inset: 0,
+        overflow: "hidden",
+        perspective: `${perspective}px`,
+        perspectiveOrigin: "50% 50%",
+        ...style
+      }
+    },
+    /* @__PURE__ */ React20.createElement(
+      "div",
+      {
+        style: {
+          position: "absolute",
+          inset: 0,
+          transformStyle: "preserve-3d",
+          transformOrigin: "50% 50%",
+          transform: worldTransform(cam)
+        }
+      },
+      children
+    )
+  ));
+};
+var StageLayer = ({
+  x = 0,
+  y = 0,
+  z = 0,
+  rotX = 0,
+  rotY = 0,
+  rotZ = 0,
+  scale = 1,
+  width,
+  height,
+  shadow,
+  style,
+  children
+}) => {
+  const stage = useStage();
+  const w = width ?? stage.width;
+  const h = height ?? stage.height;
+  const inner = useMemo3(() => ({ ...stage, width: w, height: h }), [stage, w, h]);
+  const blur = dofBlur(z, stage.focus);
+  const filters = [];
+  if (blur > 0) filters.push(`blur(${Math.round(blur * 100) / 100}px)`);
+  if (shadow) {
+    filters.push(`drop-shadow(0px ${shadow.offsetY ?? 24}px ${shadow.blur ?? 32}px rgba(0,0,0,${shadow.opacity ?? 0.45}))`);
+  }
+  return /* @__PURE__ */ React20.createElement(
+    "div",
+    {
+      style: {
+        position: "absolute",
+        left: `${stage.width / 2 - w / 2}px`,
+        top: `${stage.height / 2 - h / 2}px`,
+        width: `${w}px`,
+        height: `${h}px`,
+        transformStyle: filters.length ? "flat" : "preserve-3d",
+        transformOrigin: "50% 50%",
+        transform: `translate3d(${x}px, ${y}px, ${z}px) rotateX(${rotX}deg) rotateY(${rotY}deg) rotateZ(${rotZ}deg)${scale === 1 ? "" : ` scale(${scale})`}`,
+        ...filters.length ? { filter: filters.join(" ") } : {},
+        ...style
+      }
+    },
+    /* @__PURE__ */ React20.createElement(StageContext.Provider, { value: inner }, children)
+  );
+};
+var ContactShadow = ({ y, width, depth, opacity = 0.45, z = 0 }) => {
+  const stage = useStage();
+  return /* @__PURE__ */ React20.createElement(
+    "div",
+    {
+      style: {
+        position: "absolute",
+        left: `${stage.width / 2 - width / 2}px`,
+        top: `${stage.height / 2 - depth / 2}px`,
+        width: `${width}px`,
+        height: `${depth}px`,
+        transformOrigin: "50% 50%",
+        transform: `translate3d(0px, ${y}px, ${z}px) rotateX(90deg)`,
+        background: `radial-gradient(ellipse at center, rgba(0,0,0,${opacity}) 0%, rgba(0,0,0,${opacity * 0.5}) 35%, rgba(0,0,0,0) 70%)`,
+        pointerEvents: "none"
+      }
+    }
+  );
+};
+
+// ../execution/animate/src/media/MediaTileScene.tsx
+import React21, { useCallback, useLayoutEffect as useLayoutEffect4, useMemo as useMemo4, useRef as useRef2, useState as useState2 } from "react";
+import { useThree as useThree3 } from "@react-three/fiber";
+import { Video } from "@remotion/media";
+import { ThreeCanvas as ThreeCanvas2 } from "@remotion/three";
+import { BufferAttribute, BufferGeometry, Color, SRGBColorSpace as SRGBColorSpace3, Texture as Texture2, WebGLRenderer } from "three";
+import {
+  Img,
+  Internals as Internals2,
+  cancelRender as cancelRender2,
+  getRemotionEnvironment,
+  useCurrentFrame as useCurrentFrame15,
+  useDelayRender,
+  useVideoConfig as useVideoConfig4
+} from "remotion";
+var RESOURCE_ERROR = "__cueframe_component_error_v2__:component_resource_exhausted:";
+var RUNTIME_ERROR = "__cueframe_component_error_v2__:component_runtime_error:";
+var nextMediaTileSceneId = 0;
+var MEDIA_TILE_SCENE_LIMITS = Object.freeze({
+  streams: 8,
+  tiles: 512,
+  textureBytes: 128 * 1024 * 1024
+});
+function mediaTileFramesReady(sourceFrames, frame, playing) {
+  return sourceFrames.every((sourceFrame) => {
+    if (sourceFrame === void 0) return false;
+    if (sourceFrame === null) return true;
+    return playing || sourceFrame === frame;
+  });
+}
+function fail(prefix, message) {
+  throw new Error(prefix + message);
+}
+function decodedSize(source) {
+  const value = source;
+  const width = value.videoWidth ?? value.naturalWidth ?? value.displayWidth ?? value.width ?? 0;
+  const height = value.videoHeight ?? value.naturalHeight ?? value.displayHeight ?? value.height ?? 0;
+  if (width === 0 || height === 0) return null;
+  if (![width, height].every((dimension) => Number.isSafeInteger(dimension) && dimension > 0)) {
+    fail(RUNTIME_ERROR, "A media tile stream produced invalid decoded dimensions.");
+  }
+  return { width, height };
+}
+function validCrop(crop) {
+  if (!crop) return true;
+  return [crop.x, crop.y, crop.width, crop.height].every(Number.isFinite) && crop.x >= 0 && crop.y >= 0 && crop.width > 0 && crop.height > 0 && crop.x + crop.width <= 1 && crop.y + crop.height <= 1;
+}
+function assertMediaTileScene(streams, tiles) {
+  if (!streams || typeof streams !== "object" || Array.isArray(streams)) {
+    fail(RUNTIME_ERROR, "MediaTileScene requires a `streams` object.");
+  }
+  if (!Array.isArray(tiles)) fail(RUNTIME_ERROR, "MediaTileScene requires a `tiles` array.");
+  const ids = Object.keys(streams).sort();
+  if (ids.length === 0) fail(RUNTIME_ERROR, "MediaTileScene requires at least one stream.");
+  if (ids.length > MEDIA_TILE_SCENE_LIMITS.streams) {
+    fail(RESOURCE_ERROR, `MediaTileScene supports at most ${MEDIA_TILE_SCENE_LIMITS.streams} media streams.`);
+  }
+  if (tiles.length === 0) fail(RUNTIME_ERROR, "MediaTileScene requires at least one tile.");
+  if (tiles.length > MEDIA_TILE_SCENE_LIMITS.tiles) {
+    fail(RESOURCE_ERROR, `MediaTileScene supports at most ${MEDIA_TILE_SCENE_LIMITS.tiles} tile instances.`);
+  }
+  for (const [id, stream2] of Object.entries(streams)) {
+    if (!stream2?.asset?.handle || !["image", "video"].includes(stream2.asset.kind)) {
+      fail(RUNTIME_ERROR, `MediaTileScene stream ${JSON.stringify(id)} has no supported media asset.`);
+    }
+    if (stream2.asset.kind === "image" && (stream2.trimBeforeFrames !== void 0 || stream2.trimAfterFrames !== void 0 || stream2.playbackRate !== void 0 || stream2.loop !== void 0)) {
+      fail(RUNTIME_ERROR, `MediaTileScene image stream ${JSON.stringify(id)} cannot declare video timing.`);
+    }
+    if (stream2.playbackRate !== void 0 && (!Number.isFinite(stream2.playbackRate) || stream2.playbackRate <= 0)) {
+      fail(RUNTIME_ERROR, `MediaTileScene stream ${JSON.stringify(id)} has an invalid playback rate.`);
+    }
+  }
+  for (const tile of tiles) {
+    if (!streams[tile.stream]) fail(RUNTIME_ERROR, `MediaTileScene tile references unknown stream ${JSON.stringify(tile.stream)}.`);
+    if (![tile.x, tile.y, tile.width, tile.height, tile.z ?? 0, tile.rotation ?? 0, tile.opacity ?? 1].every(Number.isFinite) || tile.width <= 0 || tile.height <= 0 || (tile.opacity ?? 1) < 0 || (tile.opacity ?? 1) > 1 || !validCrop(tile.crop)) {
+      fail(RUNTIME_ERROR, "MediaTileScene received invalid tile geometry, opacity, or crop.");
+    }
+  }
+  const usedStreams = new Set(tiles.map((tile) => tile.stream));
+  const unusedStream = ids.find((id) => !usedStreams.has(id));
+  if (unusedStream) {
+    fail(RUNTIME_ERROR, `MediaTileScene stream ${JSON.stringify(unusedStream)} has no tile.`);
+  }
+  return ids;
+}
+function mediaTileCropUvs(crop) {
+  const value = crop ?? { x: 0, y: 0, width: 1, height: 1 };
+  if (!validCrop(value)) fail(RUNTIME_ERROR, "MediaTileScene received an invalid normalized crop.");
+  const left = value.x;
+  const right = value.x + value.width;
+  const top = 1 - value.y;
+  const bottom = 1 - value.y - value.height;
+  return [left, top, right, top, left, bottom, right, bottom];
+}
+function mediaTileFogDistances(fog, camera, perspective) {
+  const cameraDistanceFromPlane = perspective - (camera?.z ?? 0);
+  if (![fog.near, fog.far, cameraDistanceFromPlane].every(Number.isFinite) || fog.near < 0 || fog.far <= fog.near || cameraDistanceFromPlane <= 0) {
+    fail(RUNTIME_ERROR, "MediaTileScene received an invalid fog or camera depth range.");
+  }
+  return [fog.color, cameraDistanceFromPlane + fog.near, cameraDistanceFromPlane + fog.far];
+}
+function ImageProducer({ id, stream: stream2, accept, report }) {
+  return /* @__PURE__ */ React21.createElement(
+    Img,
+    {
+      src: stream2.asset.handle,
+      crossOrigin: "anonymous",
+      onLoad: (event) => {
+        const source = event.currentTarget;
+        const size = decodedSize(source);
+        if (!size) return report(new Error(RUNTIME_ERROR + `Image stream ${JSON.stringify(id)} has no decoded dimensions.`));
+        accept(id, { source, version: 1, frame: null, ...size });
+      },
+      onError: () => report(new Error(RUNTIME_ERROR + `Image stream ${JSON.stringify(id)} could not be decoded.`)),
+      style: { position: "absolute", width: 1, height: 1, opacity: 0, pointerEvents: "none" }
+    }
+  );
+}
+function VideoProducer({ id, stream: stream2, accept, report }) {
+  const container = useRef2(null);
+  const version = useRef2(0);
+  const acceptedFrame = useRef2(null);
+  const frame = useCurrentFrame15();
+  const handleVideoError = useCallback((error) => {
+    report(error);
+    return "fail";
+  }, [report]);
+  const onVideoFrame = useCallback(() => {
+    queueMicrotask(() => {
+      if (acceptedFrame.current === frame) return;
+      const source = container.current?.querySelector("canvas");
+      if (!source) return report(new Error(RUNTIME_ERROR + `Video stream ${JSON.stringify(id)} did not provide its decoded canvas.`));
+      const size = decodedSize(source);
+      if (!size) return report(new Error(RUNTIME_ERROR + `Video stream ${JSON.stringify(id)} has no decoded dimensions.`));
+      acceptedFrame.current = frame;
+      version.current += 1;
+      accept(id, { source, version: version.current, frame, ...size });
+    });
+  }, [accept, frame, id, report]);
+  return /* @__PURE__ */ React21.createElement("div", { ref: container, style: { position: "absolute", width: 1, height: 1, opacity: 0, pointerEvents: "none" } }, /* @__PURE__ */ React21.createElement(
+    Video,
+    {
+      src: stream2.asset.handle,
+      disallowFallbackToOffthreadVideo: true,
+      onError: handleVideoError,
+      onVideoFrame,
+      trimBefore: stream2.trimBeforeFrames,
+      trimAfter: stream2.trimAfterFrames,
+      playbackRate: stream2.playbackRate ?? 1,
+      loop: stream2.loop ?? false,
+      muted: true,
+      showInTimeline: false,
+      delayRenderTimeoutInMilliseconds: 12e4,
+      style: { width: 1, height: 1 }
+    }
+  ));
+}
+function geometryForCrop(crop) {
+  const geometry = new BufferGeometry();
+  geometry.setAttribute("position", new BufferAttribute(new Float32Array([
+    -0.5,
+    0.5,
+    0,
+    0.5,
+    0.5,
+    0,
+    -0.5,
+    -0.5,
+    0,
+    0.5,
+    -0.5,
+    0
+  ]), 3));
+  geometry.setAttribute("uv", new BufferAttribute(new Float32Array(mediaTileCropUvs(crop)), 2));
+  geometry.setIndex([0, 2, 1, 2, 3, 1]);
+  return geometry;
+}
+function StreamTiles({ entry, tiles }) {
+  const invalidate = useThree3((state) => state.invalidate);
+  const texture = useMemo4(() => {
+    const value = new Texture2(entry.source);
+    value.colorSpace = SRGBColorSpace3;
+    value.needsUpdate = true;
+    return value;
+  }, [entry.source]);
+  const geometries = useMemo4(() => {
+    const values = /* @__PURE__ */ new Map();
+    for (const tile of tiles) {
+      const crop = tile.crop ?? { x: 0, y: 0, width: 1, height: 1 };
+      const key = `${crop.x}:${crop.y}:${crop.width}:${crop.height}`;
+      if (!values.has(key)) values.set(key, geometryForCrop(crop));
+    }
+    return values;
+  }, [tiles]);
+  useLayoutEffect4(() => {
+    texture.needsUpdate = true;
+    invalidate();
+  }, [entry.version, invalidate, texture]);
+  useLayoutEffect4(() => () => {
+    texture.dispose();
+    for (const geometry of geometries.values()) geometry.dispose();
+  }, [geometries, texture]);
+  return /* @__PURE__ */ React21.createElement(React21.Fragment, null, tiles.map((tile, index) => {
+    const crop = tile.crop ?? { x: 0, y: 0, width: 1, height: 1 };
+    const geometry = geometries.get(`${crop.x}:${crop.y}:${crop.width}:${crop.height}`);
+    const opacity = tile.opacity ?? 1;
+    return /* @__PURE__ */ React21.createElement(
+      "mesh",
+      {
+        key: index,
+        geometry,
+        position: [tile.x, -tile.y, -(tile.z ?? 0)],
+        rotation: [0, 0, -(tile.rotation ?? 0) * Math.PI / 180],
+        scale: [tile.width, tile.height, 1]
+      },
+      /* @__PURE__ */ React21.createElement("meshBasicMaterial", { map: texture, transparent: opacity < 1, opacity, depthWrite: opacity >= 1, ...UNLIT_COLOUR_MANAGED })
+    );
+  }));
+}
+function SceneContents({ streamIds, tiles, sources, camera, fog, background, announce, presentationReady, playing }) {
+  const { advance, camera: threeCamera, gl, invalidate } = useThree3();
+  const frame = useCurrentFrame15();
+  const isRendering = getRemotionEnvironment().isRendering;
+  const perspective = camera?.perspective ?? 1400;
+  const { height } = useVideoConfig4();
+  useLayoutEffect4(() => {
+    threeCamera.position.set(camera?.x ?? 0, -(camera?.y ?? 0), perspective - (camera?.z ?? 0));
+    threeCamera.zoom = camera?.zoom ?? 1;
+    if ("fov" in threeCamera) threeCamera.fov = 2 * Math.atan(height / (2 * perspective)) * 180 / Math.PI;
+    threeCamera.lookAt(camera?.x ?? 0, -(camera?.y ?? 0), 0);
+    threeCamera.updateProjectionMatrix();
+    const match = !background || background === "transparent" ? null : /^#([a-f\d]{6})([a-f\d]{2})?$/i.exec(background);
+    if (background && background !== "transparent" && !match) {
+      fail(RUNTIME_ERROR, "MediaTileScene background must be transparent, #RRGGBB, or #RRGGBBAA.");
+    }
+    gl.setClearColor(new Color(match ? `#${match[1]}` : "#000000"), match?.[2] ? Number.parseInt(match[2], 16) / 255 : match ? 1 : 0);
+    invalidate();
+  }, [background, camera, frame, gl, height, invalidate, perspective, threeCamera]);
+  const sourceVersions = streamIds.map((id) => sources[id].version).join(":");
+  useLayoutEffect4(() => {
+    if (isRendering || !playing) advance(performance.now());
+    else invalidate();
+    if (presentationReady) announce();
+  }, [advance, announce, frame, invalidate, isRendering, playing, presentationReady, sourceVersions]);
+  return /* @__PURE__ */ React21.createElement(React21.Fragment, null, fog ? /* @__PURE__ */ React21.createElement("fog", { attach: "fog", args: mediaTileFogDistances(fog, camera, perspective) }) : null, streamIds.map((id) => /* @__PURE__ */ React21.createElement(
+    StreamTiles,
+    {
+      key: id,
+      entry: sources[id],
+      tiles: tiles.filter((tile) => tile.stream === id)
+    }
+  )));
+}
+function createWebGl2Renderer(defaults) {
+  const context = defaults.canvas.getContext("webgl2", { alpha: true, antialias: true });
+  if (!context) fail(RUNTIME_ERROR, "MediaTileScene could not acquire its required WebGL2 context.");
+  return new WebGLRenderer({ canvas: defaults.canvas, context, antialias: true, alpha: true });
+}
+function MediaTileScene({ streams, tiles, camera, fog, background, style }) {
+  const frame = useCurrentFrame15();
+  const [playing] = Internals2.Timeline.usePlayingState();
+  const { width, height } = useVideoConfig4();
+  const isRendering = getRemotionEnvironment().isRendering;
+  const { delayRender: scopedDelayRender, continueRender: scopedContinueRender } = useDelayRender();
+  const streamIds = useMemo4(() => assertMediaTileScene(streams, tiles), [streams, tiles]);
+  const [sources, setSources] = useState2({});
+  const [failure, setFailure] = useState2(null);
+  const [sceneId] = useState2(() => `cueframe-media-tile-${++nextMediaTileSceneId}`);
+  const announcedFrame = useRef2(null);
+  const frameGate = useRef2(null);
+  useLayoutEffect4(() => {
+    if (!isRendering) return;
+    const gate = {
+      frame,
+      handle: scopedDelayRender(`Waiting for MediaTileScene frame ${frame}`, {
+        timeoutInMilliseconds: 12e4
+      }),
+      complete: false
+    };
+    frameGate.current = gate;
+    return () => {
+      if (!gate.complete) scopedContinueRender(gate.handle);
+      if (frameGate.current === gate) frameGate.current = null;
+    };
+  }, [frame, isRendering, scopedContinueRender, scopedDelayRender]);
+  const report = useCallback((error) => {
+    const value = error instanceof Error ? error : new Error(String(error));
+    if (isRendering) cancelRender2(value);
+    else setFailure(value);
+  }, [isRendering]);
+  const accept = useCallback((id, value) => {
+    setSources((current) => current[id]?.source === value.source && current[id]?.version === value.version ? current : { ...current, [id]: value });
+  }, []);
+  const announce = useCallback(() => {
+    if (announcedFrame.current === frame) return;
+    announcedFrame.current = frame;
+    window.dispatchEvent(new CustomEvent("cueframe-media-tile-presented", { detail: { frame, sceneId } }));
+    const gate = frameGate.current;
+    if (gate && gate.frame === frame && !gate.complete) {
+      gate.complete = true;
+      scopedContinueRender(gate.handle);
+    }
+  }, [frame, sceneId, scopedContinueRender]);
+  const ready = streamIds.every((id) => sources[id]);
+  const presentationReady = mediaTileFramesReady(
+    streamIds.map((id) => sources[id]?.frame),
+    frame,
+    !isRendering && playing
+  );
+  const textureBytes = streamIds.reduce((total, id) => total + (sources[id]?.width ?? 0) * (sources[id]?.height ?? 0) * 4, 0);
+  if (textureBytes > MEDIA_TILE_SCENE_LIMITS.textureBytes) {
+    fail(RESOURCE_ERROR, `MediaTileScene exceeds ${MEDIA_TILE_SCENE_LIMITS.textureBytes} bytes of decoded textures.`);
+  }
+  if (failure) throw failure;
+  return /* @__PURE__ */ React21.createElement("div", { style: { position: "absolute", inset: 0, overflow: "hidden", ...style } }, /* @__PURE__ */ React21.createElement("div", { "data-cueframe-media-tile-scene": sceneId, style: { position: "absolute", inset: 0 } }, ready ? /* @__PURE__ */ React21.createElement(
+    ThreeCanvas2,
+    {
+      width,
+      height,
+      frameloop: "demand",
+      gl: createWebGl2Renderer,
+      camera: { position: [0, 0, camera?.perspective ?? 1400], near: 0.1, far: 1e5 },
+      style: { width: "100%", height: "100%" }
+    },
+    /* @__PURE__ */ React21.createElement(SceneContents, { ...{
+      streamIds,
+      tiles,
+      sources,
+      camera,
+      fog,
+      background,
+      announce,
+      presentationReady,
+      playing
+    } })
+  ) : null), streamIds.map((id) => streams[id].asset.kind === "image" ? /* @__PURE__ */ React21.createElement(ImageProducer, { key: id, id, stream: streams[id], accept, report }) : /* @__PURE__ */ React21.createElement(VideoProducer, { key: id, id, stream: streams[id], accept, report })));
+}
+var ImageTileScene = MediaTileScene;
+
+// ../execution/animate/src/scene/errors.ts
+var SceneShotError = class extends Error {
+  code;
+  /** Dotted path into the scene spec the failure is about, when there is one. */
+  path;
+  constructor(code, detail, path = null) {
+    super(path ? `${code}: ${detail} (at ${path})` : `${code}: ${detail}`);
+    this.name = "SceneShotError";
+    this.code = code;
+    this.path = path;
+  }
+};
+
+// ../execution/animate/src/scene/scaling.ts
+function referenceScale(render, reference) {
+  if (render.width * reference.height !== render.height * reference.width) {
+    throw new SceneShotError(
+      "scene_aspect_mismatch",
+      `the shot is laid out for ${reference.width}x${reference.height} but the render is ${render.width}x${render.height}; re-layout the shot for the target aspect`,
+      "referenceSize"
+    );
+  }
+  return render.width / reference.width;
+}
+
+// ../execution/animate/src/scene/coordinates.ts
+import { Euler as Euler2, Matrix4 as Matrix42, Quaternion as Quaternion2, Vector3 as Vector32 } from "three";
+var SCENE_EULER_ORDER = "XYZ";
+var F = new Matrix42().makeScale(1, -1, 1);
+function conjugateF(m) {
+  return F.clone().multiply(m).multiply(F);
+}
+function sceneWorldMatrix(t) {
+  return new Matrix42().compose(
+    new Vector32(t.position[0], t.position[1], t.position[2]),
+    new Quaternion2().setFromEuler(new Euler2(t.rotation[0], t.rotation[1], t.rotation[2], SCENE_EULER_ORDER)),
+    new Vector32(t.scale, t.scale, t.scale)
+  );
+}
+function sceneCssMatrix(t) {
+  return conjugateF(sceneWorldMatrix(t));
+}
+function sceneLayerPose(t) {
+  const q = new Quaternion2().setFromEuler(new Euler2(t.rotation[0], t.rotation[1], t.rotation[2], SCENE_EULER_ORDER));
+  return { position: [...t.position], quaternion: [q.x, q.y, q.z, q.w], scale: t.scale };
+}
+function scaleSceneTransform(t, scale) {
+  return { position: [t.position[0] * scale, t.position[1] * scale, t.position[2] * scale], rotation: [...t.rotation], scale: t.scale };
+}
+
+// ../execution/animate/src/scene/v2/builders.tsx
+import React22, { useLayoutEffect as useLayoutEffect8, useMemo as useMemo5, useRef as useRef5 } from "react";
+import { DoubleSide as DoubleSide2, FrontSide as FrontSide2 } from "three";
+
+// ../execution/animate/src/scene/deviceOpacity.ts
+var BASE_OPACITY = "cueframeBaseOpacity";
+var BASE_TRANSPARENT = "cueframeBaseTransparent";
+function applyLayerOpacity(root, opacity) {
+  root.traverse((object) => {
+    const mesh = object;
+    if (!mesh.isMesh) return;
+    const materials = Array.isArray(mesh.material) ? mesh.material : [mesh.material];
+    for (const material of materials) {
+      const stored = material.userData[BASE_OPACITY];
+      const base = typeof stored === "number" ? stored : material.opacity;
+      if (typeof stored !== "number") material.userData[BASE_OPACITY] = base;
+      material.opacity = base * opacity;
+      const storedTransparent = material.userData[BASE_TRANSPARENT];
+      const baseTransparent = typeof storedTransparent === "boolean" ? storedTransparent : material.transparent;
+      if (typeof storedTransparent !== "boolean") material.userData[BASE_TRANSPARENT] = baseTransparent;
+      const transparent = baseTransparent || material.opacity < 1;
+      if (material.transparent !== transparent) {
+        material.transparent = transparent;
+        material.needsUpdate = true;
+      }
+    }
+  });
+}
+
+// ../execution/animate/src/scene/planeFit.ts
+function planeFit(fit, plane2, image) {
+  if (!(image.width > 0) || !(image.height > 0)) {
+    throw new SceneShotError("scene_internal", `a page image decoded to ${image.width}x${image.height}`);
+  }
+  const ratio = image.width * plane2.height / (image.height * plane2.width);
+  if (fit === "contain") {
+    const size = ratio > 1 ? { width: plane2.width, height: plane2.width * image.height / image.width } : { width: plane2.height * image.width / image.height, height: plane2.height };
+    return { size, repeat: [1, 1], offset: [0, 0] };
+  }
+  const repeat = ratio > 1 ? [1 / ratio, 1] : [1, ratio];
+  return {
+    size: { width: plane2.width, height: plane2.height },
+    repeat,
+    offset: [(1 - repeat[0]) / 2, (1 - repeat[1]) / 2]
+  };
+}
+
+// ../execution/animate/src/scene/textureImageSize.ts
+function textureImageSize(texture, slot, layerIndex) {
+  const image = texture.image;
+  const width = image?.width ?? 0;
+  const height = image?.height ?? 0;
+  if (!(width > 0) || !(height > 0)) throw new SceneShotError("scene_internal", `page image slot "${slot}" decoded to ${width}x${height}`, `layers.${layerIndex}.image`);
+  return { width, height };
+}
+
+// ../execution/animate/src/scene/UnlitPlane.tsx
+import { useLayoutEffect as useLayoutEffect5 } from "react";
+import { DoubleSide, FrontSide } from "three";
+var UNLIT_PLANE_ALPHA_TEST = 0.01;
+function UnlitPlane({ texture, fit, color = "#ffffff", transparent = true, depthWrite = true, backface = "hidden", resourceOwner, resourceName }) {
+  const [rx, ry] = fit.repeat;
+  const [ox, oy] = fit.offset;
+  useLayoutEffect5(() => {
+    if (texture.repeat.x !== rx || texture.repeat.y !== ry) texture.repeat.set(rx, ry);
+    if (texture.offset.x !== ox || texture.offset.y !== oy) texture.offset.set(ox, oy);
+  }, [texture, rx, ry, ox, oy]);
+  return /* @__PURE__ */ React.createElement("mesh", null, /* @__PURE__ */ React.createElement(MeasuredPlaneGeometry, { width: fit.size.width, height: fit.size.height, owner: resourceOwner, name: resourceName }), /* @__PURE__ */ React.createElement(
+    "meshBasicMaterial",
+    {
+      map: texture,
+      color,
+      ...UNLIT_COLOUR_MANAGED,
+      transparent,
+      depthWrite,
+      side: backface === "visible" ? DoubleSide : FrontSide,
+      alphaTest: transparent ? UNLIT_PLANE_ALPHA_TEST : 0
+    }
+  ));
+}
+
+// ../execution/animate/src/scene/useSceneImageTexture.ts
+import { useLayoutEffect as useLayoutEffect6, useRef as useRef3, useState as useState3 } from "react";
+import { useThree as useThree4 } from "@react-three/fiber";
+import { cancelRender as cancelRender3, continueRender as continueRender3, delayRender as delayRender3 } from "remotion";
+import { SRGBColorSpace as SRGBColorSpace4, TextureLoader as TextureLoader2 } from "three";
+
+// ../execution/animate/src/scene/readiness.ts
+var LoadGenerations = class {
+  current = 0;
+  closed = false;
+  begin() {
+    this.current += 1;
+    return this.current;
+  }
+  isLive(token) {
+    return !this.closed && token === this.current;
+  }
+  close() {
+    this.closed = true;
+  }
+};
+var EMPTY_TEXTURE_STATE = { drawn: null, pending: null };
+function onTextureLoaded(generations, state, token, texture, handle, effects) {
+  if (!generations.isLive(token)) {
+    discardStaleTexture(texture);
+    effects.continueRender(handle);
+    return { state, commit: null };
+  }
+  return { state: { ...state, pending: texture }, commit: { texture, handle } };
+}
+function onTextureError(generations, token, error, handle, target, effects) {
+  if (!generations.isLive(token)) {
+    effects.continueRender(handle);
+    return "released";
+  }
+  const detail = error instanceof Error ? error.message : String(error);
+  effects.cancelRender(new SceneShotError("scene_asset_load_failed", `${target.what} slot "${target.slot}" failed to load: ${detail}`, `assets.${target.slot}`));
+  return "cancelled";
+}
+function onTextureCommitted(state, committed, effects) {
+  effects.redraw();
+  effects.continueRender(committed.handle);
+  const held = commitImageTexture({ drawn: state.drawn }, committed.texture);
+  return { drawn: held.drawn, pending: state.pending === committed.texture ? null : state.pending };
+}
+function onTextureOwnerUnmounted(generations, state) {
+  generations.close();
+  releaseImageTexture({ drawn: state.drawn });
+  if (state.pending && state.pending !== state.drawn) discardStaleTexture(state.pending);
+  return EMPTY_TEXTURE_STATE;
+}
+
+// ../execution/animate/src/scene/redraw.ts
+function advanceRendererOnce(advance) {
+  advance(performance.now());
+}
+
+// ../execution/animate/src/scene/useSceneImageTexture.ts
+function useSceneImageTexture(src, slot, what, resourceOwner = `surface:${slot}`) {
+  const registerActual = useSceneActualResourceRegistrarV1();
+  const advance = useThree4((s) => s.advance);
+  const [generations] = useState3(() => new LoadGenerations());
+  const [firstHandle] = useState3(() => delayRender3(`scene: ${what} "${slot}"`));
+  const firstHandleSpent = useRef3(false);
+  const [committed, setCommitted] = useState3(null);
+  const state = useRef3(EMPTY_TEXTURE_STATE);
+  useLayoutEffect6(() => {
+    const token = generations.begin();
+    let handle;
+    if (!firstHandleSpent.current) {
+      firstHandleSpent.current = true;
+      handle = firstHandle;
+    } else {
+      handle = delayRender3(`scene: ${what} "${slot}"`);
+    }
+    new TextureLoader2().load(
+      src,
+      (texture) => {
+        const size = textureImageSize(texture, slot, 0);
+        const releaseMeasurement = registerActual(texture, [{
+          owner: resourceOwner,
+          name: "surface-texture",
+          domain: "gl",
+          bytes: sceneTextureBytes({
+            width: size.width,
+            height: size.height,
+            format: "rgba8",
+            mipLevels: sceneFullMipLevels(size.width, size.height)
+          }),
+          width: size.width,
+          height: size.height
+        }]);
+        texture.addEventListener("dispose", releaseMeasurement);
+        const result = onTextureLoaded(generations, state.current, token, texture, handle, { continueRender: continueRender3 });
+        state.current = result.state;
+        if (!result.commit) return;
+        texture.colorSpace = SRGBColorSpace4;
+        texture.anisotropy = 4;
+        setCommitted(result.commit);
+      },
+      void 0,
+      (error) => {
+        onTextureError(generations, token, error, handle, { slot, what }, { continueRender: continueRender3, cancelRender: cancelRender3 });
+      }
+    );
+    return () => {
+      continueRender3(handle);
+    };
+  }, [src, slot, what, resourceOwner, generations, firstHandle, registerActual]);
+  useLayoutEffect6(() => {
+    if (!committed) return;
+    state.current = onTextureCommitted(state.current, committed, { continueRender: continueRender3, redraw: () => advanceRendererOnce(advance) });
+  }, [committed, advance]);
+  useLayoutEffect6(() => () => {
+    state.current = onTextureOwnerUnmounted(generations, state.current);
+  }, [generations]);
+  return committed?.texture ?? null;
+}
+
+// ../execution/animate/src/scene/useWorldTextTexture.ts
+import { useLayoutEffect as useLayoutEffect7, useRef as useRef4, useState as useState4 } from "react";
+import { useThree as useThree5 } from "@react-three/fiber";
+import { cancelRender as cancelRender4, continueRender as continueRender4, delayRender as delayRender4 } from "remotion";
+
+// ../execution/animate/src/scene/fontReadiness.ts
+function documentFonts() {
+  const fonts = globalThis.document?.fonts;
+  return fonts ?? null;
+}
+function whenFontReady(fonts, shorthand, sample, path) {
+  if (!fonts) {
+    return Promise.reject(new SceneShotError(
+      "scene_font_unavailable",
+      `the font ${shorthand} cannot be gated on this host: it exposes no document.fonts, so a fallback face would draw unremarked`,
+      path
+    ));
+  }
+  return fonts.load(shorthand, sample).then(() => fonts.ready).then(() => void 0).catch((error) => {
+    const detail = error instanceof Error ? error.message : String(error);
+    throw new SceneShotError("scene_font_unavailable", `the font ${shorthand} could not be loaded: ${detail}`, path);
+  });
+}
+
+// ../execution/animate/src/scene/rasterCache.ts
+var RasterCache = class {
+  entries = /* @__PURE__ */ new Map();
+  acquire(key, create) {
+    const existing = this.entries.get(key);
+    if (existing) {
+      existing.refs += 1;
+      return existing.value;
+    }
+    const value = create();
+    this.entries.set(key, { value, refs: 1 });
+    return value;
+  }
+  release(key, value) {
+    const entry = this.entries.get(key);
+    if (!entry || entry.value !== value) {
+      value.dispose();
+      return;
+    }
+    entry.refs -= 1;
+    if (entry.refs > 0) return;
+    this.entries.delete(key);
+    entry.value.dispose();
+  }
+  /** How many holders a key has right now; 0 when it is not cached. Tests and diagnostics only. */
+  refs(key) {
+    return this.entries.get(key)?.refs ?? 0;
+  }
+  get size() {
+    return this.entries.size;
+  }
+};
+var worldTextRasterCache = new RasterCache();
+
+// ../execution/animate/src/scene/rasterReadiness.ts
+function onRasterReady(generations, cache, token, key, handle, create, effects) {
+  if (!generations.isLive(token)) {
+    effects.continueRender(handle);
+    return null;
+  }
+  return { key, raster: cache.acquire(key, create), handle };
+}
+function onRasterCommitted(cache, held, committed, effects) {
+  effects.redraw();
+  effects.continueRender(committed.handle);
+  if (held) cache.release(held.key, held.raster);
+  return committed;
+}
+function onRasterOwnerUnmounted(generations, cache, held) {
+  generations.close();
+  if (held) cache.release(held.key, held.raster);
+  return null;
+}
+
+// ../execution/animate/src/scene/textLayout.ts
+function textBlockLayout(layer, scale) {
+  const fontSize = layer.fontSize * scale;
+  const lineBox = fontSize * layer.lineHeight;
+  return {
+    width: layer.width * scale,
+    height: layer.lines.length * lineBox,
+    scale,
+    fontSize,
+    lineHeight: layer.lineHeight,
+    lineBox,
+    align: layer.align,
+    lines: layer.lines.map((_, index) => ({ index, top: index * lineBox, height: lineBox }))
+  };
+}
+function lineBaselineY(box2, metrics) {
+  const halfLeading = (box2.height - (metrics.ascent + metrics.descent)) / 2;
+  return box2.top + halfLeading + metrics.ascent;
+}
+function lineOriginX(layout, lineWidth) {
+  switch (layout.align) {
+    case "left":
+      return 0;
+    case "center":
+      return (layout.width - lineWidth) / 2;
+    case "right":
+      return layout.width - lineWidth;
+  }
+}
+function resolveSceneFontFamily(family, path) {
+  if (family.startsWith("$brand:")) {
+    throw new SceneShotError("scene_brand_unresolved", `brand reference "${family}" was not resolved before rendering`, path);
+  }
+  return family;
+}
+function textFontShorthand(layer, scale, path = "fontFamily") {
+  return `${layer.fontStyle} ${layer.fontWeight} ${layer.fontSize * scale}px "${resolveSceneFontFamily(layer.fontFamily, path)}"`;
+}
+
+// ../execution/animate/src/scene/worldTextTexture.ts
+import { CanvasTexture as CanvasTexture2, LinearFilter, LinearMipmapLinearFilter, SRGBColorSpace as SRGBColorSpace5 } from "three";
+
+// ../execution/animate/src/scene/backdrop.ts
+function resolveSceneColor(color, path) {
+  if (color.startsWith("$brand:")) {
+    throw new SceneShotError("scene_brand_unresolved", `brand reference "${color}" was not resolved before rendering`, path);
+  }
+  return color;
+}
+
+// ../execution/animate/src/scene/worldTextRaster.ts
+var WORLD_TEXT_MAX_TEXTURE = STUDIO_SHADOW_MAP_BUDGET;
+function worldTextCacheKey(layer, scale, index) {
+  return JSON.stringify([
+    scale,
+    resolveSceneFontFamily(layer.fontFamily, `layers.${index}.fontFamily`),
+    layer.fontWeight,
+    layer.fontStyle,
+    layer.fontSize,
+    layer.lineHeight,
+    layer.letterSpacing,
+    layer.align,
+    layer.width,
+    resolveSceneColor(layer.color, `layers.${index}.color`),
+    layer.lines.map((line, l) => line.runs.map((run, r) => [
+      run.text,
+      run.emphasis ?? false,
+      run.color === void 0 ? null : resolveSceneColor(run.color, `layers.${index}.lines.${l}.runs.${r}.color`)
+    ]))
+  ]);
+}
+function worldTextRasterSize(layout, layerId, index) {
+  const width = Math.max(1, Math.ceil(layout.width));
+  const height = Math.max(1, Math.ceil(layout.height));
+  if (width > WORLD_TEXT_MAX_TEXTURE || height > WORLD_TEXT_MAX_TEXTURE) {
+    throw new SceneShotError(
+      "scene_resource_exhausted",
+      `world text layer "${layerId}" rasterizes to ${width}x${height}, past the ${WORLD_TEXT_MAX_TEXTURE} texture limit; narrow the layer or render smaller`,
+      `layers.${index}.width`
+    );
+  }
+  return { width, height };
+}
+function faceMetrics(ctx, index) {
+  const m = ctx.measureText("Hxg");
+  if (m.fontBoundingBoxAscent === void 0 || m.fontBoundingBoxDescent === void 0) {
+    throw new SceneShotError(
+      "scene_internal",
+      "this renderer's 2D context reports no font-box metrics (`fontBoundingBoxAscent`/`fontBoundingBoxDescent`), so a world-text baseline cannot be placed where the DOM path would place it; render on a browser that reports them",
+      `layers.${index}`
+    );
+  }
+  return { ascent: m.fontBoundingBoxAscent, descent: m.fontBoundingBoxDescent };
+}
+function drawWorldText(ctx, layer, layout, index) {
+  ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+  ctx.font = textFontShorthand(layer, layout.scale, `layers.${index}.fontFamily`);
+  ctx.textAlign = "left";
+  ctx.textBaseline = "alphabetic";
+  ctx.letterSpacing = `${layer.letterSpacing * layout.scale}px`;
+  const metrics = faceMetrics(ctx, index);
+  const base = resolveSceneColor(layer.color, `layers.${index}.color`);
+  layer.lines.forEach((line, lineIndex) => {
+    const box2 = layout.lines[lineIndex];
+    const y = lineBaselineY(box2, metrics);
+    const faces = resolveCaptionFaces({ fontFamily: resolveSceneFontFamily(layer.fontFamily, `layers.${index}.fontFamily`), fontWeight: layer.fontWeight });
+    const runFont = (emphasis) => `${emphasis ? faces.emphasis.style : layer.fontStyle} ${emphasis ? faces.emphasis.weight : layer.fontWeight} ${layout.fontSize}px "${resolveSceneFontFamily(layer.fontFamily, `layers.${index}.fontFamily`)}"`;
+    const widths = line.runs.map((run) => {
+      ctx.font = runFont(run.emphasis);
+      return ctx.measureText(run.text).width;
+    });
+    let x = lineOriginX(layout, widths.reduce((a, b) => a + b, 0));
+    line.runs.forEach((run, runIndex) => {
+      ctx.font = runFont(run.emphasis);
+      ctx.fillStyle = run.color === void 0 ? base : resolveSceneColor(run.color, `layers.${index}.lines.${lineIndex}.runs.${runIndex}.color`);
+      ctx.fillText(run.text, x, y);
+      x += widths[runIndex];
+    });
+  });
+}
+function worldTextLayout(layer, scale) {
+  return textBlockLayout(layer, scale);
+}
+
+// ../execution/animate/src/scene/worldTextTexture.ts
+function createWorldTextTexture(request, registerActual = registerActualSceneResourcesV1) {
+  const document2 = globalThis.document;
+  if (!document2) throw new SceneShotError("scene_internal", "world text needs a document to rasterize into");
+  const canvas = document2.createElement("canvas");
+  canvas.width = request.size.width;
+  canvas.height = request.size.height;
+  const ctx = canvas.getContext("2d");
+  if (!ctx) {
+    throw new SceneShotError("scene_internal", `world text layer "${request.layer.id}" could not open a 2D context`, `layers.${request.index}.lines`);
+  }
+  drawWorldText(ctx, request.layer, request.layout, request.index);
+  const texture = new CanvasTexture2(canvas);
+  texture.colorSpace = SRGBColorSpace5;
+  texture.generateMipmaps = true;
+  texture.minFilter = LinearMipmapLinearFilter;
+  texture.magFilter = LinearFilter;
+  texture.anisotropy = request.anisotropy;
+  texture.needsUpdate = true;
+  const rgbaBytes = request.size.width * request.size.height * 4;
+  const releaseMeasurement = registerActual(texture, [
+    {
+      owner: `text:${request.layer.id}`,
+      name: "raster-canvas",
+      domain: "cpu",
+      bytes: rgbaBytes,
+      width: request.size.width,
+      height: request.size.height,
+      byteLength: rgbaBytes
+    },
+    {
+      owner: `text:${request.layer.id}`,
+      name: "raster-mip-chain",
+      domain: "gl",
+      bytes: sceneTextureBytes({
+        width: request.size.width,
+        height: request.size.height,
+        format: "rgba8",
+        mipLevels: sceneFullMipLevels(request.size.width, request.size.height)
+      }),
+      width: request.size.width,
+      height: request.size.height
+    }
+  ]);
+  texture.addEventListener("dispose", releaseMeasurement);
+  return texture;
+}
+
+// ../execution/animate/src/scene/useWorldTextTexture.ts
+function useWorldTextTexture(prepared) {
+  const registerActual = useSceneActualResourceRegistrarV1();
+  const { layer, index, layout, size, key } = prepared;
+  const advance = useThree5((s) => s.advance);
+  const gl = useThree5((s) => s.gl);
+  const [generations] = useState4(() => new LoadGenerations());
+  const [firstHandle] = useState4(() => delayRender4(`scene: world text "${layer.id}"`));
+  const firstHandleSpent = useRef4(false);
+  const [committed, setCommitted] = useState4(null);
+  const held = useRef4(null);
+  const request = useRef4({ layer, layout, size, index });
+  useLayoutEffect7(() => {
+    request.current = { layer, layout, size, index };
+  });
+  useLayoutEffect7(() => {
+    const token = generations.begin();
+    let handle;
+    if (!firstHandleSpent.current) {
+      firstHandleSpent.current = true;
+      handle = firstHandle;
+    } else {
+      handle = delayRender4(`scene: world text "${request.current.layer.id}"`);
+    }
+    const anisotropy = gl.capabilities.getMaxAnisotropy();
+    const { layer: current, index: at } = request.current;
+    const shorthand = textFontShorthand(current, request.current.layout.scale, `layers.${at}.fontFamily`);
+    const faces = resolveCaptionFaces({ fontFamily: current.fontFamily, fontWeight: current.fontWeight });
+    const samples = { base: "", emphasis: "" };
+    for (const line of current.lines) for (const run of line.runs) samples[run.emphasis ? "emphasis" : "base"] += run.text;
+    const readiness = [whenFontReady(documentFonts(), shorthand, samples.base || " ", `layers.${at}.fontFamily`)];
+    if (samples.emphasis) readiness.push(whenFontReady(documentFonts(), `${faces.emphasis.style} ${faces.emphasis.weight} ${request.current.layout.fontSize}px "${current.fontFamily}"`, samples.emphasis, `layers.${at}.fontWeight`));
+    Promise.all(readiness).then(() => {
+      const ready = onRasterReady(generations, worldTextRasterCache, token, key, handle, () => createWorldTextTexture({ ...request.current, anisotropy }, registerActual), { continueRender: continueRender4 });
+      if (ready) setCommitted(ready);
+    }).catch((error) => {
+      if (!generations.isLive(token)) {
+        continueRender4(handle);
+        return;
+      }
+      cancelRender4(error instanceof Error ? error : new Error(String(error)));
+    });
+    return () => {
+      continueRender4(handle);
+    };
+  }, [key, gl, generations, firstHandle, registerActual]);
+  useLayoutEffect7(() => {
+    if (!committed) return;
+    held.current = onRasterCommitted(worldTextRasterCache, held.current, committed, { continueRender: continueRender4, redraw: () => advanceRendererOnce(advance) });
+  }, [committed, advance]);
+  useLayoutEffect7(() => () => {
+    held.current = onRasterOwnerUnmounted(generations, worldTextRasterCache, held.current);
+  }, [generations]);
+  return committed?.raster ?? null;
+}
+
+// ../execution/animate/src/scene/preparedWorldText.ts
+function worldTextPlaneFit(layout) {
+  return { size: { width: layout.width, height: layout.height }, repeat: [1, 1], offset: [0, 0] };
+}
+
+// ../execution/animate/src/scene/v2/builders.tsx
+function LoadedSceneSurface({ src, slot, what, resourceOwner, children }) {
+  return children(useSceneImageTexture(src, slot, what, resourceOwner));
+}
+var sceneDeviceResourceOwnerV1 = (node) => `${node.kind}:${node.id}`;
+var slabContentFit = (width, height, image) => planeFit("contain", { width, height }, image);
+function PosedObject({ transform, scale, opacity, children }) {
+  const group = useRef5(null);
+  const pose = useMemo5(() => sceneLayerPose(scaleSceneTransform(transform, scale)), [
+    transform.position[0],
+    transform.position[1],
+    transform.position[2],
+    transform.rotation[0],
+    transform.rotation[1],
+    transform.rotation[2],
+    transform.scale,
+    scale
+  ]);
+  useLayoutEffect8(() => {
+    if (group.current) applyLayerOpacity(group.current, opacity);
+  }, [opacity]);
+  return /* @__PURE__ */ React22.createElement("group", { ref: group, visible: opacity > 0, position: pose.position, quaternion: pose.quaternion, scale: pose.scale }, children);
+}
+function LaptopObject({ node, src, screenColor, preparedSurface, scale, surfaceResourceOwner, glassOpacity = DEVICE_GLASS_OPACITY_LINEAR, mountEarly = false }) {
+  const materialOverrides = Object.fromEntries((node.materials ?? []).map((material) => [material.role, material]));
+  const binding = node.surfaces?.screen;
+  const slot = binding && "assetSlot" in binding ? binding.assetSlot : `${node.id}.screen`;
+  const render = (screen, color = screenColor, unbound = false) => {
+    if (!unbound && !color && !mountEarly && !screen) return null;
+    return /* @__PURE__ */ React22.createElement(PosedObject, { transform: node.transform, scale, opacity: node.opacity }, /* @__PURE__ */ React22.createElement(
+      DeviceMesh,
+      {
+        kind: "laptop",
+        screen: color ? null : screen,
+        screenColor: color,
+        materialOverrides,
+        finish: node.materials?.find((material) => material.role === "shell")?.color ?? "#2a2a30",
+        glassOpacity,
+        openAngle: node.openAngle * 180 / Math.PI,
+        width: node.width * scale,
+        resourceOwner: sceneDeviceResourceOwnerV1(node)
+      }
+    ));
+  };
+  if (preparedSurface) return render(preparedSurface.kind === "texture" ? preparedSurface.texture : null, preparedSurface.kind === "color" ? preparedSurface.color : void 0);
+  if (screenColor) return render(null, screenColor);
+  if (!src) return render(null, void 0, true);
+  return /* @__PURE__ */ React22.createElement(LoadedSceneSurface, { src, slot, what: "screenshot", resourceOwner: surfaceResourceOwner }, render);
+}
+function PhoneObject({ node, src, screenColor, preparedSurface, scale, surfaceResourceOwner, glassOpacity = DEVICE_GLASS_OPACITY_LINEAR, mountEarly = false }) {
+  const materialOverrides = Object.fromEntries((node.materials ?? []).map((material) => [material.role, material]));
+  const binding = node.surfaces?.screen;
+  const slot = binding && "assetSlot" in binding ? binding.assetSlot : `${node.id}.screen`;
+  const render = (screen, color = screenColor, unbound = false) => {
+    if (!unbound && !color && !mountEarly && !screen) return null;
+    return /* @__PURE__ */ React22.createElement(PosedObject, { transform: node.transform, scale, opacity: node.opacity }, /* @__PURE__ */ React22.createElement(
+      DeviceMesh,
+      {
+        kind: "phone",
+        screen: color ? null : screen,
+        screenColor: color,
+        materialOverrides,
+        finish: node.materials?.find((material) => material.role === "shell")?.color ?? "#2a2a30",
+        glassOpacity,
+        width: node.width * scale,
+        resourceOwner: sceneDeviceResourceOwnerV1(node)
+      }
+    ));
+  };
+  if (preparedSurface) return render(preparedSurface.kind === "texture" ? preparedSurface.texture : null, preparedSurface.kind === "color" ? preparedSurface.color : void 0);
+  if (screenColor) return render(null, screenColor);
+  if (!src) return render(null, void 0, true);
+  return /* @__PURE__ */ React22.createElement(LoadedSceneSurface, { src, slot, what: "screenshot", resourceOwner: surfaceResourceOwner }, render);
+}
+var SLAB_CONTENT_OFFSET = SCENE_SLAB_CONTENT_OFFSET;
+function SlabObject({ node, src, frontColor, preparedSurface, scale, surfaceResourceOwner, mountEarly = false, expectedBodyTriangles }) {
+  const bound = node.surfaces?.front;
+  const faceOverride = node.materials?.find((material) => material.role === "face");
+  const frontSlot = bound && "assetSlot" in bound ? bound.assetSlot : `${node.id}.front`;
+  const hasFront = Boolean(bound || frontColor || preparedSurface);
+  const width = node.width * scale;
+  const height = node.height * scale;
+  const thickness = node.thickness * scale;
+  const { geometry, finish } = useOwnedSlabResources(
+    width,
+    height,
+    thickness,
+    node.cornerRadius * scale,
+    node.edgeRadius * scale,
+    node.finish,
+    node.materials?.find((material) => material.role === "body")?.color ?? SLAB_DEFAULTS.baseColor,
+    node.materials?.find((material) => material.role === "body"),
+    `slab:${node.id}`
+  );
+  if (expectedBodyTriangles !== void 0 && slabTriangleCount(geometry) !== expectedBodyTriangles) {
+    throw new Error(`scene_builder_descriptor_mismatch: slab '${node.id}' built ${slabTriangleCount(geometry)} body triangles; sealed ${expectedBodyTriangles}.`);
+  }
+  const render = (front, color = frontColor) => {
+    const contentFit = front && bound ? slabContentFit(width, height, textureImageSize(front, frontSlot, 0)) : null;
+    if (bound && !color && !mountEarly && !front) return null;
+    return /* @__PURE__ */ React22.createElement(PosedObject, { transform: node.transform, scale, opacity: node.opacity }, /* @__PURE__ */ React22.createElement(
+      "mesh",
+      {
+        geometry,
+        material: finish.material,
+        castShadow: true,
+        receiveShadow: true,
+        onBeforeRender: takeSceneEnvironment
+      }
+    ), hasFront && (color || front || mountEarly) ? /* @__PURE__ */ React22.createElement("group", { position: [0, 0, thickness / 2 + SLAB_CONTENT_OFFSET * scale] }, mountEarly ? /* @__PURE__ */ React22.createElement("mesh", null, /* @__PURE__ */ React22.createElement("planeGeometry", { args: [width, height] }), /* @__PURE__ */ React22.createElement("meshBasicMaterial", { map: front, transparent: true, ...UNLIT_COLOUR_MANAGED })) : color ? /* @__PURE__ */ React22.createElement("mesh", null, /* @__PURE__ */ React22.createElement(MeasuredPlaneGeometry, { width, height, owner: `slab:${node.id}`, name: "front-geometry" }), /* @__PURE__ */ React22.createElement("meshBasicMaterial", { color: faceOverride?.color ?? color, ...UNLIT_COLOUR_MANAGED })) : front && contentFit ? /* @__PURE__ */ React22.createElement(UnlitPlane, { texture: front, fit: contentFit, color: faceOverride?.color, resourceOwner: `slab:${node.id}`, resourceName: "front-geometry" }) : null) : null);
+  };
+  if (preparedSurface) return render(preparedSurface.kind === "texture" ? preparedSurface.texture : null, preparedSurface.kind === "color" ? preparedSurface.color : void 0);
+  if (frontColor) return render(null, frontColor);
+  if (!src) return render(null);
+  return /* @__PURE__ */ React22.createElement(LoadedSceneSurface, { src, slot: frontSlot, what: "page image", resourceOwner: surfaceResourceOwner }, render);
+}
+function useOwnedSlabResources(width, height, thickness, cornerRadius, edgeRadius, finishName, baseColor, materialOverride, owner = "slab:unscoped") {
+  const registerActual = useSceneActualResourceRegistrarV1();
+  const geometry = useMemo5(
+    () => slabBodyGeometry(width, height, thickness, cornerRadius, edgeRadius),
+    [width, height, thickness, cornerRadius, edgeRadius]
+  );
+  const finish = useMemo5(() => slabFinishMaterial(finishName, baseColor, materialOverride, owner, registerActual), [
+    finishName,
+    baseColor,
+    materialOverride?.type,
+    materialOverride?.color,
+    materialOverride?.roughness,
+    materialOverride?.metalness,
+    materialOverride?.clearcoat,
+    materialOverride?.clearcoatRoughness,
+    materialOverride?.anisotropy,
+    materialOverride?.anisotropyRotation,
+    materialOverride?.ior,
+    materialOverride?.reflectivity,
+    owner,
+    registerActual
+  ]);
+  const geometryBytes = (geometry.index?.array.byteLength ?? 0) + Object.values(geometry.attributes).reduce((sum, attribute) => sum + attribute.array.byteLength, 0);
+  const geometryMeasurement = useMemo5(() => registerActual(geometry, [
+    { owner, name: "body-geometry", domain: "gl", bytes: geometryBytes },
+    { owner, name: "body-geometry-arrays", domain: "cpu", bytes: geometryBytes }
+  ]), [geometry, geometryBytes, owner, registerActual]);
+  useLayoutEffect8(() => () => {
+    geometry.dispose();
+    geometryMeasurement();
+  }, [geometry, geometryMeasurement]);
+  useLayoutEffect8(() => () => finish.dispose(), [finish]);
+  return { geometry, finish };
+}
+function PageObject({ node, src, contentColor, preparedSurface, scale, surfaceResourceOwner, mountEarly = false }) {
+  const binding = node.surfaces?.content;
+  const slot = binding && "assetSlot" in binding ? binding.assetSlot : `${node.id}.content`;
+  const baseOverride = node.materials?.find((material) => material.role === "base");
+  const box2 = { width: node.width * scale, height: node.height * scale };
+  const render = (texture, color = contentColor) => {
+    if (mountEarly) {
+      return /* @__PURE__ */ React22.createElement(PosedObject, { transform: node.transform, scale, opacity: node.opacity }, /* @__PURE__ */ React22.createElement("mesh", null, /* @__PURE__ */ React22.createElement("planeGeometry", { args: [box2.width, box2.height] }), /* @__PURE__ */ React22.createElement("meshBasicMaterial", { map: texture, ...UNLIT_COLOUR_MANAGED, transparent: true, alphaTest: UNLIT_PLANE_ALPHA_TEST })));
+    }
+    if (color) return /* @__PURE__ */ React22.createElement(PosedObject, { transform: node.transform, scale, opacity: node.opacity }, /* @__PURE__ */ React22.createElement("mesh", null, /* @__PURE__ */ React22.createElement(MeasuredPlaneGeometry, { width: box2.width, height: box2.height, owner: `page:${node.id}`, name: "content-geometry" }), /* @__PURE__ */ React22.createElement(
+      "meshBasicMaterial",
+      {
+        color: baseOverride?.color ?? color,
+        ...UNLIT_COLOUR_MANAGED,
+        transparent: node.transparency !== "opaque",
+        depthWrite: node.depthWrite,
+        side: node.backface === "visible" ? DoubleSide2 : FrontSide2
+      }
+    )));
+    if (!texture) return null;
+    const image = textureImageSize(texture, slot, 0);
+    const fit = planeFit(node.fit, box2, image);
+    return /* @__PURE__ */ React22.createElement(PosedObject, { transform: node.transform, scale, opacity: node.opacity }, /* @__PURE__ */ React22.createElement(UnlitPlane, { texture, fit, color: baseOverride?.color, transparent: node.transparency !== "opaque", depthWrite: node.depthWrite, backface: node.backface, resourceOwner: `page:${node.id}`, resourceName: "content-geometry" }));
+  };
+  if (preparedSurface) return render(preparedSurface.kind === "texture" ? preparedSurface.texture : null, preparedSurface.kind === "color" ? preparedSurface.color : void 0);
+  if (contentColor) return render(null, contentColor);
+  return /* @__PURE__ */ React22.createElement(LoadedSceneSurface, { src, slot, what: "page image", resourceOwner: surfaceResourceOwner }, render);
+}
+function WorldTextObject({ node, index, scale, referenceWidth }) {
+  const prepared = useMemo5(() => {
+    const rasterNode = { ...node, width: node.maxWidth ?? referenceWidth };
+    const layout = worldTextLayout(rasterNode, scale);
+    return {
+      kind: "worldText",
+      layer: rasterNode,
+      index,
+      layout,
+      size: worldTextRasterSize(layout, node.id, index),
+      key: worldTextCacheKey(rasterNode, scale, index)
+    };
+  }, [node, index, scale, referenceWidth]);
+  const texture = useWorldTextTexture(prepared);
+  if (!texture) return null;
+  return /* @__PURE__ */ React22.createElement(PosedObject, { transform: node.transform, scale, opacity: node.opacity }, /* @__PURE__ */ React22.createElement(UnlitPlane, { texture, fit: worldTextPlaneFit(prepared.layout), resourceOwner: `text:${node.id}`, resourceName: "plane-geometry" }));
+}
+
+// ../execution/animate/src/scene/v2/slots.ts
+var BOTH_SCALES = [2, 3];
+function sceneSlotsFor(node) {
+  switch (node.kind) {
+    case "laptop":
+      return [{
+        slot: "screen",
+        attachment: { part: "lid", materialRole: "screen" },
+        dimensions: { width: node.width * 0.86, height: node.width * 0.54 },
+        uvOrigin: "top-left",
+        fit: "contain",
+        alpha: "straight",
+        depth: "test-only",
+        required: false,
+        bakeScales: BOTH_SCALES
+      }];
+    case "slab":
+      return [{
+        slot: "front",
+        attachment: { part: "body", materialRole: "face" },
+        dimensions: { width: node.width, height: node.height },
+        uvOrigin: "top-left",
+        fit: "contain",
+        alpha: "straight",
+        depth: "test-only",
+        required: false,
+        bakeScales: BOTH_SCALES
+      }];
+    case "page":
+      return [{
+        slot: "content",
+        attachment: { part: "quad", materialRole: "base" },
+        dimensions: { width: node.width, height: node.height },
+        // A page's alpha and depth follow its own declared fields; `fit` is the author's.
+        uvOrigin: "top-left",
+        fit: node.fit,
+        alpha: "straight",
+        depth: "write",
+        // The ONE required slot in the table: a page with no content is not a page.
+        required: true,
+        bakeScales: BOTH_SCALES
+      }];
+    default:
+      return [];
+  }
+}
+function collect(nodes, ancestors, out) {
+  for (const node of nodes) {
+    if (node.kind === "text" && node.space === "screen") continue;
+    const chain = [...ancestors, node.transform];
+    if (node.kind === "group") {
+      collect(node.children, chain, out);
+      continue;
+    }
+    const bindings = node.surfaces;
+    if (!bindings) continue;
+    for (const descriptor of sceneSlotsFor(node)) {
+      const binding = bindings[descriptor.slot];
+      if (binding) out.push({ layerId: node.id, slot: descriptor.slot, binding, dimensions: descriptor.dimensions, chain });
+    }
+  }
+}
+function sceneBoundSurfaces(spec2) {
+  const out = [];
+  collect(spec2.layers, [], out);
+  return out;
+}
+function assertSceneSurfaceResolution(spec2, output) {
+  for (const surface of sceneBoundSurfaces(spec2)) {
+    if (surface.binding.source !== "component") continue;
+    const { layout, bakeScale } = surface.binding;
+    selectSceneBakeScale({
+      surfaceId: surface.layerId,
+      slotName: surface.slot,
+      slot: surface.dimensions,
+      layout,
+      contentDuration: 1,
+      output,
+      referenceSize: spec2.referenceSize,
+      evaluate: () => ({ camera: spec2.camera, chain: surface.chain })
+    }, bakeScale);
+  }
+}
+
+// ../execution/animate/src/scene/v2/videoBinding.tsx
+import React23, { useCallback as useCallback2, useLayoutEffect as useLayoutEffect9, useRef as useRef6, useState as useState5 } from "react";
+import { flushSync } from "react-dom";
+import { useThree as useThree6 } from "@react-three/fiber";
+import { Video as Video2 } from "@remotion/media";
+import { Sequence, cancelRender as cancelRender5, continueRender as continueRender5, delayRender as delayRender5, useCurrentFrame as useCurrentFrame16 } from "remotion";
+import { CanvasTexture as CanvasTexture3, LinearFilter as LinearFilter2, LinearMipmapLinearFilter as LinearMipmapLinearFilter2, SRGBColorSpace as SRGBColorSpace6 } from "three";
+var VIDEO_ERROR = "__cueframe_component_error_v2__:scene_video_runtime_error:";
+function sceneHasVideoTextureV1(scene, texture) {
+  let attached = false;
+  scene.traverse((object) => {
+    const material = object.material;
+    const rows = Array.isArray(material) ? material : [material];
+    if (rows.some((row) => row?.map === texture)) attached = true;
+  });
+  return attached;
+}
+function decodedDimensions(image) {
+  const value = image;
+  const width = value.displayWidth ?? value.videoWidth ?? value.width ?? 0;
+  const height = value.displayHeight ?? value.videoHeight ?? value.height ?? 0;
+  if (!Number.isSafeInteger(width) || width <= 0 || !Number.isSafeInteger(height) || height <= 0) throw new Error(`${VIDEO_ERROR} decoded video frame has invalid dimensions.`);
+  return { width, height };
+}
+function SceneVideoBindingV1({ src, schedule, contentFrame, width, height, resourceOwner = `video:${src}`, children }) {
+  const registerActual = useSceneActualResourceRegistrarV1();
+  const compositionFrame = useCurrentFrame16();
+  const address = sceneVideoMidpointAddressV1(contentFrame, schedule);
+  const expected = useRef6("");
+  const alive = useRef6(true);
+  const canvas = useRef6(null);
+  const texture = useRef6(null);
+  const releaseTextureMeasurement = useRef6(null);
+  const accepted = useRef6(null);
+  const revision = useRef6(0);
+  const drawReceipt = useRef6({ request: null, revision: null });
+  const readinessHandle = useRef6(null);
+  const [binding, setBinding] = useState5(null);
+  const request = `${contentFrame}:${address.sourceIndex}:${address.mediaFrame}`;
+  expected.current = request;
+  useLayoutEffect9(() => {
+    alive.current = true;
+    return () => {
+      alive.current = false;
+      if (readinessHandle.current !== null) continueRender5(readinessHandle.current);
+      readinessHandle.current = null;
+      if (texture.current) {
+        texture.current.dispose();
+        releaseTextureMeasurement.current?.();
+      }
+      releaseTextureMeasurement.current = null;
+      texture.current = null;
+      canvas.current = null;
+      accepted.current = null;
+    };
+  }, []);
+  const onVideoFrame = useCallback2((image) => {
+    if (!alive.current || expected.current !== request || accepted.current === request) return;
+    const size = decodedDimensions(image);
+    if (size.width !== width || size.height !== height) throw new Error(`${VIDEO_ERROR} decoded dimensions ${size.width}x${size.height} differ from admitted ${width}x${height}.`);
+    let owned = canvas.current;
+    if (!owned) {
+      owned = document.createElement("canvas");
+      owned.width = size.width;
+      owned.height = size.height;
+      canvas.current = owned;
+      const uploaded = new CanvasTexture3(owned);
+      uploaded.colorSpace = SRGBColorSpace6;
+      uploaded.minFilter = LinearMipmapLinearFilter2;
+      uploaded.magFilter = LinearFilter2;
+      uploaded.generateMipmaps = true;
+      releaseTextureMeasurement.current = registerActual(uploaded, [
+        { owner: resourceOwner, name: "owned-video-canvas", domain: "cpu", bytes: size.width * size.height * 4, width: size.width, height: size.height, byteLength: size.width * size.height * 4 },
+        { owner: resourceOwner, name: "surface-texture", domain: "gl", bytes: sceneTextureBytes({ width: size.width, height: size.height, format: "rgba8", mipLevels: sceneFullMipLevels(size.width, size.height) }), width: size.width, height: size.height }
+      ]);
+      texture.current = uploaded;
+    } else if (owned.width !== size.width || owned.height !== size.height) {
+      throw new Error(`${VIDEO_ERROR} decoded dimensions changed after admission.`);
+    }
+    const context = owned.getContext("2d", { alpha: true });
+    context.clearRect(0, 0, size.width, size.height);
+    context.drawImage(image, 0, 0, size.width, size.height);
+    accepted.current = request;
+    revision.current += 1;
+    drawReceipt.current = { request: null, revision: null };
+    if (readinessHandle.current !== null) continueRender5(readinessHandle.current);
+    readinessHandle.current = delayRender5(`Commit video texture ${request}`, { timeoutInMilliseconds: 12e4 });
+    const handle = readinessHandle.current;
+    const next = { kind: "video-texture", texture: texture.current, visual: { kind: "texture", texture: texture.current, readiness: "committed" }, sourceIndex: address.sourceIndex, revision: revision.current, request, drawReceipt: drawReceipt.current, readinessHandle: handle, releaseReadiness: () => {
+      if (readinessHandle.current !== handle) return;
+      readinessHandle.current = null;
+      continueRender5(handle);
+    } };
+    flushSync(() => setBinding(next));
+  }, [address.sourceIndex, height, request, resourceOwner, width, registerActual]);
+  const handleError = useCallback2((error) => {
+    cancelRender5(error);
+    return "fail";
+  }, []);
+  return /* @__PURE__ */ React23.createElement(React23.Fragment, null, children(binding), /* @__PURE__ */ React23.createElement(Sequence, { from: compositionFrame - address.mediaFrame, layout: "none" }, /* @__PURE__ */ React23.createElement(
+    Video2,
+    {
+      src,
+      muted: true,
+      headless: true,
+      showInTimeline: false,
+      disallowFallbackToOffthreadVideo: true,
+      playbackRate: address.playbackRate,
+      onVideoFrame,
+      onError: handleError,
+      delayRenderTimeoutInMilliseconds: 12e4
+    }
+  )));
+}
+function SceneVideoTextureCommitV1({ binding }) {
+  const { advance, scene } = useThree6((state) => ({ advance: state.advance, scene: state.scene }));
+  useLayoutEffect9(() => {
+    if (!sceneHasVideoTextureV1(scene, binding.texture)) throw new Error(`${VIDEO_ERROR} matching texture was not attached to a material before readiness.`);
+    binding.texture.needsUpdate = true;
+    advance(performance.now());
+    binding.drawReceipt.request = binding.request;
+    binding.drawReceipt.revision = binding.revision;
+    binding.releaseReadiness();
+  }, [advance, binding, scene]);
+  return null;
+}
+
+// ../execution/animate/src/scene/v2/SceneShotV2.tsx
+import React26, { useLayoutEffect as useLayoutEffect11 } from "react";
+import { useThree as useThree8 } from "@react-three/fiber";
+import { getRemotionEnvironment as getRemotionEnvironment2, Internals as Internals3 } from "remotion";
+
+// ../execution/animate/src/scene/assets.ts
+function sceneImageHandle(assets, ref) {
+  const binding = assets[ref.slot];
+  const handle = binding && typeof binding === "object" ? binding : null;
+  const kind = handle?.kind;
+  if (!handle || typeof handle.handle !== "string" || handle.handle.length === 0 || kind !== void 0 && kind !== "image") {
+    throw new SceneShotError(
+      "scene_asset_unbound",
+      `${ref.what} slot "${ref.slot}" of layer "${ref.layerId}" is not bound to an admitted image asset`,
+      `${ref.layerPath ?? `layers.${ref.layerIndex}`}.${ref.field}`
+    );
+  }
+  return handle.handle;
+}
+
+// ../execution/animate/src/scene/finishing.tsx
+import React24 from "react";
+
+// ../execution/animate/src/scene/finishingMath.ts
+var VIGNETTE_CORE_INSET = 0.15;
+var VIGNETTE_SIGMA = 0.16;
+function vignetteGeometry(size) {
+  return {
+    x0: size.width * VIGNETTE_CORE_INSET,
+    y0: size.height * VIGNETTE_CORE_INSET,
+    x1: size.width * (1 - VIGNETTE_CORE_INSET),
+    y1: size.height * (1 - VIGNETTE_CORE_INSET),
+    sigmaX: size.width * VIGNETTE_SIGMA,
+    sigmaY: size.height * VIGNETTE_SIGMA
+  };
+}
+
+// ../execution/animate/src/scene/grainNoise.ts
+var GRAIN_LATTICE = 256;
+var GRAIN_CHANNELS = 4;
+var GRAIN_OCTAVES = 2;
+var GRAIN_GREY_COEFFICIENT = 0.3333;
+var GRAIN_SAMPLE_OFFSET = 1;
+var RAND_M = 2147483647;
+var RAND_A = 16807;
+var RAND_Q = 127773;
+var RAND_R = 2836;
+function grainSetupSeed(seed) {
+  let s = Math.round(Math.fround(seed));
+  if (s <= 0) s = -(s % (RAND_M - 1)) + 1;
+  if (s > RAND_M - 1) s = RAND_M - 1;
+  return s;
+}
+function grainNextRandom(seed) {
+  const r = RAND_A * (seed % RAND_Q) - RAND_R * Math.floor(seed / RAND_Q);
+  return r <= 0 ? r + RAND_M : r;
+}
+function grainLattice(seed) {
+  let s = grainSetupSeed(seed);
+  const selector = new Int32Array(GRAIN_LATTICE + GRAIN_LATTICE + 2);
+  const gradient = Array.from({ length: GRAIN_CHANNELS }, () => new Float64Array((GRAIN_LATTICE + GRAIN_LATTICE + 2) * 2));
+  for (let k = 0; k < GRAIN_CHANNELS; k++) {
+    const g = gradient[k];
+    for (let i = 0; i < GRAIN_LATTICE; i++) {
+      selector[i] = i;
+      for (let j = 0; j < 2; j++) {
+        s = grainNextRandom(s);
+        g[i * 2 + j] = (s % (GRAIN_LATTICE + GRAIN_LATTICE) - GRAIN_LATTICE) / GRAIN_LATTICE;
+      }
+      const gx = g[i * 2], gy = g[i * 2 + 1];
+      const length = Math.sqrt(gx * gx + gy * gy);
+      g[i * 2] = gx / length;
+      g[i * 2 + 1] = gy / length;
+    }
+  }
+  for (let i = GRAIN_LATTICE - 1; i > 0; i--) {
+    const k = selector[i];
+    s = grainNextRandom(s);
+    const j = s % GRAIN_LATTICE;
+    selector[i] = selector[j];
+    selector[j] = k;
+  }
+  for (let i = 0; i < GRAIN_LATTICE + 2; i++) {
+    selector[GRAIN_LATTICE + i] = selector[i];
+    for (let k = 0; k < GRAIN_CHANNELS; k++) {
+      const g = gradient[k];
+      g[(GRAIN_LATTICE + i) * 2] = g[i * 2];
+      g[(GRAIN_LATTICE + i) * 2 + 1] = g[i * 2 + 1];
+    }
+  }
+  return { selector, gradient };
+}
+function fitFrequency(frequency, tile) {
+  if (frequency === 0) return frequency;
+  const lo = Math.floor(tile * frequency) / tile;
+  const hi = Math.ceil(tile * frequency) / tile;
+  return frequency / lo < hi / frequency ? lo : hi;
+}
+function grainStitch(frequency, tileWidth, tileHeight) {
+  const baseX = fitFrequency(frequency, tileWidth);
+  const baseY = fitFrequency(frequency, tileHeight);
+  const width = Math.floor(tileWidth * baseX + 0.5);
+  const height = Math.floor(tileHeight * baseY + 0.5);
+  return { baseX, baseY, width, height, wrapX: width, wrapY: height };
+}
+var GRAIN_TABLE_WIDTH = GRAIN_LATTICE + GRAIN_LATTICE + 2;
+var GRAIN_TABLE_HEIGHT = 3;
+function grainLatticeTable(seed) {
+  const lattice = grainLattice(seed);
+  const table = new Float32Array(GRAIN_TABLE_WIDTH * GRAIN_TABLE_HEIGHT * 4);
+  for (let i = 0; i < GRAIN_TABLE_WIDTH; i++) {
+    table[i * 4] = lattice.selector[i];
+  }
+  const row = GRAIN_TABLE_WIDTH * 4;
+  for (let i = 0; i < GRAIN_TABLE_WIDTH; i++) {
+    table[row + i * 4] = lattice.gradient[0][i * 2];
+    table[row + i * 4 + 1] = lattice.gradient[0][i * 2 + 1];
+    table[row + i * 4 + 2] = lattice.gradient[1][i * 2];
+    table[row + i * 4 + 3] = lattice.gradient[1][i * 2 + 1];
+    table[row * 2 + i * 4] = lattice.gradient[2][i * 2];
+    table[row * 2 + i * 4 + 1] = lattice.gradient[2][i * 2 + 1];
+  }
+  return table;
+}
+
+// ../execution/animate/src/scene/finishing.tsx
+function hashSeed(seed) {
+  let hash = 2166136261;
+  for (let i = 0; i < seed.length; i++) {
+    hash ^= seed.charCodeAt(i);
+    hash = Math.imul(hash, 16777619) >>> 0;
+  }
+  return hash >>> 0;
+}
+function grainSeed(seed, frame) {
+  return hashSeed(`${seed}#${frame}`) % 2147483647;
+}
+function postFilterId(seed) {
+  return `cf-scene-post-${hashSeed(seed).toString(16).padStart(8, "0")}`;
+}
+function postFilterStages(post) {
+  const stages = [];
+  if (post.grain > 0) stages.push("grain");
+  if (post.vignette > 0) stages.push("vignette");
+  return stages;
+}
+function postFilterStyle(id, post) {
+  return postFilterStages(post).length ? { filter: `url(#${id})` } : {};
+}
+var GRAIN_BASE_FREQUENCY = 0.85;
+function grainFrequency(scale) {
+  return GRAIN_BASE_FREQUENCY / scale;
+}
+var GREY = "0.3333 0.3333 0.3333 0 0  0.3333 0.3333 0.3333 0 0  0.3333 0.3333 0.3333 0 0  0 0 0 0 1";
+var OPAQUE = "1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 0 1";
+function PostFilter({ id, post, seed, frame, size, scale }) {
+  const stages = postFilterStages(post);
+  if (stages.length === 0) return null;
+  const primitives = [
+    /* @__PURE__ */ React24.createElement("feColorMatrix", { key: "opaque", in: "SourceGraphic", type: "matrix", values: OPAQUE, result: "cfOpaque" })
+  ];
+  let input = "cfOpaque";
+  if (stages.includes("grain")) {
+    const g = post.grain;
+    primitives.push(
+      /* @__PURE__ */ React24.createElement("feTurbulence", { key: "noise", type: "fractalNoise", baseFrequency: grainFrequency(scale), numOctaves: GRAIN_OCTAVES, seed: grainSeed(seed, frame), stitchTiles: "stitch", result: "cfNoise" }),
+      /* @__PURE__ */ React24.createElement("feColorMatrix", { key: "grey", in: "cfNoise", type: "matrix", values: GREY, result: "cfGrey" }),
+      /* @__PURE__ */ React24.createElement("feComponentTransfer", { key: "level", in: "cfGrey", result: "cfGrain" }, /* @__PURE__ */ React24.createElement("feFuncR", { type: "linear", slope: g, intercept: (1 - g) / 2 }), /* @__PURE__ */ React24.createElement("feFuncG", { type: "linear", slope: g, intercept: (1 - g) / 2 }), /* @__PURE__ */ React24.createElement("feFuncB", { type: "linear", slope: g, intercept: (1 - g) / 2 })),
+      /* @__PURE__ */ React24.createElement("feBlend", { key: "grainBlend", mode: "overlay", in: "cfGrain", in2: input, result: "cfGrained" })
+    );
+    input = "cfGrained";
+  }
+  if (stages.includes("vignette")) {
+    const v = post.vignette;
+    const { width, height } = size;
+    const g = vignetteGeometry(size);
+    primitives.push(
+      /* @__PURE__ */ React24.createElement("feFlood", { key: "core", floodColor: "#ffffff", x: g.x0, y: g.y0, width: g.x1 - g.x0, height: g.y1 - g.y0, result: "cfCore" }),
+      /* @__PURE__ */ React24.createElement("feGaussianBlur", { key: "soft", in: "cfCore", stdDeviation: `${g.sigmaX} ${g.sigmaY}`, x: 0, y: 0, width, height, result: "cfSoft" }),
+      /* @__PURE__ */ React24.createElement("feColorMatrix", { key: "factor", in: "cfSoft", type: "matrix", values: `0 0 0 ${v} ${1 - v}  0 0 0 ${v} ${1 - v}  0 0 0 ${v} ${1 - v}  0 0 0 0 1`, x: 0, y: 0, width, height, result: "cfFactor" }),
+      /* @__PURE__ */ React24.createElement("feBlend", { key: "vignetteBlend", mode: "multiply", in: "cfFactor", in2: input, result: "cfDarkened" })
+    );
+    input = "cfDarkened";
+  }
+  primitives.push(/* @__PURE__ */ React24.createElement("feComposite", { key: "alpha", in: input, in2: "SourceGraphic", operator: "in" }));
+  return /* @__PURE__ */ React24.createElement("svg", { "aria-hidden": "true", style: { position: "absolute", width: 0, height: 0, overflow: "hidden" } }, /* @__PURE__ */ React24.createElement("filter", { id, x: "0", y: "0", width: "100%", height: "100%", colorInterpolationFilters: "sRGB" }, primitives));
+}
+
+// ../execution/animate/src/scene/finishingPass.ts
+function sceneFinishingUniforms(post, seed, frame, size, scale) {
+  const stages = postFilterStages(post);
+  const grain = stages.includes("grain") ? post.grain : 0;
+  const vignette = stages.includes("vignette") ? post.vignette : 0;
+  const noiseSeed = grainSeed(seed, frame);
+  const stitch = grainStitch(grainFrequency(scale), size.width, size.height);
+  const g = vignetteGeometry(size);
+  return {
+    grain,
+    vignette,
+    frame: [size.width, size.height],
+    seed: noiseSeed,
+    grainBase: [stitch.baseX, stitch.baseY],
+    grainStitch: [stitch.width, stitch.height, stitch.wrapX, stitch.wrapY],
+    vignetteCore: [g.x0, g.y0, g.x1, g.y1],
+    vignetteSigma: [g.sigmaX, g.sigmaY],
+    lattice: grain > 0 ? grainLatticeTable(noiseSeed) : null
+  };
+}
+
+// ../execution/animate/src/scene/FocusPass.tsx
+import { useLayoutEffect as useLayoutEffect10, useState as useState6 } from "react";
+import { useFrame, useThree as useThree7 } from "@react-three/fiber";
+
+// ../execution/animate/src/scene/focusBlur.ts
+var FOCUS_TAPS = 8;
+var FOCUS_OFF = { distance: 1, range: 1, maxBlur: 0 };
+function focusUniforms(focus, scale, camera, frame) {
+  const authored = focus ?? FOCUS_OFF;
+  return {
+    distance: authored.distance * scale,
+    range: authored.range * scale,
+    maxBlur: authored.maxBlur * scale,
+    near: camera.near,
+    far: camera.far,
+    texel: [1 / frame.width, 1 / frame.height]
+  };
+}
+
+// ../execution/animate/src/scene/focusResources.ts
+import {
+  ClampToEdgeWrapping,
+  DataTexture,
+  DepthFormat,
+  DepthTexture,
+  FloatType,
+  HalfFloatType,
+  LinearFilter as LinearFilter3,
+  NearestFilter,
+  NoBlending,
+  OrthographicCamera,
+  PlaneGeometry,
+  RGBAFormat,
+  Scene,
+  ShaderMaterial,
+  UnsignedIntType,
+  Mesh,
+  Vector2,
+  Vector4,
+  WebGLRenderTarget
+} from "three";
+
+// ../execution/animate/src/scene/focusShaders.ts
+var FOCUS_VERTEX_SHADER = (
+  /* glsl */
+  `
+varying vec2 vUv;
+void main() {
+  vUv = uv;
+  gl_Position = vec4(position.xy, 0.0, 1.0);
+}
+`
+);
+var FOCUS_GATHER_CHUNK = (
+  /* glsl */
+  `
+uniform sampler2D tColor;
+uniform sampler2D tDepth;
+uniform vec2 uTexel;
+uniform vec2 uDirection;
+uniform float uNear;
+uniform float uFar;
+uniform float uFocusDistance;
+uniform float uFocusRange;
+uniform float uMaxBlur;
+varying vec2 vUv;
+
+float focusViewDistance(vec2 uv) {
+  float depth = texture2D(tDepth, uv).x;
+  return -((uNear * uFar) / ((uFar - uNear) * depth - uFar));
+}
+
+float focusCircleOfConfusion(float distance) {
+  return min(1.0, abs(distance - uFocusDistance) / uFocusRange) * uMaxBlur;
+}
+
+void focusTap(vec2 offset, float radius, float weight, float centreDistance, inout vec4 sum, inout float total) {
+  vec2 uv = vUv + offset;
+  float tapDistance = focusViewDistance(uv);
+  float allow = tapDistance < centreDistance ? step(radius, focusCircleOfConfusion(tapDistance)) : 1.0;
+  float w = weight * allow;
+  sum += texture2D(tColor, uv) * w;
+  total += w;
+}
+
+vec4 focusGather() {
+  float centreDistance = focusViewDistance(vUv);
+  float centreRadius = focusCircleOfConfusion(centreDistance);
+  vec4 sum = texture2D(tColor, vUv);
+  float total = 1.0;
+  for (int i = 1; i <= FOCUS_TAPS; i++) {
+    float t = float(i) / float(FOCUS_TAPS);
+    float weight = exp(-2.0 * t * t);
+    float radius = t * centreRadius;
+    vec2 offset = uDirection * uTexel * radius;
+    focusTap(offset, radius, weight, centreDistance, sum, total);
+    focusTap(-offset, radius, weight, centreDistance, sum, total);
+  }
+  return sum / total;
+}
+`
+);
+var FOCUS_BLUR_FRAGMENT_SHADER = `${FOCUS_GATHER_CHUNK}
+void main() {
+  gl_FragColor = focusGather();
+}
+`;
+var FOCUS_FINISHING_CHUNK = (
+  /* glsl */
+  `
+uniform float uGrain;
+uniform float uVignette;
+uniform vec2 uFrameSize;
+/** The stitched base frequency, per axis: cycles per output pixel. */
+uniform vec2 uGrainBase;
+/** The stitch: lattice period in x and y, then the wrap point in x and y. */
+uniform vec4 uGrainStitch;
+/** The vignette core rectangle: left, top, right, bottom, in frame pixels. */
+uniform vec4 uVignetteCore;
+uniform vec2 uVignetteSigma;
+uniform sampler2D tGrainLattice;
+
+const float SCENE_SQRT2 = 1.4142135623730951;
+
+/** Abramowitz\u2013Stegun 7.1.26, the series finishingMath.ts evaluates, sign and all. */
+float sceneErf(float x) {
+  float s = sign(x);
+  float a = abs(x);
+  float t = 1.0 / (1.0 + 0.3275911 * a);
+  float y = 1.0 - (((((1.061405429 * t - 1.453152027) * t) + 1.421413741) * t - 0.284496736) * t + 0.254829592) * t * exp(-a * a);
+  return s * y;
+}
+
+float sceneBlurredCoverage(float a, float b, float sigma, float p) {
+  return 0.5 * (sceneErf((b - p) / (sigma * SCENE_SQRT2)) - sceneErf((a - p) / (sigma * SCENE_SQRT2)));
+}
+
+float sceneVignetteFactor(vec2 point) {
+  float coverage = sceneBlurredCoverage(uVignetteCore.x, uVignetteCore.z, uVignetteSigma.x, point.x)
+                 * sceneBlurredCoverage(uVignetteCore.y, uVignetteCore.w, uVignetteSigma.y, point.y);
+  return uVignette * coverage + (1.0 - uVignette);
+}
+
+float sceneGrainSelector(float index) {
+  return texture2D(tGrainLattice, vec2((index + 0.5) / float(GRAIN_TABLE_WIDTH), 0.5 / float(GRAIN_TABLE_HEIGHT))).r;
+}
+
+/** One lattice corner's gradient dotted with (rx, ry), for the three channels the grey averages. */
+vec3 sceneGrainCorner(float index, float rx, float ry) {
+  vec4 ab = texture2D(tGrainLattice, vec2((index + 0.5) / float(GRAIN_TABLE_WIDTH), 1.5 / float(GRAIN_TABLE_HEIGHT)));
+  vec2 c = texture2D(tGrainLattice, vec2((index + 0.5) / float(GRAIN_TABLE_WIDTH), 2.5 / float(GRAIN_TABLE_HEIGHT))).rg;
+  return vec3(rx * ab.x + ry * ab.y, rx * ab.z + ry * ab.w, rx * c.x + ry * c.y);
+}
+
+/** The spec's noise2 for three channels at once, with the stitch wrap already folded. */
+vec3 sceneGrainNoise(vec2 v, vec4 stitch) {
+  float bx0 = floor(v.x), bx1 = bx0 + 1.0;
+  float rx0 = v.x - bx0, rx1 = rx0 - 1.0;
+  float by0 = floor(v.y), by1 = by0 + 1.0;
+  float ry0 = v.y - by0, ry1 = ry0 - 1.0;
+  if (bx0 >= stitch.z) bx0 -= stitch.x;
+  if (bx1 >= stitch.z) bx1 -= stitch.x;
+  if (by0 >= stitch.w) by0 -= stitch.y;
+  if (by1 >= stitch.w) by1 -= stitch.y;
+  bx0 = mod(bx0, float(GRAIN_LATTICE));
+  bx1 = mod(bx1, float(GRAIN_LATTICE));
+  by0 = mod(by0, float(GRAIN_LATTICE));
+  by1 = mod(by1, float(GRAIN_LATTICE));
+  float i = sceneGrainSelector(bx0);
+  float j = sceneGrainSelector(bx1);
+  float sx = rx0 * rx0 * (3.0 - 2.0 * rx0);
+  float sy = ry0 * ry0 * (3.0 - 2.0 * ry0);
+  vec3 a = mix(sceneGrainCorner(sceneGrainSelector(i + by0), rx0, ry0), sceneGrainCorner(sceneGrainSelector(j + by0), rx1, ry0), sx);
+  vec3 b = mix(sceneGrainCorner(sceneGrainSelector(i + by1), rx0, ry1), sceneGrainCorner(sceneGrainSelector(j + by1), rx1, ry1), sx);
+  return mix(a, b, sy);
+}
+
+/** type="fractalNoise" over two octaves, greyed by the filter's own 0.3333 coefficient. */
+float sceneGrainField(vec2 point) {
+  vec2 v = point * uGrainBase;
+  vec4 stitch = uGrainStitch;
+  vec3 sum = vec3(0.0);
+  float ratio = 1.0;
+  for (int octave = 0; octave < GRAIN_OCTAVES; octave++) {
+    sum += sceneGrainNoise(v, stitch) / ratio;
+    v *= 2.0;
+    ratio *= 2.0;
+    stitch *= 2.0;
+  }
+  vec3 fractal = (sum + 1.0) * 0.5;
+  return clamp((fractal.x + fractal.y + fractal.z) * GRAIN_GREY_COEFFICIENT, 0.0, 1.0);
+}
+
+/** feBlend mode="overlay": the CSS blend formula, switching on the backdrop. */
+vec3 sceneOverlay(vec3 backdrop, float source) {
+  vec3 lo = 2.0 * backdrop * source;
+  vec3 hi = 1.0 - 2.0 * (1.0 - backdrop) * (1.0 - source);
+  return mix(hi, lo, step(backdrop, vec3(0.5)));
+}
+
+vec3 sceneFinishing(vec3 color) {
+  if (uGrain <= 0.0 && uVignette <= 0.0) return color;
+  // The pixel's top-left corner in the frame's own pixels, y down: the space both halves share.
+  vec2 pixel = vec2(gl_FragCoord.x - 0.5, uFrameSize.y - gl_FragCoord.y - 0.5);
+  vec3 finished = clamp(color, 0.0, 1.0);
+  if (uGrain > 0.0) {
+    float level = uGrain * sceneGrainField(pixel + float(GRAIN_SAMPLE_OFFSET)) + (1.0 - uGrain) * 0.5;
+    finished = sceneOverlay(finished, level);
+  }
+  if (uVignette > 0.0) {
+    finished *= sceneVignetteFactor(pixel + 0.5);
+  }
+  return finished;
+}
+`
+);
+var FOCUS_COMPOSITE_FRAGMENT_SHADER = `${FOCUS_GATHER_CHUNK}
+${FOCUS_FINISHING_CHUNK}
+void main() {
+  vec4 gathered = focusGather();
+  float coverage = gathered.a;
+  gl_FragColor = vec4(coverage > 0.0 ? gathered.rgb / coverage : gathered.rgb, coverage);
+  #include <colorspace_fragment>
+  gl_FragColor.rgb = sceneFinishing(gl_FragColor.rgb);
+  gl_FragColor.rgb *= coverage;
+}
+`;
+
+// ../execution/animate/src/scene/focusResources.ts
+var HALF_FLOAT_TARGET_EXTENSIONS = ["EXT_color_buffer_half_float", "EXT_color_buffer_float"];
+var FOCUS_SPEC_PATH = "post";
+function assertHalfFloatColorTargets(gl, path) {
+  if (HALF_FLOAT_TARGET_EXTENSIONS.some((name) => gl.extensions.has(name))) return;
+  throw new SceneShotError(
+    "scene_render_target_unsupported",
+    `the world pass renders through half-float colour targets, which this renderer cannot allocate: neither ${HALF_FLOAT_TARGET_EXTENSIONS.join(" nor ")} is available`,
+    path
+  );
+}
+function canvasSampleCount(gl, path) {
+  if (gl.getRenderTarget() !== null) {
+    throw new SceneShotError(
+      "scene_internal",
+      "the world pass reads its multisample count from the canvas, but a render target was bound when it was constructed",
+      path
+    );
+  }
+  const context = gl.getContext();
+  const samples = context.getParameter(context.SAMPLES);
+  if (typeof samples !== "number" || !Number.isFinite(samples)) {
+    throw new SceneShotError(
+      "scene_internal",
+      `the world pass reads its multisample count from the canvas, but this renderer reported SAMPLES as ${typeof samples === "string" ? JSON.stringify(samples) : String(samples)}`,
+      path
+    );
+  }
+  return samples > 1 ? samples : 0;
+}
+function focusUniformValues() {
+  return {
+    tColor: { value: null },
+    tDepth: { value: null },
+    uTexel: { value: new Vector2(1, 1) },
+    uDirection: { value: new Vector2(1, 0) },
+    uNear: { value: 1 },
+    uFar: { value: 1 },
+    uFocusDistance: { value: 0 },
+    uFocusRange: { value: 1 },
+    uMaxBlur: { value: 0 }
+  };
+}
+function finishingUniformValues(lattice) {
+  return {
+    uGrain: { value: 0 },
+    uVignette: { value: 0 },
+    uFrameSize: { value: new Vector2(1, 1) },
+    uGrainBase: { value: new Vector2(0, 0) },
+    uGrainStitch: { value: new Vector4(1, 1, 1, 1) },
+    uVignetteCore: { value: new Vector4(0, 0, 1, 1) },
+    uVignetteSigma: { value: new Vector2(1, 1) },
+    tGrainLattice: { value: lattice }
+  };
+}
+var FINISHING_DEFINES = {
+  GRAIN_TABLE_WIDTH,
+  GRAIN_TABLE_HEIGHT,
+  GRAIN_LATTICE,
+  GRAIN_OCTAVES,
+  GRAIN_GREY_COEFFICIENT,
+  GRAIN_SAMPLE_OFFSET
+};
+function focusMaterial(fragmentShader, uniforms = {}, defines = {}) {
+  return new ShaderMaterial({
+    defines: { FOCUS_TAPS, ...defines },
+    uniforms: { ...focusUniformValues(), ...uniforms },
+    vertexShader: FOCUS_VERTEX_SHADER,
+    fragmentShader,
+    // The quad replaces the frame outright, alpha included; blending or a depth test would let
+    // whatever was underneath survive and would break the coverage a transparent shot must keep.
+    blending: NoBlending,
+    depthTest: false,
+    depthWrite: false,
+    transparent: true
+  });
+}
+var FocusResources = class {
+  constructor(gl, width, height, registerActual = registerActualSceneResourcesV1) {
+    this.registerActual = registerActual;
+    this.renderer = gl;
+    assertHalfFloatColorTargets(gl, FOCUS_SPEC_PATH);
+    this.samples = canvasSampleCount(gl, FOCUS_SPEC_PATH);
+    if (this.samples !== 4) {
+      throw new SceneShotError(
+        "scene_internal",
+        `the prepared scene plan requires the admitted 4-sample canvas, but this renderer reported ${this.samples}`,
+        FOCUS_SPEC_PATH
+      );
+    }
+    this.toneMapping = gl.toneMapping;
+    const depthTexture = new DepthTexture(width, height, UnsignedIntType);
+    depthTexture.format = DepthFormat;
+    depthTexture.minFilter = NearestFilter;
+    depthTexture.magFilter = NearestFilter;
+    this.world = new WebGLRenderTarget(width, height, {
+      format: RGBAFormat,
+      type: HalfFloatType,
+      minFilter: LinearFilter3,
+      magFilter: LinearFilter3,
+      wrapS: ClampToEdgeWrapping,
+      wrapT: ClampToEdgeWrapping,
+      depthBuffer: true,
+      stencilBuffer: false,
+      depthTexture,
+      samples: this.samples
+    });
+    this.gathered = new WebGLRenderTarget(width, height, {
+      format: RGBAFormat,
+      type: HalfFloatType,
+      minFilter: LinearFilter3,
+      magFilter: LinearFilter3,
+      wrapS: ClampToEdgeWrapping,
+      wrapT: ClampToEdgeWrapping,
+      depthBuffer: false,
+      stencilBuffer: false
+    });
+    this.grainLattice = new DataTexture(
+      new Float32Array(GRAIN_TABLE_WIDTH * GRAIN_TABLE_HEIGHT * 4),
+      GRAIN_TABLE_WIDTH,
+      GRAIN_TABLE_HEIGHT,
+      RGBAFormat,
+      FloatType
+    );
+    this.grainLattice.minFilter = NearestFilter;
+    this.grainLattice.magFilter = NearestFilter;
+    this.grainLattice.needsUpdate = true;
+    this.blur = focusMaterial(FOCUS_BLUR_FRAGMENT_SHADER);
+    this.composite = focusMaterial(FOCUS_COMPOSITE_FRAGMENT_SHADER, finishingUniformValues(this.grainLattice), FINISHING_DEFINES);
+    this.geometry = new PlaneGeometry(2, 2);
+    this.mesh = new Mesh(this.geometry, this.blur);
+    this.mesh.frustumCulled = false;
+    this.quadScene = new Scene();
+    this.quadScene.add(this.mesh);
+    this.quadCamera = new OrthographicCamera(-1, 1, 1, -1, 0, 1);
+    this.releaseMeasurement = this.registerActual(this, sceneFocusPreparationAllocationsV1(width, height, 4).map((row) => ({
+      owner: row.owner,
+      name: row.name,
+      domain: row.domain,
+      bytes: row.bytes,
+      width,
+      height,
+      samples: row.name.includes("msaa") ? 4 : void 0
+    })));
+  }
+  registerActual;
+  /**
+   * The renderer these resources were built for and measured against.
+   *
+   * Kept so the pass can check it is still being driven by that renderer. The targets, their
+   * textures and their framebuffers belong to one GL context, and `samples` was read from that
+   * context's canvas; handing them to a different renderer would draw through objects it has never
+   * uploaded. Fiber builds one renderer per canvas and never swaps it, so this is a guard against a
+   * future change rather than a case anyone can reach today — but the symptom would be a blank or
+   * wrong frame with no error, which is exactly the kind of thing that has to be asserted.
+   */
+  renderer;
+  world;
+  gathered;
+  blur;
+  composite;
+  quadScene;
+  quadCamera;
+  /** The canvas's multisample count, read once at construction and kept across resizes. */
+  samples;
+  /**
+   * The renderer's tone-mapping curve when these resources were built.
+   *
+   * Kept for the same reason `renderer` is, and checked the same way. Every lit material this
+   * package draws carries its own copy of the curve, injected by `onBeforeCompile` from
+   * `renderer.toneMapping` — and three calls that ONCE PER PROGRAM, then serves the compiled
+   * program out of its cache. `customProgramCacheKey` cannot repair that: three computes the cache
+   * key before the material has ever seen a renderer, so the key could only ever carry the curve
+   * of a PREVIOUS compile, and a genuine change would still hit the stale program. So the curve is
+   * asserted constant instead of keyed — which is the truth of this renderer anyway, since fiber
+   * sets it from `flat` at canvas construction and nothing in this package writes it afterwards.
+   */
+  toneMapping;
+  /**
+   * One frame's grain lattice, as a float texture the composite samples.
+   *
+   * Owned per instance like everything else here, and refreshed only when the frame's seed changes
+   * — which is every frame a shot with grain renders, since `grainSeed` re-seeds per frame, and
+   * never for a shot without it.
+   */
+  grainLattice;
+  grainLatticeSeed = null;
+  geometry;
+  mesh;
+  releaseMeasurement;
+  get size() {
+    return { width: this.world.width, height: this.world.height };
+  }
+  /**
+   * Follow the frame. `WebGLRenderTarget.setSize` resizes its colour textures but not the depth
+   * texture attached to it, which would leave the depth attachment at the old size and the
+   * framebuffer incomplete — so the depth texture is resized here and dropped, and Three rebuilds
+   * both from the new sizes on the next draw.
+   */
+  resize(width, height) {
+    if (this.world.width === width && this.world.height === height) return;
+    this.releaseMeasurement();
+    const depth = this.world.depthTexture;
+    if (depth) {
+      depth.image.width = width;
+      depth.image.height = height;
+      depth.dispose();
+    }
+    this.world.setSize(width, height);
+    this.gathered.setSize(width, height);
+    this.releaseMeasurement = this.registerActual(this, sceneFocusPreparationAllocationsV1(width, height, 4).map((row) => ({
+      owner: row.owner,
+      name: row.name,
+      domain: row.domain,
+      bytes: row.bytes,
+      width,
+      height,
+      samples: row.name.includes("msaa") ? 4 : void 0
+    })));
+  }
+  /** Point the quad at one of the two materials; the pass draws the same geometry twice. */
+  use(material) {
+    this.mesh.material = material;
+  }
+  /** Write one frame's focus into both materials. Uniform writes only: no program is rebuilt. */
+  apply(uniforms) {
+    for (const material of [this.blur, this.composite]) {
+      const u = material.uniforms;
+      u.uNear.value = uniforms.near;
+      u.uFar.value = uniforms.far;
+      u.uFocusDistance.value = uniforms.distance;
+      u.uFocusRange.value = uniforms.range;
+      u.uMaxBlur.value = uniforms.maxBlur;
+      u.uTexel.value.set(uniforms.texel[0], uniforms.texel[1]);
+    }
+    this.blur.uniforms.tColor.value = this.world.texture;
+    this.blur.uniforms.tDepth.value = this.world.depthTexture;
+    this.blur.uniforms.uDirection.value.set(1, 0);
+    this.composite.uniforms.tColor.value = this.gathered.texture;
+    this.composite.uniforms.tDepth.value = this.world.depthTexture;
+    this.composite.uniforms.uDirection.value.set(0, 1);
+  }
+  /**
+   * Write one frame's finishing into the composite material.
+   *
+   * Uniform writes and, when the seed moved, one 25 KB texture upload; no program is rebuilt. The
+   * lattice is skipped when grain is off, because nothing samples it then.
+   */
+  applyFinishing(finishing) {
+    const u = this.composite.uniforms;
+    u.uGrain.value = finishing.grain;
+    u.uVignette.value = finishing.vignette;
+    u.uFrameSize.value.set(finishing.frame[0], finishing.frame[1]);
+    u.uGrainBase.value.set(finishing.grainBase[0], finishing.grainBase[1]);
+    u.uGrainStitch.value.set(finishing.grainStitch[0], finishing.grainStitch[1], finishing.grainStitch[2], finishing.grainStitch[3]);
+    u.uVignetteCore.value.set(finishing.vignetteCore[0], finishing.vignetteCore[1], finishing.vignetteCore[2], finishing.vignetteCore[3]);
+    u.uVignetteSigma.value.set(finishing.vignetteSigma[0], finishing.vignetteSigma[1]);
+    if (finishing.lattice && this.grainLatticeSeed !== finishing.seed) {
+      this.grainLattice.image.data.set(finishing.lattice);
+      this.grainLattice.needsUpdate = true;
+      this.grainLatticeSeed = finishing.seed;
+    }
+  }
+  dispose() {
+    this.world.depthTexture?.dispose();
+    this.world.dispose();
+    this.gathered.dispose();
+    this.blur.dispose();
+    this.composite.dispose();
+    this.grainLattice.dispose();
+    this.geometry.dispose();
+    this.quadScene.remove(this.mesh);
+    this.releaseMeasurement();
+  }
+};
+function renderFocusPass(gl, scene, camera, resources, uniforms, finishing) {
+  const output = gl.getRenderTarget();
+  resources.apply(uniforms);
+  resources.applyFinishing(finishing);
+  gl.setRenderTarget(resources.world);
+  gl.render(scene, camera);
+  resources.use(resources.blur);
+  gl.setRenderTarget(resources.gathered);
+  gl.render(resources.quadScene, resources.quadCamera);
+  resources.use(resources.composite);
+  gl.setRenderTarget(output);
+  gl.render(resources.quadScene, resources.quadCamera);
+}
+
+// ../execution/animate/src/scene/FocusPass.tsx
+var FOCUS_PASS_PRIORITY = 1;
+function focusCameraPlanes(camera) {
+  const perspective = camera;
+  if (!perspective.isPerspectiveCamera) {
+    throw new SceneShotError(
+      "scene_internal",
+      `the focus pass reconstructs view distance from a perspective depth buffer, but this shot's camera is ${perspective.type ?? "of an unknown kind"}`,
+      FOCUS_SPEC_PATH
+    );
+  }
+  return { near: perspective.near, far: perspective.far };
+}
+function assertPassRenderer(resources, gl) {
+  if (resources.renderer !== gl) {
+    throw new SceneShotError(
+      "scene_internal",
+      "the world pass was built for one renderer and is being drawn by another; its targets, its textures and its multisample count all belong to the first",
+      FOCUS_SPEC_PATH
+    );
+  }
+  if (resources.toneMapping !== gl.toneMapping) {
+    throw new SceneShotError(
+      "scene_internal",
+      `the world pass was built while this renderer tone-mapped with ${resources.toneMapping} and is being drawn with ${gl.toneMapping}; every lit material compiled the first curve into its own program and would keep drawing it`,
+      FOCUS_SPEC_PATH
+    );
+  }
+}
+function FocusPass({ focus, finishing, scale, frame }) {
+  const registerActual = useSceneActualResourceRegistrarV1();
+  const gl = useThree7((s) => s.gl);
+  const scene = useThree7((s) => s.scene);
+  const camera = useThree7((s) => s.camera);
+  const [resources] = useState6(() => new FocusResources(gl, frame.width, frame.height, registerActual));
+  useLayoutEffect10(() => {
+    resources.resize(frame.width, frame.height);
+  }, [resources, frame.width, frame.height]);
+  useLayoutEffect10(() => () => resources.dispose(), [resources]);
+  assertPassRenderer(resources, gl);
+  const planes = focusCameraPlanes(camera);
+  useFrame(() => {
+    renderFocusPass(gl, scene, camera, resources, focusUniforms(focus, scale, planes, frame), finishing);
+  }, FOCUS_PASS_PRIORITY);
+  return null;
+}
+
+// ../execution/animate/src/scene/text.tsx
+import React25 from "react";
+function screenTextStyle(layer, index, evaluated, scale, frame) {
+  const layout = textBlockLayout(layer, scale);
+  const { width, height } = layout;
+  return {
+    position: "absolute",
+    left: `${frame.width / 2 + evaluated.x * scale - width / 2}px`,
+    top: `${frame.height / 2 + evaluated.y * scale - height / 2}px`,
+    width: `${width}px`,
+    height: `${height}px`,
+    transformOrigin: "50% 50%",
+    transform: `rotate(${evaluated.rotation}deg) scale(${evaluated.scale})`,
+    opacity: evaluated.opacity,
+    color: resolveSceneColor(layer.color, `layers.${index}.color`),
+    fontFamily: resolveSceneFontFamily(layer.fontFamily, `layers.${index}.fontFamily`),
+    fontWeight: layer.fontWeight,
+    fontStyle: layer.fontStyle,
+    fontSize: `${layout.fontSize}px`,
+    lineHeight: `${layout.lineHeight}`,
+    textAlign: layout.align,
+    whiteSpace: "pre",
+    pointerEvents: "none"
+  };
+}
+function ScreenText({ layer, index, evaluated, scale, frame }) {
+  return /* @__PURE__ */ React25.createElement("div", { style: screenTextStyle(layer, index, evaluated, scale, frame), "data-scene-layer": layer.id }, layer.lines.map((line, lineIndex) => /* @__PURE__ */ React25.createElement("div", { key: lineIndex }, line.runs.map((run, runIndex) => /* @__PURE__ */ React25.createElement(
+    "span",
+    {
+      key: runIndex,
+      style: run.color === void 0 ? void 0 : { color: resolveSceneColor(run.color, `layers.${index}.lines.${lineIndex}.runs.${runIndex}.color`) }
+    },
+    run.text
+  )))));
+}
+
+// ../execution/animate/src/scene/v2/SceneShotV2.tsx
+function backdropStyleV2(backdrop) {
+  const stops = (rows) => rows.map((row) => `${row.color} ${row.at * 100}%`).join(", ");
+  switch (backdrop.kind) {
+    case "transparent":
+      return {};
+    case "solid":
+      return { background: backdrop.color };
+    case "linear":
+      return { background: `linear-gradient(${backdrop.angle * 180 / Math.PI}deg, ${stops(backdrop.stops)})` };
+    case "radial":
+      return { background: `radial-gradient(circle at ${backdrop.at[0] * 100}% ${backdrop.at[1] * 100}%, ${stops(backdrop.stops)})` };
+  }
+}
+function scaleBounds(b, scale) {
+  return {
+    minX: b.minX * scale,
+    maxX: b.maxX * scale,
+    minY: b.minY * scale,
+    maxY: b.maxY * scale,
+    minZ: b.minZ * scale,
+    maxZ: b.maxZ * scale
+  };
+}
+var isScreenText = (node) => node.kind === "text" && node.space === "screen";
+function drawSceneFrameV2({ advance, invalidate, isRendering, playing, now }) {
+  if (isRendering || !playing) advance(now);
+  else invalidate();
+}
+function SceneFrameCommitV2({ frame, children }) {
+  const { advance, invalidate } = useThree8((state) => ({ advance: state.advance, invalidate: state.invalidate }));
+  const [playing] = Internals3.Timeline.usePlayingState();
+  const isRendering = getRemotionEnvironment2().isRendering;
+  useLayoutEffect11(() => {
+    drawSceneFrameV2({ advance, invalidate, isRendering, playing, now: performance.now() });
+  }, [advance, frame, invalidate, isRendering, playing]);
+  return /* @__PURE__ */ React26.createElement(React26.Fragment, null, children);
+}
+function resolveSceneAssetsV2(layers, assets) {
+  const out = /* @__PURE__ */ new Map();
+  const walk = (nodes, parentPath = "layers") => {
+    nodes.forEach((node, index) => {
+      const layerPath = `${parentPath}.${index}`;
+      if (node.kind === "group") {
+        walk(node.children, `${layerPath}.children`);
+        return;
+      }
+      const binding = node.kind === "laptop" || node.kind === "phone" ? node.surfaces?.screen : node.kind === "page" ? node.surfaces.content : node.kind === "slab" ? node.surfaces?.front : void 0;
+      if (!binding || binding.source === "color") return;
+      if (binding.source !== "image") throw new Error(`scene_prepared_surface_required: ${layerPath}.surfaces must be prepared before rendering.`);
+      if (node.kind === "laptop" || node.kind === "phone") {
+        out.set(node.id, sceneImageHandle(assets, { slot: binding.assetSlot, layerPath, layerId: node.id, field: "screen", what: "screenshot" }));
+      } else if (node.kind === "page") {
+        out.set(node.id, sceneImageHandle(assets, { slot: binding.assetSlot, layerPath, layerId: node.id, field: "image", what: "page image" }));
+      } else if (node.kind === "slab") {
+        out.set(node.id, sceneImageHandle(assets, { slot: binding.assetSlot, layerPath, layerId: node.id, field: "front", what: "page image" }));
+      }
+    });
+  };
+  walk(layers);
+  return out;
+}
+function assertNoObjectLightFields(nodes, parentPath = "layers") {
+  for (let index = 0; index < nodes.length; index += 1) {
+    const node = nodes[index];
+    const path = `${parentPath}.${index}`;
+    assertNoObjectLightField(node, path);
+    if (node.kind === "group") assertNoObjectLightFields(node.children, `${path}.children`);
+  }
+}
+function ObjectNode({ node, index, scale, referenceWidth, handles, mountEarly, sealedBodyTriangles, sealedSurfaceColors, preparedSurfaceVisuals, surfaceOwners }) {
+  switch (node.kind) {
+    case "group":
+      return /* @__PURE__ */ React26.createElement(PosedObject, { transform: node.transform, scale, opacity: node.opacity }, node.children.filter((c) => !isScreenText(c)).map((child, i) => /* @__PURE__ */ React26.createElement(ObjectNode, { key: child.id, node: child, index: i, scale, referenceWidth, handles, mountEarly, sealedBodyTriangles, sealedSurfaceColors, preparedSurfaceVisuals, surfaceOwners })));
+    case "laptop":
+      return /* @__PURE__ */ React26.createElement(LaptopObject, { node, src: handles.get(node.id) ?? "", screenColor: sealedSurfaceColors[node.id], preparedSurface: preparedSurfaceVisuals[node.id], surfaceResourceOwner: surfaceOwners[node.id], scale, mountEarly });
+    case "phone":
+      return /* @__PURE__ */ React26.createElement(PhoneObject, { node, src: handles.get(node.id) ?? "", screenColor: sealedSurfaceColors[node.id], preparedSurface: preparedSurfaceVisuals[node.id], surfaceResourceOwner: surfaceOwners[node.id], scale, mountEarly });
+    case "slab":
+      return /* @__PURE__ */ React26.createElement(SlabObject, { node, src: handles.get(node.id), frontColor: sealedSurfaceColors[node.id], preparedSurface: preparedSurfaceVisuals[node.id], surfaceResourceOwner: surfaceOwners[node.id], scale, mountEarly, expectedBodyTriangles: sealedBodyTriangles[node.id] });
+    case "page":
+      return /* @__PURE__ */ React26.createElement(PageObject, { node, src: handles.get(node.id) ?? "", contentColor: sealedSurfaceColors[node.id], preparedSurface: preparedSurfaceVisuals[node.id], surfaceResourceOwner: surfaceOwners[node.id], scale, mountEarly });
+    case "text":
+      return /* @__PURE__ */ React26.createElement(WorldTextObject, { node, index, scale, referenceWidth });
+  }
+}
+function SceneShotV2({ spec: spec2, assets, render, mountSurfacesEarly = false, preparedPlan, sealedBodyTriangles = {}, sealedSurfaceColors = {}, preparedSurfaceVisuals = {}, videoTextureBindings = [], sealedSurfaceHandles, sealedShadowBounds: sealedShadowBounds2, sealedCameraPlanes }) {
+  const scale = referenceScale(render, spec2.referenceSize);
+  const frame = { width: render.width, height: render.height };
+  const photographic = admitSceneRigV2(spec2.environment) === PHOTOGRAPHIC_STUDIO_RIG_ID;
+  const studioRig = photographic ? null : spec2.environment;
+  const lightingProfile = studioRig ? admitLightingProfile(studioRig.lightingProfile) : null;
+  assertNoObjectLightFields(spec2.layers);
+  if (!preparedPlan) assertSceneSurfaceResolution(spec2, frame);
+  const handles = sealedSurfaceHandles ? new Map(Object.entries(sealedSurfaceHandles)) : resolveSceneAssetsV2(spec2.layers, assets);
+  const surfaceOwners = Object.fromEntries(preparedPlan?.surfaces.map((surface) => [surface.authoredObjectId, surface.path]) ?? []);
+  const world = spec2.layers.filter((node) => !isScreenText(node));
+  const screenText = spec2.layers.filter(isScreenText);
+  const filterId = postFilterId(render.seed);
+  const filter = postFilterStyle(filterId, spec2.post);
+  const layerBox = { position: "absolute", inset: 0 };
+  const canDrawWorld = typeof document !== "undefined";
+  const camera = sceneCameraPose(spec2.camera, spec2.referenceSize.height, scale, frame);
+  if (sealedCameraPlanes) {
+    camera.near = sealedCameraPlanes.near;
+    camera.far = sealedCameraPlanes.far;
+  }
+  return /* @__PURE__ */ React26.createElement("div", { style: { ...layerBox, overflow: "hidden" }, "data-scene-shot": render.seed, "data-scene-contract": "2" }, /* @__PURE__ */ React26.createElement("div", { style: { ...layerBox, ...backdropStyleV2(spec2.backdrop), ...filter }, "data-scene-backdrop": "" }), world.length > 0 ? /* @__PURE__ */ React26.createElement("div", { style: layerBox, "data-scene-world": "" }, canDrawWorld ? /* @__PURE__ */ React26.createElement(ThreeCanvas, { width: frame.width, height: frame.height, sceneCamera: camera, shadows: !photographic, style: { position: "absolute", inset: 0 } }, /* @__PURE__ */ React26.createElement(SceneFrameCommitV2, { frame: render.frame }, photographic ? /* @__PURE__ */ React26.createElement(PhotographicStudioRig, { worldScale: scale }) : /* @__PURE__ */ React26.createElement(
+    StudioRig,
+    {
+      lightingProfile,
+      preset: studioRig.preset,
+      intensity: studioRig.intensity,
+      floorY: studioRig.floorY * scale,
+      shadowOpacity: studioRig.shadowOpacity,
+      worldScale: scale,
+      shadowBounds: sealedShadowBounds2 ? scaleBounds(sealedShadowBounds2, scale) : void 0
+    }
+  ), world.map((node, index) => /* @__PURE__ */ React26.createElement(ObjectNode, { key: node.id, node, index, scale, referenceWidth: spec2.referenceSize.width, handles, mountEarly: mountSurfacesEarly, sealedBodyTriangles, sealedSurfaceColors, preparedSurfaceVisuals, surfaceOwners })), videoTextureBindings.map((binding) => /* @__PURE__ */ React26.createElement(SceneVideoTextureCommitV1, { key: binding.texture.uuid, binding })), /* @__PURE__ */ React26.createElement(
+    FocusPass,
+    {
+      focus: spec2.post.focus,
+      finishing: sceneFinishingUniforms(spec2.post, render.seed, render.frame, frame, scale),
+      scale,
+      frame
+    }
+  ))) : null) : null, screenText.length > 0 ? /* @__PURE__ */ React26.createElement("div", { style: { ...layerBox, ...filter }, "data-scene-screen-text": "" }, screenText.map((node, index) => /* @__PURE__ */ React26.createElement(
+    ScreenText,
+    {
+      key: node.id,
+      layer: node,
+      index,
+      evaluated: { x: node.x, y: node.y, rotation: node.rotation, scale: node.scale, opacity: node.opacity },
+      scale,
+      frame
+    }
+  ))) : null, /* @__PURE__ */ React26.createElement(PostFilter, { id: filterId, post: spec2.post, seed: render.seed, frame: render.frame, size: frame, scale }));
+}
+
+// ../execution/animate/src/scene/v2/shadow.ts
+import { Matrix4 as Matrix43, Vector3 as Vector33 } from "three";
+
+// ../execution/animate/src/scene/worldBounds.ts
+var EMPTY_BOUNDS = {
+  minX: Number.POSITIVE_INFINITY,
+  maxX: Number.NEGATIVE_INFINITY,
+  minY: Number.POSITIVE_INFINITY,
+  maxY: Number.NEGATIVE_INFINITY,
+  minZ: Number.POSITIVE_INFINITY,
+  maxZ: Number.NEGATIVE_INFINITY
+};
+function pointsBounds(points) {
+  const b = { ...EMPTY_BOUNDS };
+  for (const [x, y, z] of points) {
+    b.minX = Math.min(b.minX, x);
+    b.maxX = Math.max(b.maxX, x);
+    b.minY = Math.min(b.minY, y);
+    b.maxY = Math.max(b.maxY, y);
+    b.minZ = Math.min(b.minZ, z);
+    b.maxZ = Math.max(b.maxZ, z);
+  }
+  return b;
+}
+function unionBounds(a, b) {
+  return {
+    minX: Math.min(a.minX, b.minX),
+    maxX: Math.max(a.maxX, b.maxX),
+    minY: Math.min(a.minY, b.minY),
+    maxY: Math.max(a.maxY, b.maxY),
+    minZ: Math.min(a.minZ, b.minZ),
+    maxZ: Math.max(a.maxZ, b.maxZ)
+  };
+}
+function boxCorners(cx, cy, cz, hx, hy, hz) {
+  const out = [];
+  for (const sx of [-1, 1]) for (const sy of [-1, 1]) for (const sz of [-1, 1]) out.push([cx + sx * hx, cy + sy * hy, cz + sz * hz]);
+  return out;
+}
+function deviceShellCorners(kind, width, openAngle) {
+  const dim = deviceDimensions(kind, width);
+  if (kind === "phone") return boxCorners(0, 0, 0, dim.w / 2, dim.h / 2, dim.t / 2);
+  const layout = laptopLayout(dim);
+  const corners = boxCorners(0, layout.baseY, 0, dim.w / 2, dim.t / 2, dim.d / 2);
+  const hinge = [0, layout.hingeY, layout.hingeZ];
+  const theta = lidRotationX(openAngle);
+  const cos = Math.cos(theta), sin = Math.sin(theta);
+  for (const sx of [-1, 1]) for (const y of [0, dim.h]) for (const sz of [-1, 1]) {
+    const z = sz * dim.t / 2;
+    corners.push([sx * dim.w / 2, hinge[1] + y * cos - z * sin, hinge[2] + y * sin + z * cos]);
+  }
+  return corners;
+}
+
+// ../execution/animate/src/scene/v2/shadow.ts
+function sceneShadowBoundsV2(samples, referenceSize, floorY) {
+  let bounds = {
+    minX: -referenceSize.width / 2,
+    maxX: referenceSize.width / 2,
+    minY: Math.min(-referenceSize.height / 2, floorY),
+    maxY: referenceSize.height / 2,
+    minZ: 0,
+    maxZ: 0
+  };
+  for (const objects of samples) bounds = unionBounds(bounds, treeBounds(objects, new Matrix43(), referenceSize.width));
+  return bounds;
+}
+function treeBounds(objects, parent, fallbackTextWidth) {
+  let bounds = {
+    minX: Number.POSITIVE_INFINITY,
+    maxX: Number.NEGATIVE_INFINITY,
+    minY: Number.POSITIVE_INFINITY,
+    maxY: Number.NEGATIVE_INFINITY,
+    minZ: Number.POSITIVE_INFINITY,
+    maxZ: Number.NEGATIVE_INFINITY
+  };
+  for (const node of objects) {
+    if (node.kind === "text" && node.space === "screen") continue;
+    const world = parent.clone().multiply(sceneWorldMatrix(node.transform));
+    if (node.kind === "group") {
+      bounds = unionBounds(bounds, treeBounds(node.children, world, fallbackTextWidth));
+      continue;
+    }
+    bounds = unionBounds(bounds, pointsBounds(placed(localCorners(node, fallbackTextWidth), world)));
+  }
+  return bounds;
+}
+function localCorners(node, fallbackTextWidth) {
+  switch (node.kind) {
+    case "laptop":
+      return deviceShellCorners("laptop", node.width, node.openAngle * 180 / Math.PI);
+    case "phone":
+      return deviceShellCorners("phone", node.width, 0);
+    case "page":
+      return plane(node.width, node.height);
+    case "slab":
+      return box(node.width, node.height, node.thickness);
+    case "text":
+      return plane(node.maxWidth ?? fallbackTextWidth, textBlockLayout({ ...node, width: node.maxWidth ?? fallbackTextWidth }, 1).height);
+  }
+}
+function box(width, height, thickness) {
+  const hx = width / 2, hy = height / 2, hz = thickness / 2;
+  const out = [];
+  for (const x of [-hx, hx]) for (const y of [-hy, hy]) for (const z of [-hz, hz]) out.push([x, y, z]);
+  return out;
+}
+function plane(width, height) {
+  const hx = width / 2, hy = height / 2;
+  return [[-hx, -hy, 0], [hx, -hy, 0], [-hx, hy, 0], [hx, hy, 0]];
+}
+function placed(local, world) {
+  const v = new Vector33();
+  return local.map((p) => {
+    v.set(...p).applyMatrix4(world);
+    return [v.x, v.y, v.z];
+  });
+}
+
+// ../execution/animate/src/scene/v2/PreparedSceneShotV1.tsx
+var shadowBoundsByPlan = /* @__PURE__ */ new WeakMap();
+function sealedShadowBounds(plan) {
+  const cached = shadowBoundsByPlan.get(plan);
+  if (cached) return cached;
+  const samples = Array.from({ length: plan.output.durationInFrames }, (_, frame) => evaluateScene(plan.scene, frame, plan.output.durationInFrames).layers.map((node) => runtimeObject(node, plan, {}, {})));
+  const floorY = plan.scene.environment.kind === "photographic-studio-v1" ? -plan.scene.referenceSize.height / 2 : plan.scene.environment.floorY;
+  const bounds = sceneShadowBoundsV2(samples, plan.scene.referenceSize, floorY);
+  shadowBoundsByPlan.set(plan, bounds);
+  return bounds;
+}
+var PreparedSceneShotError = class extends Error {
+  constructor(code, message) {
+    super(`${code}: ${message}`);
+    this.code = code;
+    this.name = "PreparedSceneShotError";
+  }
+  code;
+};
+function runtimeObject(node, plan, handles, colors) {
+  if (node.kind === "group") return { ...node, opacity: 1, children: (node.children ?? []).map((child) => runtimeObject(child, plan, handles, colors)) };
+  if (node.kind === "text") return { ...node, opacity: node.worldOpacity };
+  if (!["slab", "laptop", "phone", "page"].includes(node.kind)) throw new PreparedSceneShotError("scene_builder_descriptor_unavailable", `Prepared renderer has no ${node.kind} builder yet.`);
+  const prepared = plan.objects.find((object) => object.authoredId === node.id);
+  if (!prepared?.builder || prepared.builder.kind !== node.kind) throw new PreparedSceneShotError("scene_builder_descriptor_mismatch", `${node.kind} '${node.id}' has no matching sealed descriptor.`);
+  const slot = node.kind === "slab" ? "front" : node.kind === "page" ? "content" : "screen";
+  const surface = plan.surfaces.find((candidate) => candidate.authoredObjectId === node.id && candidate.slot === slot);
+  if (!surface) return { ...node, opacity: node.worldOpacity };
+  if (surface.realized.source === "color") {
+    colors[node.id] = surface.realized.color;
+    return { ...node, opacity: node.worldOpacity };
+  }
+  if (surface.realized.source === "video") return { ...node, opacity: node.worldOpacity };
+  handles[node.id] = surface.realized.image.handle;
+  return { ...node, opacity: node.worldOpacity };
+}
+function nestedScreenText(nodes) {
+  const screens = [];
+  for (const node of nodes) {
+    if (node.kind === "text" && node.space === "screen") screens.push({ ...node, opacity: node.worldOpacity });
+    if (node.kind === "group" && node.children) screens.push(...nestedScreenText(node.children));
+  }
+  return screens;
+}
+function VideoBindingStack({ surfaces, index, contentFrame, visuals, bindings, children }) {
+  const surface = surfaces[index];
+  if (!surface) return /* @__PURE__ */ React.createElement(React.Fragment, null, children(visuals, bindings));
+  const schedule = surface.realized.schedule;
+  const ownerKey = `${surface.authoredObjectId}:${surface.slot}:${surface.realized.video.encodedSha256}:${surface.realized.video.width}x${surface.realized.video.height}:${schedule.sourceRate.num}/${schedule.sourceRate.den}:${schedule.shotRate.num}/${schedule.shotRate.den}:${schedule.contentDuration}:${schedule.startFrame}:${schedule.endFrame}:${schedule.addressing}`;
+  return /* @__PURE__ */ React.createElement(SceneVideoBindingV1, { key: ownerKey, src: surface.realized.video.handle, schedule: surface.realized.schedule, contentFrame, width: surface.realized.video.width, height: surface.realized.video.height, resourceOwner: surface.path }, (binding) => /* @__PURE__ */ React.createElement(VideoBindingStack, { surfaces, index: index + 1, contentFrame, visuals: binding ? { ...visuals, [surface.authoredObjectId]: binding.visual } : visuals, bindings: binding ? [...bindings, binding] : bindings, children }));
+}
+function PreparedSceneShotV1({ plan, render }) {
+  return /* @__PURE__ */ React.createElement(SceneRuntimeAllocationBoundaryV1, { plan }, /* @__PURE__ */ React.createElement(PreparedSceneShotContentsV1, { plan, render }));
+}
+function PreparedSceneShotContentsV1({ plan, render }) {
+  if (render.width !== plan.output.width || render.height !== plan.output.height || render.fps !== plan.output.fps.num / plan.output.fps.den || render.frame < 0) {
+    throw new PreparedSceneShotError("scene_plan_output_mismatch", "Render frame/output does not match the sealed plan.");
+  }
+  const evaluated = evaluateScene(plan.scene, render.frame, plan.output.durationInFrames);
+  const handles = {};
+  const colors = {};
+  const layers = [
+    ...evaluated.layers.map((node) => runtimeObject(node, plan, handles, colors)),
+    ...nestedScreenText(evaluated.layers).filter((screen) => !evaluated.layers.some((top) => top.id === screen.id))
+  ];
+  const bodyTriangles = Object.fromEntries(plan.objects.filter((object) => object.kind === "slab").map((object) => {
+    const body = object.parts.find((part) => part.partId === "body" && part.mounted);
+    if (!body) throw new PreparedSceneShotError("scene_builder_descriptor_mismatch", `Slab '${object.authoredId}' has no mounted body part.`);
+    return [object.authoredId, body.triangles];
+  }));
+  const shadowBounds = sealedShadowBounds(plan);
+  const spec2 = {
+    ...plan.scene,
+    camera: evaluated.camera,
+    environment: evaluated.environment,
+    layers,
+    post: { ...plan.scene.post, focus: evaluated.focus }
+  };
+  const heldRender = { ...render, frame: evaluated.contentFrame };
+  const videos = plan.surfaces.filter((surface) => surface.realized.source === "video");
+  const shot = (preparedSurfaceVisuals, videoTextureBindings) => /* @__PURE__ */ React.createElement(SceneShotV2, { spec: spec2, assets: {}, render: heldRender, preparedPlan: plan, sealedBodyTriangles: bodyTriangles, sealedSurfaceColors: colors, sealedSurfaceHandles: handles, sealedShadowBounds: shadowBounds, preparedSurfaceVisuals, videoTextureBindings, sealedCameraPlanes: plan.motion.cameraClipPlanes[evaluated.contentFrame] });
+  if (!videos.length) return shot({}, []);
+  return /* @__PURE__ */ React.createElement(VideoBindingStack, { surfaces: videos, index: 0, contentFrame: evaluated.contentFrame, visuals: {}, bindings: [] }, shot);
+}
+
+// ../execution/animate/src/scene/v2/preparedSurface.ts
+function preparedSurfaceDeviceProps(surface) {
+  if (!surface) return { screen: null };
+  return surface.kind === "texture" ? { screen: surface.texture } : { screen: null, screenColor: surface.color };
+}
+
+// ../execution/animate/src/media/recipes.ts
+function finite(name, value, minimum = 0) {
+  if (!Number.isFinite(value) || value < minimum) throw new Error(`${name} must be at least ${minimum}.`);
+  return value;
+}
+function progress(value) {
+  finite("progress", value);
+  return Math.min(1, value);
+}
+function stream(streamIds, index) {
+  if (streamIds.length === 0 || streamIds.some((id) => !id)) throw new Error("A media tile recipe requires stream IDs.");
+  return streamIds[index % streamIds.length];
+}
+function driftWallRecipe(input) {
+  const columns = Math.floor(finite("columns", input.columns, 1));
+  const rows = Math.floor(finite("rows", input.rows, 1));
+  const width = finite("tileWidth", input.tileWidth, Number.EPSILON);
+  const height = finite("tileHeight", input.tileHeight, Number.EPSILON);
+  const gap = finite("gap", input.gap);
+  const t = progress(input.progress);
+  const strideX = width + gap;
+  const strideY = height + gap;
+  const wallWidth = columns * strideX;
+  const wallHeight = rows * strideY;
+  const dx = (input.driftX ?? strideX) * t;
+  const dy = (input.driftY ?? strideY * 0.35) * t;
+  const tiles = [];
+  for (let row = 0; row < rows; row++) {
+    for (let column = 0; column < columns; column++) {
+      const stagger = row % 2 === 0 ? 0 : strideX * 0.5;
+      const x = (column * strideX + stagger + dx + wallWidth * 0.5) % wallWidth - wallWidth * 0.5;
+      const y = (row * strideY + dy + wallHeight * 0.5) % wallHeight - wallHeight * 0.5;
+      tiles.push({ stream: stream(input.streamIds, row * columns + column), x, y, width, height });
+    }
+  }
+  return { tiles };
+}
+function infiniteSpiralRecipe(input) {
+  const count = Math.floor(finite("count", input.count, 1));
+  const t = progress(input.progress);
+  const turns = finite("turns", input.turns, Number.EPSILON);
+  const tiles = Array.from({ length: count }, (_, index) => {
+    const unit = count === 1 ? 0 : index / (count - 1);
+    const angle = unit * Math.PI * 2 * turns + t * Math.PI * 2;
+    const radius = finite("radiusStep", input.radiusStep) * (index + 1);
+    return {
+      stream: stream(input.streamIds, index),
+      x: Math.cos(angle) * radius,
+      y: Math.sin(angle) * radius,
+      z: unit * 900,
+      width: finite("tileWidth", input.tileWidth, Number.EPSILON),
+      height: finite("tileHeight", input.tileHeight, Number.EPSILON),
+      rotation: angle * 180 / Math.PI + 90,
+      opacity: Math.max(0.08, 1 - unit * unit * 0.82)
+    };
+  });
+  return { tiles, camera: { z: t * 480, zoom: 1 + t * 0.12 }, fog: { color: "#08090d", near: 300, far: 1200 } };
+}
+function depthJourneyRecipe(input) {
+  const count = Math.floor(finite("count", input.count, 1));
+  const depth = finite("depth", input.depth, Number.EPSILON);
+  const t = progress(input.progress);
+  const tiles = Array.from({ length: count }, (_, index) => {
+    const layer = index / count;
+    const z = (layer * depth - t * depth + depth) % depth;
+    const angle = index * 2.399963229728653;
+    const radius = 110 + index * 83 % 520;
+    const fog = z / depth;
+    return {
+      stream: stream(input.streamIds, index),
+      x: Math.cos(angle) * radius,
+      y: Math.sin(angle) * radius * 0.62,
+      z,
+      width: finite("tileWidth", input.tileWidth, Number.EPSILON),
+      height: finite("tileHeight", input.tileHeight, Number.EPSILON),
+      rotation: Math.sin(angle) * 8,
+      opacity: Math.max(0.06, (1 - fog) * (1 - fog))
+    };
+  });
+  return { tiles, camera: { x: Math.sin(t * Math.PI * 2) * 45, y: Math.cos(t * Math.PI * 2) * 24 }, fog: { color: "#050609", near: depth * 0.28, far: depth } };
+}
+function hashString(value) {
+  let hash = 0;
+  for (let index = 0; index < value.length; index++) {
+    hash = (hash << 5) - hash + value.charCodeAt(index) | 0;
+  }
+  return Math.abs(hash);
+}
+function seededRandom(seed) {
+  const value = Math.sin(seed * 9999) * 1e4;
+  return value - Math.floor(value);
+}
+function infiniteCanvasRecipe(input) {
+  if (input.streamIds.length === 0 || input.streamIds.some((id) => !id)) {
+    throw new Error("An infinite canvas recipe requires stream IDs.");
+  }
+  const viewportHeight = finite("viewportHeight", input.viewportHeight, Number.EPSILON);
+  const aspectRatio = finite("aspectRatio", input.aspectRatio ?? 16 / 9, Number.EPSILON);
+  const fovDegrees = finite("fovDegrees", input.fovDegrees ?? 60, Number.EPSILON);
+  if (fovDegrees >= 180) throw new Error("fovDegrees must be less than 180.");
+  const t = progress(input.progress);
+  const eased = t * t * (3 - 2 * t);
+  const perspective = viewportHeight / (2 * Math.tan(fovDegrees * Math.PI / 360));
+  const worldScale = perspective / 50;
+  const camera = {
+    x: (input.driftX ?? 6) * eased,
+    y: (input.driftY ?? -3) * eased,
+    z: 50 - (input.forwardTravel ?? 35) * eased
+  };
+  const tiles = [];
+  const chunkSize = 110;
+  const depthFadeStart = 140;
+  const depthFadeEnd = 260;
+  for (let cx = -1; cx <= 1; cx++) {
+    for (let cy = -1; cy <= 1; cy++) {
+      for (let cz = -2; cz <= 0; cz++) {
+        const seed = hashString(`${cx},${cy},${cz}`);
+        for (let item = 0; item < 5; item++) {
+          const itemSeed = seed + item * 1e3;
+          const random = (offset) => seededRandom(itemSeed + offset);
+          const size = 12 + random(4) * 8;
+          const planeX = cx * chunkSize + random(0) * chunkSize;
+          const planeY = cy * chunkSize + random(1) * chunkSize;
+          const planeZ = cz * chunkSize + random(2) * chunkSize;
+          const depthDistance = Math.abs(planeZ - camera.z);
+          const depthFade = depthDistance <= depthFadeStart ? 1 : Math.max(0, 1 - (depthDistance - depthFadeStart) / (depthFadeEnd - depthFadeStart));
+          const mediaIndex = Math.floor(random(5) * 1e6);
+          tiles.push({
+            stream: input.streamIds[mediaIndex % input.streamIds.length],
+            x: (planeX - camera.x) * worldScale,
+            y: (camera.y - planeY) * worldScale,
+            z: (camera.z - planeZ) * worldScale - perspective,
+            width: size * aspectRatio * worldScale,
+            height: size * worldScale,
+            opacity: depthFade * depthFade
+          });
+        }
+      }
+    }
+  }
+  return { tiles, camera: { perspective } };
+}
+function gridToHeroRecipe(input) {
+  const columns = Math.floor(finite("columns", input.columns, 1));
+  const rows = Math.floor(finite("rows", input.rows, 1));
+  const count = columns * rows;
+  if (!Number.isSafeInteger(input.heroIndex) || input.heroIndex < 0 || input.heroIndex >= count) {
+    throw new Error("heroIndex must reference a tile in the grid.");
+  }
+  const t = progress(input.progress);
+  const eased = t * t * (3 - 2 * t);
+  const strideX = input.tileWidth + finite("gap", input.gap);
+  const strideY = input.tileHeight + input.gap;
+  const tiles = Array.from({ length: count }, (_, index) => {
+    const x = (index % columns - (columns - 1) / 2) * strideX;
+    const y = (Math.floor(index / columns) - (rows - 1) / 2) * strideY;
+    const hero = index === input.heroIndex;
+    return {
+      stream: stream(input.streamIds, index),
+      x: hero ? x * (1 - eased) : x * (1 + eased * 0.35),
+      y: hero ? y * (1 - eased) : y * (1 + eased * 0.35),
+      z: hero ? -eased * 80 : eased * 180,
+      width: hero ? input.tileWidth + (input.heroWidth - input.tileWidth) * eased : input.tileWidth,
+      height: hero ? input.tileHeight + (input.heroHeight - input.tileHeight) * eased : input.tileHeight,
+      opacity: hero ? 1 : 1 - eased
+    };
+  });
+  return { tiles };
+}
+
+// ../execution/animate/src/index.ts
+var sandboxScope = {
+  smooth,
+  smootherstep,
+  rushInto,
+  rushFrom,
+  Create,
+  GrowFromCenter,
+  FadeIn,
+  Write,
+  Indicate,
+  Wiggle,
+  LaggedStart,
+  AnimationGroup,
+  Succession,
+  Transform,
+  MoveAlongPath,
+  GrowArrow,
+  Arrow,
+  makeArrowPath,
+  BrandBox,
+  Graph,
+  DiGraph,
+  ThreeCanvas,
+  StageCameraRig,
+  useImageTexture,
+  StudioRig,
+  DeviceMesh,
+  deviceDimensions,
+  lidRotationX,
+  makeDefaultScreenTexture,
+  defaultScreenLayout,
+  solveFlex,
+  flexReady,
+  isFlexReady,
+  leafIds,
+  flexBoxToThree,
+  fitBox,
+  FlexLayout,
+  useFlexReady,
+  PerspectiveStage,
+  StageLayer,
+  ContactShadow,
+  useStage,
+  resolveCamera,
+  cameraToThree,
+  perspectiveFor,
+  worldTransform,
+  dofBlur,
+  CAMERA_PRESETS,
+  dollyIn,
+  dollyOut,
+  drift,
+  tiltReveal,
+  orbit,
+  DEFAULT_CAMERA,
+  MediaTileScene,
+  ImageTileScene,
+  driftWallRecipe,
+  infiniteSpiralRecipe,
+  depthJourneyRecipe,
+  infiniteCanvasRecipe,
+  gridToHeroRecipe,
+  SceneShotV2
+};
+var sandboxScopeNames = Object.keys(sandboxScope);
+
+export {
+  smooth,
+  smootherstep,
+  rushInto,
+  rushFrom,
+  Create,
+  GrowFromCenter,
+  FadeIn,
+  Write,
+  Indicate,
+  Wiggle,
+  LaggedStart,
+  AnimationGroup,
+  Succession,
+  Transform,
+  MoveAlongPath,
+  GrowArrow,
+  Arrow,
+  makeArrowPath,
+  BrandBox,
+  Graph,
+  DiGraph,
+  DEFAULT_CAMERA,
+  perspectiveFor,
+  cameraOps,
+  worldTransform,
+  resolveCamera,
+  cameraOpsMatrix,
+  cameraToThree,
+  SCENE_DEFAULT_FOV,
+  SCENE_FOV_MIN,
+  SCENE_FOV_MAX,
+  sceneEyeDistance,
+  defaultSceneCamera,
+  sceneCameraPlanes,
+  sceneCameraPose,
+  sceneCameraPoseFromV1,
+  StageCameraRig,
+  ThreeCanvas,
+  useImageTexture,
+  defaultScreenLayout,
+  makeDefaultScreenTexture,
+  flexReady,
+  isFlexReady,
+  leafIds,
+  solveFlex,
+  flexBoxToThree,
+  fitBox,
+  unionTracks,
+  weightsAt,
+  buildTree,
+  useFlexReady,
+  FlexLayout,
+  dollyIn,
+  dollyOut,
+  drift,
+  tiltReveal,
+  orbit,
+  CAMERA_PRESETS,
+  dofBlur,
+  useStage,
+  PerspectiveStage,
+  StageLayer,
+  ContactShadow,
+  MEDIA_TILE_SCENE_LIMITS,
+  mediaTileFramesReady,
+  assertMediaTileScene,
+  mediaTileCropUvs,
+  mediaTileFogDistances,
+  MediaTileScene,
+  ImageTileScene,
+  SceneShotError,
+  referenceScale,
+  conjugateF,
+  sceneWorldMatrix,
+  sceneCssMatrix,
+  sceneLayerPose,
+  scaleSceneTransform,
+  PosedObject,
+  LaptopObject,
+  SLAB_CONTENT_OFFSET,
+  SlabObject,
+  PageObject,
+  WorldTextObject,
+  sceneSlotsFor,
+  sceneBoundSurfaces,
+  assertSceneSurfaceResolution,
+  SceneVideoBindingV1,
+  SceneVideoTextureCommitV1,
+  backdropStyleV2,
+  resolveSceneAssetsV2,
+  SceneShotV2,
+  sceneShadowBoundsV2,
+  PreparedSceneShotError,
+  PreparedSceneShotV1,
+  preparedSurfaceDeviceProps,
+  driftWallRecipe,
+  infiniteSpiralRecipe,
+  depthJourneyRecipe,
+  infiniteCanvasRecipe,
+  gridToHeroRecipe,
+  sandboxScope,
+  sandboxScopeNames
+};