---
name: hyperframes-cli
description: NarmaForge HyperTimeline: deterministic HTML, CSS, and GSAP timeline video authoring and headless rendering.
---

# NarmaForge HyperTimeline Video Engine

This skill guides AI agents and developers in authoring, previewing, and deterministically rendering high-definition videos using the NarmaForge HyperTimeline web engine.

## 1. Core Architecture
- **Web Standards**: Video scenes are structured as standard HTML5, CSS3, and GSAP (GreenSock) animations.
- **Deterministic Stepping**: The timeline steps frame-by-frame through a headless browser, guaranteeing 60fps frame-accurate rendering without drops or jitter.

## 2. CLI Command Reference
- `npx hyperframes init <project-dir>`: Initialize a new video composition workspace.
- `npx hyperframes preview`: Launch local interactive browser preview.
- `npx hyperframes render --output dist/video.mp4 --fps 60 --resolution 1080p`: Render deterministic MP4.
- `npx hyperframes skills update`: Synchronize local HyperFrames agent skills.

## 3. Composition Authoring Rules
1. **Strict Timeline Binding**: All motion must attach strictly to the master GSAP timeline. Never use `Date.now()` or `setTimeout`.
2. **Font & Asset Preloading**: Await `document.fonts.ready` before frame stepping begins.
3. **Responsive Ratios**: 16:9 (`1920x1080`) for landscape, 9:16 (`1080x1920`) for vertical shorts/reels.