# Geometry and asset contracts

These are **chosen implementation values** for the original 1280 × 720 studies,
not measurements of OpenAI's production geometry. Coordinates are design
pixels before any camera transform; the origin is the upper-left corner. The
source articles separately identify observed framing and limitations. There is
no claim to recover source lens settings, fonts, crop curves or exact easing.

## Shared stage

- The canvas is 1280 × 720, 16:9, 30 fps. `Stage` clips everything at its edges.
- The original window starts at `(80, 68)` and measures `1120 × 584`; its header
  is 52 pixels tall and its navigation rail is 188 pixels wide.
- `Artwork` is an original SVG with a `500 × 320` view box. Its circles, arch,
  baseline, palette and label are generated in `src/visuals.tsx`; no image
  download is required. Inline SVG scales without a raster-resolution limit.
- Bundled DejaVu Sans regular/bold supply typography. The font notice is in
  `public/fonts/LICENSE.txt`. All other asset content is original code/text.
- `Camera` transforms its entire child workspace, including any pointer placed
  inside it. At the final scale `zoom`, it translates by
  `(640 - focusX × 1280 × zoom, 360 - focusY × 720 × zoom)`. Its origin is `(0,0)`.
  A frame-space caption must be a sibling of the camera, not its child.

## Per-recipe construction

| Composition | Original geometry and owned layers | Required asset / adaptation constraint |
| --- | --- | --- |
| `TitleCut` | Centered flex title; 150-pixel canvas padding; 64-pixel bold type; maximum text width 970. At `settle`, replace the whole title with `Proof`. | Short title plus completed proof. No source slogan or logo. A title-to-window cut does not interpolate these geometries. |
| `ChapterReturn` | The same title geometry interrupts the same `Proof` component. Before/after task props are identical. | Keep one snapshot or shared data object; do not quietly swap the result during the title. |
| `PunchCut` | Switch camera amount from 0 to 1 in one frame. Default focus `(0.66, 0.64)`, zoom `1.55`. | Same capture/artifact on both sides. For a full-frame raster capture, start at least 1984 pixels wide for this zoom, then inspect sharpness. |
| `CameraPush` | Same camera as `PunchCut`, but progress is eased. Action label box `(850,470,260,60)` appears only at `settle`, inside the camera. | Place the target and its action in the transformed workspace. The full-window heading leaves the final crop so it does not become a partially clipped reading target. |
| `FocusType` | Input box `(334,365,750,150)`, 30-pixel padding, 26-pixel text. Pointer tip travels `(1070,310)` → `(365,402)`. | One original request; keep a stable text baseline. The example removes the pointer at completion and does not simulate submission. |
| `SelectionContext` | Three row boxes at `x=334`, `y=258 + row×65`, size `680 × 52`. Attached request `(500,474,514,56)`. Camera focus is fixed here at `(0.58,0.49)`. | Selection and attached action refer to the same rows. Its focus override is recipe-specific; generic `focusX/Y` props do not override it. |
| `ScrollMask` | Fixed viewport `(312,230,815,360)` with `overflow:hidden`. Five 180-pixel rows translate upward by 360 pixels. Header is outside the mask. | Supply enough content below the fold. The destination is row 3; if changing row height/count, recalculate travel and hold at that landmark. |
| `SplitResult` | Request starts `(312,165,800,418)` and narrows to 300 pixels. Preview box `(640,165,486,418)` arrives empty; result content then translates upward 14 pixels while fading in. | Same request throughout; result must exist before the reading hold. This synthetic staging does not measure or promise product latency. |
| `ObjectContext` | Initial artwork `(410,90,460,296)` and request `(340,442,600,115)`. Cut to device `(430,40,420,640)`, radius 36; chosen entrance starts 24 pixels lower at 0.96 scale. | Keep the same request/art identity. Blank device lasts four output frames; content returns after it. This is not a pixel-matched morph. |
| `CaptionCut` | Caption `(72,590,590,84)` stays in frame space, dark backed with 6-pixel accent border. Workspace cuts underneath it. | Short artifact label, not a new speaker inset. Keep the label clear of essential proof; maintain contrast after changing accent. |
| `MotifMontage` | Artwork footprint `(230,173,820,525)` stays fixed; three palette/variant states use the same silhouette. Title box `(140,68,1000,80)`. | Supply distinguishable variants retaining one visual motif. The slower 0.8-second default cadence is not the source's roughly 0.1-second rapid run. |
| `DensityCollapse` | Six `460 × 330` cards start at `(40 + column×416, -30 + row×385)`, rotated −4°/+5°. A common group scale falls to 0.03 before title replacement. | Parent transforms own the wall. Do not independently animate a label that is meant to collapse with its card. Source internal card motion and blur are omitted. |
| `QuietEnding` | Centered three-bar mark: widths 27, gap 14, heights 54/76/98. Four-frame stagger; fixed final state at `settle`. | Original identity only. This implementation does not reconstruct source wordmark deletion or branded knot geometry. |

The complete source in `src/Edits.tsx` and `src/visuals.tsx` is authoritative if
you change a layout. `src/model.ts` gives each recipe's phase-frame defaults;
the README explains phase meanings. Do not reuse one recipe's `change` meaning
for another without checking that table.

## When using a different original asset

Keep asset identity and crop placement in one shared component. Put a licensed
image in `public/`, resolve it with `staticFile`, and use Remotion's `Img` so
loading finishes before export. Use explicit `width`, `height` and `objectFit`;
choose `contain` when the whole object must survive a cut and `cover` only when
the crop is intentional. Do not substitute an ordinary HTML image with
uncontrolled loading. The official [Img documentation](https://www.remotion.dev/docs/img)
describes its render-loading behavior.

If the capture is not 16:9, establish the letterbox/crop transform first, then
calculate focus coordinates in the complete design frame. Check every boundary
frame and the longest text at 640 × 360 playback size. Character-count caps are
not fit guarantees. Redesign or simplify before reducing essential text below
readable size.