video

Video

Create one narrated 1920×1080 MP4 at 30 fps in /workspace. Use the baked /opt/remotion harness and dependencies. Never install or download anything. The sandbox has no network.

Plan before rendering

Draft the complete deck specification first. For every slide include its on-screen text and narration line. Keep this specification unchanged: pass its narration lines to synthesize_narration, and later use the full specification as markdown_representation. It is the durable accessible and editable source; scene files and props.json are ephemeral.

Refuse requests above the 12-scene product limit rather than silently shortening them. The selected composition must also be at most 180 seconds.

Composition rules

• Give each slide one clear purpose. Keep safe outer margins, readable body contrast, restrained motion, and every shape on the 1920×1080 canvas.
• The harness supplies sequencing, narration audio, and the SurfSense watermark. Do not add another watermark or audio element.
• Use only these system-installed font families: Inter for normal text, Lora for editorial titles or quotes, and JetBrains Mono for code and figures. No other family is available reliably offline. Do not use loadFont, @font-face, or @remotion/google-fonts.
• Write one complete, self-contained TSX module per slide. Each module must import every dependency it uses and have a default component export. The harness writes the module verbatim: it does not inject globals, strip imports, or rewrite exports. Dependencies must already exist in baked node_modules.

Use this exact module shape:

import type React from "react";
import {AbsoluteFill, useCurrentFrame, useVideoConfig} from "remotion";
import {stagger} from "../../stagger";

const Scene: React.FC = () => {
  const frame = useCurrentFrame();
  const {fps} = useVideoConfig();
  const entrance = stagger(frame, fps, 0, 1);

  return (
    <AbsoluteFill
      style={{
        alignItems: "center",
        backgroundColor: "#101828",
        color: "white",
        fontFamily: "Inter",
        justifyContent: "center",
      }}
    >
      <h1 style={{fontSize: 96, ...entrance}}>A clear opening</h1>
    </AbsoluteFill>
  );
};

export default Scene;