diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 000000000..afd089166
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,16 @@
+.git
+.github
+.idea
+.vscode
+node_modules
+packages/*/node_modules
+packages/*/dist
+packages/*/.debug
+packages/*/tests/output
+packages/*/tests/.artifacts
+packages/*/tests/golden
+coverage
+tmp
+dist
+*.log
+*.tsbuildinfo
diff --git a/.fallowrc.jsonc b/.fallowrc.jsonc
index 2c6fff407..1a95dcdd7 100644
--- a/.fallowrc.jsonc
+++ b/.fallowrc.jsonc
@@ -3,6 +3,7 @@
   "entry": [
     "packages/producer/src/**/*.test.ts",
     "packages/aws-lambda/src/**/*.test.ts",
+    "packages/amplify-video-worker/tests/**/*.test.ts",
     "packages/producer/src/regression-harness.ts",
     "packages/producer/src/regression-harness-distributed.test.ts",
     "packages/producer/src/regression-harness-lambda-local.ts",
diff --git a/Dockerfile.amplify-worker b/Dockerfile.amplify-worker
new file mode 100644
index 000000000..d6283d98c
--- /dev/null
+++ b/Dockerfile.amplify-worker
@@ -0,0 +1,74 @@
+FROM node:22-bookworm-slim
+
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    ca-certificates \
+    curl \
+    unzip \
+    ffmpeg \
+    chromium \
+    libgbm1 \
+    libnss3 \
+    libatk-bridge2.0-0 \
+    libdrm2 \
+    libxcomposite1 \
+    libxdamage1 \
+    libxrandr2 \
+    libcups2 \
+    libasound2 \
+    libpangocairo-1.0-0 \
+    libxshmfence1 \
+    libgtk-3-0 \
+    fonts-liberation \
+    fonts-noto-color-emoji \
+    fonts-noto-cjk \
+    fonts-noto-core \
+    fonts-noto-extra \
+    fonts-noto-ui-core \
+    fonts-freefont-ttf \
+    fonts-dejavu-core \
+    fontconfig \
+    && rm -rf /var/lib/apt/lists/* \
+    && apt-get clean \
+    && fc-cache -fv
+
+ENV PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true
+ENV PUPPETEER_EXECUTABLE_PATH=/usr/bin/chromium
+ENV CONTAINER=true
+
+RUN npx --yes @puppeteer/browsers install chrome-headless-shell@stable \
+      --path /root/.cache/puppeteer \
+    && find /root/.cache/puppeteer/chrome-headless-shell -name "chrome-headless-shell" -type f
+
+WORKDIR /app
+
+RUN curl -fsSL https://bun.sh/install | bash
+ENV PATH="/root/.bun/bin:$PATH"
+
+COPY package.json bun.lock ./
+COPY packages/core/package.json packages/core/package.json
+COPY packages/engine/package.json packages/engine/package.json
+COPY packages/player/package.json packages/player/package.json
+COPY packages/producer/package.json packages/producer/package.json
+COPY packages/cli/package.json packages/cli/package.json
+COPY packages/studio/package.json packages/studio/package.json
+COPY packages/shader-transitions/package.json packages/shader-transitions/package.json
+COPY packages/aws-lambda/package.json packages/aws-lambda/package.json
+COPY packages/amplify-video-worker/package.json packages/amplify-video-worker/package.json
+
+RUN bun install --frozen-lockfile
+
+COPY packages/core/ packages/core/
+COPY packages/engine/ packages/engine/
+COPY packages/aws-lambda/ packages/aws-lambda/
+COPY packages/producer/ packages/producer/
+COPY packages/amplify-video-worker/ packages/amplify-video-worker/
+
+# aws-lambda is COPYed only so `bun install --frozen-lockfile` can resolve
+# the workspace symlink — producer's tsconfig excludes its sole consumer
+# (regression-harness-lambda-local.ts), so we don't need to build it.
+RUN bun run --filter @hyperframes/producer build
+RUN bun run --filter @hyperframes/amplify-video-worker build
+
+EXPOSE 3000
+
+CMD ["bun", "packages/amplify-video-worker/dist/index.js"]
diff --git a/bun.lock b/bun.lock
index 8c86b1b31..b685c796e 100644
--- a/bun.lock
+++ b/bun.lock
@@ -20,9 +20,27 @@
         "typescript": "^5.0.0",
       },
     },
+    "packages/amplify-video-worker": {
+      "name": "@hyperframes/amplify-video-worker",
+      "version": "0.0.1",
+      "dependencies": {
+        "@aws-sdk/client-dynamodb": "^3.1021.0",
+        "@aws-sdk/client-s3": "^3.1021.0",
+        "@aws-sdk/client-sqs": "^3.1021.0",
+        "@aws-sdk/lib-dynamodb": "^3.1021.0",
+        "@hyperframes/core": "workspace:^",
+        "@hyperframes/producer": "workspace:^",
+        "qrcode": "^1.5.4",
+      },
+      "devDependencies": {
+        "@types/node": "^25.0.10",
+        "@types/qrcode": "^1.5.5",
+        "typescript": "^5.7.2",
+      },
+    },
     "packages/aws-lambda": {
       "name": "@hyperframes/aws-lambda",
-      "version": "0.6.27",
+      "version": "0.6.30",
       "dependencies": {
         "@aws-sdk/client-s3": "^3.700.0",
         "@aws-sdk/client-sfn": "^3.700.0",
@@ -54,7 +72,7 @@
     },
     "packages/cli": {
       "name": "@hyperframes/cli",
-      "version": "0.6.27",
+      "version": "0.6.30",
       "bin": {
         "hyperframes": "./dist/cli.js",
       },
@@ -97,7 +115,7 @@
     },
     "packages/core": {
       "name": "@hyperframes/core",
-      "version": "0.6.27",
+      "version": "0.6.30",
       "dependencies": {
         "@chenglou/pretext": "^0.0.5",
         "postcss": "^8.5.8",
@@ -124,7 +142,7 @@
     },
     "packages/engine": {
       "name": "@hyperframes/engine",
-      "version": "0.6.27",
+      "version": "0.6.30",
       "dependencies": {
         "@hono/node-server": "^1.13.0",
         "@hyperframes/core": "workspace:^",
@@ -142,7 +160,7 @@
     },
     "packages/player": {
       "name": "@hyperframes/player",
-      "version": "0.6.27",
+      "version": "0.6.30",
       "devDependencies": {
         "@types/bun": "^1.1.0",
         "gsap": "^3.12.5",
@@ -154,7 +172,7 @@
     },
     "packages/producer": {
       "name": "@hyperframes/producer",
-      "version": "0.6.27",
+      "version": "0.6.30",
       "dependencies": {
         "@fontsource/archivo-black": "^5.2.8",
         "@fontsource/eb-garamond": "^5.2.7",
@@ -194,7 +212,7 @@
     },
     "packages/shader-transitions": {
       "name": "@hyperframes/shader-transitions",
-      "version": "0.6.27",
+      "version": "0.6.30",
       "dependencies": {
         "html2canvas": "^1.4.1",
       },
@@ -206,7 +224,7 @@
     },
     "packages/studio": {
       "name": "@hyperframes/studio",
-      "version": "0.6.27",
+      "version": "0.6.30",
       "dependencies": {
         "@codemirror/autocomplete": "^6.20.1",
         "@codemirror/commands": "^6.10.3",
@@ -285,32 +303,44 @@
 
     "@aws-crypto/util": ["@aws-crypto/util@5.2.0", "", { "dependencies": { "@aws-sdk/types": "^3.222.0", "@smithy/util-utf8": "^2.0.0", "tslib": "^2.6.2" } }, "sha512-4RkU9EsI6ZpBve5fseQlGNUWKMa1RLPQ1dnjnQoe07ldfIzcsGb5hC5W0Dm7u423KWzawlrpbjXBrXCEv9zazQ=="],
 
+    "@aws-sdk/client-dynamodb": ["@aws-sdk/client-dynamodb@3.1050.0", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.12", "@aws-sdk/credential-provider-node": "^3.972.43", "@aws-sdk/dynamodb-codec": "^3.973.12", "@aws-sdk/middleware-endpoint-discovery": "^3.972.13", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-KE2rsQUYuHmiNxuJs1IPbFuZcRMpI7anpn7WHEQ3BzzAhh0lXd+47Jgq6SZJSrkt70DjDyoUiuGh7/gKRIRhFg=="],
+
     "@aws-sdk/client-s3": ["@aws-sdk/client-s3@3.1048.0", "", { "dependencies": { "@aws-crypto/sha1-browser": "5.2.0", "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.11", "@aws-sdk/credential-provider-node": "^3.972.42", "@aws-sdk/middleware-bucket-endpoint": "^3.972.13", "@aws-sdk/middleware-expect-continue": "^3.972.12", "@aws-sdk/middleware-flexible-checksums": "^3.974.19", "@aws-sdk/middleware-location-constraint": "^3.972.10", "@aws-sdk/middleware-sdk-s3": "^3.972.40", "@aws-sdk/middleware-ssec": "^3.972.10", "@aws-sdk/signature-v4-multi-region": "^3.996.27", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-SrJn5FteqqtcDBgQIvqLKk3Qn/2vSsi5XR03I53EDDR4CbCdLysVSNgUnjVncEECMua9Pz+nxO0/lEx3TP+6mA=="],
 
     "@aws-sdk/client-sfn": ["@aws-sdk/client-sfn@3.1048.0", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.11", "@aws-sdk/credential-provider-node": "^3.972.42", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-f+F2WkFX9HOqd7Wq7phc45olVkd8jpTgbZmxPvj2ItixrgT/XiobZn6vLmUF+b/2f0wO074yFT3p2go8If7K9Q=="],
 
-    "@aws-sdk/core": ["@aws-sdk/core@3.974.11", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@aws-sdk/xml-builder": "^3.972.24", "@aws/lambda-invoke-store": "^0.2.2", "@smithy/core": "^3.24.2", "@smithy/signature-v4": "^5.4.2", "@smithy/types": "^4.14.1", "bowser": "^2.11.0", "tslib": "^2.6.2" } }, "sha512-QpnINq5FZH6EOaDEkmHdT7eUunbvD27pDNQypaWjFyYz7Zl1q3UCMQErBZxpmfGfI7MvI2TlK8KTkgNpv8b1ug=="],
+    "@aws-sdk/client-sqs": ["@aws-sdk/client-sqs@3.1050.0", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.12", "@aws-sdk/credential-provider-node": "^3.972.43", "@aws-sdk/middleware-sdk-sqs": "^3.972.24", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-HybqoeiQTYI/OWtHZZPuVlUYWN+0wM4PgvNPwlpNDB+yraoZMhgDUUDdDshpvjl8ohVWNK1mtBeu37TOncdPRQ=="],
+
+    "@aws-sdk/core": ["@aws-sdk/core@3.974.12", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@aws-sdk/xml-builder": "^3.972.24", "@aws/lambda-invoke-store": "^0.2.2", "@smithy/core": "^3.24.2", "@smithy/signature-v4": "^5.4.2", "@smithy/types": "^4.14.1", "bowser": "^2.11.0", "tslib": "^2.6.2" } }, "sha512-qrqgioqYFjwR6LatVNS1L2Vk++EwRIxqSQXPKNv5Ofux2D8UNgqMQ1znnMyEImXquVPTtbf71fc128pvmU6y9A=="],
 
     "@aws-sdk/crc64-nvme": ["@aws-sdk/crc64-nvme@3.972.8", "", { "dependencies": { "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-fVfUCL/Xh2zINYMPZvj+iBn6XWouQf0DAnjaWCI9MkmqXzL2Iy5FoQB8O7syFe6gN6AH1ecDDU58T51Ou0kFkA=="],
 
-    "@aws-sdk/credential-provider-env": ["@aws-sdk/credential-provider-env@3.972.37", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-/jpPvEh6f7ntmIzf7dNxoNX6Q8vt8UpesCjbW6mFfk4V1NW6bIy9qxcQ6WbA8As5yQhsZOe+xeNd4xHX8kdY2Q=="],
+    "@aws-sdk/credential-provider-env": ["@aws-sdk/credential-provider-env@3.972.38", "", { "dependencies": { "@aws-sdk/core": "^3.974.12", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-m3WjZEgPtioMhPmwqUt+DhlTJ2i9ufR6DhfkyXojb9puEvfR+ur2U5shavu5/Cc9WHHsDCvALi6UFHgcqjhQ5w=="],
+
+    "@aws-sdk/credential-provider-http": ["@aws-sdk/credential-provider-http@3.972.40", "", { "dependencies": { "@aws-sdk/core": "^3.974.12", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-D78L/m2Dr6cJnnSvWoAudPhQmCwmJ7j6APXsPYmFpPaKfQTfCSu0rdm8j14Np+VmXF9z8Aj8HE3xFpsrwtfgeg=="],
+
+    "@aws-sdk/credential-provider-ini": ["@aws-sdk/credential-provider-ini@3.972.42", "", { "dependencies": { "@aws-sdk/core": "^3.974.12", "@aws-sdk/credential-provider-env": "^3.972.38", "@aws-sdk/credential-provider-http": "^3.972.40", "@aws-sdk/credential-provider-login": "^3.972.42", "@aws-sdk/credential-provider-process": "^3.972.38", "@aws-sdk/credential-provider-sso": "^3.972.42", "@aws-sdk/credential-provider-web-identity": "^3.972.42", "@aws-sdk/nested-clients": "^3.997.10", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/credential-provider-imds": "^4.3.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-Mu5ESvFXeinafVM8jTIvRqcvK2Ehj4kz3auT39yUcHwu1Vfxo6xRlmUafdKLW4tusjAJukQwK09sCSMgOm7OKg=="],
+
+    "@aws-sdk/credential-provider-login": ["@aws-sdk/credential-provider-login@3.972.42", "", { "dependencies": { "@aws-sdk/core": "^3.974.12", "@aws-sdk/nested-clients": "^3.997.10", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-O6WkZga3kf0yqyJYd1dbeJqVhEgJx/x1UaLgtbR+XuL/YP+K5y6QTxQKL7ka9z3jnQASESKGAPnRyt4D5hQrxA=="],
 
-    "@aws-sdk/credential-provider-http": ["@aws-sdk/credential-provider-http@3.972.39", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-pIgTpisWyWg7X1bUbzSjuUYosYTD0Ghz2M0hkSTmb3a6i3qV3uU+NYJPI/E2XSC0HcsZh5rsLPzeXrkb2DS0Cg=="],
+    "@aws-sdk/credential-provider-node": ["@aws-sdk/credential-provider-node@3.972.43", "", { "dependencies": { "@aws-sdk/credential-provider-env": "^3.972.38", "@aws-sdk/credential-provider-http": "^3.972.40", "@aws-sdk/credential-provider-ini": "^3.972.42", "@aws-sdk/credential-provider-process": "^3.972.38", "@aws-sdk/credential-provider-sso": "^3.972.42", "@aws-sdk/credential-provider-web-identity": "^3.972.42", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/credential-provider-imds": "^4.3.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-D/DJmbrWRP5BXEO3FH+ar4el+2n6OlGofiud7dQun2jES+AQEJjczenp1jBb4MBN7CpGpS8nsWGQLtuzc9tQbA=="],
 
-    "@aws-sdk/credential-provider-ini": ["@aws-sdk/credential-provider-ini@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/credential-provider-env": "^3.972.37", "@aws-sdk/credential-provider-http": "^3.972.39", "@aws-sdk/credential-provider-login": "^3.972.41", "@aws-sdk/credential-provider-process": "^3.972.37", "@aws-sdk/credential-provider-sso": "^3.972.41", "@aws-sdk/credential-provider-web-identity": "^3.972.41", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/credential-provider-imds": "^4.3.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-u2tyjaxJJzW8UtW4SM1ZcPMDwO6y+kV+llvou+Adts0FAKyzes5jG4izQN+KX3yE8ZROpS5y1LJ//xL2iSf76w=="],
+    "@aws-sdk/credential-provider-process": ["@aws-sdk/credential-provider-process@3.972.38", "", { "dependencies": { "@aws-sdk/core": "^3.974.12", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-EnbYVajGgbkb24s0K1eo4VNAPV5mHIET7LSvirTaFCwkfrfaOJxtSE+wY/tJdKDS21cEYkZs2ruCaAm+W4iblg=="],
 
-    "@aws-sdk/credential-provider-login": ["@aws-sdk/credential-provider-login@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-0LBitxXiAiaE5nlFPfpNIww/8FRY/I7WIndWsc9GmNFOM7cE1wNpVNQEGEk9Outg5l8xl+3vybxFyUy4l9q/LQ=="],
+    "@aws-sdk/credential-provider-sso": ["@aws-sdk/credential-provider-sso@3.972.42", "", { "dependencies": { "@aws-sdk/core": "^3.974.12", "@aws-sdk/nested-clients": "^3.997.10", "@aws-sdk/token-providers": "3.1049.0", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-RVV/9NbFwI8ZHEH5dn39lGyFmSbSVj1+orZdr6QsOe1mW9DCglmlen0cFaNZmCcqkqc7erNRHNBduxbeZuHAnw=="],
 
-    "@aws-sdk/credential-provider-node": ["@aws-sdk/credential-provider-node@3.972.42", "", { "dependencies": { "@aws-sdk/credential-provider-env": "^3.972.37", "@aws-sdk/credential-provider-http": "^3.972.39", "@aws-sdk/credential-provider-ini": "^3.972.41", "@aws-sdk/credential-provider-process": "^3.972.37", "@aws-sdk/credential-provider-sso": "^3.972.41", "@aws-sdk/credential-provider-web-identity": "^3.972.41", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/credential-provider-imds": "^4.3.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-D4oon2zbqqsWOJUM99Gm3/ZyJ0IJvTXVN3PyloGb3kQEyI36fjCZheZj422lAgTWWd6TSHgiImLt3RIaLdv3dQ=="],
+    "@aws-sdk/credential-provider-web-identity": ["@aws-sdk/credential-provider-web-identity@3.972.42", "", { "dependencies": { "@aws-sdk/core": "^3.974.12", "@aws-sdk/nested-clients": "^3.997.10", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-/67fXX0ddllD4u2Nujc5PvT4byHgpMUfz6+RxIKi/0nFIckeorm7JvXgzBuDyVKw0s58EbofmETDWUf9vTEuHQ=="],
 
-    "@aws-sdk/credential-provider-process": ["@aws-sdk/credential-provider-process@3.972.37", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-7nVaHBUaWIddASYfVaA9O4D5ZVjewU3sCol9WqZPGfW0nR+0WqE0xHZnD/U2L33PlOB8KNXGKZ6wOES/QijKzg=="],
+    "@aws-sdk/dynamodb-codec": ["@aws-sdk/dynamodb-codec@3.973.12", "", { "dependencies": { "@aws-sdk/core": "^3.974.12", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-E+qpJPN1QLzfeVDQe1gVmMiHu9PTJWwXqSQjIt8mH5OQXmds2J/IN+Ar6Oa9ZhhuPZb4fPkcgZg4UEpwJM90NA=="],
 
-    "@aws-sdk/credential-provider-sso": ["@aws-sdk/credential-provider-sso@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/token-providers": "3.1048.0", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-IOWAWEHe5LkjSKkkUUX9ciV6Y1scHTsnfEkdt5yyC4Slrc7AGbkLPrpntjqh18ksJAMOaVhoBsO8p2WyTcY2wQ=="],
+    "@aws-sdk/endpoint-cache": ["@aws-sdk/endpoint-cache@3.972.5", "", { "dependencies": { "mnemonist": "0.38.3", "tslib": "^2.6.2" } }, "sha512-itVdge0NozgtgmtbZ25FVwWU3vGlE7x7feE/aOEJNkQfEpbkrF8Rj1QmnK+2blFfYE1xWt/iU+6/jUp/pv1+MA=="],
 
-    "@aws-sdk/credential-provider-web-identity": ["@aws-sdk/credential-provider-web-identity@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-mbACk9Yypa8nm4iGZLs0PofOXEcTDOUw6wDnsPXNDNSd2WNXs1tSo+6nc/fh0jLYdfVZThhBL98PHW4aXFsG5A=="],
+    "@aws-sdk/lib-dynamodb": ["@aws-sdk/lib-dynamodb@3.1050.0", "", { "dependencies": { "@aws-sdk/core": "^3.974.12", "@aws-sdk/util-dynamodb": "^3.996.2", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" }, "peerDependencies": { "@aws-sdk/client-dynamodb": "^3.1050.0" } }, "sha512-AitozRt1Pe5AfET64ATr3MtZ1KMUg0AX0ju6phhzm7GOCJZEoNvxBfXXTHg35dBYo9dSqEwAWat7XB4VDRqrkA=="],
 
     "@aws-sdk/middleware-bucket-endpoint": ["@aws-sdk/middleware-bucket-endpoint@3.972.13", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-JDaukix+kt5KwF7FzNSkfZHpqiPJajVkKJLJexF6z5B44+CN70BXGiQaCEAiCtKtRZNvC16eF3SY9L0bDJPlbA=="],
 
+    "@aws-sdk/middleware-endpoint-discovery": ["@aws-sdk/middleware-endpoint-discovery@3.972.13", "", { "dependencies": { "@aws-sdk/endpoint-cache": "^3.972.5", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-1r6EkFdSQ4quTP3pW8yWIcYuyDwdwdBxGr+kfuPFYE3DqR+1gBc6NyJneAyoIs+wc/cUfnyJ4ZYC0T2SQTxP9A=="],
+
     "@aws-sdk/middleware-expect-continue": ["@aws-sdk/middleware-expect-continue@3.972.12", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-dA5pKTom/Ls9mgeyeaRBNQrRIVOLVjv4AmKOB0/e4yaiXEUy0gSz2d3liP8JHtYoCAEWySU1jWnyzwLOREN+4g=="],
 
     "@aws-sdk/middleware-flexible-checksums": ["@aws-sdk/middleware-flexible-checksums@3.974.19", "", { "dependencies": { "@aws-crypto/crc32": "5.2.0", "@aws-crypto/crc32c": "5.2.0", "@aws-crypto/util": "5.2.0", "@aws-sdk/core": "^3.974.11", "@aws-sdk/crc64-nvme": "^3.972.8", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-GLciZVIvWM3C+ffuqnUqlAZwRjQdLt+KXiqr9+aRwZyKVyF2J5lrJAzzSqwweNl9hUWBN00BhilWXdMI5DjNcw=="],
@@ -319,16 +349,20 @@
 
     "@aws-sdk/middleware-sdk-s3": ["@aws-sdk/middleware-sdk-s3@3.972.40", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/signature-v4-multi-region": "^3.996.27", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/signature-v4": "^5.4.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-vyFY4EsAGySqqd87Z7n4qcCYXJO3QArB8VIJzuupY5XuLHIp579HTZldIUGGABvAOzLptfPb9+lJBJcB+3/cvA=="],
 
+    "@aws-sdk/middleware-sdk-sqs": ["@aws-sdk/middleware-sdk-sqs@3.972.24", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-ej3vwWFzTP2B0FxlU2JelMaxplEncflFv2ARsoMQ9TXI/yfmsPEZw8zkOdsQp3rMEJ/vN7iKTYDYIcpeMmDRoQ=="],
+
     "@aws-sdk/middleware-ssec": ["@aws-sdk/middleware-ssec@3.972.10", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-Gli9A0u8EVVb+5bFDGS/QbSVg28w/wpEidg1ggVcSj65BDTdGR6punsOcVjqdiu1i42WHWo51MCvARPIIz9juw=="],
 
-    "@aws-sdk/nested-clients": ["@aws-sdk/nested-clients@3.997.9", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.11", "@aws-sdk/signature-v4-multi-region": "^3.996.27", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-jPR3rnmRI4hWYyzfmTGBr7NblMp8QYYeflHXba1H6+7CGrWVqWKQzaXFQ4qbExqPRsXN3T3L3JxFhr6aouXUGQ=="],
+    "@aws-sdk/nested-clients": ["@aws-sdk/nested-clients@3.997.10", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.12", "@aws-sdk/signature-v4-multi-region": "^3.996.27", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-FtQ/Bt327peZJuyo4WZSOLVUTw9ujRxntepiC7L65FxA2P82Xlq0g14T22BuqBUeMjDoxa9nvwiMHjLIfP3eUg=="],
 
     "@aws-sdk/signature-v4-multi-region": ["@aws-sdk/signature-v4-multi-region@3.996.27", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/signature-v4": "^5.4.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-0Phbz4t6HI3D3skxvG2uI+VWU034/nSIw1T8d+FPzzQG9EQTrw94o9mOKO2Gv3n3Oc8P7JD7RAUxkoneLWv5Eg=="],
 
-    "@aws-sdk/token-providers": ["@aws-sdk/token-providers@3.1048.0", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-k0y/GcuesuSfWyUM0WamrGyeZmltRYaPbHO82UDA6mZ/doB+FOHKutikPAtSXMn/hDz970cF+iRuuiYO9VEbAA=="],
+    "@aws-sdk/token-providers": ["@aws-sdk/token-providers@3.1049.0", "", { "dependencies": { "@aws-sdk/core": "^3.974.12", "@aws-sdk/nested-clients": "^3.997.10", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-r7+d0lQMTHKypkmaF5jRTBYLYHCUHzt3gaVoN9SidLhQeWhCmHk3AKrboDTpPF5b7Pt7vKu3+oeMjznM2Eu1ow=="],
 
     "@aws-sdk/types": ["@aws-sdk/types@3.973.8", "", { "dependencies": { "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-gjlAdtHMbtR9X5iIhVUvbVcy55KnznpC6bkDUWW9z915bi0ckdUr5cjf16Kp6xq0bP5HBD2xzgbL9F9Quv5vUw=="],
 
+    "@aws-sdk/util-dynamodb": ["@aws-sdk/util-dynamodb@3.996.2", "", { "dependencies": { "tslib": "^2.6.2" }, "peerDependencies": { "@aws-sdk/client-dynamodb": "^3.1003.0" } }, "sha512-ddpwaZmjBzcApYN7lgtAXjk+u+GO8fiPsxzuc59UqP+zqdxI1gsenPvkyiHiF9LnYnyRGijz6oN2JylnN561qQ=="],
+
     "@aws-sdk/util-locate-window": ["@aws-sdk/util-locate-window@3.965.5", "", { "dependencies": { "tslib": "^2.6.2" } }, "sha512-WhlJNNINQB+9qtLtZJcpQdgZw3SCDCpXdUJP7cToGwHbCWCnRckGlc6Bx/OhWwIYFNAn+FIydY8SZ0QmVu3xTQ=="],
 
     "@aws-sdk/xml-builder": ["@aws-sdk/xml-builder@3.972.24", "", { "dependencies": { "@nodable/entities": "2.1.0", "@smithy/types": "^4.14.1", "fast-xml-parser": "5.7.3", "tslib": "^2.6.2" } }, "sha512-V8z5YcDPfsvzrBlj0xR1vhRtocblhYbqdreCJB/voGd4Sr5zjNAeWxexbnqVtskTJe0vFb5KMqbSL++ePl+zRw=="],
@@ -575,6 +609,8 @@
 
     "@hono/node-server": ["@hono/node-server@1.19.14", "", { "peerDependencies": { "hono": "^4" } }, "sha512-GwtvgtXxnWsucXvbQXkRgqksiH2Qed37H9xHZocE5sA3N8O8O8/8FA3uclQXxXVzc9XBZuEOMK7+r02FmSpHtw=="],
 
+    "@hyperframes/amplify-video-worker": ["@hyperframes/amplify-video-worker@workspace:packages/amplify-video-worker"],
+
     "@hyperframes/aws-lambda": ["@hyperframes/aws-lambda@workspace:packages/aws-lambda"],
 
     "@hyperframes/cli": ["@hyperframes/cli@workspace:packages/cli"],
@@ -975,6 +1011,8 @@
 
     "@types/node": ["@types/node@25.7.0", "", { "dependencies": { "undici-types": "~7.21.0" } }, "sha512-z+pdZyxE+RTQE9AcboAZCb4otwcrvgHD+GlBpPgn0emDVt0ohrTMhAwlr2Wd9nZ+nihhYFxO2pThz3C5qSu2Eg=="],
 
+    "@types/qrcode": ["@types/qrcode@1.5.6", "", { "dependencies": { "@types/node": "*" } }, "sha512-te7NQcV2BOvdj2b1hCAHzAoMNuj65kNBMz0KBaxM6c3VGBOhU0dURQKOtH8CFNI/dsKkwlv32p26qYQTWoB5bw=="],
+
     "@types/react": ["@types/react@19.2.14", "", { "dependencies": { "csstype": "^3.2.2" } }, "sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w=="],
 
     "@types/react-dom": ["@types/react-dom@19.2.3", "", { "peerDependencies": { "@types/react": "^19.2.0" } }, "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ=="],
@@ -1101,6 +1139,8 @@
 
     "callsites": ["callsites@3.1.0", "", {}, "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ=="],
 
+    "camelcase": ["camelcase@5.3.1", "", {}, "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg=="],
+
     "camelcase-css": ["camelcase-css@2.0.1", "", {}, "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA=="],
 
     "caniuse-lite": ["caniuse-lite@1.0.30001792", "", {}, "sha512-hVLMUZFgR4JJ6ACt1uEESvQN1/dBVqPAKY0hgrV70eN3391K6juAfTjKZLKvOMsx8PxA7gsY1/tLMMTcfFLLpw=="],
@@ -1183,6 +1223,8 @@
 
     "debug": ["debug@4.4.3", "", { "dependencies": { "ms": "^2.1.3" } }, "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA=="],
 
+    "decamelize": ["decamelize@1.2.0", "", {}, "sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA=="],
+
     "decimal.js": ["decimal.js@10.6.0", "", {}, "sha512-YpgQiITW3JXGntzdUmyUR1V812Hn8T1YVXhCu+wO3OpS4eU9l4YdD3qjyiKdV6mvV29zapkMeD390UVEf2lkUg=="],
 
     "deep-eql": ["deep-eql@5.0.2", "", {}, "sha512-h5k/5U50IJJFpzfL6nO9jaaumfjO/f2NjK/oYB2Djzm4p9L+3T9qWpZqZ2hAbLPuuYq9wrU08WQyBTL5GbPk5Q=="],
@@ -1205,6 +1247,8 @@
 
     "didyoumean": ["didyoumean@1.2.2", "", {}, "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw=="],
 
+    "dijkstrajs": ["dijkstrajs@1.0.3", "", {}, "sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA=="],
+
     "dlv": ["dlv@1.1.3", "", {}, "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA=="],
 
     "dom-serializer": ["dom-serializer@2.0.0", "", { "dependencies": { "domelementtype": "^2.3.0", "domhandler": "^5.0.2", "entities": "^4.2.0" } }, "sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg=="],
@@ -1301,6 +1345,8 @@
 
     "fill-range": ["fill-range@7.1.1", "", { "dependencies": { "to-regex-range": "^5.0.1" } }, "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg=="],
 
+    "find-up": ["find-up@4.1.0", "", { "dependencies": { "locate-path": "^5.0.0", "path-exists": "^4.0.0" } }, "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw=="],
+
     "fix-dts-default-cjs-exports": ["fix-dts-default-cjs-exports@1.0.1", "", { "dependencies": { "magic-string": "^0.30.17", "mlly": "^1.7.4", "rollup": "^4.34.8" } }, "sha512-pVIECanWFC61Hzl2+oOCtoJ3F17kglZC/6N94eRWycFgBH35hHx0Li604ZIzhseh97mf2p0cv7vVrOZGoqhlEg=="],
 
     "foreground-child": ["foreground-child@3.3.1", "", { "dependencies": { "cross-spawn": "^7.0.6", "signal-exit": "^4.0.1" } }, "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw=="],
@@ -1489,6 +1535,8 @@
 
     "load-tsconfig": ["load-tsconfig@0.2.5", "", {}, "sha512-IXO6OCs9yg8tMKzfPZ1YmheJbZCiEsnBdcB03l0OcfK9prKnJb96siuHCr5Fl37/yo9DnKU+TLpxzTUspw9shg=="],
 
+    "locate-path": ["locate-path@5.0.0", "", { "dependencies": { "p-locate": "^4.1.0" } }, "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g=="],
+
     "lodash": ["lodash@4.18.1", "", {}, "sha512-dMInicTPVE8d1e5otfwmmjlxkZoUpiVLwyeTdUsi/Caj/gfzzblBcCE5sRHV/AsjuCmxWrte2TNGSYuCeCq+0Q=="],
 
     "lodash.truncate": ["lodash.truncate@4.4.2", "", {}, "sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw=="],
@@ -1533,6 +1581,8 @@
 
     "mlly": ["mlly@1.8.2", "", { "dependencies": { "acorn": "^8.16.0", "pathe": "^2.0.3", "pkg-types": "^1.3.1", "ufo": "^1.6.3" } }, "sha512-d+ObxMQFmbt10sretNDytwt85VrbkhhUA/JBGm1MPaWJ65Cl4wOgLaB1NYvJSZ0Ef03MMEU/0xpPMXUIQ29UfA=="],
 
+    "mnemonist": ["mnemonist@0.38.3", "", { "dependencies": { "obliterator": "^1.6.1" } }, "sha512-2K9QYubXx/NAjv4VLq1d1Ly8pWNC5L3BrixtdkyTegXWJIqY+zLNDhhX/A+ZwWt70tB1S8H4BE8FLYEFyNoOBw=="],
+
     "ms": ["ms@2.1.3", "", {}, "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA=="],
 
     "mz": ["mz@2.7.0", "", { "dependencies": { "any-promise": "^1.0.0", "object-assign": "^4.0.1", "thenify-all": "^1.0.0" } }, "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q=="],
@@ -1557,6 +1607,8 @@
 
     "object-keys": ["object-keys@1.1.1", "", {}, "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA=="],
 
+    "obliterator": ["obliterator@1.6.1", "", {}, "sha512-9WXswnqINnnhOG/5SLimUlzuU1hFJUc8zkwyD59Sd+dPOMf05PmnYG/d6Q7HZ+KmgkZJa1PxRso6QdM3sTNHig=="],
+
     "once": ["once@1.4.0", "", { "dependencies": { "wrappy": "1" } }, "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w=="],
 
     "onnxruntime-common": ["onnxruntime-common@1.26.0", "", {}, "sha512-qVyMR4lcWgbkc4getFV+GQijsTnbg/siteoqcDwa3sI/LxbrMSNw4ePyvCq/ymdQaRomCA7YuWmhzsswxvymdw=="],
@@ -1573,8 +1625,14 @@
 
     "oxlint": ["oxlint@1.64.0", "", { "optionalDependencies": { "@oxlint/binding-android-arm-eabi": "1.64.0", "@oxlint/binding-android-arm64": "1.64.0", "@oxlint/binding-darwin-arm64": "1.64.0", "@oxlint/binding-darwin-x64": "1.64.0", "@oxlint/binding-freebsd-x64": "1.64.0", "@oxlint/binding-linux-arm-gnueabihf": "1.64.0", "@oxlint/binding-linux-arm-musleabihf": "1.64.0", "@oxlint/binding-linux-arm64-gnu": "1.64.0", "@oxlint/binding-linux-arm64-musl": "1.64.0", "@oxlint/binding-linux-ppc64-gnu": "1.64.0", "@oxlint/binding-linux-riscv64-gnu": "1.64.0", "@oxlint/binding-linux-riscv64-musl": "1.64.0", "@oxlint/binding-linux-s390x-gnu": "1.64.0", "@oxlint/binding-linux-x64-gnu": "1.64.0", "@oxlint/binding-linux-x64-musl": "1.64.0", "@oxlint/binding-openharmony-arm64": "1.64.0", "@oxlint/binding-win32-arm64-msvc": "1.64.0", "@oxlint/binding-win32-ia32-msvc": "1.64.0", "@oxlint/binding-win32-x64-msvc": "1.64.0" }, "peerDependencies": { "oxlint-tsgolint": ">=0.22.1" }, "optionalPeers": ["oxlint-tsgolint"], "bin": { "oxlint": "bin/oxlint" } }, "sha512-Star3SNpWPeWFPw7kRXIhXUSn6fdiAl25q15CQzH/9WaOtG6e9CWTc25vNZOCr4PE1yEP1GtKJKIKglhj3OmEQ=="],
 
+    "p-limit": ["p-limit@2.3.0", "", { "dependencies": { "p-try": "^2.0.0" } }, "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w=="],
+
+    "p-locate": ["p-locate@4.1.0", "", { "dependencies": { "p-limit": "^2.2.0" } }, "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A=="],
+
     "p-retry": ["p-retry@4.6.2", "", { "dependencies": { "@types/retry": "0.12.0", "retry": "^0.13.1" } }, "sha512-312Id396EbJdvRONlngUx0NydfrIQ5lsYu0znKVUzVvArzEIt08V1qhtyESbGVd1FGX7UKtiFp5uwKZdM8wIuQ=="],
 
+    "p-try": ["p-try@2.2.0", "", {}, "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ=="],
+
     "pac-proxy-agent": ["pac-proxy-agent@7.2.0", "", { "dependencies": { "@tootallnate/quickjs-emscripten": "^0.23.0", "agent-base": "^7.1.2", "debug": "^4.3.4", "get-uri": "^6.0.1", "http-proxy-agent": "^7.0.0", "https-proxy-agent": "^7.0.6", "pac-resolver": "^7.0.1", "socks-proxy-agent": "^8.0.5" } }, "sha512-TEB8ESquiLMc0lV8vcd5Ql/JAKAoyzHFXaStwjkzpOpC5Yv+pIzLfHvjTSdf3vpa2bMiUQrg9i6276yn8666aA=="],
 
     "pac-resolver": ["pac-resolver@7.0.1", "", { "dependencies": { "degenerator": "^5.0.0", "netmask": "^2.0.2" } }, "sha512-5NPgf87AT2STgwa2ntRMr45jTKrYBGkVU36yT0ig/n/GMAa3oPqhZfIQ2kMEimReg0+t9kZViDVZ83qfVUlckg=="],
@@ -1589,6 +1647,8 @@
 
     "parse5": ["parse5@8.0.1", "", { "dependencies": { "entities": "^8.0.0" } }, "sha512-z1e/HMG90obSGeidlli3hj7cbocou0/wa5HacvI3ASx34PecNjNQeaHNo5WIZpWofN9kgkqV1q5YvXe3F0FoPw=="],
 
+    "path-exists": ["path-exists@4.0.0", "", {}, "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w=="],
+
     "path-expression-matcher": ["path-expression-matcher@1.5.0", "", {}, "sha512-cbrerZV+6rvdQrrD+iGMcZFEiiSrbv9Tfdkvnusy6y0x0GKBXREFg/Y65GhIfm0tnLntThhzCnfKwp1WRjeCyQ=="],
 
     "path-key": ["path-key@3.1.1", "", {}, "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q=="],
@@ -1613,6 +1673,8 @@
 
     "pkg-types": ["pkg-types@1.3.1", "", { "dependencies": { "confbox": "^0.1.8", "mlly": "^1.7.4", "pathe": "^2.0.1" } }, "sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ=="],
 
+    "pngjs": ["pngjs@5.0.0", "", {}, "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw=="],
+
     "postcss": ["postcss@8.5.14", "", { "dependencies": { "nanoid": "^3.3.11", "picocolors": "^1.1.1", "source-map-js": "^1.2.1" } }, "sha512-SoSL4+OSEtR99LHFZQiJLkT59C5B1amGO1NzTwj7TT1qCUgUO6hxOvzkOYxD+vMrXBM3XJIKzokoERdqQq/Zmg=="],
 
     "postcss-import": ["postcss-import@15.1.0", "", { "dependencies": { "postcss-value-parser": "^4.0.0", "read-cache": "^1.0.0", "resolve": "^1.1.7" }, "peerDependencies": { "postcss": "^8.0.0" } }, "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew=="],
@@ -1645,6 +1707,8 @@
 
     "puppeteer-core": ["puppeteer-core@24.43.1", "", { "dependencies": { "@puppeteer/browsers": "2.13.2", "chromium-bidi": "14.0.0", "debug": "^4.4.3", "devtools-protocol": "0.0.1608973", "typed-query-selector": "^2.12.2", "webdriver-bidi-protocol": "0.4.1", "ws": "^8.20.0" } }, "sha512-T5ScUMAsmhdNbgDR41AGESYeS6V9MSgetkSnVhhW+gXvzC42VesKCn5ld87gAZDJ6vLHL9GkRvY9WtQWSnwFbw=="],
 
+    "qrcode": ["qrcode@1.5.4", "", { "dependencies": { "dijkstrajs": "^1.0.1", "pngjs": "^5.0.0", "yargs": "^15.3.1" }, "bin": { "qrcode": "bin/qrcode" } }, "sha512-1ca71Zgiu6ORjHqFBDpnSMTR2ReToX4l1Au1VFLyVeBTFavzQnv5JxMFr3ukHVKpSrSA2MCk0lNJSykjUfz7Zg=="],
+
     "queue-microtask": ["queue-microtask@1.2.3", "", {}, "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A=="],
 
     "react": ["react@19.2.6", "", {}, "sha512-sfWGGfavi0xr8Pg0sVsyHMAOziVYKgPLNrS7ig+ivMNb3wbCBw3KxtflsGBAwD3gYQlE/AEZsTLgToRrSCjb0Q=="],
@@ -1663,6 +1727,8 @@
 
     "require-from-string": ["require-from-string@2.0.2", "", {}, "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw=="],
 
+    "require-main-filename": ["require-main-filename@2.0.0", "", {}, "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="],
+
     "resolve": ["resolve@1.22.12", "", { "dependencies": { "es-errors": "^1.3.0", "is-core-module": "^2.16.1", "path-parse": "^1.0.7", "supports-preserve-symlinks-flag": "^1.0.0" }, "bin": { "resolve": "bin/resolve" } }, "sha512-TyeJ1zif53BPfHootBGwPRYT1RUt6oGWsaQr8UyZW/eAm9bKoijtvruSDEmZHm92CwS9nj7/fWttqPCgzep8CA=="],
 
     "resolve-from": ["resolve-from@5.0.0", "", {}, "sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw=="],
@@ -1691,6 +1757,8 @@
 
     "serialize-error": ["serialize-error@8.1.0", "", { "dependencies": { "type-fest": "^0.20.2" } }, "sha512-3NnuWfM6vBYoy5gZFvHiYsVbafvI9vZv/+jlIigFn4oP4zjNPK3LhcY0xSCgeb1a5L8jO71Mit9LlNoi2UfDDQ=="],
 
+    "set-blocking": ["set-blocking@2.0.0", "", {}, "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw=="],
+
     "sharp": ["sharp@0.34.5", "", { "dependencies": { "@img/colour": "^1.0.0", "detect-libc": "^2.1.2", "semver": "^7.7.3" }, "optionalDependencies": { "@img/sharp-darwin-arm64": "0.34.5", "@img/sharp-darwin-x64": "0.34.5", "@img/sharp-libvips-darwin-arm64": "1.2.4", "@img/sharp-libvips-darwin-x64": "1.2.4", "@img/sharp-libvips-linux-arm": "1.2.4", "@img/sharp-libvips-linux-arm64": "1.2.4", "@img/sharp-libvips-linux-ppc64": "1.2.4", "@img/sharp-libvips-linux-riscv64": "1.2.4", "@img/sharp-libvips-linux-s390x": "1.2.4", "@img/sharp-libvips-linux-x64": "1.2.4", "@img/sharp-libvips-linuxmusl-arm64": "1.2.4", "@img/sharp-libvips-linuxmusl-x64": "1.2.4", "@img/sharp-linux-arm": "0.34.5", "@img/sharp-linux-arm64": "0.34.5", "@img/sharp-linux-ppc64": "0.34.5", "@img/sharp-linux-riscv64": "0.34.5", "@img/sharp-linux-s390x": "0.34.5", "@img/sharp-linux-x64": "0.34.5", "@img/sharp-linuxmusl-arm64": "0.34.5", "@img/sharp-linuxmusl-x64": "0.34.5", "@img/sharp-wasm32": "0.34.5", "@img/sharp-win32-arm64": "0.34.5", "@img/sharp-win32-ia32": "0.34.5", "@img/sharp-win32-x64": "0.34.5" } }, "sha512-Ou9I5Ft9WNcCbXrU9cMgPBcCK8LiwLqcbywW3t4oDV37n1pzpuNLsYiAV8eODnjbtQlSDwZ2cUEeQz4E54Hltg=="],
 
     "shebang-command": ["shebang-command@2.0.0", "", { "dependencies": { "shebang-regex": "^3.0.0" } }, "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA=="],
@@ -1857,6 +1925,8 @@
 
     "which": ["which@2.0.2", "", { "dependencies": { "isexe": "^2.0.0" }, "bin": { "node-which": "./bin/node-which" } }, "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA=="],
 
+    "which-module": ["which-module@2.0.1", "", {}, "sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ=="],
+
     "why-is-node-running": ["why-is-node-running@2.3.0", "", { "dependencies": { "siginfo": "^2.0.0", "stackback": "0.0.2" }, "bin": { "why-is-node-running": "cli.js" } }, "sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w=="],
 
     "wrap-ansi": ["wrap-ansi@7.0.0", "", { "dependencies": { "ansi-styles": "^4.0.0", "string-width": "^4.1.0", "strip-ansi": "^6.0.0" } }, "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q=="],
@@ -1897,6 +1967,20 @@
 
     "@aws-cdk/cloud-assembly-schema/semver": ["semver@7.8.0", "", { "bundled": true, "bin": { "semver": "bin/semver.js" } }, "sha512-AcM7dV/5ul4EekoQ29Agm5vri8JNqRyj39o0qpX6vDF2GZrtutZl5RwgD1XnZjiTAfncsJhMI48QQH3sN87YNA=="],
 
+    "@aws-sdk/client-s3/@aws-sdk/core": ["@aws-sdk/core@3.974.11", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@aws-sdk/xml-builder": "^3.972.24", "@aws/lambda-invoke-store": "^0.2.2", "@smithy/core": "^3.24.2", "@smithy/signature-v4": "^5.4.2", "@smithy/types": "^4.14.1", "bowser": "^2.11.0", "tslib": "^2.6.2" } }, "sha512-QpnINq5FZH6EOaDEkmHdT7eUunbvD27pDNQypaWjFyYz7Zl1q3UCMQErBZxpmfGfI7MvI2TlK8KTkgNpv8b1ug=="],
+
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node": ["@aws-sdk/credential-provider-node@3.972.42", "", { "dependencies": { "@aws-sdk/credential-provider-env": "^3.972.37", "@aws-sdk/credential-provider-http": "^3.972.39", "@aws-sdk/credential-provider-ini": "^3.972.41", "@aws-sdk/credential-provider-process": "^3.972.37", "@aws-sdk/credential-provider-sso": "^3.972.41", "@aws-sdk/credential-provider-web-identity": "^3.972.41", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/credential-provider-imds": "^4.3.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-D4oon2zbqqsWOJUM99Gm3/ZyJ0IJvTXVN3PyloGb3kQEyI36fjCZheZj422lAgTWWd6TSHgiImLt3RIaLdv3dQ=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/core": ["@aws-sdk/core@3.974.11", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@aws-sdk/xml-builder": "^3.972.24", "@aws/lambda-invoke-store": "^0.2.2", "@smithy/core": "^3.24.2", "@smithy/signature-v4": "^5.4.2", "@smithy/types": "^4.14.1", "bowser": "^2.11.0", "tslib": "^2.6.2" } }, "sha512-QpnINq5FZH6EOaDEkmHdT7eUunbvD27pDNQypaWjFyYz7Zl1q3UCMQErBZxpmfGfI7MvI2TlK8KTkgNpv8b1ug=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node": ["@aws-sdk/credential-provider-node@3.972.42", "", { "dependencies": { "@aws-sdk/credential-provider-env": "^3.972.37", "@aws-sdk/credential-provider-http": "^3.972.39", "@aws-sdk/credential-provider-ini": "^3.972.41", "@aws-sdk/credential-provider-process": "^3.972.37", "@aws-sdk/credential-provider-sso": "^3.972.41", "@aws-sdk/credential-provider-web-identity": "^3.972.41", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/credential-provider-imds": "^4.3.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-D4oon2zbqqsWOJUM99Gm3/ZyJ0IJvTXVN3PyloGb3kQEyI36fjCZheZj422lAgTWWd6TSHgiImLt3RIaLdv3dQ=="],
+
+    "@aws-sdk/middleware-bucket-endpoint/@aws-sdk/core": ["@aws-sdk/core@3.974.11", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@aws-sdk/xml-builder": "^3.972.24", "@aws/lambda-invoke-store": "^0.2.2", "@smithy/core": "^3.24.2", "@smithy/signature-v4": "^5.4.2", "@smithy/types": "^4.14.1", "bowser": "^2.11.0", "tslib": "^2.6.2" } }, "sha512-QpnINq5FZH6EOaDEkmHdT7eUunbvD27pDNQypaWjFyYz7Zl1q3UCMQErBZxpmfGfI7MvI2TlK8KTkgNpv8b1ug=="],
+
+    "@aws-sdk/middleware-flexible-checksums/@aws-sdk/core": ["@aws-sdk/core@3.974.11", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@aws-sdk/xml-builder": "^3.972.24", "@aws/lambda-invoke-store": "^0.2.2", "@smithy/core": "^3.24.2", "@smithy/signature-v4": "^5.4.2", "@smithy/types": "^4.14.1", "bowser": "^2.11.0", "tslib": "^2.6.2" } }, "sha512-QpnINq5FZH6EOaDEkmHdT7eUunbvD27pDNQypaWjFyYz7Zl1q3UCMQErBZxpmfGfI7MvI2TlK8KTkgNpv8b1ug=="],
+
+    "@aws-sdk/middleware-sdk-s3/@aws-sdk/core": ["@aws-sdk/core@3.974.11", "", { "dependencies": { "@aws-sdk/types": "^3.973.8", "@aws-sdk/xml-builder": "^3.972.24", "@aws/lambda-invoke-store": "^0.2.2", "@smithy/core": "^3.24.2", "@smithy/signature-v4": "^5.4.2", "@smithy/types": "^4.14.1", "bowser": "^2.11.0", "tslib": "^2.6.2" } }, "sha512-QpnINq5FZH6EOaDEkmHdT7eUunbvD27pDNQypaWjFyYz7Zl1q3UCMQErBZxpmfGfI7MvI2TlK8KTkgNpv8b1ug=="],
+
     "@babel/code-frame/js-tokens": ["js-tokens@4.0.0", "", {}, "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="],
 
     "@babel/core/semver": ["semver@6.3.1", "", { "bin": { "semver": "bin/semver.js" } }, "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA=="],
@@ -1973,6 +2057,8 @@
 
     "proxy-agent/lru-cache": ["lru-cache@7.18.3", "", {}, "sha512-jumlc0BIUrS3qJGgIkWZsyfAM7NCWiBcCDhnd+3NNM5KbBmLTgHVfWBcg6W+rLUsIpzpERPsvwUP7CckAQSOoA=="],
 
+    "qrcode/yargs": ["yargs@15.4.1", "", { "dependencies": { "cliui": "^6.0.0", "decamelize": "^1.2.0", "find-up": "^4.1.0", "get-caller-file": "^2.0.1", "require-directory": "^2.1.1", "require-main-filename": "^2.0.0", "set-blocking": "^2.0.0", "string-width": "^4.2.0", "which-module": "^2.0.0", "y18n": "^4.0.0", "yargs-parser": "^18.1.2" } }, "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A=="],
+
     "socks-proxy-agent/agent-base": ["agent-base@7.1.4", "", {}, "sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ=="],
 
     "strip-literal/js-tokens": ["js-tokens@9.0.1", "", {}, "sha512-mxa9E9ITFOt0ban3j6L5MpjwegGz6lBQmM1IJkWeBZGcMxto50+eWdjC/52xDbS2vy0k7vIMK0Fe2wfL9OQSpQ=="],
@@ -1993,6 +2079,30 @@
 
     "vitest/tinypool": ["tinypool@1.1.1", "", {}, "sha512-Zba82s87IFq9A9XmjiX5uZA/ARWDrB03OHlq+Vw1fSdt0I+4/Kutwy8BP4Y/y/aORMo61FQ0vIb5j44vSo5Pkg=="],
 
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-env": ["@aws-sdk/credential-provider-env@3.972.37", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-/jpPvEh6f7ntmIzf7dNxoNX6Q8vt8UpesCjbW6mFfk4V1NW6bIy9qxcQ6WbA8As5yQhsZOe+xeNd4xHX8kdY2Q=="],
+
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-http": ["@aws-sdk/credential-provider-http@3.972.39", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-pIgTpisWyWg7X1bUbzSjuUYosYTD0Ghz2M0hkSTmb3a6i3qV3uU+NYJPI/E2XSC0HcsZh5rsLPzeXrkb2DS0Cg=="],
+
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-ini": ["@aws-sdk/credential-provider-ini@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/credential-provider-env": "^3.972.37", "@aws-sdk/credential-provider-http": "^3.972.39", "@aws-sdk/credential-provider-login": "^3.972.41", "@aws-sdk/credential-provider-process": "^3.972.37", "@aws-sdk/credential-provider-sso": "^3.972.41", "@aws-sdk/credential-provider-web-identity": "^3.972.41", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/credential-provider-imds": "^4.3.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-u2tyjaxJJzW8UtW4SM1ZcPMDwO6y+kV+llvou+Adts0FAKyzes5jG4izQN+KX3yE8ZROpS5y1LJ//xL2iSf76w=="],
+
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-process": ["@aws-sdk/credential-provider-process@3.972.37", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-7nVaHBUaWIddASYfVaA9O4D5ZVjewU3sCol9WqZPGfW0nR+0WqE0xHZnD/U2L33PlOB8KNXGKZ6wOES/QijKzg=="],
+
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-sso": ["@aws-sdk/credential-provider-sso@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/token-providers": "3.1048.0", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-IOWAWEHe5LkjSKkkUUX9ciV6Y1scHTsnfEkdt5yyC4Slrc7AGbkLPrpntjqh18ksJAMOaVhoBsO8p2WyTcY2wQ=="],
+
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-web-identity": ["@aws-sdk/credential-provider-web-identity@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-mbACk9Yypa8nm4iGZLs0PofOXEcTDOUw6wDnsPXNDNSd2WNXs1tSo+6nc/fh0jLYdfVZThhBL98PHW4aXFsG5A=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-env": ["@aws-sdk/credential-provider-env@3.972.37", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-/jpPvEh6f7ntmIzf7dNxoNX6Q8vt8UpesCjbW6mFfk4V1NW6bIy9qxcQ6WbA8As5yQhsZOe+xeNd4xHX8kdY2Q=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-http": ["@aws-sdk/credential-provider-http@3.972.39", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-pIgTpisWyWg7X1bUbzSjuUYosYTD0Ghz2M0hkSTmb3a6i3qV3uU+NYJPI/E2XSC0HcsZh5rsLPzeXrkb2DS0Cg=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-ini": ["@aws-sdk/credential-provider-ini@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/credential-provider-env": "^3.972.37", "@aws-sdk/credential-provider-http": "^3.972.39", "@aws-sdk/credential-provider-login": "^3.972.41", "@aws-sdk/credential-provider-process": "^3.972.37", "@aws-sdk/credential-provider-sso": "^3.972.41", "@aws-sdk/credential-provider-web-identity": "^3.972.41", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/credential-provider-imds": "^4.3.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-u2tyjaxJJzW8UtW4SM1ZcPMDwO6y+kV+llvou+Adts0FAKyzes5jG4izQN+KX3yE8ZROpS5y1LJ//xL2iSf76w=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-process": ["@aws-sdk/credential-provider-process@3.972.37", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-7nVaHBUaWIddASYfVaA9O4D5ZVjewU3sCol9WqZPGfW0nR+0WqE0xHZnD/U2L33PlOB8KNXGKZ6wOES/QijKzg=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-sso": ["@aws-sdk/credential-provider-sso@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/token-providers": "3.1048.0", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-IOWAWEHe5LkjSKkkUUX9ciV6Y1scHTsnfEkdt5yyC4Slrc7AGbkLPrpntjqh18ksJAMOaVhoBsO8p2WyTcY2wQ=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-web-identity": ["@aws-sdk/credential-provider-web-identity@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-mbACk9Yypa8nm4iGZLs0PofOXEcTDOUw6wDnsPXNDNSd2WNXs1tSo+6nc/fh0jLYdfVZThhBL98PHW4aXFsG5A=="],
+
     "@babel/helper-compilation-targets/lru-cache/yallist": ["yallist@3.1.1", "", {}, "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g=="],
 
     "@isaacs/cliui/string-width/emoji-regex": ["emoji-regex@9.2.2", "", {}, "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg=="],
@@ -2005,6 +2115,12 @@
 
     "glob/minimatch/brace-expansion": ["brace-expansion@2.1.0", "", { "dependencies": { "balanced-match": "^1.0.0" } }, "sha512-TN1kCZAgdgweJhWWpgKYrQaMNHcDULHkWwQIspdtjV4Y5aurRdZpjAqn6yX3FPqTA9ngHCc4hJxMAMgGfve85w=="],
 
+    "qrcode/yargs/cliui": ["cliui@6.0.0", "", { "dependencies": { "string-width": "^4.2.0", "strip-ansi": "^6.0.0", "wrap-ansi": "^6.2.0" } }, "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ=="],
+
+    "qrcode/yargs/y18n": ["y18n@4.0.3", "", {}, "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ=="],
+
+    "qrcode/yargs/yargs-parser": ["yargs-parser@18.1.3", "", { "dependencies": { "camelcase": "^5.0.0", "decamelize": "^1.2.0" } }, "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ=="],
+
     "tailwindcss/chokidar/glob-parent": ["glob-parent@5.1.2", "", { "dependencies": { "is-glob": "^4.0.1" } }, "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow=="],
 
     "tailwindcss/chokidar/readdirp": ["readdirp@3.6.0", "", { "dependencies": { "picomatch": "^2.2.1" } }, "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA=="],
@@ -2113,8 +2229,30 @@
 
     "tsx/esbuild/@esbuild/win32-x64": ["@esbuild/win32-x64@0.27.7", "", { "os": "win32", "cpu": "x64" }, "sha512-56hiAJPhwQ1R4i+21FVF7V8kSD5zZTdHcVuRFMW0hn753vVfQN8xlx4uOPT4xoGH0Z/oVATuR82AiqSTDIpaHg=="],
 
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-ini/@aws-sdk/credential-provider-login": ["@aws-sdk/credential-provider-login@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-0LBitxXiAiaE5nlFPfpNIww/8FRY/I7WIndWsc9GmNFOM7cE1wNpVNQEGEk9Outg5l8xl+3vybxFyUy4l9q/LQ=="],
+
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-ini/@aws-sdk/nested-clients": ["@aws-sdk/nested-clients@3.997.9", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.11", "@aws-sdk/signature-v4-multi-region": "^3.996.27", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-jPR3rnmRI4hWYyzfmTGBr7NblMp8QYYeflHXba1H6+7CGrWVqWKQzaXFQ4qbExqPRsXN3T3L3JxFhr6aouXUGQ=="],
+
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-sso/@aws-sdk/nested-clients": ["@aws-sdk/nested-clients@3.997.9", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.11", "@aws-sdk/signature-v4-multi-region": "^3.996.27", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-jPR3rnmRI4hWYyzfmTGBr7NblMp8QYYeflHXba1H6+7CGrWVqWKQzaXFQ4qbExqPRsXN3T3L3JxFhr6aouXUGQ=="],
+
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-sso/@aws-sdk/token-providers": ["@aws-sdk/token-providers@3.1048.0", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-k0y/GcuesuSfWyUM0WamrGyeZmltRYaPbHO82UDA6mZ/doB+FOHKutikPAtSXMn/hDz970cF+iRuuiYO9VEbAA=="],
+
+    "@aws-sdk/client-s3/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-web-identity/@aws-sdk/nested-clients": ["@aws-sdk/nested-clients@3.997.9", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.11", "@aws-sdk/signature-v4-multi-region": "^3.996.27", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-jPR3rnmRI4hWYyzfmTGBr7NblMp8QYYeflHXba1H6+7CGrWVqWKQzaXFQ4qbExqPRsXN3T3L3JxFhr6aouXUGQ=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-ini/@aws-sdk/credential-provider-login": ["@aws-sdk/credential-provider-login@3.972.41", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-0LBitxXiAiaE5nlFPfpNIww/8FRY/I7WIndWsc9GmNFOM7cE1wNpVNQEGEk9Outg5l8xl+3vybxFyUy4l9q/LQ=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-ini/@aws-sdk/nested-clients": ["@aws-sdk/nested-clients@3.997.9", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.11", "@aws-sdk/signature-v4-multi-region": "^3.996.27", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-jPR3rnmRI4hWYyzfmTGBr7NblMp8QYYeflHXba1H6+7CGrWVqWKQzaXFQ4qbExqPRsXN3T3L3JxFhr6aouXUGQ=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-sso/@aws-sdk/nested-clients": ["@aws-sdk/nested-clients@3.997.9", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.11", "@aws-sdk/signature-v4-multi-region": "^3.996.27", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-jPR3rnmRI4hWYyzfmTGBr7NblMp8QYYeflHXba1H6+7CGrWVqWKQzaXFQ4qbExqPRsXN3T3L3JxFhr6aouXUGQ=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-sso/@aws-sdk/token-providers": ["@aws-sdk/token-providers@3.1048.0", "", { "dependencies": { "@aws-sdk/core": "^3.974.11", "@aws-sdk/nested-clients": "^3.997.9", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-k0y/GcuesuSfWyUM0WamrGyeZmltRYaPbHO82UDA6mZ/doB+FOHKutikPAtSXMn/hDz970cF+iRuuiYO9VEbAA=="],
+
+    "@aws-sdk/client-sfn/@aws-sdk/credential-provider-node/@aws-sdk/credential-provider-web-identity/@aws-sdk/nested-clients": ["@aws-sdk/nested-clients@3.997.9", "", { "dependencies": { "@aws-crypto/sha256-browser": "5.2.0", "@aws-crypto/sha256-js": "5.2.0", "@aws-sdk/core": "^3.974.11", "@aws-sdk/signature-v4-multi-region": "^3.996.27", "@aws-sdk/types": "^3.973.8", "@smithy/core": "^3.24.2", "@smithy/fetch-http-handler": "^5.4.2", "@smithy/node-http-handler": "^4.7.2", "@smithy/types": "^4.14.1", "tslib": "^2.6.2" } }, "sha512-jPR3rnmRI4hWYyzfmTGBr7NblMp8QYYeflHXba1H6+7CGrWVqWKQzaXFQ4qbExqPRsXN3T3L3JxFhr6aouXUGQ=="],
+
     "glob/minimatch/brace-expansion/balanced-match": ["balanced-match@1.0.2", "", {}, "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="],
 
+    "qrcode/yargs/cliui/wrap-ansi": ["wrap-ansi@6.2.0", "", { "dependencies": { "ansi-styles": "^4.0.0", "string-width": "^4.1.0", "strip-ansi": "^6.0.0" } }, "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA=="],
+
     "tailwindcss/chokidar/readdirp/picomatch": ["picomatch@2.3.2", "", {}, "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA=="],
   }
 }
diff --git a/docs/amplify-video-worker.md b/docs/amplify-video-worker.md
new file mode 100644
index 000000000..2cfe2386a
--- /dev/null
+++ b/docs/amplify-video-worker.md
@@ -0,0 +1,47 @@
+# Amplify Video Worker
+
+This worker is the render backend for Amplify explainer-video jobs.
+
+It runs as a dedicated ECS Fargate service and pulls jobs from SQS, then:
+
+- reads the Amplify `source.json`, `brief.json`, and `plan.json` artifacts
+- generates narration/script cards
+- synthesizes voiceover with ElevenLabs when enabled
+- renders the MP4 through Hyperframes
+- uploads artifacts back to the Amplify assets bucket
+- updates the Amplify DynamoDB job record
+
+## AWS targets
+
+- Account: `913524910742`
+- Region: `us-east-1`
+- ECS cluster: `amplify-dev-cluster`
+- ECS service: `amplify-dev-video-worker`
+- Task definition family: `amplify-dev-video-worker`
+- Queue: `amplify-dev-explainer-video-jobs`
+- DLQ: `amplify-dev-explainer-video-jobs-dlq`
+- ECR repo: `amplify/dev/video-worker`
+- CloudWatch log group: `/ecs/amplify-dev-video-worker`
+
+## Runtime config
+
+- `AMPLIFY_VIDEO_QUEUE_URL`
+- `DYNAMODB_TABLE_NAME`
+- `AWS_REGION`
+- `ELEVENLABS_API_KEY`
+- `ELEVENLABS_VOICE_ID`
+- optional: `ELEVENLABS_MODEL_ID`
+- optional: `WORKER_POLL_WAIT_SECONDS`
+- optional: `WORKER_VISIBILITY_TIMEOUT_SECONDS`
+- optional: `HYPERFRAMES_RENDER_WORKERS`
+
+## Deploy
+
+Use:
+
+```bash
+scripts/deploy-amplify-worker.sh
+```
+
+That script builds `Dockerfile.amplify-worker` for `linux/amd64` and pushes both
+`latest` and the current git-sha tag to the Amplify ECR repo.
diff --git a/packages/amplify-video-worker/package.json b/packages/amplify-video-worker/package.json
new file mode 100644
index 000000000..685f189e0
--- /dev/null
+++ b/packages/amplify-video-worker/package.json
@@ -0,0 +1,31 @@
+{
+  "name": "@hyperframes/amplify-video-worker",
+  "version": "0.0.1",
+  "private": true,
+  "description": "Amplify explainer-video worker powered by Hyperframes",
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "build": "tsc -p tsconfig.json",
+    "typecheck": "tsc --noEmit",
+    "test": "bun test tests"
+  },
+  "dependencies": {
+    "@aws-sdk/client-dynamodb": "^3.1021.0",
+    "@aws-sdk/client-s3": "^3.1021.0",
+    "@aws-sdk/client-sqs": "^3.1021.0",
+    "@aws-sdk/lib-dynamodb": "^3.1021.0",
+    "@hyperframes/core": "workspace:^",
+    "@hyperframes/producer": "workspace:^",
+    "qrcode": "^1.5.4"
+  },
+  "devDependencies": {
+    "@types/node": "^25.0.10",
+    "@types/qrcode": "^1.5.5",
+    "typescript": "^5.7.2"
+  },
+  "engines": {
+    "node": ">=22"
+  }
+}
diff --git a/packages/amplify-video-worker/scripts/sync-skills.sh b/packages/amplify-video-worker/scripts/sync-skills.sh
new file mode 100755
index 000000000..7cca78566
--- /dev/null
+++ b/packages/amplify-video-worker/scripts/sync-skills.sh
@@ -0,0 +1,29 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+# Sync the upstream hyperframes skill content into the amplify-video-worker
+# package so it ships inside the Docker image. Run this manually whenever the
+# upstream skill files change.
+
+PACKAGE_DIR="$(cd "$(dirname "$0")/.." && pwd)"
+REPO_ROOT="$(cd "$PACKAGE_DIR/../.." && pwd)"
+SOURCE_HYPERFRAMES="$REPO_ROOT/skills/hyperframes"
+SOURCE_GSAP="$REPO_ROOT/skills/gsap"
+DEST="$PACKAGE_DIR/skills"
+
+if [ ! -d "$SOURCE_HYPERFRAMES" ]; then
+  echo "Missing $SOURCE_HYPERFRAMES — run from inside the hyperframes repo." >&2
+  exit 1
+fi
+
+mkdir -p "$DEST/hyperframes"
+cp "$SOURCE_HYPERFRAMES/SKILL.md" "$DEST/hyperframes/"
+cp "$SOURCE_HYPERFRAMES/house-style.md" "$DEST/hyperframes/"
+cp "$SOURCE_HYPERFRAMES/patterns.md" "$DEST/hyperframes/"
+cp "$SOURCE_HYPERFRAMES/visual-styles.md" "$DEST/hyperframes/"
+cp "$SOURCE_HYPERFRAMES/data-in-motion.md" "$DEST/hyperframes/"
+
+mkdir -p "$DEST/gsap"
+cp "$SOURCE_GSAP/SKILL.md" "$DEST/gsap/"
+
+echo "Synced skill content to $DEST"
diff --git a/packages/amplify-video-worker/skills/amplify-constraints.md b/packages/amplify-video-worker/skills/amplify-constraints.md
new file mode 100644
index 000000000..c63fe808d
--- /dev/null
+++ b/packages/amplify-video-worker/skills/amplify-constraints.md
@@ -0,0 +1,99 @@
+# Amplify Composition Constraints
+
+These constraints are non-negotiable. The Amplify worker will reject and retry any
+composition that violates them.
+
+## Required structure
+
+- The composition root element MUST have:
+  - `data-composition-id="amplify-explainer"`
+  - `data-width` and `data-height` MUST match the aspect ratio in the user prompt header.
+    Use these pixel dimensions:
+    - 16:9 → `data-width="1920" data-height="1080"`
+    - 1:1 → `data-width="1080" data-height="1080"`
+    - 9:16 → `data-width="1080" data-height="1920"`
+  - `data-duration="<targetDurationSeconds>"` — matches the brief's target duration in seconds.
+- The composition MUST register a paused GSAP master timeline as:
+  ```js
+  window.__timelines = window.__timelines || {};
+  window.__timelines["amplify-explainer"] = tl; // tl = gsap.timeline({ paused: true })
+  ```
+- Every scene clip MUST have `data-start` and `data-duration` attributes.
+- Scene clips MUST NOT carry inline `visibility:hidden` or `opacity:0` styles. The
+  Hyperframes runtime drives visibility from `data-start`/`data-duration`. Animate inner
+  elements (text, cards) with opacity if you want fade-ins.
+
+## Audio
+
+- If the brief has voiceover enabled, the composition MUST include
+  `<audio id="narration-track" src="./narration.mp3" data-start="0" data-duration="<targetDurationSeconds>" data-track-index="8"></audio>`.
+  The worker writes `narration.mp3` next to `index.html`.
+- If voiceover is disabled, do not include an `<audio>` track.
+
+## Aspect-ratio safe zones
+
+The user prompt header tells you the target aspect ratio and exact pixel dimensions.
+Lay out the composition so:
+
+- 16:9: keep focal content inside the central 92% of the frame; captions in the lower third.
+- 1:1: SQUARE — keep focal content inside the central 80%; captions in the bottom 20%, well clear of edges; do NOT assume landscape width for typography or image placement.
+- 9:16: PORTRAIT — vertical stack; captions in the lower 25%; never use a landscape-only layout.
+
+## Author attribution
+
+When the user prompt header specifies an "Author reference style" line, follow it for ALL narration text and any on-screen author credit:
+
+- `first_name` — refer to the author by first name throughout (casual, conversational).
+- `formal_third` — refer to the author formally in the third person (e.g., "the author argues…"). Avoid first names.
+- `full_attribution` — use the author's full name on first mention, then first or last name as natural thereafter.
+
+When no style is specified, default to `full_attribution`.
+
+## Connector lines and arrows between elements
+
+Do NOT draw connector arrows between absolutely-positioned elements (boxes,
+nodes, cards) using `position:absolute` divs with hardcoded pixel offsets and
+`transform:rotate(...)`. The coordinates depend on the rendered width of the
+parent container — they look right in the LLM's imagined viewport and end up
+crossing through the boxes or missing them entirely in the actual render.
+
+Instead, do one of:
+
+- **Inline SVG with viewBox.** Wrap the diagram in `<svg viewBox="0 0 100 60" preserveAspectRatio="xMidYMid meet">` and draw `<line>`, `<polyline>`, or `<path>` between coordinates that match the same viewBox. The SVG scales with its container and connectors stay attached.
+- **Text arrows in a flexbox row.** Use `display:flex` with `→`, `↓`, `↔`, or `—` characters as separators between boxes. Trivial to align, never drifts.
+- **Skip the connector.** Spatial proximity + a kicker label often communicates the relationship more clearly than a line ever does.
+
+If you absolutely must use absolutely-positioned boxes, also draw the connectors as `<svg>` overlaying the same container with `position:absolute;inset:0` and a `viewBox` that matches the container's pixel size.
+
+## Images
+
+The user prompt header may include a `Cover image URL:` line. If present:
+
+- The value will be a **relative local path** beginning with `./` (e.g. `./cover.png`). The worker has already downloaded the cover image to the project directory.
+- Reference it as `<img src="./cover.png" ...>` — do NOT add `crossorigin="anonymous"` on relative-path images.
+- If the value is a remote URL (legacy fallback), you may still use it, but be aware Substack-hosted images may fail to load in Chromium due to missing CORS headers.
+
+Author and publication images: do NOT reference any remote image URLs not provided in the prompt. Use typography, color blocks, or initials instead of fetching head-shots.
+
+## Close-scene QR code mount
+
+The composition's final scene MUST include an empty mount element where the worker will inject a QR code for the CTA URL:
+
+```html
+<div class="qr-mount" style="width:200px;height:200px;background:#fff;padding:12px;"></div>
+```
+
+Place it next to the CTA URL/booklet text so viewers can scan it as the video ends. The worker replaces the mount's contents with an inline SVG QR code post-render. If you omit the mount entirely, the worker will append a fallback QR card to the close scene at the bottom-right, which is uglier than placing it intentionally.
+
+Do NOT attempt to generate the QR code yourself; you cannot. Just include the empty mount.
+
+## Remote scripts
+
+- Allowed: `cdnjs.cloudflare.com/ajax/libs/gsap/...` only.
+- No other remote scripts.
+
+## Output format
+
+You return JSON via structured output. The `indexHtml` field is the complete
+`<!doctype html>` document. The `narration` array is per-scene narration text the
+worker will pass to ElevenLabs (include only when voice is enabled).
diff --git a/packages/amplify-video-worker/skills/gsap/SKILL.md b/packages/amplify-video-worker/skills/gsap/SKILL.md
new file mode 100644
index 000000000..db40a6c17
--- /dev/null
+++ b/packages/amplify-video-worker/skills/gsap/SKILL.md
@@ -0,0 +1,240 @@
+---
+name: gsap
+description: GSAP animation reference for HyperFrames. Covers gsap.to(), from(), fromTo(), easing, stagger, defaults, timelines (gsap.timeline(), position parameter, labels, nesting, playback), and performance (transforms, will-change, quickTo). Use when writing GSAP animations in HyperFrames compositions.
+---
+
+# GSAP
+
+## HyperFrames Contract
+
+HyperFrames controls GSAP through its `gsap` runtime adapter. Create a paused timeline synchronously, register it on `window.__timelines` with the exact `data-composition-id`, and let HyperFrames seek it.
+
+```html
+<script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+<script>
+  window.__timelines = window.__timelines || {};
+  const tl = gsap.timeline({ paused: true });
+
+  tl.from(".title", { y: 48, opacity: 0, duration: 0.6, ease: "power3.out" }, 0);
+  tl.to(".accent", { scaleX: 1, duration: 0.5, ease: "power2.out" }, 0.25);
+
+  window.__timelines["main"] = tl; // key must equal data-composition-id on the composition root
+</script>
+```
+
+- The registry key must match the composition root's `data-composition-id`.
+- Do not call `tl.play()` for render-critical motion.
+- Do not build timelines inside async code, timers, or event handlers.
+- Keep loops finite. HyperFrames renders finite video durations.
+
+## Core Tween Methods
+
+- **gsap.to(targets, vars)** — animate from current state to `vars`. Most common.
+- **gsap.from(targets, vars)** — animate from `vars` to current state (entrances).
+- **gsap.fromTo(targets, fromVars, toVars)** — explicit start and end.
+- **gsap.set(targets, vars)** — apply immediately (duration 0).
+
+Always use **camelCase** property names (e.g. `backgroundColor`, `rotationX`).
+
+## Common vars
+
+- **duration** — seconds (default 0.5).
+- **delay** — seconds before start.
+- **ease** — `"power1.out"` (default), `"power3.inOut"`, `"back.out(1.7)"`, `"elastic.out(1, 0.3)"`, `"none"`.
+- **stagger** — number `0.1` or object: `{ amount: 0.3, from: "center" }`, `{ each: 0.1, from: "random" }`.
+- **overwrite** — `false` (default), `true`, or `"auto"`.
+- **repeat** — finite number; never `-1` in HyperFrames. Compute repeats from the visible duration. **yoyo** — alternates direction with repeat.
+- **onComplete**, **onStart**, **onUpdate** — callbacks.
+- **immediateRender** — default `true` for from()/fromTo(). Set `false` on later tweens targeting the same property+element to avoid overwrite.
+
+## Transforms and CSS
+
+Prefer GSAP's **transform aliases** over raw `transform` string:
+
+| GSAP property               | Equivalent          |
+| --------------------------- | ------------------- |
+| `x`, `y`, `z`               | translateX/Y/Z (px) |
+| `xPercent`, `yPercent`      | translateX/Y in %   |
+| `scale`, `scaleX`, `scaleY` | scale               |
+| `rotation`                  | rotate (deg)        |
+| `rotationX`, `rotationY`    | 3D rotate           |
+| `skewX`, `skewY`            | skew                |
+| `transformOrigin`           | transform-origin    |
+
+- **autoAlpha** — prefer over `opacity`. At 0: also sets `visibility: hidden`.
+- **CSS variables** — `"--hue": 180`.
+- **svgOrigin** _(SVG only)_ — global SVG coordinate space origin. Don't combine with `transformOrigin`.
+- **Directional rotation** — `"360_cw"`, `"-170_short"`, `"90_ccw"`.
+- **clearProps** — `"all"` or comma-separated; removes inline styles on complete.
+- **Relative values** — `"+=20"`, `"-=10"`, `"*=2"`.
+
+## Function-Based Values
+
+```javascript
+gsap.to(".item", {
+  x: (i, target, targets) => i * 50,
+  stagger: 0.1,
+});
+```
+
+## Easing
+
+Built-in eases: `power1`–`power4`, `back`, `bounce`, `circ`, `elastic`, `expo`, `sine`. Each has `.in`, `.out`, `.inOut`.
+
+## Defaults
+
+```javascript
+gsap.defaults({ duration: 0.6, ease: "power2.out" });
+```
+
+## Controlling Tweens
+
+```javascript
+const tween = gsap.to(".box", { x: 100 });
+tween.pause();
+tween.play();
+tween.reverse();
+tween.kill();
+tween.progress(0.5);
+tween.time(0.2);
+```
+
+## gsap.matchMedia() (Responsive + Accessibility)
+
+Runs setup only when a media query matches; auto-reverts when it stops matching.
+
+```javascript
+let mm = gsap.matchMedia();
+mm.add(
+  {
+    isDesktop: "(min-width: 800px)",
+    reduceMotion: "(prefers-reduced-motion: reduce)",
+  },
+  (context) => {
+    const { isDesktop, reduceMotion } = context.conditions;
+    gsap.to(".box", {
+      rotation: isDesktop ? 360 : 180,
+      duration: reduceMotion ? 0 : 2,
+    });
+  },
+);
+```
+
+---
+
+## Timelines
+
+### Creating a Timeline
+
+```javascript
+const tl = gsap.timeline({ defaults: { duration: 0.5, ease: "power2.out" } });
+tl.to(".a", { x: 100 }).to(".b", { y: 50 }).to(".c", { opacity: 0 });
+```
+
+### Position Parameter
+
+Third argument controls placement:
+
+- **Absolute**: `1` — at 1s
+- **Relative**: `"+=0.5"` — after end; `"-=0.2"` — before end
+- **Label**: `"intro"`, `"intro+=0.3"`
+- **Alignment**: `"<"` — same start as previous; `">"` — after previous ends; `"<0.2"` — 0.2s after previous starts
+
+```javascript
+tl.to(".a", { x: 100 }, 0);
+tl.to(".b", { y: 50 }, "<"); // same start as .a
+tl.to(".c", { opacity: 0 }, "<0.2"); // 0.2s after .b starts
+```
+
+### Labels
+
+```javascript
+tl.addLabel("intro", 0);
+tl.to(".a", { x: 100 }, "intro");
+tl.addLabel("outro", "+=0.5");
+tl.play("outro");
+tl.tweenFromTo("intro", "outro");
+```
+
+### Timeline Options
+
+- **paused: true** — create paused; call `.play()` to start.
+- **repeat**, **yoyo** — apply to whole timeline.
+- **defaults** — vars merged into every child tween.
+
+### Nesting Timelines
+
+```javascript
+const master = gsap.timeline();
+const child = gsap.timeline();
+child.to(".a", { x: 100 }).to(".b", { y: 50 });
+master.add(child, 0);
+```
+
+### Playback Control
+
+`tl.play()`, `tl.pause()`, `tl.reverse()`, `tl.restart()`, `tl.time(2)`, `tl.progress(0.5)`, `tl.kill()`.
+
+---
+
+## Performance
+
+### Prefer Transform and Opacity
+
+Animating `x`, `y`, `scale`, `rotation`, `opacity` stays on the compositor. Avoid `width`, `height`, `top`, `left` when transforms achieve the same effect.
+
+### will-change
+
+```css
+will-change: transform;
+```
+
+Only on elements that actually animate.
+
+### gsap.quickTo() for Frequent Updates
+
+```javascript
+let xTo = gsap.quickTo("#id", "x", { duration: 0.4, ease: "power3" }),
+  yTo = gsap.quickTo("#id", "y", { duration: 0.4, ease: "power3" });
+container.addEventListener("mousemove", (e) => {
+  xTo(e.pageX);
+  yTo(e.pageY);
+});
+```
+
+### Stagger > Many Tweens
+
+Use `stagger` instead of separate tweens with manual delays.
+
+### Cleanup
+
+Pause or kill off-screen animations.
+
+---
+
+## References (loaded on demand)
+
+- **[references/effects.md](references/effects.md)** — Drop-in effects: typewriter text, audio visualizer. Read when needing ready-made effect patterns for HyperFrames.
+
+## Best Practices
+
+- Use camelCase property names; prefer transform aliases and autoAlpha.
+- Prefer timelines over chaining with delay; use the position parameter.
+- Add labels with `addLabel()` for readable sequencing.
+- Pass defaults into timeline constructor.
+- Store tween/timeline return value when controlling playback.
+
+## Do Not
+
+- Animate layout properties (width/height/top/left) when transforms suffice.
+- Use both svgOrigin and transformOrigin on the same SVG element.
+- Chain animations with delay when a timeline can sequence them.
+- Create tweens before the DOM exists.
+- Skip cleanup — always kill tweens when no longer needed.
+- Use infinite repeat values in HyperFrames compositions. Use finite repeat counts computed from the visible duration.
+
+## Credits And References
+
+- HyperFrames adapter source: `packages/core/src/runtime/adapters/gsap.ts`.
+- GSAP documentation: https://gsap.com/docs/v3/
+- GSAP timeline pause and seek behavior: https://gsap.com/docs/v3/GSAP/Timeline/pause%28%29/
diff --git a/packages/amplify-video-worker/skills/hyperframes/SKILL.md b/packages/amplify-video-worker/skills/hyperframes/SKILL.md
new file mode 100644
index 000000000..f68c52dac
--- /dev/null
+++ b/packages/amplify-video-worker/skills/hyperframes/SKILL.md
@@ -0,0 +1,490 @@
+---
+name: hyperframes
+description: Create video compositions, animations, title cards, overlays, captions, voiceovers, audio-reactive visuals, and scene transitions in HyperFrames HTML. Use when asked to build any HTML-based video content, add captions or subtitles synced to audio, generate text-to-speech narration, create audio-reactive animation (beat sync, glow, pulse driven by music), add animated text highlighting (marker sweeps, hand-drawn circles, burst lines, scribble, sketchout), or add transitions between scenes (crossfades, wipes, reveals, shader transitions). Covers composition authoring, timing, media, and the full video production workflow. For dev-loop CLI commands (init, lint, inspect, preview, render) see the hyperframes-cli skill; for asset preprocessing commands (tts, transcribe, remove-background) see the hyperframes-media skill.
+---
+
+# HyperFrames
+
+HTML is the source of truth for video. A composition is an HTML file with `data-*` attributes for timing, a GSAP timeline for animation, and CSS for appearance. The framework handles clip visibility, media playback, and timeline sync.
+
+## Approach
+
+### Discovery (exploratory requests only)
+
+For open-ended requests ("make me a product launch video", "create something for our brand") where the user hasn't committed to a direction, understand intent before picking colors:
+
+- **Audience** — who watches this? Developers? Executives? General consumers?
+- **Platform** — where does it play? Social (15s), website hero, product demo, internal?
+- **Priority** — what matters most? Motion quality? Content accuracy? Brand fidelity? Speed?
+- **Variations** — does the user want options, or a single best shot?
+
+For specific requests ("add a title card", "fix the timing on scene 3"), skip discovery.
+
+For exploratory requests, consider offering 2-3 variations that differ meaningfully — not just color swaps, but different pacing, energy levels, or structural approaches. One safe/expected, one ambitious. Don't mandate this — it's a tool available when appropriate.
+
+### Step 1: Design system
+
+If `design.md` or `DESIGN.md` exists in the project, read it first (check both casings — they're different files on Linux). It's the source of truth for brand colors, fonts, and constraints. Use its exact values — don't invent colors or substitute fonts. Any format works (YAML frontmatter, prose, tables — just extract the values).
+
+If it names fonts you can't find locally (no `fonts/` directory with `.woff2` files, not a built-in font), warn the user before writing HTML: "design.md specifies [font name] but no font files found. Please add .woff2 files to `fonts/` or I'll fall back to [closest built-in alternative]."
+
+If no `design.md` exists, offer the user a choice:
+
+1. **User named a style or mood?** → Read [visual-styles.md](./visual-styles.md) for the 8 named presets. Pick the closest match.
+2. **Want to browse options visually?** → Run the design picker: read [references/design-picker.md](references/design-picker.md) for the full workflow. This serves a visual picker page. The user configures mood, palette, typography, and motion in the browser, then copies the generated design.md and pastes it back into the conversation.
+3. **Want to skip and go fast?** → Ask: mood, light or dark, any brand colors/fonts? Then pick a palette from [house-style.md](./house-style.md).
+
+**design.md defines the brand. It does not define video composition rules.** Those come from [references/video-composition.md](references/video-composition.md) and [house-style.md](./house-style.md). Use brand colors at video-appropriate scale — not at web-UI opacity.
+
+### Step 2: Prompt expansion
+
+Always run on every composition (except single-scene pieces and trivial edits). This step grounds the user's intent against `design.md` and `house-style.md` and produces a consistent intermediate that every downstream agent reads the same way.
+
+Read [references/prompt-expansion.md](references/prompt-expansion.md) for the full process and output format.
+
+### Step 3: Plan
+
+Before writing HTML, think at a high level:
+
+1. **What** — what should the viewer experience? Identify the narrative arc, key moments, and emotional beats.
+2. **Structure** — how many compositions, which are sub-compositions vs inline, what tracks carry what (video, audio, overlays, captions).
+3. **Rhythm** — declare your scene rhythm before implementing. Which scenes are quick hits, which are holds, where do shaders land, where does energy peak. Name the pattern: fast-fast-SLOW-fast-SHADER-hold. Read [references/beat-direction.md](references/beat-direction.md) for rhythm templates.
+4. **Timing** — which clips drive the duration, where do transitions land, what's the pacing.
+5. **Layout** — build the end-state first. See "Layout Before Animation" below.
+6. **Animate** — then add motion using the rules below.
+
+**Build what was asked.** A request for "a title card" is not a request for "a title card + 3 supporting scenes + ambient music + captions." Every scene, every element, every tween should earn its place. If additional scenes or elements would genuinely improve the piece, propose them — don't add them.
+
+For small edits (fix a color, adjust timing, add one element), skip straight to the rules.
+
+<HARD-GATE>
+Before writing ANY composition HTML — verify you have a visual identity from Step 1. If you're reaching for `#333`, `#3b82f6`, or `Roboto`, you skipped it.
+</HARD-GATE>
+
+## Layout Before Animation
+
+Position every element where it should be at its **most visible moment** — the frame where it's fully entered, correctly placed, and not yet exiting. Write this as static HTML+CSS first. No GSAP yet.
+
+**Why this matters:** If you position elements at their animated start state (offscreen, scaled to 0, opacity 0) and tween them to where you think they should land, you're guessing the final layout. Overlaps are invisible until the video renders. By building the end state first, you can see and fix layout problems before adding any motion.
+
+### The process
+
+1. **Identify the hero frame** for each scene — the moment when the most elements are simultaneously visible. This is the layout you build.
+2. **Write static CSS** for that frame. The `.scene-content` container MUST fill the full scene using `width: 100%; height: 100%; padding: Npx;` with `display: flex; flex-direction: column; gap: Npx; box-sizing: border-box`. Use padding to push content inward — NEVER `position: absolute; top: Npx` on a content container. Absolute-positioned content containers overflow when content is taller than the remaining space. Reserve `position: absolute` for decoratives only.
+3. **Add entrances with `gsap.from()`** — animate FROM offscreen/invisible TO the CSS position. The CSS position is the ground truth; the tween describes the journey to get there. (In sub-compositions loaded via `data-composition-src`, prefer `gsap.fromTo()` — see load-bearing GSAP rules in [references/motion-principles.md](references/motion-principles.md).)
+4. **Add exits with `gsap.to()`** — animate TO offscreen/invisible FROM the CSS position.
+
+### Example
+
+```css
+/* scene-content fills the scene, padding positions content */
+.scene-content {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  padding: 120px 160px;
+  gap: 24px;
+  box-sizing: border-box;
+}
+.title {
+  font-size: 120px;
+}
+.subtitle {
+  font-size: 42px;
+}
+/* Container fills any scene size (1920x1080, 1080x1920, etc).
+   Padding positions content. Flex + gap handles spacing. */
+```
+
+**WRONG — hardcoded dimensions and absolute positioning:**
+
+```css
+.scene-content {
+  position: absolute;
+  top: 200px;
+  left: 160px;
+  width: 1920px;
+  height: 1080px;
+  display: flex; /* ... */
+}
+```
+
+```js
+// Step 3: Animate INTO those positions
+tl.from(".title", { y: 60, opacity: 0, duration: 0.6, ease: "power3.out" }, 0);
+tl.from(".subtitle", { y: 40, opacity: 0, duration: 0.5, ease: "power3.out" }, 0.2);
+tl.from(".logo", { scale: 0.8, opacity: 0, duration: 0.4, ease: "power2.out" }, 0.3);
+
+// Step 4: Animate OUT from those positions
+tl.to(".title", { y: -40, opacity: 0, duration: 0.4, ease: "power2.in" }, 3);
+tl.to(".subtitle", { y: -30, opacity: 0, duration: 0.3, ease: "power2.in" }, 3.1);
+tl.to(".logo", { scale: 0.9, opacity: 0, duration: 0.3, ease: "power2.in" }, 3.2);
+```
+
+### When elements share space across time
+
+If element A exits before element B enters in the same area, both should have correct CSS positions for their respective hero frames. The timeline ordering guarantees they never visually coexist — but if you skip the layout step, you won't catch the case where they accidentally overlap due to a timing error.
+
+### What counts as intentional overlap
+
+Layered effects (glow behind text, shadow elements, background patterns) and z-stacked designs (card stacks, depth layers) are intentional. The layout step is about catching **unintentional** overlap — two headlines landing on top of each other, a stat covering a label, content bleeding off-frame.
+
+## Data Attributes
+
+### All Clips
+
+| Attribute          | Required                          | Values                                                 |
+| ------------------ | --------------------------------- | ------------------------------------------------------ |
+| `id`               | Yes                               | Unique identifier                                      |
+| `data-start`       | Yes                               | Seconds or clip ID reference (`"el-1"`, `"intro + 2"`) |
+| `data-duration`    | Required for img/div/compositions | Seconds. Video/audio defaults to media duration.       |
+| `data-track-index` | Yes                               | Integer. Same-track clips cannot overlap.              |
+| `data-media-start` | No                                | Trim offset into source (seconds)                      |
+| `data-volume`      | No                                | 0-1 (default 1)                                        |
+
+`data-track-index` does **not** affect visual layering — use CSS `z-index`.
+
+### Composition Clips
+
+| Attribute                    | Required | Values                                                            |
+| ---------------------------- | -------- | ----------------------------------------------------------------- |
+| `data-composition-id`        | Yes      | Unique composition ID                                             |
+| `data-start`                 | Yes      | Start time (root composition: use `"0"`)                          |
+| `data-duration`              | Yes      | Takes precedence over GSAP timeline duration                      |
+| `data-width` / `data-height` | Yes      | Pixel dimensions (1920x1080 or 1080x1920)                         |
+| `data-composition-src`       | No       | Path to external HTML file                                        |
+| `data-variable-values`       | No       | JSON object of per-instance variable overrides on a sub-comp host |
+
+On the root `<html>` element:
+
+| Attribute                    | Required | Values                                                                                                                         |
+| ---------------------------- | -------- | ------------------------------------------------------------------------------------------------------------------------------ |
+| `data-composition-variables` | No       | JSON array of declared variables (id/type/label/default) — drives Studio editing UI and provides defaults for `getVariables()` |
+
+## Composition Structure
+
+Sub-compositions loaded via `data-composition-src` use a `<template>` wrapper. **Standalone compositions (the main index.html) do NOT use `<template>`** — they put the `data-composition-id` div directly in `<body>`. Using `<template>` on a standalone file hides all content from the browser and breaks rendering.
+
+Sub-composition structure:
+
+```html
+<template id="my-comp-template">
+  <div data-composition-id="my-comp" data-width="1920" data-height="1080">
+    <!-- content -->
+    <style>
+      [data-composition-id="my-comp"] {
+        /* scoped styles */
+      }
+    </style>
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+      const tl = gsap.timeline({ paused: true });
+      // tweens...
+      window.__timelines["my-comp"] = tl;
+    </script>
+  </div>
+</template>
+```
+
+Load in root: `<div id="el-1" data-composition-id="my-comp" data-composition-src="compositions/my-comp.html" data-start="0" data-duration="10" data-track-index="1"></div>`
+
+## Variables (Parametrized Compositions)
+
+Render the same composition with different content — title, theme color, prices, captions — without editing the source HTML.
+
+**Three-step pattern:**
+
+1. **Declare** variables on the composition's `<html>` root with `data-composition-variables`. Each entry needs `id`, `type` (one of `string`, `number`, `color`, `boolean`, `enum`), `label`, and `default`. Enum entries also need `options: [{value, label}, ...]`.
+2. **Read** the resolved values inside the composition's script with `window.__hyperframes.getVariables()`. Returns the merged result of declared defaults + per-instance overrides + CLI overrides.
+3. **Override** at render time with `npx hyperframes render --variables '{...}'` (top-level) or with `data-variable-values='{...}'` on the host element (per-instance for sub-comps).
+
+```html
+<!doctype html>
+<html
+  data-composition-variables='[
+  {"id":"title","type":"string","label":"Title","default":"Hello"},
+  {"id":"theme","type":"enum","label":"Theme","default":"light","options":[
+    {"value":"light","label":"Light"},
+    {"value":"dark","label":"Dark"}
+  ]}
+]'
+>
+  <body>
+    <div data-composition-id="root" data-width="1920" data-height="1080">
+      <h1 id="hero" class="clip" data-start="0" data-duration="3"></h1>
+      <script>
+        const { title, theme } = window.__hyperframes.getVariables();
+        document.getElementById("hero").textContent = title;
+        document.body.dataset.theme = theme;
+      </script>
+    </div>
+  </body>
+</html>
+```
+
+```bash
+# Dev preview uses declared defaults
+npx hyperframes preview
+
+# Render with overrides
+npx hyperframes render --variables '{"title":"Q4 Report","theme":"dark"}' --output q4.mp4
+
+# Or from a JSON file
+npx hyperframes render --variables-file ./vars.json
+```
+
+**Sub-composition per-instance values:** the same `getVariables()` works inside sub-comps loaded via `data-composition-src`. Each host element passes its own values:
+
+```html
+<div
+  data-composition-id="card-pro"
+  data-composition-src="compositions/card.html"
+  data-variable-values='{"title":"Pro","price":"$29"}'
+></div>
+<div
+  data-composition-id="card-enterprise"
+  data-composition-src="compositions/card.html"
+  data-variable-values='{"title":"Enterprise","price":"Custom"}'
+></div>
+```
+
+The runtime layers each host's `data-variable-values` over the sub-comp's declared defaults on a per-instance basis, so the same source can be embedded multiple times with different content.
+
+**Rules of thumb:**
+
+- Always provide a sensible `default` for every declared variable. Dev preview uses defaults — without them, the composition won't render correctly until `--variables` is provided.
+- Read variables once at the top of the script (`const { title } = ...`), not inside frame loops or event handlers — `getVariables()` allocates a fresh object per call.
+- Use `--strict-variables` in CI to fail fast on undeclared keys or type mismatches.
+- Variable types are validated at render time. `string`, `number`, `boolean`, and `color` (hex string) check `typeof`; `enum` checks the value is in the declared `options`.
+
+## Video and Audio
+
+Video must be `muted playsinline`. Audio is always a separate `<audio>` element:
+
+```html
+<video
+  id="el-v"
+  data-start="0"
+  data-duration="30"
+  data-track-index="0"
+  src="video.mp4"
+  muted
+  playsinline
+></video>
+<audio
+  id="el-a"
+  data-start="0"
+  data-duration="30"
+  data-track-index="2"
+  src="video.mp4"
+  data-volume="1"
+></audio>
+```
+
+## Timeline Contract
+
+- All timelines start `{ paused: true }` — the player controls playback
+- Register every timeline: `window.__timelines["<composition-id>"] = tl`
+- Framework auto-nests sub-timelines — do NOT manually add them
+- Duration comes from `data-duration`, not from GSAP timeline length
+- Never create empty tweens to set duration
+
+## Rules (Non-Negotiable)
+
+**Deterministic:** No `Math.random()`, `Date.now()`, or time-based logic. Use a seeded PRNG if you need pseudo-random values (e.g. mulberry32).
+
+**GSAP:** Only animate visual properties (`opacity`, `x`, `y`, `scale`, `rotation`, `color`, `backgroundColor`, `borderRadius`, transforms). Do NOT animate `visibility`, `display`, or call `video.play()`/`audio.play()`.
+
+**Animation conflicts:** Never animate the same property on the same element from multiple timelines simultaneously.
+
+**No `repeat: -1`:** Infinite-repeat timelines break the capture engine. Calculate the exact repeat count from composition duration: `repeat: Math.ceil(duration / cycleDuration) - 1`.
+
+**Synchronous timeline construction:** Never build timelines inside `async`/`await`, `setTimeout`, or Promises. The capture engine reads `window.__timelines` synchronously after page load. Fonts are embedded by the compiler, so they're available immediately — no need to wait for font loading.
+
+**Never do:**
+
+1. Forget `window.__timelines` registration
+2. Use video for audio — always muted video + separate `<audio>`
+3. Nest video inside a timed div — use a non-timed wrapper
+4. Use `data-layer` (use `data-track-index`) or `data-end` (use `data-duration`)
+5. Animate video element dimensions — animate a wrapper div
+6. Call play/pause/seek on media — framework owns playback
+7. Create a top-level container without `data-composition-id`
+8. Use `repeat: -1` on any timeline or tween — always finite repeats
+9. Build timelines asynchronously (inside `async`, `setTimeout`, `Promise`)
+10. Use `gsap.set()` on clip elements from later scenes — they don't exist in the DOM at page load. Use `tl.set(selector, vars, timePosition)` inside the timeline at or after the clip's `data-start` time instead.
+11. Use `<br>` in content text — forced line breaks don't account for actual rendered font width. Text that wraps naturally + a `<br>` produces an extra unwanted break, causing overlap. Let text wrap via `max-width` instead. Exception: short display titles where each word is deliberately on its own line (e.g., "THE\nIMMORTAL\nGAME" at 130px).
+
+## Scene Transitions (Non-Negotiable)
+
+Every multi-scene composition MUST follow ALL of these rules. Violating any one of them is a broken composition.
+
+1. **ALWAYS use transitions between scenes.** No jump cuts. No exceptions.
+2. **ALWAYS use entrance animations on every scene.** Every element animates IN via `gsap.from()`. No element may appear fully-formed. If a scene has 5 elements, it needs 5 entrance tweens.
+3. **NEVER use exit animations** except on the final scene. This means: NO `gsap.to()` that animates opacity to 0, y offscreen, scale to 0, or any other "out" animation before a transition fires. The transition IS the exit. The outgoing scene's content MUST be fully visible at the moment the transition starts.
+4. **Final scene only:** The last scene may fade elements out (e.g., fade to black). This is the ONLY scene where `gsap.to(..., { opacity: 0 })` is allowed.
+
+**WRONG — exit animation before transition:**
+
+```js
+// BANNED — this empties the scene before the transition can use it
+tl.to("#s1-title", { opacity: 0, y: -40, duration: 0.4 }, 6.5);
+tl.to("#s1-subtitle", { opacity: 0, duration: 0.3 }, 6.7);
+// transition fires on empty frame
+```
+
+**RIGHT — entrance only, transition handles exit:**
+
+```js
+// Scene 1 entrance animations
+tl.from("#s1-title", { y: 50, opacity: 0, duration: 0.7, ease: "power3.out" }, 0.3);
+tl.from("#s1-subtitle", { y: 30, opacity: 0, duration: 0.5, ease: "power2.out" }, 0.6);
+// NO exit tweens — transition at 7.2s handles the scene change
+// Scene 2 entrance animations
+tl.from("#s2-heading", { x: -40, opacity: 0, duration: 0.6, ease: "expo.out" }, 8.0);
+```
+
+## Animation Guardrails
+
+- Offset first animation 0.1-0.3s (not t=0)
+- Vary eases across entrance tweens — use at least 3 different eases per scene
+- Don't repeat an entrance pattern within a scene
+- Avoid full-screen linear gradients on dark backgrounds (H.264 banding — use radial or solid + localized glow)
+- 60px+ headlines, 20px+ body, 16px+ data labels for rendered video
+- `font-variant-numeric: tabular-nums` on number columns
+
+If no `design.md` exists, follow [house-style.md](./house-style.md) for aesthetic defaults.
+
+## Typography and Assets
+
+- **Built-in fonts:** Write the `font-family` you want in CSS — the compiler embeds supported fonts automatically.
+- **Custom fonts:** If design.md names a font that isn't built-in, the user must provide `.woff2` files in a `fonts/` directory. If missing, warn before writing HTML. When files exist, add `@font-face` declarations pointing to the local files.
+- Add `crossorigin="anonymous"` to external media
+- For dynamic text overflow, use `window.__hyperframes.fitTextFontSize(text, { maxWidth, fontFamily, fontWeight })`
+- All files live at the project root alongside `index.html`; sub-compositions use `../`
+
+## Editing Existing Compositions
+
+- **Read actual files, don't guess.** When editing, extending, or creating companion compositions, read the existing source. Don't reconstruct hex codes from memory. Don't guess GSAP easing patterns. The composition IS the spec — extract exact values from it.
+- Match existing fonts, colors, animation patterns from what you read
+- Only change what was requested
+- Preserve timing of unrelated clips
+
+## Output Checklist
+
+**Fast (run immediately, block on results):**
+
+- [ ] `npx hyperframes lint` and `npx hyperframes validate` both pass
+- [ ] Design adherence verified if design.md exists
+
+**Slow (run in parallel while presenting the preview to the user):**
+
+- [ ] `npx hyperframes inspect` passes, or every reported overflow is intentionally marked
+- [ ] Contrast warnings addressed (see Quality Checks below)
+- [ ] Animation choreography verified (see Quality Checks below)
+
+## Quality Checks
+
+### Visual Inspect
+
+`hyperframes inspect` runs the composition in headless Chrome, seeks through the timeline, and maps visual layout issues with timestamps, selectors, bounding boxes, and fix hints. Run it after `lint` and `validate`:
+
+```bash
+npx hyperframes inspect
+npx hyperframes inspect --json
+```
+
+Failures usually mean text is spilling out of a bubble/card, a fixed-size label is clipping dynamic copy, or text has moved off the canvas. Fix by increasing container size or padding, reducing font size or letter spacing, adding a real `max-width` so text wraps inside the container, or using `window.__hyperframes.fitTextFontSize(...)` for dynamic copy.
+
+Use `--samples 15` for dense videos and `--at 1.5,4,7.25` for specific hero frames. Repeated static issues are collapsed by default to avoid flooding agent context. If overflow is intentional for an entrance/exit animation, mark the element or ancestor with `data-layout-allow-overflow`. If a decorative element should never be audited, mark it with `data-layout-ignore`.
+
+`hyperframes layout` is the compatibility alias for the same check.
+
+### Contrast
+
+`hyperframes validate` runs a WCAG contrast audit by default. It seeks to 5 timestamps, screenshots the page, samples background pixels behind every text element, and computes contrast ratios. Failures appear as warnings:
+
+```
+⚠ WCAG AA contrast warnings (3):
+  · .subtitle "secondary text" — 2.67:1 (need 4.5:1, t=5.3s)
+```
+
+If warnings appear:
+
+- On dark backgrounds: brighten the failing color until it clears 4.5:1 (normal text) or 3:1 (large text, 24px+ or 19px+ bold)
+- On light backgrounds: darken it
+- Stay within the palette family — don't invent a new color, adjust the existing one
+- Re-run `hyperframes validate` until clean
+
+Use `--no-contrast` to skip if iterating rapidly and you'll check later.
+
+### Design Adherence
+
+If a `design.md` exists, verify the composition follows it after authoring. Read the HTML and check:
+
+1. **Colors** — every hex value in the composition appears in design.md's palette section (however the user labeled it: Colors, Palette, Theme, etc.). Flag any invented colors.
+2. **Typography** — font families and weights match design.md's type spec. No substitutions.
+3. **Corners** — border-radius values match the declared corner style, if specified.
+4. **Spacing** — padding and gap values fall within the declared density range, if specified.
+5. **Depth** — shadow usage matches the declared depth level, if specified (flat = none, subtle = light, layered = glows).
+6. **Avoidance rules** — if design.md has a section listing things to avoid (commonly "What NOT to Do", "Don'ts", "Anti-patterns", or "Do's and Don'ts"), verify none are present.
+
+Report violations as a checklist. Fix each one before serving.
+
+If no `design.md` exists (house-style-only path), verify:
+
+1. **Palette consistency** — the same bg, fg, and accent colors are used across all scenes. No per-scene color invention.
+2. **No lazy defaults** — check the composition against house-style.md's "Lazy Defaults to Question" list. If any appear, they must be a deliberate choice for the content, not a default.
+
+### Animation Map
+
+After authoring animations, run the animation map to verify choreography:
+
+```bash
+node skills/hyperframes/scripts/animation-map.mjs <composition-dir> \
+  --out <composition-dir>/.hyperframes/anim-map
+```
+
+Outputs a single `animation-map.json` with:
+
+- **Per-tween summaries**: `"#card1 animates opacity+y over 0.50s. moves 23px up. fades in. ends at (120, 200)"`
+- **ASCII timeline**: Gantt chart of all tweens across the composition duration
+- **Stagger detection**: reports actual intervals (`"3 elements stagger at 120ms"`)
+- **Dead zones**: periods over 1s with no animation — intentional hold or missing entrance?
+- **Element lifecycles**: first/last animation time, final visibility
+- **Scene snapshots**: visible element state at 5 key timestamps
+- **Flags**: `offscreen`, `collision`, `invisible`, `paced-fast` (under 0.2s), `paced-slow` (over 2s)
+
+Read the JSON. Scan summaries for anything unexpected. Check every flag — fix or justify. Verify the timeline shows the intended choreography rhythm. Re-run after fixes.
+
+Skip on small edits (fixing a color, adjusting one duration). Run on new compositions and significant animation changes.
+
+---
+
+## References (loaded on demand)
+
+- **[references/captions.md](references/captions.md)** — Captions, subtitles, lyrics, karaoke synced to audio. Tone-adaptive style detection, per-word styling, text overflow prevention, caption exit guarantees, word grouping. Read when adding any text synced to audio timing.
+- **[references/audio-reactive.md](references/audio-reactive.md)** — Audio-reactive animation: map frequency bands and amplitude to GSAP properties. Read when visuals should respond to music, voice, or sound.
+- **[references/css-patterns.md](references/css-patterns.md)** — CSS+GSAP marker highlighting: highlight, circle, burst, scribble, sketchout. Deterministic, fully seekable. Read when adding visual emphasis to text.
+- **[references/video-composition.md](references/video-composition.md)** — Video-medium rules: density, color presence, scale, frame composition, design.md as brand not layout. **Always read** — these override web instincts.
+- **[references/beat-direction.md](references/beat-direction.md)** — Beat planning: concept, mood, choreography verbs, rhythm templates, transition decisions, depth layers. **Always read for multi-scene compositions.**
+- **[references/typography.md](references/typography.md)** — Typography: font pairing, OpenType features, dark-background adjustments, font discovery script. **Always read** — every composition has text.
+- **[references/motion-principles.md](references/motion-principles.md)** — Motion design principles, image motion treatment, load-bearing GSAP rules. **Always read** — every composition has motion.
+- **[references/techniques.md](references/techniques.md)** — 11 visual techniques with code patterns: SVG drawing, Canvas 2D, CSS 3D, kinetic type, Lottie, video compositing, typing effect, variable fonts, MotionPath, velocity transitions, audio-reactive. Read when planning techniques per beat.
+- **[references/narration.md](references/narration.md)** — Pacing, tone, script structure, number pronunciation, opening line patterns. Read when the composition includes voiceover or TTS.
+- **[references/design-picker.md](references/design-picker.md)** — Create a design.md via visual picker. Read when no design.md exists and the user wants to create one.
+- **[visual-styles.md](visual-styles.md)** — 8 named visual styles with hex palettes, GSAP easing signatures, and shader pairings. Read when user names a style or when generating design.md.
+- **[house-style.md](house-style.md)** — Default motion, sizing, and color palettes when no design.md is specified.
+- **[patterns.md](patterns.md)** — PiP, title cards, slide show patterns.
+- **[data-in-motion.md](data-in-motion.md)** — Data, stats, and infographic patterns.
+- **[references/transcript-guide.md](references/transcript-guide.md)** — Caption-side transcript handling: input formats, mandatory quality check, cleaning JS, OpenAI/Groq API fallback, "if no transcript exists" flow. (For the `transcribe` CLI invocation, model selection rules, and the `.en` gotcha, see the `hyperframes-media` skill.)
+- **[references/dynamic-techniques.md](references/dynamic-techniques.md)** — Dynamic caption animation techniques (karaoke, clip-path, slam, scatter, elastic, 3D).
+
+- **[references/transitions.md](references/transitions.md)** — Scene transitions: crossfades, wipes, reveals, shader transitions. Energy/mood selection, CSS vs WebGL guidance. **Always read for multi-scene compositions** — scenes without transitions feel like jump cuts.
+  - [transitions/catalog.md](references/transitions/catalog.md) — Hard rules, scene template, and routing to per-type implementation code.
+  - Shader transitions are in `@hyperframes/shader-transitions` (`packages/shader-transitions/`) — read package source, not skill files.
+
+GSAP patterns and effects are in the `/gsap` skill.
diff --git a/packages/amplify-video-worker/skills/hyperframes/data-in-motion.md b/packages/amplify-video-worker/skills/hyperframes/data-in-motion.md
new file mode 100644
index 000000000..8850e4915
--- /dev/null
+++ b/packages/amplify-video-worker/skills/hyperframes/data-in-motion.md
@@ -0,0 +1,19 @@
+# Data in Motion
+
+Light guidance for data and stats in video compositions. The [house style](./house-style.md) handles aesthetics — this just addresses data-specific pitfalls.
+
+## Visual Continuity
+
+When successive stats belong to the same concept (Q1 → Q2 → Q3 → Q4, or three metrics for the same product), keep them in the same visual space with the same aesthetic. Only the VALUE changes. An aesthetic change should signal a new concept, not just a new number.
+
+## Numbers Need Visual Weight
+
+A number on its own floats in empty space. Pair every metric with a visual element that gives it presence — a proportional fill bar, a background color shift, a shape that represents the value, a progress ring. The visual doesn't need to be a chart — it just needs to fill the frame and make the data feel tangible rather than just text on a background.
+
+## Avoid Web Patterns
+
+- **No pie charts** — hard to compare, looks like PowerPoint
+- **No multi-axis charts** — viewer can't study intersections in a 3-second window
+- **No 6-panel dashboards** — 2-3 related metrics side-by-side is fine, 6+ is a web pattern
+- **No gridlines, tick marks, or legends** — visual noise that adds nothing in motion
+- **No chart library output** — build with GSAP + SVG/CSS, not D3 or Chart.js
diff --git a/packages/amplify-video-worker/skills/hyperframes/house-style.md b/packages/amplify-video-worker/skills/hyperframes/house-style.md
new file mode 100644
index 000000000..892c2ebed
--- /dev/null
+++ b/packages/amplify-video-worker/skills/hyperframes/house-style.md
@@ -0,0 +1,73 @@
+# House Style
+
+Creative direction for compositions when no `design.md` is provided. These are starting points — override anything that doesn't serve the content. When a `design.md` exists, its brand values take precedence; house-style fills gaps.
+
+## Before Writing HTML
+
+1. **Interpret the prompt.** Generate real content. A recipe lists real ingredients. A HUD has real readouts.
+2. **Pick a palette.** Light or dark? Declare bg, fg, accent before writing code.
+3. **Pick typefaces.** Run the font discovery script in [references/typography.md](references/typography.md) — or pick a font you already know that fits the theme. The script broadens your options; it's not the only source.
+
+## Lazy Defaults to Question
+
+These patterns are AI design tells — the first thing every LLM reaches for. If you're about to use one, pause and ask: is this a deliberate choice for THIS content, or am I defaulting?
+
+- Gradient text (`background-clip: text` + gradient)
+- Left-edge accent stripes on cards/callouts
+- Cyan-on-dark / purple-to-blue gradients / neon accents
+- Pure `#000` or `#fff` (tint toward your accent hue instead)
+- Identical card grids (same-size cards repeated)
+- Everything centered with equal weight (lead the eye somewhere)
+- Banned fonts (see [references/typography.md](references/typography.md) for full list)
+
+If the content genuinely calls for one of these — centered layout for a solemn closing, cards for a real product UI mockup, a banned font because it's the perfect thematic match — use it. The goal is intentionality, not avoidance.
+
+## Color
+
+- Match light/dark to content: food, wellness, kids → light. Tech, cinema, finance → dark.
+- One accent hue. Same background across all scenes.
+- Tint neutrals toward your accent (even subtle warmth/coolness beats dead gray).
+- **Contrast:** enforced by `hyperframes validate` (WCAG AA). Text must be readable with decoratives removed.
+- Declare palette up front. Don't invent colors per-element.
+
+## Background Layer
+
+Every scene needs visual depth — persistent decorative elements that stay visible while content animates in. Without these, scenes feel empty during entrance staggering.
+
+Ideas (mix and match, 2-5 per scene):
+
+- Radial glows (accent-tinted, low opacity, breathing scale)
+- Ghost text (theme words at 3-8% opacity, very large, slow drift)
+- Accent lines (hairline rules, subtle pulse)
+- Grain/noise overlay, geometric shapes, grid patterns
+- Thematic decoratives (orbit rings for space, vinyl grooves for music, grid lines for data)
+
+All decoratives should have slow ambient GSAP animation — breathing, drift, pulse. Static decoratives feel dead.
+
+**Decorative count vs motion count.** The "2-5 per scene" count refers to decorative _elements_. If a project's `design.md` says "single ambient motion per scene", it means one looping motion applied to these decoratives (a shared breath/drift/pulse) — not one element total. A scene with 4 decoratives sharing one breathing motion is correct; a scene with 1 decorative is under-dressed.
+
+## Motion
+
+See [references/motion-principles.md](references/motion-principles.md) for full rules. Quick: 0.3–0.6s, vary eases, combine transforms on entrances, overlap entries.
+
+## Typography
+
+See [references/typography.md](references/typography.md) for full rules. Quick: 700-900 headlines / 300-400 body, serif + sans (not two sans), 60px+ headlines / 20px+ body.
+
+## Palettes
+
+Declare one background, one foreground, one accent before writing HTML.
+
+| Category          | Use for                                       | File                                                       |
+| ----------------- | --------------------------------------------- | ---------------------------------------------------------- |
+| Bold / Energetic  | Product launches, social media, announcements | [palettes/bold-energetic.md](palettes/bold-energetic.md)   |
+| Warm / Editorial  | Storytelling, documentaries, case studies     | [palettes/warm-editorial.md](palettes/warm-editorial.md)   |
+| Dark / Premium    | Tech, finance, luxury, cinematic              | [palettes/dark-premium.md](palettes/dark-premium.md)       |
+| Clean / Corporate | Explainers, tutorials, presentations          | [palettes/clean-corporate.md](palettes/clean-corporate.md) |
+| Nature / Earth    | Sustainability, outdoor, organic              | [palettes/nature-earth.md](palettes/nature-earth.md)       |
+| Neon / Electric   | Gaming, tech, nightlife                       | [palettes/neon-electric.md](palettes/neon-electric.md)     |
+| Pastel / Soft     | Fashion, beauty, lifestyle, wellness          | [palettes/pastel-soft.md](palettes/pastel-soft.md)         |
+| Jewel / Rich      | Luxury, events, sophisticated                 | [palettes/jewel-rich.md](palettes/jewel-rich.md)           |
+| Monochrome        | Dramatic, typography-focused                  | [palettes/monochrome.md](palettes/monochrome.md)           |
+
+Or derive from OKLCH — pick a hue, build bg/fg/accent at different lightnesses, tint everything toward that hue.
diff --git a/packages/amplify-video-worker/skills/hyperframes/patterns.md b/packages/amplify-video-worker/skills/hyperframes/patterns.md
new file mode 100644
index 000000000..94121dd6d
--- /dev/null
+++ b/packages/amplify-video-worker/skills/hyperframes/patterns.md
@@ -0,0 +1,191 @@
+# Composition Patterns
+
+## Picture-in-Picture (Video in a Frame)
+
+Animate a wrapper div for position/size. The video fills the wrapper. The wrapper has NO data attributes.
+
+```html
+<div
+  id="pip-frame"
+  style="position:absolute;top:0;left:0;width:1920px;height:1080px;z-index:50;overflow:hidden;"
+>
+  <video
+    id="el-video"
+    data-start="0"
+    data-duration="60"
+    data-track-index="0"
+    src="talking-head.mp4"
+    muted
+    playsinline
+  ></video>
+</div>
+```
+
+```js
+tl.to(
+  "#pip-frame",
+  { top: 700, left: 1360, width: 500, height: 280, borderRadius: 16, duration: 1 },
+  10,
+);
+tl.to("#pip-frame", { left: 40, duration: 0.6 }, 30);
+```
+
+## Text Behind Subject (transparent webm overlay)
+
+Put a headline _behind_ a presenter so their silhouette occludes the text. Requires a transparent cutout produced by `npx hyperframes remove-background presenter.mp4 -o presenter.webm`.
+
+Three layers, plus one critical rule:
+
+```html
+<!-- z=1 base — full opaque mp4 (lobby + presenter), always visible -->
+<video
+  id="cf-base"
+  data-start="0"
+  data-duration="6"
+  data-media-start="0"
+  data-track-index="0"
+  src="presenter.mp4"
+  muted
+  playsinline
+></video>
+
+<!-- z=2 headline — visible the whole time -->
+<h1
+  id="cf-headline"
+  style="position:absolute;top:50%;left:50%;
+     transform:translate(-50%,-50%); z-index:2; font-size:220px; font-weight:900;
+     color:#fff; text-shadow:0 6px 32px rgba(0,0,0,.55); clip-path:inset(0 0 100% 0);"
+>
+  MAKE IT IN HYPERFRAMES
+</h1>
+
+<!-- z=3 cutout — same source, alpha around presenter, hidden until the cut -->
+<!-- WRAPPER has the opacity, NOT the video itself (see rule below). -->
+<div class="cutout-wrap" style="position:absolute;inset:0;z-index:3;opacity:0">
+  <video
+    id="cf-cutout"
+    data-start="0"
+    data-duration="6"
+    data-media-start="0"
+    data-track-index="1"
+    src="presenter.webm"
+    muted
+    playsinline
+  ></video>
+</div>
+```
+
+```js
+const tl = gsap.timeline({ paused: true });
+const CUT = 3.3;
+
+// Reveal headline early
+tl.to("#cf-headline", { clipPath: "inset(0 0 0% 0)", duration: 0.6, ease: "expo.out" }, 0.25);
+
+// At the cut, flip the cutout wrapper visible — the presenter's silhouette
+// punches through the headline.
+tl.set(".cutout-wrap", { opacity: 1 }, CUT);
+
+// Sentinel: extend timeline to the composition's full duration so the
+// renderer doesn't bail past the last meaningful tween.
+tl.set({}, {}, 6);
+
+window.__timelines["cover-flip"] = tl;
+```
+
+**Why a wrapper div, not opacity on the video itself?**
+
+The framework forces `opacity: 1` on any element with `data-start`/`data-duration` while it's "active" — that's how it manages clip lifecycles. A CSS `opacity: 0` on the video element is silently overwritten. Wrap the video in a div with no `data-*` attributes; the wrapper is owned by your CSS/GSAP.
+
+**Why both videos at `data-start="0"`?**
+
+So both decode in sync from t=0. Late-mounting the cutout (`data-start=3.3`) makes Chrome do a seek + decoder warm-up at mount, which can land a frame off the base mp4 — visible as a one-frame jitter at the cut.
+
+**Color match:** `remove-background` defaults to `--quality balanced` (crf 18) which keeps the cutout's RGB nearly identical to the source mp4 — minimal edge halo or color shift when overlaid. Use `--quality best` (crf 12) for hero shots; only drop to `--quality fast` (crf 30) when the cutout sits over a _different_ background and the size matters.
+
+## Title Card with Fade
+
+```html
+<div
+  id="title-card"
+  data-start="0"
+  data-duration="5"
+  data-track-index="5"
+  style="display:flex;align-items:center;justify-content:center;background:#111;z-index:60;"
+>
+  <h1 style="font-size:64px;color:#fff;opacity:0;">My Video Title</h1>
+</div>
+```
+
+```js
+tl.to("#title-card h1", { opacity: 1, duration: 0.6 }, 0.3);
+tl.to("#title-card", { opacity: 0, duration: 0.5 }, 4);
+```
+
+## Slide Show with Section Headers
+
+Use separate elements on the same track, each with its own time range. Slides auto-mount/unmount based on `data-start`/`data-duration`.
+
+```html
+<div class="slide" data-start="0" data-duration="30" data-track-index="3">...</div>
+<div class="slide" data-start="30" data-duration="25" data-track-index="3">...</div>
+<div class="slide" data-start="55" data-duration="20" data-track-index="3">...</div>
+```
+
+## Top-Level Composition Example
+
+```html
+<div
+  id="comp-1"
+  data-composition-id="my-video"
+  data-start="0"
+  data-duration="60"
+  data-width="1920"
+  data-height="1080"
+>
+  <!-- Primitive clips -->
+  <video
+    id="el-1"
+    data-start="0"
+    data-duration="10"
+    data-track-index="0"
+    src="..."
+    muted
+    playsinline
+  ></video>
+  <video
+    id="el-2"
+    data-start="el-1"
+    data-duration="8"
+    data-track-index="0"
+    src="..."
+    muted
+    playsinline
+  ></video>
+  <img id="el-3" data-start="5" data-duration="4" data-track-index="1" src="..." />
+  <audio id="el-4" data-start="0" data-duration="30" data-track-index="2" src="..." />
+
+  <!-- Sub-compositions loaded from files -->
+  <div
+    id="el-5"
+    data-composition-id="intro-anim"
+    data-composition-src="compositions/intro-anim.html"
+    data-start="0"
+    data-track-index="3"
+  ></div>
+
+  <div
+    id="el-6"
+    data-composition-id="captions"
+    data-composition-src="compositions/caption-overlay.html"
+    data-start="0"
+    data-track-index="4"
+  ></div>
+
+  <script>
+    // Just register the timeline — framework auto-nests sub-compositions
+    const tl = gsap.timeline({ paused: true });
+    window.__timelines["my-video"] = tl;
+  </script>
+</div>
+```
diff --git a/packages/amplify-video-worker/skills/hyperframes/visual-styles.md b/packages/amplify-video-worker/skills/hyperframes/visual-styles.md
new file mode 100644
index 000000000..55f618815
--- /dev/null
+++ b/packages/amplify-video-worker/skills/hyperframes/visual-styles.md
@@ -0,0 +1,443 @@
+# Visual Style Library
+
+Named visual identities for HyperFrames videos. Each style is grounded in a real graphic design tradition and expressed as a DESIGN.md-compatible token block. Use them as starters — copy the YAML into your project's `design.md` front matter, then customize.
+
+**How to pick:** Match mood first, content second. Ask: _"What should the viewer FEEL?"_
+
+**How to use:** Copy the style's YAML token block into `design.md` front matter. Add `## Overview`, `## Colors`, `## Typography`, `## Elevation`, `## Components`, `## Do's and Don'ts` prose sections to complete the file.
+
+## Quick Reference
+
+| Style           | Mood                  | Best for                           | Transition shader                 |
+| --------------- | --------------------- | ---------------------------------- | --------------------------------- |
+| Swiss Pulse     | Clinical, precise     | SaaS, data, dev tools, metrics     | Cinematic Zoom or SDF Iris        |
+| Velvet Standard | Premium, timeless     | Luxury, enterprise, keynotes       | Cross-Warp Morph                  |
+| Deconstructed   | Industrial, raw       | Tech launches, security, punk      | Glitch or Whip Pan                |
+| Maximalist Type | Loud, kinetic         | Big announcements, launches        | Ridged Burn                       |
+| Data Drift      | Futuristic, immersive | AI, ML, cutting-edge tech          | Gravitational Lens or Domain Warp |
+| Soft Signal     | Intimate, warm        | Wellness, personal stories, brand  | Thermal Distortion                |
+| Folk Frequency  | Cultural, vivid       | Consumer apps, food, communities   | Swirl Vortex or Ripple Waves      |
+| Shadow Cut      | Dark, cinematic       | Dramatic reveals, security, exposé | Domain Warp                       |
+
+---
+
+## 1. Swiss Pulse — Josef Müller-Brockmann
+
+**Mood:** Clinical, precise | **Best for:** SaaS dashboards, developer tools, APIs, metrics
+
+```yaml
+name: Swiss Pulse
+colors:
+  primary: "#1a1a1a"
+  on-primary: "#ffffff"
+  accent: "#0066FF"
+typography:
+  headline:
+    fontFamily: Helvetica Neue
+    fontSize: 5rem
+    fontWeight: 700
+  label:
+    fontFamily: Inter
+    fontSize: 0.875rem
+    fontWeight: 400
+  stat:
+    fontFamily: Helvetica Neue
+    fontSize: 7rem
+    fontWeight: 700
+rounded:
+  none: 0px
+  sm: 2px
+spacing:
+  sm: 8px
+  md: 16px
+  lg: 32px
+motion:
+  energy: high
+  easing:
+    entry: "expo.out"
+    exit: "power4.in"
+    ambient: "none"
+  duration:
+    entrance: 0.4
+    hold: 1.5
+    transition: 0.6
+  atmosphere:
+    - grid-lines
+    - registration-marks
+  transition: cinematic-zoom
+```
+
+Grid-locked compositions. Every element snaps to an invisible 12-column grid. Numbers dominate the frame at 80–120px. Animated counters count up from 0. Hard cuts, no decorative transitions. Nothing floats.
+
+---
+
+## 2. Velvet Standard — Massimo Vignelli
+
+**Mood:** Premium, timeless | **Best for:** Luxury products, enterprise software, keynotes, investor decks
+
+```yaml
+name: Velvet Standard
+colors:
+  primary: "#0a0a0a"
+  on-primary: "#ffffff"
+  accent: "#1a237e"
+typography:
+  headline:
+    fontFamily: Inter
+    fontSize: 3rem
+    fontWeight: 300
+    letterSpacing: 0.15em
+    textTransform: uppercase
+  body:
+    fontFamily: Inter
+    fontSize: 1rem
+    fontWeight: 300
+    lineHeight: 1.6
+rounded:
+  sm: 0px
+  md: 2px
+spacing:
+  sm: 16px
+  md: 32px
+  lg: 64px
+motion:
+  energy: calm
+  easing:
+    entry: "sine.inOut"
+    exit: "power1.in"
+    ambient: "sine.inOut"
+  duration:
+    entrance: 1.2
+    hold: 3.0
+    transition: 1.5
+  atmosphere:
+    - subtle-grain
+    - hairline-rules
+  transition: cross-warp-morph
+```
+
+Generous negative space. Symmetrical, centered, architectural precision. Thin sans-serif, ALL CAPS, wide letter-spacing. Sequential reveals with long holds. Nothing snaps — everything glides with intention. Luxury takes its time.
+
+---
+
+## 3. Deconstructed — Neville Brody
+
+**Mood:** Industrial, raw | **Best for:** Tech news, developer launches, security products, punk-energy reveals
+
+```yaml
+name: Deconstructed
+colors:
+  primary: "#1a1a1a"
+  on-primary: "#f0f0f0"
+  accent: "#D4501E"
+typography:
+  headline:
+    fontFamily: Space Grotesk
+    fontSize: 4rem
+    fontWeight: 700
+  label:
+    fontFamily: Space Mono
+    fontSize: 0.75rem
+    fontWeight: 700
+    textTransform: uppercase
+rounded:
+  none: 0px
+spacing:
+  sm: 4px
+  md: 12px
+  lg: 24px
+motion:
+  energy: high
+  easing:
+    entry: "back.out(2.5)"
+    exit: "steps(8)"
+    ambient: "elastic.out(1.2, 0.4)"
+  duration:
+    entrance: 0.3
+    hold: 1.0
+    transition: 0.5
+  atmosphere:
+    - scan-lines
+    - glitch-artifacts
+    - grain-overlay
+  transition: glitch
+```
+
+Type at angles, overlapping edges, escaping frames. Bold industrial weight. Gritty textures: scan-line effects, glitch artifacts baked into design. Text SLAMS and SHATTERS. Letters scramble then snap to final position. Intentional irregularity — nothing should feel polished.
+
+---
+
+## 4. Maximalist Type — Paula Scher
+
+**Mood:** Loud, kinetic | **Best for:** Big product launches, milestone announcements, high-energy hype videos
+
+```yaml
+name: Maximalist Type
+colors:
+  primary: "#0a0a0a"
+  on-primary: "#ffffff"
+  accent-red: "#E63946"
+  accent-yellow: "#FFD60A"
+typography:
+  headline:
+    fontFamily: Anton
+    fontSize: 8rem
+    fontWeight: 400
+    textTransform: uppercase
+  subhead:
+    fontFamily: Space Grotesk
+    fontSize: 3rem
+    fontWeight: 700
+rounded:
+  none: 0px
+spacing:
+  sm: 0px
+  md: 8px
+motion:
+  energy: high
+  easing:
+    entry: "expo.out"
+    exit: "back.out(1.8)"
+    ambient: "power3.out"
+  duration:
+    entrance: 0.3
+    hold: 0.8
+    transition: 0.4
+  atmosphere:
+    - type-layers
+    - color-blocks
+  transition: ridged-burn
+```
+
+Text IS the visual. Overlapping type layers at different scales and angles, filling 50–80% of frame. Bold saturated colors — maximum contrast. Everything kinetic: slamming, sliding, scaling. 2–3 second rapid-fire scenes. No static moments. Fast arrivals, hard stops.
+
+---
+
+## 5. Data Drift — Refik Anadol
+
+**Mood:** Futuristic, immersive | **Best for:** AI products, ML platforms, data companies, speculative tech
+
+```yaml
+name: Data Drift
+colors:
+  primary: "#0a0a0a"
+  on-primary: "#e0e0e0"
+  accent-purple: "#7c3aed"
+  accent-cyan: "#06b6d4"
+typography:
+  headline:
+    fontFamily: Inter
+    fontSize: 2.5rem
+    fontWeight: 200
+    letterSpacing: 0.05em
+  body:
+    fontFamily: Inter
+    fontSize: 0.875rem
+    fontWeight: 300
+rounded:
+  sm: 4px
+  md: 12px
+  full: 9999px
+spacing:
+  sm: 16px
+  md: 32px
+  lg: 64px
+motion:
+  energy: moderate
+  easing:
+    entry: "sine.inOut"
+    exit: "power2.out"
+    ambient: "sine.inOut"
+  duration:
+    entrance: 1.0
+    hold: 2.5
+    transition: 1.5
+  atmosphere:
+    - particle-field
+    - light-traces
+    - radial-glow
+  transition: gravitational-lens
+```
+
+Thin futuristic sans-serif — floating, weightless, minimal. Fluid morphing compositions. Extreme scale shifts (micro → macro). Particles coalesce into numbers. Light traces data paths through the frame. Smooth, continuous, organic. Nothing hard.
+
+---
+
+## 6. Soft Signal — Stefan Sagmeister
+
+**Mood:** Intimate, warm | **Best for:** Wellness brands, personal stories, lifestyle products, human-centered apps
+
+```yaml
+name: Soft Signal
+colors:
+  primary: "#FFF8EC"
+  on-primary: "#2a2a2a"
+  accent-amber: "#F5A623"
+  accent-rose: "#C4A3A3"
+  accent-sage: "#8FAF8C"
+typography:
+  headline:
+    fontFamily: Playfair Display
+    fontSize: 3rem
+    fontWeight: 400
+    fontStyle: italic
+  body:
+    fontFamily: Inter
+    fontSize: 1rem
+    fontWeight: 300
+    lineHeight: 1.7
+rounded:
+  sm: 8px
+  md: 16px
+  lg: 24px
+  full: 9999px
+spacing:
+  sm: 12px
+  md: 24px
+  lg: 48px
+motion:
+  energy: calm
+  easing:
+    entry: "sine.inOut"
+    exit: "power1.inOut"
+    ambient: "sine.inOut"
+  duration:
+    entrance: 1.0
+    hold: 3.0
+    transition: 1.5
+  atmosphere:
+    - soft-gradient
+    - warm-grain
+  transition: thermal-distortion
+```
+
+Handwritten-style or humanist serif fonts. Personal, lowercase, delicate. Close-up framing: single element fills the frame. Slow drifts and floats, never snaps. Soft organic motion. Nothing should feel hurried or polished. Intimate, never corporate.
+
+---
+
+## 7. Folk Frequency — Eduardo Terrazas
+
+**Mood:** Cultural, vivid | **Best for:** Consumer apps, food platforms, community products, festive launches
+
+```yaml
+name: Folk Frequency
+colors:
+  primary: "#ffffff"
+  on-primary: "#1a1a1a"
+  accent-pink: "#FF1493"
+  accent-blue: "#0047AB"
+  accent-yellow: "#FFE000"
+  accent-green: "#009B77"
+typography:
+  headline:
+    fontFamily: Fredoka One
+    fontSize: 4rem
+    fontWeight: 400
+  body:
+    fontFamily: Nunito
+    fontSize: 1rem
+    fontWeight: 600
+rounded:
+  sm: 8px
+  md: 16px
+  lg: 32px
+  full: 9999px
+spacing:
+  sm: 8px
+  md: 16px
+  lg: 32px
+motion:
+  energy: high
+  easing:
+    entry: "back.out(1.6)"
+    exit: "elastic.out(1, 0.5)"
+    ambient: "sine.inOut"
+  duration:
+    entrance: 0.5
+    hold: 1.5
+    transition: 0.8
+  atmosphere:
+    - pattern-tiles
+    - confetti-burst
+    - color-blocks
+  transition: swirl-vortex
+```
+
+Bold warm rounded type. Pattern and repetition — folk art rhythm and density. Layered compositions with rich visual texture. Every frame feels handcrafted. Colorful motion: elements bounce, pop, spin into place with joy. Overshoots feel intentional. Celebratory energy.
+
+---
+
+## 8. Shadow Cut — Hans Hillmann
+
+**Mood:** Dark, cinematic | **Best for:** Security products, dramatic reveals, investigative content, intense launches
+
+```yaml
+name: Shadow Cut
+colors:
+  primary: "#0a0a0a"
+  on-primary: "#f0f0f0"
+  surface: "#3a3a3a"
+  accent: "#C1121F"
+typography:
+  headline:
+    fontFamily: Oswald
+    fontSize: 4rem
+    fontWeight: 700
+    textTransform: uppercase
+  body:
+    fontFamily: Inter
+    fontSize: 0.875rem
+    fontWeight: 400
+rounded:
+  none: 0px
+  sm: 2px
+spacing:
+  sm: 8px
+  md: 16px
+  lg: 48px
+motion:
+  energy: moderate
+  easing:
+    entry: "power3.out"
+    exit: "power4.in"
+    ambient: "sine.inOut"
+  duration:
+    entrance: 0.8
+    hold: 2.5
+    transition: 1.2
+  atmosphere:
+    - deep-shadow
+    - vignette
+    - grain-overlay
+  transition: domain-warp
+```
+
+Near-monochrome: deep blacks, cold greys, stark white + one blood accent. Sharp angular text like film noir title cards. Heavy contrast, no softness. Elements emerge from darkness — reveal is the narrative. Slow creeping push-ins, dramatic scale reveals. The pause before the hit matters. Domain Warp dissolves reality before the next scene.
+
+---
+
+## Mood → Style Guide
+
+| If the content feels...            | Use...          |
+| ---------------------------------- | --------------- |
+| Data-driven, analytical, technical | Swiss Pulse     |
+| Premium, enterprise, luxury        | Velvet Standard |
+| Raw, punk, aggressive, rebellious  | Deconstructed   |
+| Hype, loud, high-energy launch     | Maximalist Type |
+| AI, ML, speculative, futuristic    | Data Drift      |
+| Human, warm, personal, wellness    | Soft Signal     |
+| Cultural, fun, consumer, festive   | Folk Frequency  |
+| Dark, dramatic, intense, cinematic | Shadow Cut      |
+
+---
+
+## Creating Custom Styles
+
+These 8 styles are starters — not constraints. Create your own:
+
+1. **Name it** after a designer, art movement, or cultural reference
+2. **Write YAML tokens** — `colors` (2–5 tokens), `typography` (2–3 scales), `rounded`, `spacing`, `motion` (energy + easing + duration + atmosphere + transition)
+3. **Add prose** — one paragraph describing the feel, what to do, what to avoid
+4. **Token references** — use `{colors.accent}`, `{typography.headline}` in component definitions
+
+The pattern: **YAML tokens (what) → prose rationale (why) → components (how they combine).**
diff --git a/packages/amplify-video-worker/src/amplify.ts b/packages/amplify-video-worker/src/amplify.ts
new file mode 100644
index 000000000..8ca15814b
--- /dev/null
+++ b/packages/amplify-video-worker/src/amplify.ts
@@ -0,0 +1,166 @@
+import { GetObjectCommand, PutObjectCommand, S3Client } from "@aws-sdk/client-s3";
+import { DynamoDBClient } from "@aws-sdk/client-dynamodb";
+import { DynamoDBDocumentClient, GetCommand, PutCommand } from "@aws-sdk/lib-dynamodb";
+import type { ArtifactRef, ExplainerVideoJobRecord, UserRecord } from "./types.js";
+
+const region = process.env.AWS_REGION || "us-east-1";
+const tableName = process.env.DYNAMODB_TABLE_NAME || "amplify-dev-users";
+
+const s3 = new S3Client({ region });
+const dynamo = DynamoDBDocumentClient.from(new DynamoDBClient({ region }));
+
+function jobRecordPk(jobId: string) {
+  return `explainerJob#${jobId}`;
+}
+
+function getArtifactUrl(key: string) {
+  return `/api/infographic/${encodeURIComponent(key)}`;
+}
+
+async function readStreamAsString(body: unknown): Promise<string> {
+  if (!body) throw new Error("S3 object body missing");
+  if (
+    typeof body === "object" &&
+    body !== null &&
+    "transformToString" in body &&
+    typeof body.transformToString === "function"
+  ) {
+    return await body.transformToString();
+  }
+
+  const chunks: Buffer[] = [];
+  for await (const chunk of body as AsyncIterable<Uint8Array>) {
+    chunks.push(Buffer.from(chunk));
+  }
+  return Buffer.concat(chunks).toString("utf-8");
+}
+
+export function buildArtifact(key: string, mimeType: string): ArtifactRef {
+  return {
+    key,
+    url: getArtifactUrl(key),
+    mimeType,
+  };
+}
+
+export async function readJsonArtifact<T>(bucket: string, key: string): Promise<T> {
+  const response = await s3.send(
+    new GetObjectCommand({
+      Bucket: bucket,
+      Key: key,
+    }),
+  );
+  const raw = await readStreamAsString(response.Body);
+  return JSON.parse(raw) as T;
+}
+
+export async function uploadJsonArtifact(
+  bucket: string,
+  key: string,
+  payload: unknown,
+): Promise<ArtifactRef> {
+  await s3.send(
+    new PutObjectCommand({
+      Bucket: bucket,
+      Key: key,
+      Body: Buffer.from(JSON.stringify(payload, null, 2)),
+      ContentType: "application/json",
+    }),
+  );
+  return buildArtifact(key, "application/json");
+}
+
+export async function uploadBufferArtifact(
+  bucket: string,
+  key: string,
+  body: Buffer,
+  mimeType: string,
+): Promise<ArtifactRef> {
+  await s3.send(
+    new PutObjectCommand({
+      Bucket: bucket,
+      Key: key,
+      Body: body,
+      ContentType: mimeType,
+    }),
+  );
+  return buildArtifact(key, mimeType);
+}
+
+export async function uploadFileArtifact(
+  bucket: string,
+  key: string,
+  filePath: string,
+  mimeType: string,
+): Promise<ArtifactRef> {
+  const body = await import("node:fs/promises").then((fs) => fs.readFile(filePath));
+  return uploadBufferArtifact(bucket, key, body, mimeType);
+}
+
+export async function getExplainerVideoJob(jobId: string): Promise<ExplainerVideoJobRecord> {
+  const response = await dynamo.send(
+    new GetCommand({
+      TableName: tableName,
+      Key: { userId: jobRecordPk(jobId) },
+    }),
+  );
+
+  if (!response.Item) {
+    throw new Error(`Explainer-video job not found: ${jobId}`);
+  }
+
+  return response.Item as ExplainerVideoJobRecord;
+}
+
+export async function mergeExplainerVideoJob(
+  jobId: string,
+  updates: Partial<
+    Omit<ExplainerVideoJobRecord, "userId" | "itemType" | "ownerUserId" | "jobId" | "createdAt">
+  >,
+): Promise<ExplainerVideoJobRecord> {
+  const existing = await getExplainerVideoJob(jobId);
+  const next: ExplainerVideoJobRecord = {
+    ...existing,
+    ...updates,
+    updatedAt: new Date().toISOString(),
+  };
+
+  await dynamo.send(
+    new PutCommand({
+      TableName: tableName,
+      Item: next,
+    }),
+  );
+
+  return next;
+}
+
+async function getUserWithClient(
+  client: { send: (cmd: any) => Promise<{ Item?: Record<string, unknown> }> },
+  userId: string,
+): Promise<UserRecord> {
+  const response = await client.send(
+    new GetCommand({
+      TableName: tableName,
+      Key: { userId },
+    }),
+  );
+  if (!response.Item) {
+    throw new Error(`User record not found: ${userId}`);
+  }
+  const item = response.Item as Record<string, unknown>;
+  return {
+    userId,
+    aiBaseUrl: (item.aiBaseUrl as string | null | undefined) ?? null,
+    aiApiKey: (item.aiApiKey as string | null | undefined) ?? null,
+    aiModel: (item.aiModel as string | null | undefined) ?? null,
+    elevenLabsApiKey: (item.elevenLabsApiKey as string | null | undefined) ?? null,
+    elevenLabsModelId: (item.elevenLabsModelId as string | null | undefined) ?? null,
+  };
+}
+
+export async function getUser(userId: string): Promise<UserRecord> {
+  return getUserWithClient(dynamo, userId);
+}
+
+export const __testHooks = { getUserWithClient };
diff --git a/packages/amplify-video-worker/src/composition.ts b/packages/amplify-video-worker/src/composition.ts
new file mode 100644
index 000000000..ac1c8e2e5
--- /dev/null
+++ b/packages/amplify-video-worker/src/composition.ts
@@ -0,0 +1,1005 @@
+import { spawn } from "node:child_process";
+import { statSync, readFileSync } from "node:fs";
+import { join as joinPath } from "node:path";
+import { lintHyperframeHtml } from "@hyperframes/core";
+import type {
+  LintFinding,
+  ExplainerSourceArtifact,
+  ExplainerVideoBrief,
+  ExplainerVideoRenderPlan,
+  CompositionAuthoringResult,
+  CompositionAttemptError,
+} from "./types.js";
+import type { ConversationMessage } from "./llm-client.js";
+
+export type ValidationResult = { ok: true } | { ok: false; missing: string[] };
+
+const REQUIRED_MARKERS: Array<{ key: string; pattern: RegExp }> = [
+  { key: "doctype", pattern: /<!doctype\s+html/i },
+  {
+    key: "data-composition-id",
+    pattern: /data-composition-id\s*=\s*["']amplify-explainer["']/i,
+  },
+  { key: "window.__timelines", pattern: /window\.__timelines/ },
+  { key: "gsap.timeline", pattern: /gsap\.timeline\s*\(/ },
+];
+
+export function validateCompositionHtml(html: string): ValidationResult {
+  const missing: string[] = [];
+  for (const marker of REQUIRED_MARKERS) {
+    if (!marker.pattern.test(html)) {
+      missing.push(marker.key);
+    }
+  }
+  return missing.length === 0 ? { ok: true } : { ok: false, missing };
+}
+
+// ── Lint adapter ──────────────────────────────────────────────────────────────
+
+export interface LintResult {
+  errors: LintFinding[];
+  warnings: LintFinding[];
+}
+
+function normalizeFinding(raw: {
+  severity?: string;
+  code?: string;
+  ruleId?: string;
+  message?: string;
+  line?: number | null;
+}): LintFinding {
+  const severity: LintFinding["severity"] =
+    raw.severity === "error" ? "error" : raw.severity === "warning" ? "warning" : "info";
+  return {
+    severity,
+    ruleId: raw.ruleId ?? raw.code ?? "unknown",
+    message: raw.message ?? "",
+    line: raw.line ?? null,
+  };
+}
+
+function readCoreLintFindings(html: string): unknown[] {
+  const raw = lintHyperframeHtml(html, {});
+  if (Array.isArray(raw)) return raw;
+  const wrapped = (raw as { findings?: unknown[] }).findings;
+  return Array.isArray(wrapped) ? wrapped : [];
+}
+
+function normalizeCoreLintFindings(html: string): LintFinding[] {
+  const out: LintFinding[] = [];
+  for (const finding of readCoreLintFindings(html)) {
+    if (typeof finding !== "object" || finding === null) continue;
+    out.push(normalizeFinding(finding as Parameters<typeof normalizeFinding>[0]));
+  }
+  return out;
+}
+
+function partitionBySeverity(findings: LintFinding[]): LintResult {
+  const errors: LintFinding[] = [];
+  const warnings: LintFinding[] = [];
+  for (const finding of findings) {
+    if (finding.severity === "error") errors.push(finding);
+    else if (finding.severity === "warning") warnings.push(finding);
+  }
+  return { errors, warnings };
+}
+
+export async function lintCompositionHtml(html: string): Promise<LintResult> {
+  return partitionBySeverity([...normalizeCoreLintFindings(html), ...lintGsapSelectors(html)]);
+}
+
+// ── GSAP selector lint (bd-n59) ──────────────────────────────────────────────
+//
+// LLM-authored compositions hard-code GSAP selectors inside an inline <script>
+// (e.g. `gsap.from("#scene-hook .kicker", ...)`) but the LLM is free to pick
+// the actual class names inside each scene's content block. When a selector
+// references an id or class that no element actually carries, `gsap.from()`
+// silently no-ops — text appears in its final state from t=0 instead of fading
+// in, so the scene looks broken on render. We catch the mismatch up front so
+// the retry-feedback loop can ask the LLM to fix it before we burn an MP4.
+//
+// Strategy: regex-extract DOM ids + class tokens (excluding script bodies),
+// regex-extract string-literal selectors passed to gsap.from/.to/.fromTo/.set
+// (and the same on chained timelines), then for each compound selector verify
+// every #id and .class token it references exists somewhere in the DOM.
+
+const GSAP_CALL_PATTERN =
+  /(?:^|[^A-Za-z0-9_$])(?:gsap|tl|timeline|master|t)\s*\.\s*(from|to|fromTo|set|add)\s*\(\s*((?:'(?:\\.|[^'\\])*')|(?:"(?:\\.|[^"\\])*")|(?:`(?:\\.|[^`\\])*`))/g;
+const CLASS_ATTR_PATTERN = /\sclass\s*=\s*(?:"([^"]*)"|'([^']*)')/gi;
+const ID_ATTR_PATTERN = /\sid\s*=\s*(?:"([^"]*)"|'([^']*)')/gi;
+const SCRIPT_BLOCK_PATTERN = /<script\b[^>]*>([\s\S]*?)<\/script>/gi;
+
+function stripScripts(html: string): string {
+  return html.replace(SCRIPT_BLOCK_PATTERN, " ");
+}
+
+function matchedAttrValue(match: RegExpMatchArray): string {
+  return (match[1] ?? match[2] ?? "").trim();
+}
+
+function collectDomIds(htmlSansScripts: string): Set<string> {
+  const out = new Set<string>();
+  for (const m of htmlSansScripts.matchAll(ID_ATTR_PATTERN)) {
+    const value = matchedAttrValue(m);
+    if (value) out.add(value);
+  }
+  return out;
+}
+
+function collectDomClasses(htmlSansScripts: string): Set<string> {
+  const out = new Set<string>();
+  for (const m of htmlSansScripts.matchAll(CLASS_ATTR_PATTERN)) {
+    for (const token of matchedAttrValue(m).split(/\s+/)) {
+      if (token) out.add(token);
+    }
+  }
+  return out;
+}
+
+const QUOTE_CHARS = new Set(["'", '"', "`"]);
+
+function unquote(raw: string): string {
+  if (raw.length < 2) return raw;
+  const quote = raw.charAt(0);
+  if (!QUOTE_CHARS.has(quote)) return raw;
+  if (raw.charAt(raw.length - 1) !== quote) return raw;
+  return raw.slice(1, -1);
+}
+
+function lineForIndex(html: string, index: number): number {
+  if (index <= 0) return 1;
+  let count = 1;
+  const stop = Math.min(index, html.length);
+  for (let i = 0; i < stop; i += 1) {
+    if (html.charCodeAt(i) === 10) count += 1;
+  }
+  return count;
+}
+
+interface CompoundTokens {
+  ids: string[];
+  classes: string[];
+}
+
+const ID_TOKEN_PATTERN = /#[A-Za-z_][\w-]*/g;
+const CLASS_TOKEN_PATTERN = /\.[A-Za-z_][\w-]*/g;
+const PSEUDO_PATTERN = /::?[A-Za-z-]/;
+const ATTR_SELECTOR_PATTERN = /\[[^\]]*\]/g;
+
+function collectMatchesAfter(input: string, pattern: RegExp, skipChars: number): string[] {
+  const found = input.match(pattern);
+  if (!found) return [];
+  return found.map((m) => m.slice(skipChars));
+}
+
+function stripPseudoAndAttr(part: string): string {
+  // Strip pseudo-classes/elements (`:hover`, `::before`) and attribute
+  // selectors (`[data-foo="bar"]`) before we look for id/class tokens.
+  const noPseudo = part.split(PSEUDO_PATTERN)[0] ?? part;
+  return noPseudo.replace(ATTR_SELECTOR_PATTERN, "");
+}
+
+function extractTokensFromCompound(compound: string): CompoundTokens {
+  // Compound selectors are space-separated descendant chains; each chain
+  // element can be tag#id.class.class, .class, #id, *, etc. We only care
+  // about #id and .class tokens — combinators (`>`, `+`, `~`, `*`) and
+  // attribute-only selectors are fine and left untouched.
+  const parts = compound.trim().split(/\s+/).filter(Boolean);
+  const ids: string[] = [];
+  const classes: string[] = [];
+  for (const part of parts) {
+    const cleaned = stripPseudoAndAttr(part);
+    ids.push(...collectMatchesAfter(cleaned, ID_TOKEN_PATTERN, 1));
+    classes.push(...collectMatchesAfter(cleaned, CLASS_TOKEN_PATTERN, 1));
+  }
+  return { ids, classes };
+}
+
+function findMissingTokens(
+  compound: string,
+  knownIds: Set<string>,
+  knownClasses: Set<string>,
+): { missingIds: string[]; missingClasses: string[] } | null {
+  const { ids, classes } = extractTokensFromCompound(compound);
+  const missingIds = ids.filter((id) => !knownIds.has(id));
+  const missingClasses = classes.filter((cls) => !knownClasses.has(cls));
+  if (missingIds.length === 0 && missingClasses.length === 0) return null;
+  return { missingIds, missingClasses };
+}
+
+function formatMissingTokens(missingIds: string[], missingClasses: string[]): string {
+  const parts: string[] = [];
+  if (missingIds.length > 0)
+    parts.push(`missing id(s): ${missingIds.map((s) => `#${s}`).join(", ")}`);
+  if (missingClasses.length > 0)
+    parts.push(`missing class(es): ${missingClasses.map((s) => `.${s}`).join(", ")}`);
+  return parts.join("; ");
+}
+
+function makeGsapSelectorFinding(
+  method: string,
+  compound: string,
+  detail: string,
+  line: number,
+): LintFinding {
+  return {
+    severity: "error",
+    ruleId: "gsap-selector-missing",
+    message: `gsap.${method}("${compound}") references DOM tokens that no element carries — ${detail}. The animation will silently no-op (text appears static from t=0). Either add the tokens to the scene markup or change the selector to match what your DOM actually emits.`,
+    line,
+  };
+}
+
+function isStaticallyResolvableSelector(selector: string): boolean {
+  // Template literals with `${...}` can't be resolved at lint time.
+  return selector.length > 0 && !selector.includes("${");
+}
+
+interface GsapCallSite {
+  method: string;
+  selector: string;
+  line: number;
+}
+
+function checkCompound(
+  compound: string,
+  call: GsapCallSite,
+  knownIds: Set<string>,
+  knownClasses: Set<string>,
+): LintFinding | null {
+  const missing = findMissingTokens(compound, knownIds, knownClasses);
+  if (!missing) return null;
+  const detail = formatMissingTokens(missing.missingIds, missing.missingClasses);
+  return makeGsapSelectorFinding(call.method, compound, detail, call.line);
+}
+
+function shouldVisitCompound(compound: string, call: GsapCallSite, seen: Set<string>): boolean {
+  if (!compound) return false;
+  const dedupeKey = `${call.line}::${call.method}::${compound}`;
+  if (seen.has(dedupeKey)) return false;
+  seen.add(dedupeKey);
+  return true;
+}
+
+function lintGsapCallSite(
+  call: GsapCallSite,
+  knownIds: Set<string>,
+  knownClasses: Set<string>,
+  seen: Set<string>,
+): LintFinding[] {
+  const findings: LintFinding[] = [];
+  for (const compoundRaw of call.selector.split(",")) {
+    const compound = compoundRaw.trim();
+    if (!shouldVisitCompound(compound, call, seen)) continue;
+    const finding = checkCompound(compound, call, knownIds, knownClasses);
+    if (finding) findings.push(finding);
+  }
+  return findings;
+}
+
+// fallow-ignore-next-line complexity
+function gsapMatchToSite(html: string, match: RegExpMatchArray): GsapCallSite | null {
+  const selector = unquote(match[2] ?? "");
+  if (!isStaticallyResolvableSelector(selector)) return null;
+  return {
+    method: match[1] ?? "",
+    selector,
+    line: lineForIndex(html, match.index ?? 0),
+  };
+}
+
+function collectGsapCallSites(html: string): GsapCallSite[] {
+  const sites: GsapCallSite[] = [];
+  for (const match of html.matchAll(GSAP_CALL_PATTERN)) {
+    const site = gsapMatchToSite(html, match);
+    if (site) sites.push(site);
+  }
+  return sites;
+}
+
+export function lintGsapSelectors(html: string): LintFinding[] {
+  if (!/gsap\s*\./.test(html)) return [];
+  const htmlSansScripts = stripScripts(html);
+  const knownIds = collectDomIds(htmlSansScripts);
+  const knownClasses = collectDomClasses(htmlSansScripts);
+  const seen = new Set<string>();
+  const findings: LintFinding[] = [];
+  for (const call of collectGsapCallSites(html)) {
+    findings.push(...lintGsapCallSite(call, knownIds, knownClasses, seen));
+  }
+  return findings;
+}
+
+export function formatLintForFeedback(result: LintResult, limit = 4000): string {
+  const lines: string[] = [];
+  for (const f of result.errors) {
+    const linePart = f.line != null ? ` (line ${f.line})` : "";
+    lines.push(`ERROR ${f.ruleId}${linePart}: ${f.message}`);
+  }
+  for (const f of result.warnings) {
+    const linePart = f.line != null ? ` (line ${f.line})` : "";
+    lines.push(`WARN ${f.ruleId}${linePart}: ${f.message}`);
+  }
+  return lines.join("\n").slice(0, limit);
+}
+
+// ── Duration extension for LLM-authored compositions ─────────────────────────
+
+export interface DurationModification {
+  target: "root" | "narration-track" | "last-scene";
+  from: number;
+  to: number;
+}
+
+export interface ExtendCompositionDurationResult {
+  html: string;
+  extended: boolean;
+  originalRootDurationSeconds: number;
+  newRootDurationSeconds: number;
+  modifications: DurationModification[];
+}
+
+const ROOT_TAG_PATTERN =
+  /<([a-zA-Z][a-zA-Z0-9-]*)([^>]*?data-composition-id\s*=\s*["']amplify-explainer["'][^>]*?)>/i;
+const NARRATION_TAG_PATTERN =
+  /<([a-zA-Z][a-zA-Z0-9-]*)([^>]*?id\s*=\s*["']narration-track["'][^>]*?)>/i;
+const DATA_DURATION_ATTR = /data-duration\s*=\s*["']([0-9]*\.?[0-9]+)["']/i;
+const ANY_TAG_PATTERN_GLOBAL = /<([a-zA-Z][a-zA-Z0-9-]*)\s+([^>]*?)>/gs;
+
+function readAttr(attrs: string, name: string): string | null {
+  const escaped = name.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+  const re = new RegExp(`${escaped}\\s*=\\s*["']([^"']*)["']`, "i");
+  const m = attrs.match(re);
+  return m ? (m[1] ?? null) : null;
+}
+
+function rewriteDurationInTag(tag: string, newDuration: number): string {
+  return tag.replace(DATA_DURATION_ATTR, `data-duration="${newDuration}"`);
+}
+
+/**
+ * Rewrite `data-duration` attributes in an LLM-authored composition when the
+ * actual narration duration exceeds the LLM-baked target. Updates the root
+ * composition element, the narration audio track, and the last scene clip so
+ * the rendered timeline covers the full voiceover. No-op when actual <= root.
+ */
+export function extendCompositionDuration(
+  html: string,
+  actualDurationSeconds: number,
+): ExtendCompositionDurationResult {
+  const noop: ExtendCompositionDurationResult = {
+    html,
+    extended: false,
+    originalRootDurationSeconds: 0,
+    newRootDurationSeconds: 0,
+    modifications: [],
+  };
+
+  if (!Number.isFinite(actualDurationSeconds) || actualDurationSeconds <= 0) {
+    return noop;
+  }
+
+  const rootMatch = html.match(ROOT_TAG_PATTERN);
+  if (!rootMatch || rootMatch.index === undefined) return noop;
+
+  const rootTag = rootMatch[0];
+  const rootDurationStr = readAttr(rootTag, "data-duration");
+  if (rootDurationStr === null) return noop;
+  const originalRootDuration = Number.parseFloat(rootDurationStr);
+  if (!Number.isFinite(originalRootDuration)) return noop;
+
+  noop.originalRootDurationSeconds = originalRootDuration;
+  noop.newRootDurationSeconds = originalRootDuration;
+
+  // Only extend — never shrink.
+  if (actualDurationSeconds <= originalRootDuration + 0.01) {
+    return noop;
+  }
+
+  const modifications: DurationModification[] = [];
+  type Replacement = { start: number; end: number; text: string };
+  const replacements: Replacement[] = [];
+
+  // 1. Root.
+  const newRootTag = rewriteDurationInTag(rootTag, actualDurationSeconds);
+  replacements.push({
+    start: rootMatch.index,
+    end: rootMatch.index + rootTag.length,
+    text: newRootTag,
+  });
+  modifications.push({
+    target: "root",
+    from: originalRootDuration,
+    to: actualDurationSeconds,
+  });
+
+  // 2. Narration audio track.
+  const narrationMatch = html.match(NARRATION_TAG_PATTERN);
+  if (narrationMatch && narrationMatch.index !== undefined) {
+    const narrationTag = narrationMatch[0];
+    const narrationDurStr = readAttr(narrationTag, "data-duration");
+    const originalNarrationDuration =
+      narrationDurStr !== null ? Number.parseFloat(narrationDurStr) : 0;
+    const newNarrationTag = rewriteDurationInTag(narrationTag, actualDurationSeconds);
+    if (newNarrationTag !== narrationTag) {
+      replacements.push({
+        start: narrationMatch.index,
+        end: narrationMatch.index + narrationTag.length,
+        text: newNarrationTag,
+      });
+      modifications.push({
+        target: "narration-track",
+        from: originalNarrationDuration,
+        to: actualDurationSeconds,
+      });
+    }
+  }
+
+  // 3. Last scene clip — the element (excluding root and narration track)
+  //    whose data-start + data-duration is largest. Extend that clip so its
+  //    end matches the new root duration; the final frame stays on-screen
+  //    while audio finishes instead of going blank.
+  let lastSceneIndex = -1;
+  let lastSceneTag = "";
+  let lastSceneEnd = -1;
+  let lastSceneStart = 0;
+  let lastSceneDuration = 0;
+  for (const tagMatch of html.matchAll(ANY_TAG_PATTERN_GLOBAL)) {
+    if (tagMatch.index === undefined) continue;
+    const fullTag = tagMatch[0];
+    const attrs = tagMatch[2];
+    if (attrs === undefined) continue;
+    if (/data-composition-id\s*=\s*["']amplify-explainer["']/i.test(attrs)) continue;
+    if (/id\s*=\s*["']narration-track["']/i.test(attrs)) continue;
+    const startStr = readAttr(attrs, "data-start");
+    const durStr = readAttr(attrs, "data-duration");
+    if (startStr === null || durStr === null) continue;
+    const start = Number.parseFloat(startStr);
+    const dur = Number.parseFloat(durStr);
+    if (!Number.isFinite(start) || !Number.isFinite(dur)) continue;
+    const end = start + dur;
+    if (end > lastSceneEnd) {
+      lastSceneEnd = end;
+      lastSceneIndex = tagMatch.index;
+      lastSceneTag = fullTag;
+      lastSceneStart = start;
+      lastSceneDuration = dur;
+    }
+  }
+
+  if (lastSceneIndex >= 0 && lastSceneEnd + 0.01 < actualDurationSeconds) {
+    const newSceneDuration = Math.max(0, actualDurationSeconds - lastSceneStart);
+    const newSceneTag = rewriteDurationInTag(lastSceneTag, newSceneDuration);
+    if (newSceneTag !== lastSceneTag) {
+      replacements.push({
+        start: lastSceneIndex,
+        end: lastSceneIndex + lastSceneTag.length,
+        text: newSceneTag,
+      });
+      modifications.push({
+        target: "last-scene",
+        from: lastSceneDuration,
+        to: newSceneDuration,
+      });
+    }
+  }
+
+  // Apply replacements in reverse so earlier indices stay valid.
+  replacements.sort((a, b) => b.start - a.start);
+  let newHtml = html;
+  for (const r of replacements) {
+    newHtml = newHtml.slice(0, r.start) + r.text + newHtml.slice(r.end);
+  }
+
+  return {
+    html: newHtml,
+    extended: true,
+    originalRootDurationSeconds: originalRootDuration,
+    newRootDurationSeconds: actualDurationSeconds,
+    modifications,
+  };
+}
+
+// ── Post-render sanity check ──────────────────────────────────────────────────
+
+export type SanityResult = { ok: true } | { ok: false; reason: string };
+
+export type SanityCheckDeps = {
+  probeDuration: (filePath: string) => Promise<number>;
+};
+
+export function probeDurationWithFfprobe(filePath: string): Promise<number> {
+  return new Promise((resolve, reject) => {
+    const proc = spawn("ffprobe", [
+      "-v",
+      "error",
+      "-show_entries",
+      "format=duration",
+      "-of",
+      "default=noprint_wrappers=1:nokey=1",
+      filePath,
+    ]);
+    let stdout = "";
+    let stderr = "";
+    proc.stdout.on("data", (chunk) => {
+      stdout += chunk.toString();
+    });
+    proc.stderr.on("data", (chunk) => {
+      stderr += chunk.toString();
+    });
+    proc.on("close", (code) => {
+      if (code !== 0) {
+        reject(new Error(`ffprobe failed (${code}): ${stderr.slice(0, 500)}`));
+        return;
+      }
+      const duration = Number.parseFloat(stdout.trim());
+      if (!Number.isFinite(duration)) {
+        reject(new Error(`ffprobe returned non-numeric duration: ${stdout}`));
+        return;
+      }
+      resolve(duration);
+    });
+  });
+}
+
+const MIN_SANITY_BYTES = 50_000;
+
+export async function postRenderSanityCheck(
+  filePath: string,
+  targetDurationSeconds: number,
+  deps: SanityCheckDeps = { probeDuration: probeDurationWithFfprobe },
+): Promise<SanityResult> {
+  const stat = statSync(filePath);
+  if (stat.size < MIN_SANITY_BYTES) {
+    return {
+      ok: false,
+      reason: `Rendered MP4 size ${stat.size} bytes is below the ${MIN_SANITY_BYTES}-byte sanity threshold. The composition probably rendered blank.`,
+    };
+  }
+
+  const actualDuration = await deps.probeDuration(filePath);
+  const lower = targetDurationSeconds * 0.5;
+  const upper = targetDurationSeconds * 1.5;
+  if (actualDuration < lower || actualDuration > upper) {
+    return {
+      ok: false,
+      reason: `Rendered MP4 duration ${actualDuration.toFixed(2)}s is more than 50% off the target ${targetDurationSeconds}s. The timeline's data-duration likely does not match the GSAP master timeline length.`,
+    };
+  }
+  return { ok: true };
+}
+
+// ── Prompt assembly ───────────────────────────────────────────────────────────
+
+export interface SkillBundle {
+  hyperframesSkill: string;
+  houseStyle: string;
+  patterns: string;
+  visualStyles: string;
+  dataInMotion: string;
+  gsapSkill: string;
+  amplifyConstraints: string;
+}
+
+export interface RetryFeedback {
+  previousIndexHtml: string;
+  errorText: string;
+}
+
+export interface BuildAuthoringMessagesArgs {
+  brief: ExplainerVideoBrief;
+  plan: ExplainerVideoRenderPlan;
+  source: ExplainerSourceArtifact;
+  skillBundle: SkillBundle;
+  retryFeedback: RetryFeedback | null;
+  /**
+   * When set, the narration text + per-scene start times have already been
+   * decided (typically by an earlier narration-only LLM call followed by TTS).
+   * The HTML-authoring call must illustrate this exact narration rather than
+   * generating new copy. Total audio duration is the source of truth for
+   * timeline length.
+   */
+  predeterminedNarration?: NarrationPlan | null;
+}
+
+export interface NarrationPlanScene {
+  sceneId: string;
+  startSeconds: number;
+  narrationText: string;
+}
+
+export interface NarrationPlan {
+  scenes: NarrationPlanScene[];
+  audioDurationSeconds: number;
+}
+
+function buildSystemContent(bundle: SkillBundle): string {
+  return [
+    "# Hyperframes Authoring Skill",
+    bundle.hyperframesSkill,
+    "# House Style",
+    bundle.houseStyle,
+    "# Composition Patterns",
+    bundle.patterns,
+    "# Visual Styles",
+    bundle.visualStyles,
+    "# Data in Motion",
+    bundle.dataInMotion,
+    "# GSAP Reference",
+    bundle.gsapSkill,
+    "# Amplify constraints (non-negotiable)",
+    bundle.amplifyConstraints,
+  ].join("\n\n---\n\n");
+}
+
+const BOILERPLATE_PATTERNS: RegExp[] = [
+  /^thanks for reading/i,
+  /^discussion about this post/i,
+  /^install:/i,
+  /^start your substack/i,
+  /privacy ∙ terms/i,
+  /this site requires javascript/i,
+  /^get the app$/i,
+  /^substack is the home/i,
+];
+
+function sanitizeParagraphs(source: ExplainerSourceArtifact): string {
+  const seeds = [...source.article.paragraphs, ...source.article.text.split(/\n+/)];
+  const seen = new Set<string>();
+  return seeds
+    .map((line) => line.replace(/\s+/g, " ").trim())
+    .filter((line) => line.length > 40)
+    .filter((line) => !BOILERPLATE_PATTERNS.some((pattern) => pattern.test(line)))
+    .filter((line) => {
+      const key = line.toLowerCase();
+      if (seen.has(key)) return false;
+      seen.add(key);
+      return true;
+    })
+    .join("\n\n");
+}
+
+export function dimensionsForAspect(aspect: "16:9" | "1:1" | "9:16"): {
+  width: number;
+  height: number;
+} {
+  if (aspect === "1:1") return { width: 1080, height: 1080 };
+  if (aspect === "9:16") return { width: 1080, height: 1920 };
+  return { width: 1920, height: 1080 };
+}
+
+const AUTHOR_REFERENCE_INSTRUCTION: Record<
+  NonNullable<ExplainerVideoBrief["interview"]["authorReferenceStyle"]>,
+  string
+> = {
+  first_name:
+    "Author reference style: refer to the author by FIRST NAME throughout (casual, conversational tone).",
+  formal_third:
+    'Author reference style: refer to the author formally in the third person (e.g., "the author argues…"). Avoid first names.',
+  full_attribution:
+    "Author reference style: use the author's full name on first mention, then first or last name as natural thereafter.",
+};
+
+const ASPECT_SAFE_AREA: Record<"16:9" | "1:1" | "9:16", string> = {
+  "16:9":
+    "Aspect safe areas: hold focal content within the central 92% of the frame; captions sit in the lower third.",
+  "1:1":
+    "Aspect safe areas: SQUARE 1080×1080 — hold focal content in the central 80% of the frame; captions sit in the bottom 20%, away from edges. Avoid layouts that assume landscape width.",
+  "9:16":
+    "Aspect safe areas: PORTRAIT 1080×1920 — vertical stack layout; captions sit in the lower 25%; avoid landscape-only constructs.",
+};
+
+function formatPredeterminedNarration(plan: NarrationPlan): string {
+  const header = [
+    "PRE-DETERMINED NARRATION (audio is already synthesized — your HTML must illustrate this exact content).",
+    `Total audio duration: ${plan.audioDurationSeconds.toFixed(2)}s — your composition's data-duration on the root, the narration audio track, and the SUM of scene clip durations MUST cover this full duration.`,
+    "Scene-by-scene narration (use these sceneIds and startSeconds as the timing skeleton — your visual scenes should mount/unmount around these boundaries):",
+  ];
+  const items = plan.scenes.map(
+    (s) =>
+      `  • sceneId="${s.sceneId}" start=${s.startSeconds.toFixed(2)}s — ${s.narrationText.replace(/\s+/g, " ").trim()}`,
+  );
+  const footer = [
+    "Do NOT rewrite the narration. Echo it back verbatim in the response's narration array (same sceneId/startSeconds/narrationText).",
+    "Design your final scene to hold its visible content until the audio ends — never let the canvas go blank before the timeline ends.",
+  ];
+  return [...header, ...items, ...footer].join("\n");
+}
+
+function buildSourceBodyBlock(
+  source: ExplainerSourceArtifact,
+  predeterminedNarration: NarrationPlan | null | undefined,
+): string {
+  if (predeterminedNarration) {
+    return `${formatPredeterminedNarration(predeterminedNarration)}\n`;
+  }
+  const cleaned = sanitizeParagraphs(source);
+  const body =
+    cleaned || "(article body was empty after sanitization — work from title/subtitle/description)";
+  return `Article body (use as the source of truth — do not invent claims):\n${body}`;
+}
+
+function buildInitialUserContent(args: BuildAuthoringMessagesArgs): string {
+  const { brief, plan, source, predeterminedNarration } = args;
+  const article = brief.article;
+  const dims = dimensionsForAspect(plan.aspectRatio);
+  const authorRefInstruction = brief.interview?.authorReferenceStyle
+    ? AUTHOR_REFERENCE_INSTRUCTION[brief.interview.authorReferenceStyle]
+    : null;
+  const effectiveDuration = predeterminedNarration
+    ? predeterminedNarration.audioDurationSeconds
+    : plan.targetDurationSeconds;
+  const durationSuffix = predeterminedNarration ? " (locked to actual narration audio length)" : "";
+
+  const lines: Array<string | false | null | undefined> = [
+    "Author a complete Hyperframes composition for the article below.",
+    "",
+    `Target duration: ${effectiveDuration.toFixed(2)}s${durationSuffix}`,
+    `Aspect ratio: ${plan.aspectRatio} (${dims.width}×${dims.height})`,
+    ASPECT_SAFE_AREA[plan.aspectRatio],
+    `Voice: ${plan.voice.enabled ? `enabled, style ${plan.voice.style ?? "documentary"}` : "disabled"}`,
+    `Captions: ${plan.captions.enabled ? "enabled" : "disabled"}`,
+    brief.interview?.goal && `Goal: ${brief.interview.goal}`,
+    brief.interview?.audience && `Audience: ${brief.interview.audience}`,
+    brief.interview?.narrativeStyle && `Narrative style: ${brief.interview.narrativeStyle}`,
+    authorRefInstruction,
+    brief.interview?.textMode && `Text mode: ${brief.interview.textMode}`,
+    brief.interview?.visualMode && `Visual mode: ${brief.interview.visualMode}`,
+    `CTA: ${plan.cta.label}${plan.cta.url ? ` (${plan.cta.url})` : ""}`,
+    "",
+    `Article title: ${article.title}`,
+    article.subtitle && `Article subtitle: ${article.subtitle}`,
+    article.description && `Article description: ${article.description}`,
+    article.publication?.name && `Publication: ${article.publication.name}`,
+    article.primaryAuthor?.name && `Author: ${article.primaryAuthor.name}`,
+    article.primaryAuthor?.bio && `Author bio: ${article.primaryAuthor.bio}`,
+    article.coverImage && `Cover image URL: ${article.coverImage}`,
+    article.url && `Article URL: ${article.url}`,
+    article.bookletLink?.shortUrl && `Booklet URL: ${article.bookletLink.shortUrl}`,
+    "",
+    buildSourceBodyBlock(source, predeterminedNarration),
+    "",
+    "Return JSON via the structured-output schema. The indexHtml field is the complete <!doctype html> document. The narration array carries per-scene narration text (omit/empty when voice is disabled).",
+  ];
+
+  return lines.filter((entry): entry is string => Boolean(entry)).join("\n");
+}
+
+function buildRetryUserContent(feedback: RetryFeedback): string {
+  return [
+    "Your previous composition failed validation. Here are the errors:",
+    "",
+    feedback.errorText.slice(0, 4000),
+    "",
+    "Return a new, complete indexHtml that fixes these issues. Keep what was working; change only what needs to change. Do not return a diff.",
+  ].join("\n");
+}
+
+export function buildAuthoringMessages(args: BuildAuthoringMessagesArgs): ConversationMessage[] {
+  const messages: ConversationMessage[] = [
+    { role: "system", content: buildSystemContent(args.skillBundle) },
+    { role: "user", content: buildInitialUserContent(args) },
+  ];
+
+  if (args.retryFeedback) {
+    messages.push({
+      role: "assistant",
+      content: args.retryFeedback.previousIndexHtml,
+    });
+    messages.push({
+      role: "user",
+      content: buildRetryUserContent(args.retryFeedback),
+    });
+  }
+
+  return messages;
+}
+
+// ── Narration-only authoring (used to pre-decide what gets TTS'd) ────────────
+
+export interface BuildNarrationMessagesArgs {
+  brief: ExplainerVideoBrief;
+  plan: ExplainerVideoRenderPlan;
+  source: ExplainerSourceArtifact;
+  skillBundle: SkillBundle;
+}
+
+export const NARRATION_JSON_SCHEMA = {
+  type: "object",
+  additionalProperties: false,
+  required: ["narration", "notes"],
+  properties: {
+    narration: {
+      type: "array",
+      items: {
+        type: "object",
+        additionalProperties: false,
+        required: ["sceneId", "startSeconds", "narrationText"],
+        properties: {
+          sceneId: { type: "string" },
+          startSeconds: { type: "number" },
+          narrationText: { type: "string" },
+        },
+      },
+    },
+    notes: { type: ["string", "null"] },
+  },
+} as const;
+
+function buildNarrationOnlySystemContent(bundle: SkillBundle): string {
+  return [
+    "# Amplify explainer narration writer",
+    "You are writing only the spoken narration for an explainer video — no HTML, no GSAP, no layout. The narration will be sent to ElevenLabs TTS and the resulting audio length will determine the video's exact runtime, so concise, intentional pacing matters.",
+    "",
+    "Speak in the voice style requested by the brief. Honor the author-reference style. Use the article body as the source of truth — do not invent claims.",
+    "",
+    "Pacing: ElevenLabs speaks at roughly 2.3 words per second for documentary/calm styles and 2.6 wps for energetic. Aim for narration whose word count, divided by that rate, lands within ±10% of the target duration.",
+    "",
+    "Plan 4–7 scenes that cover hook → context → insight(s) → close. Each scene's startSeconds should be your honest estimate of when that scene's narration begins given the pacing above. The HTML compositor will use your scene IDs and timing as the visual skeleton.",
+    "",
+    "# Amplify constraints (relevant subset)",
+    bundle.amplifyConstraints,
+  ].join("\n\n");
+}
+
+function buildNarrationOnlyUserContent(args: BuildNarrationMessagesArgs): string {
+  const { brief, plan, source } = args;
+  const article = brief.article;
+  const cleaned = sanitizeParagraphs(source);
+  const authorRefInstruction = brief.interview?.authorReferenceStyle
+    ? AUTHOR_REFERENCE_INSTRUCTION[brief.interview.authorReferenceStyle]
+    : null;
+  const lines: Array<string | false | null | undefined> = [
+    "Write the narration for an explainer video about the article below.",
+    "",
+    `Target duration: ${plan.targetDurationSeconds}s (the audio you specify will determine the actual runtime).`,
+    `Voice: ${plan.voice.enabled ? `enabled, style ${plan.voice.style ?? "documentary"}` : "disabled"}`,
+    brief.interview?.goal && `Goal: ${brief.interview.goal}`,
+    brief.interview?.audience && `Audience: ${brief.interview.audience}`,
+    brief.interview?.narrativeStyle && `Narrative style: ${brief.interview.narrativeStyle}`,
+    authorRefInstruction,
+    `CTA: ${plan.cta.label}${plan.cta.url ? ` (${plan.cta.url})` : ""}`,
+    "",
+    `Article title: ${article.title}`,
+    article.subtitle && `Article subtitle: ${article.subtitle}`,
+    article.primaryAuthor?.name && `Author: ${article.primaryAuthor.name}`,
+    article.primaryAuthor?.bio && `Author bio: ${article.primaryAuthor.bio}`,
+    article.url && `Article URL: ${article.url}`,
+    "",
+    "Article body:",
+    cleaned || "(article body was empty after sanitization — work from title/subtitle/description)",
+    "",
+    "Return JSON via the structured-output schema. Only the narration array and notes — no HTML.",
+  ];
+  return lines.filter((entry): entry is string => Boolean(entry)).join("\n");
+}
+
+export function buildNarrationOnlyMessages(
+  args: BuildNarrationMessagesArgs,
+): ConversationMessage[] {
+  return [
+    {
+      role: "system",
+      content: buildNarrationOnlySystemContent(args.skillBundle),
+    },
+    { role: "user", content: buildNarrationOnlyUserContent(args) },
+  ];
+}
+
+// ── Skill bundle loader ───────────────────────────────────────────────────────
+
+function readRequired(filePath: string): string {
+  try {
+    return readFileSync(filePath, "utf-8");
+  } catch (error) {
+    const reason = error instanceof Error ? error.message : String(error);
+    throw new Error(`Skill bundle file missing: ${filePath} (${reason})`);
+  }
+}
+
+export function loadSkillBundle(skillsRoot: string): SkillBundle {
+  return {
+    hyperframesSkill: readRequired(joinPath(skillsRoot, "hyperframes", "SKILL.md")),
+    houseStyle: readRequired(joinPath(skillsRoot, "hyperframes", "house-style.md")),
+    patterns: readRequired(joinPath(skillsRoot, "hyperframes", "patterns.md")),
+    visualStyles: readRequired(joinPath(skillsRoot, "hyperframes", "visual-styles.md")),
+    dataInMotion: readRequired(joinPath(skillsRoot, "hyperframes", "data-in-motion.md")),
+    gsapSkill: readRequired(joinPath(skillsRoot, "gsap", "SKILL.md")),
+    amplifyConstraints: readRequired(joinPath(skillsRoot, "amplify-constraints.md")),
+  };
+}
+
+// ── Composition loop ──────────────────────────────────────────────────────────
+
+export type LlmFn = (conversation: ConversationMessage[]) => Promise<{
+  indexHtml: string;
+  narration: Array<{
+    sceneId: string;
+    startSeconds: number;
+    narrationText: string;
+  }>;
+  notes: string | null;
+}>;
+
+export type LintFn = (html: string) => Promise<LintResult>;
+
+export interface RunCompositionLoopArgs {
+  brief: ExplainerVideoBrief;
+  plan: ExplainerVideoRenderPlan;
+  source: ExplainerSourceArtifact;
+  skillBundle: SkillBundle;
+  maxAttempts: number;
+  llmTimeoutMs: number;
+  llm: LlmFn;
+  lint: LintFn;
+  predeterminedNarration?: NarrationPlan | null;
+}
+
+export async function runCompositionLoop(
+  args: RunCompositionLoopArgs,
+): Promise<CompositionAuthoringResult> {
+  const errors: CompositionAttemptError[] = [];
+  let retryFeedback: RetryFeedback | null = null;
+
+  for (let attempt = 1; attempt <= args.maxAttempts; attempt++) {
+    const conversation = buildAuthoringMessages({
+      brief: args.brief,
+      plan: args.plan,
+      source: args.source,
+      skillBundle: args.skillBundle,
+      retryFeedback,
+      predeterminedNarration: args.predeterminedNarration ?? null,
+    });
+
+    let llmResponse: Awaited<ReturnType<LlmFn>>;
+    try {
+      llmResponse = await args.llm(conversation);
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error);
+      errors.push({ attempt, kind: "llm_error", message });
+      const previousHtml: string = retryFeedback != null ? retryFeedback.previousIndexHtml : "";
+      retryFeedback = {
+        previousIndexHtml: previousHtml,
+        errorText: `LLM call failed: ${message}`,
+      };
+      continue;
+    }
+
+    const validation = validateCompositionHtml(llmResponse.indexHtml);
+    if (!validation.ok) {
+      const detail = `Missing required markers: ${validation.missing.join(", ")}`;
+      errors.push({ attempt, kind: "html_invalid", message: detail });
+      retryFeedback = {
+        previousIndexHtml: llmResponse.indexHtml,
+        errorText: detail,
+      };
+      continue;
+    }
+
+    const lintResult = await args.lint(llmResponse.indexHtml);
+    if (lintResult.errors.length > 0) {
+      const detail = formatLintForFeedback(lintResult);
+      errors.push({
+        attempt,
+        kind: "lint_failed",
+        message: `${lintResult.errors.length} lint errors`,
+        detail,
+      });
+      retryFeedback = {
+        previousIndexHtml: llmResponse.indexHtml,
+        errorText: detail,
+      };
+      continue;
+    }
+
+    return {
+      ok: true,
+      indexHtml: llmResponse.indexHtml,
+      narration: llmResponse.narration,
+      notes: llmResponse.notes,
+      attempts: attempt,
+    };
+  }
+
+  return { ok: false, attempts: args.maxAttempts, errors };
+}
diff --git a/packages/amplify-video-worker/src/elevenlabs.ts b/packages/amplify-video-worker/src/elevenlabs.ts
new file mode 100644
index 000000000..7e0c05078
--- /dev/null
+++ b/packages/amplify-video-worker/src/elevenlabs.ts
@@ -0,0 +1,126 @@
+import type { TimedWord } from "./types.js";
+
+interface ElevenLabsAlignment {
+  characters?: string[];
+  character_start_times_seconds?: number[];
+  character_end_times_seconds?: number[];
+}
+
+interface ElevenLabsResponse {
+  audio_base64?: string;
+  alignment?: ElevenLabsAlignment | null;
+  normalized_alignment?: ElevenLabsAlignment | null;
+}
+
+const ELEVENLABS_API_KEY = process.env.ELEVENLABS_API_KEY?.trim() || "";
+const ELEVENLABS_MODEL_ID = process.env.ELEVENLABS_MODEL_ID?.trim() || "eleven_multilingual_v2";
+const ELEVENLABS_OUTPUT_FORMAT = process.env.ELEVENLABS_OUTPUT_FORMAT?.trim() || "";
+
+function resolveVoiceId(style: "energetic_american" | "calm_executive" | "documentary") {
+  const styleSpecific =
+    style === "energetic_american"
+      ? process.env.ELEVENLABS_VOICE_ID_ENERGETIC_AMERICAN
+      : style === "calm_executive"
+        ? process.env.ELEVENLABS_VOICE_ID_CALM_EXECUTIVE
+        : process.env.ELEVENLABS_VOICE_ID_DOCUMENTARY;
+  const voiceId = styleSpecific?.trim() || process.env.ELEVENLABS_VOICE_ID?.trim() || "";
+  if (!voiceId) {
+    throw new Error(`Missing ElevenLabs voice id for style ${style}`);
+  }
+  return voiceId;
+}
+
+function finalizeWord(words: TimedWord[], text: string, start: number | null, end: number | null) {
+  const normalized = text.trim();
+  if (!normalized || start === null || end === null) return;
+  words.push({
+    text: normalized,
+    start,
+    end,
+  });
+}
+
+function wordsFromAlignment(alignment: ElevenLabsAlignment | null | undefined) {
+  const chars = alignment?.characters || [];
+  const starts = alignment?.character_start_times_seconds || [];
+  const ends = alignment?.character_end_times_seconds || [];
+  const words: TimedWord[] = [];
+
+  let current = "";
+  let wordStart: number | null = null;
+  let wordEnd: number | null = null;
+
+  for (let index = 0; index < chars.length; index++) {
+    const char = chars[index];
+    if (!char) continue;
+    const start: number = starts[index] ?? wordEnd ?? 0;
+    const end: number = ends[index] ?? start;
+    if (/\s/.test(char)) {
+      finalizeWord(words, current, wordStart, wordEnd);
+      current = "";
+      wordStart = null;
+      wordEnd = null;
+      continue;
+    }
+
+    current += char;
+    if (wordStart === null) wordStart = start;
+    wordEnd = end;
+  }
+
+  finalizeWord(words, current, wordStart, wordEnd);
+  return words;
+}
+
+export async function synthesizeSpeechWithTimestamps(args: {
+  text: string;
+  style: "energetic_american" | "calm_executive" | "documentary";
+  seed: number;
+}) {
+  if (!ELEVENLABS_API_KEY) {
+    throw new Error("Missing ELEVENLABS_API_KEY");
+  }
+
+  const voiceId = resolveVoiceId(args.style);
+  const url = new URL(`https://api.elevenlabs.io/v1/text-to-speech/${voiceId}/with-timestamps`);
+  if (ELEVENLABS_OUTPUT_FORMAT) {
+    url.searchParams.set("output_format", ELEVENLABS_OUTPUT_FORMAT);
+  }
+
+  const response = await fetch(url, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      "xi-api-key": ELEVENLABS_API_KEY,
+    },
+    body: JSON.stringify({
+      text: args.text,
+      model_id: ELEVENLABS_MODEL_ID,
+      seed: args.seed,
+    }),
+  });
+
+  const raw = await response.text();
+  if (!response.ok) {
+    throw new Error(`ElevenLabs request failed (${response.status}): ${raw.slice(0, 400)}`);
+  }
+
+  const parsed = JSON.parse(raw) as ElevenLabsResponse;
+  if (!parsed.audio_base64) {
+    throw new Error("ElevenLabs response missing audio_base64");
+  }
+
+  const audio = Buffer.from(parsed.audio_base64, "base64");
+  const words = wordsFromAlignment(parsed.alignment || parsed.normalized_alignment);
+  if (!words.length) {
+    throw new Error("ElevenLabs response missing usable timestamp alignment");
+  }
+
+  return {
+    audio,
+    mimeType: "audio/mpeg",
+    modelId: ELEVENLABS_MODEL_ID,
+    voiceId,
+    words,
+  };
+}
diff --git a/packages/amplify-video-worker/src/index.ts b/packages/amplify-video-worker/src/index.ts
new file mode 100644
index 000000000..bef082dd1
--- /dev/null
+++ b/packages/amplify-video-worker/src/index.ts
@@ -0,0 +1,3 @@
+import { startWorker } from "./worker.js";
+
+await startWorker();
diff --git a/packages/amplify-video-worker/src/llm-client.ts b/packages/amplify-video-worker/src/llm-client.ts
new file mode 100644
index 000000000..cf362ffb4
--- /dev/null
+++ b/packages/amplify-video-worker/src/llm-client.ts
@@ -0,0 +1,160 @@
+export type ConversationMessage = {
+  role: "system" | "user" | "assistant";
+  content: string;
+};
+
+export type AiConfig = {
+  baseUrl: string;
+  apiKey: string;
+  model: string;
+};
+
+export type AuthorCompositionArgs<_T> = {
+  conversation: ConversationMessage[];
+  schema: object;
+  schemaName: string;
+  ai: AiConfig;
+  timeoutMs: number;
+  fetchImpl?: typeof fetch;
+};
+
+function stripJsonFences(raw: string): string {
+  return raw
+    .replace(/^```json\s*/i, "")
+    .replace(/^```\s*/i, "")
+    .replace(/```\s*$/i, "")
+    .trim();
+}
+
+function shouldUseResponsesApi(ai: AiConfig): boolean {
+  const normalizedModel = ai.model.replace(/^@[^/]+\//, "");
+  return (
+    ai.baseUrl.includes("api.openai.com") &&
+    (/^gpt-5(\b|[-.])/.test(normalizedModel) || /^o\d/.test(normalizedModel))
+  );
+}
+
+function normalizeBaseUrl(url: string): string {
+  return url.replace(/\/$/, "");
+}
+
+async function callResponses<T>(args: AuthorCompositionArgs<T>): Promise<T> {
+  const { conversation, schema, schemaName, ai, timeoutMs, fetchImpl = fetch } = args;
+  const instructions = conversation
+    .filter((m) => m.role === "system")
+    .map((m) => m.content)
+    .join("\n\n");
+  const inputs = conversation
+    .filter((m) => m.role !== "system")
+    .map((m) => ({ role: m.role, content: m.content }));
+
+  const controller = new AbortController();
+  const timer = setTimeout(() => controller.abort(), timeoutMs);
+  try {
+    const response = await fetchImpl(`${normalizeBaseUrl(ai.baseUrl)}/responses`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        Authorization: `Bearer ${ai.apiKey}`,
+      },
+      body: JSON.stringify({
+        model: ai.model,
+        instructions,
+        input: inputs,
+        max_output_tokens: 16000,
+        reasoning: { effort: "low" },
+        text: {
+          format: {
+            type: "json_schema",
+            name: schemaName,
+            strict: true,
+            schema,
+          },
+        },
+      }),
+      signal: controller.signal,
+    });
+
+    if (!response.ok) {
+      const text = await response.text();
+      throw new Error(`OpenAI Responses API error ${response.status}: ${text.slice(0, 500)}`);
+    }
+    const payload = (await response.json()) as {
+      output_text?: string;
+      output?: Array<{ content?: Array<{ type?: string; text?: string }> }>;
+    };
+    const text =
+      (typeof payload.output_text === "string" && payload.output_text.trim()) ||
+      (payload.output ?? [])
+        .flatMap((item) => item.content ?? [])
+        .filter((c) => c.type === "output_text" && typeof c.text === "string")
+        .map((c) => (c.text ?? "").trim())
+        .filter(Boolean)
+        .join("\n");
+    if (!text || !text.trim()) {
+      throw new Error("OpenAI Responses API returned an empty response");
+    }
+    const cleaned = stripJsonFences(text);
+    try {
+      return JSON.parse(cleaned) as T;
+    } catch (parseError) {
+      throw new Error(
+        `Failed to parse JSON from LLM output: ${parseError instanceof Error ? parseError.message : String(parseError)}. Output (first 200 chars): ${cleaned.slice(0, 200)}`,
+      );
+    }
+  } finally {
+    clearTimeout(timer);
+  }
+}
+
+async function callChatCompletions<T>(args: AuthorCompositionArgs<T>): Promise<T> {
+  const { conversation, ai, timeoutMs, fetchImpl = fetch } = args;
+  const controller = new AbortController();
+  const timer = setTimeout(() => controller.abort(), timeoutMs);
+  try {
+    const response = await fetchImpl(`${normalizeBaseUrl(ai.baseUrl)}/chat/completions`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        Authorization: `Bearer ${ai.apiKey}`,
+      },
+      body: JSON.stringify({
+        model: ai.model,
+        messages: conversation,
+        response_format: { type: "json_object" },
+        temperature: 0.4,
+        max_tokens: 16000,
+      }),
+      signal: controller.signal,
+    });
+
+    if (!response.ok) {
+      const text = await response.text();
+      throw new Error(`Chat Completions error ${response.status}: ${text.slice(0, 500)}`);
+    }
+    const payload = (await response.json()) as {
+      choices?: Array<{ message?: { content?: string } }>;
+    };
+    const text = payload.choices?.[0]?.message?.content?.trim() ?? "";
+    if (!text) {
+      throw new Error("Chat Completions returned an empty response");
+    }
+    const cleaned = stripJsonFences(text);
+    try {
+      return JSON.parse(cleaned) as T;
+    } catch (parseError) {
+      throw new Error(
+        `Failed to parse JSON from LLM output: ${parseError instanceof Error ? parseError.message : String(parseError)}. Output (first 200 chars): ${cleaned.slice(0, 200)}`,
+      );
+    }
+  } finally {
+    clearTimeout(timer);
+  }
+}
+
+export async function authorComposition<T>(args: AuthorCompositionArgs<T>): Promise<T> {
+  if (shouldUseResponsesApi(args.ai)) {
+    return callResponses<T>(args);
+  }
+  return callChatCompletions<T>(args);
+}
diff --git a/packages/amplify-video-worker/src/post-process.ts b/packages/amplify-video-worker/src/post-process.ts
new file mode 100644
index 000000000..f5acc1b39
--- /dev/null
+++ b/packages/amplify-video-worker/src/post-process.ts
@@ -0,0 +1,146 @@
+import { writeFileSync } from "node:fs";
+import { join } from "node:path";
+import QRCode from "qrcode";
+import type { ExplainerVideoBrief } from "./types.js";
+
+const COVER_FILENAME_BASE = "cover";
+const QR_DEFAULT_SIZE_PX = 320;
+
+const EXT_BY_MIME: Record<string, string> = {
+  "image/png": "png",
+  "image/jpeg": "jpg",
+  "image/jpg": "jpg",
+  "image/webp": "webp",
+  "image/gif": "gif",
+  "image/avif": "avif",
+};
+
+function inferExtension(contentType: string | null, url: string): string {
+  if (contentType) {
+    const base = contentType.split(";")[0]?.trim().toLowerCase() ?? "";
+    if (EXT_BY_MIME[base]) return EXT_BY_MIME[base];
+  }
+  const match = url.match(/\.(png|jpe?g|webp|gif|avif)(?:\?|$)/i);
+  if (match && match[1]) return match[1].toLowerCase().replace("jpeg", "jpg");
+  return "png";
+}
+
+/**
+ * Fetch the cover image into projectDir and return the relative path the LLM
+ * should use in the composition. Returns null on any failure — caller falls
+ * back to the original remote URL (which will likely fail in Chromium due to
+ * Substack CDN missing CORS headers, but no worse than today).
+ */
+export async function prefetchCoverImage(
+  brief: ExplainerVideoBrief,
+  projectDir: string,
+): Promise<string | null> {
+  const url = brief.article.coverImage?.trim();
+  if (!url) return null;
+  try {
+    const response = await fetch(url, {
+      headers: { "User-Agent": "amplify-video-worker/1.0" },
+    });
+    if (!response.ok) {
+      console.warn(`[post-process] cover image fetch failed (${response.status}) ${url}`);
+      return null;
+    }
+    const ext = inferExtension(response.headers.get("content-type"), url);
+    const filename = `${COVER_FILENAME_BASE}.${ext}`;
+    const buffer = Buffer.from(await response.arrayBuffer());
+    writeFileSync(join(projectDir, filename), buffer);
+    return `./${filename}`;
+  } catch (err) {
+    console.warn(`[post-process] cover image fetch error ${url}`, err);
+    return null;
+  }
+}
+
+/**
+ * Return a derived brief whose article.coverImage points at the local file.
+ * Original brief is not mutated.
+ */
+export function briefWithLocalCover(
+  brief: ExplainerVideoBrief,
+  localPath: string,
+): ExplainerVideoBrief {
+  return {
+    ...brief,
+    article: { ...brief.article, coverImage: localPath },
+  };
+}
+
+const CROSSORIGIN_ON_LOCAL_IMG =
+  /(<img[^>]*\bsrc\s*=\s*["']\.\/[^"']+["'][^>]*?)\s+crossorigin\s*=\s*["'][^"']*["']/gi;
+
+/**
+ * Strip crossorigin="..." from <img> tags whose src is a relative local path.
+ * Chromium occasionally rejects local-file images when crossorigin is set on a
+ * file:// load; stripping it removes that risk and is a no-op when the LLM
+ * didn't add the attribute.
+ */
+export function stripCrossoriginOnLocalImages(html: string): string {
+  return html.replace(CROSSORIGIN_ON_LOCAL_IMG, "$1");
+}
+
+export interface QrInjectionResult {
+  html: string;
+  injected: boolean;
+  fallbackAppended: boolean;
+}
+
+const QR_MOUNT_PATTERN =
+  /(<div[^>]*\bclass\s*=\s*["'][^"']*\bqr-mount\b[^"']*["'][^>]*>)([\s\S]*?)(<\/div>)/i;
+const CLOSE_SCENE_PATTERN =
+  /(<section[^>]*\bid\s*=\s*["']scene-(?:close|cta|outro|end|finale)["'][^>]*>)([\s\S]*?)(<\/section>)/i;
+
+async function renderQrSvg(url: string, size: number): Promise<string> {
+  const svg = await QRCode.toString(url, {
+    type: "svg",
+    errorCorrectionLevel: "M",
+    margin: 1,
+    width: size,
+    color: { dark: "#181511", light: "#0000" },
+  });
+  return svg.replace(/<\?xml[^?]*\?>\s*/i, "");
+}
+
+/**
+ * Generate a QR code for ctaUrl and inject it into the composition.
+ *
+ * Strategy:
+ *   1. Find an element with class="qr-mount" (the convention the LLM is
+ *      instructed to include) and replace its contents with the QR SVG.
+ *   2. If no mount is present, append a QR card to the close scene so the
+ *      addition is non-destructive even if the LLM forgot the mount.
+ *   3. If neither a mount nor a close scene exists, leave the html alone.
+ */
+export async function injectQrCode(
+  html: string,
+  ctaUrl: string | null | undefined,
+  size: number = QR_DEFAULT_SIZE_PX,
+): Promise<QrInjectionResult> {
+  const url = ctaUrl?.trim();
+  if (!url) return { html, injected: false, fallbackAppended: false };
+
+  let svg: string;
+  try {
+    svg = await renderQrSvg(url, size);
+  } catch (err) {
+    console.warn("[post-process] qr-code generation failed", err);
+    return { html, injected: false, fallbackAppended: false };
+  }
+
+  if (QR_MOUNT_PATTERN.test(html)) {
+    const next = html.replace(QR_MOUNT_PATTERN, `$1${svg}$3`);
+    return { html: next, injected: true, fallbackAppended: false };
+  }
+
+  if (CLOSE_SCENE_PATTERN.test(html)) {
+    const fallbackCard = `<div class="qr-mount" data-qr-injected="fallback" style="position:absolute;right:48px;bottom:48px;width:${size}px;height:${size}px;background:#fff;padding:12px;box-shadow:0 12px 40px rgba(0,0,0,.35);z-index:25;">${svg}</div>`;
+    const next = html.replace(CLOSE_SCENE_PATTERN, `$1$2${fallbackCard}$3`);
+    return { html: next, injected: true, fallbackAppended: true };
+  }
+
+  return { html, injected: false, fallbackAppended: false };
+}
diff --git a/packages/amplify-video-worker/src/types.ts b/packages/amplify-video-worker/src/types.ts
new file mode 100644
index 000000000..4cd3ff5c6
--- /dev/null
+++ b/packages/amplify-video-worker/src/types.ts
@@ -0,0 +1,256 @@
+export interface AmplifyQueueMessage {
+  version: "2026-05-15";
+  jobId: string;
+  ownerUserId: string;
+  assetsBucket: string;
+  baseKey: string;
+  sourceKey: string;
+  briefKey: string;
+  planKey: string;
+  createdAt: string;
+}
+
+export interface ArtifactRef {
+  key: string;
+  url: string;
+  mimeType: string;
+}
+
+export interface ExplainerPrimaryAuthor {
+  name: string;
+  role?: string | null;
+  bio?: string | null;
+  imageUrl?: string | null;
+  website?: string | null;
+  linkedin?: string | null;
+  x?: string | null;
+}
+
+export interface ExplainerPublicationRef {
+  name?: string | null;
+  subdomain?: string | null;
+  customDomain?: string | null;
+  url?: string | null;
+  linkedinUrl?: string | null;
+}
+
+export interface ExplainerBookletLink {
+  shortUrl: string;
+  sourceUrl: string;
+  slug?: string | null;
+}
+
+export interface ExplainerArticleRef {
+  title: string;
+  subtitle?: string | null;
+  url: string;
+  description?: string | null;
+  coverImage?: string | null;
+  publication?: ExplainerPublicationRef | null;
+  primaryAuthor?: ExplainerPrimaryAuthor | null;
+  bookletLink?: ExplainerBookletLink | null;
+}
+
+export interface ExplainerVideoBrief {
+  version: "2026-05-15";
+  article: ExplainerArticleRef;
+  interview: {
+    goal: string;
+    customGoal?: string;
+    audience: string;
+    customAudience?: string;
+    durationSeconds: 30 | 45 | 60 | 90;
+    narrativeStyle: string;
+    authorReferenceStyle?: "first_name" | "formal_third" | "full_attribution";
+    aspectRatio?: "16:9" | "1:1" | "9:16";
+    textMode: "preserve" | "condense" | "rewrite";
+    visualMode: "editorial" | "motion_social" | "documentary" | "captions_only";
+    voiceoverMode: "ai_voice" | "captions_only" | "none";
+    ctaMode: "booklet" | "article" | "newsletter" | "author";
+    productionNotes?: string;
+  };
+  defaultsApplied: string[];
+  createdAt: string;
+}
+
+export interface ExplainerScenePlan {
+  id: string;
+  purpose: string;
+  source: "article" | "derived" | "author" | "cta";
+  durationSeconds: number;
+}
+
+export interface ExplainerVideoRenderPlan {
+  version: "2026-05-15";
+  rendererKind: "hyperframes" | "remotion";
+  compositionKind:
+    | "article_explainer"
+    | "documentary_teaser"
+    | "social_recap"
+    | "capsule_exec_brief";
+  targetDurationSeconds: number;
+  aspectRatio: "16:9" | "9:16" | "1:1";
+  voice: {
+    enabled: boolean;
+    provider?: "elevenlabs";
+    style?: "energetic_american" | "calm_executive" | "documentary";
+  };
+  captions: {
+    enabled: boolean;
+    burnIn: boolean;
+    exportSrt: boolean;
+  };
+  scenes: ExplainerScenePlan[];
+  cta: {
+    mode: "booklet" | "article" | "newsletter" | "author";
+    label: string;
+    url?: string | null;
+  };
+  worker: {
+    status: "pending_deployment" | "queued" | "processing" | "completed" | "failed";
+    queueName?: string | null;
+    notes: string;
+  };
+  billing: {
+    billingSurfaceId: string;
+    billingAccountId?: string;
+    rawBillingSurfaceKey?: string;
+  };
+}
+
+export interface ExplainerSourceArtifact {
+  version: "2026-05-15";
+  article: {
+    text: string;
+    paragraphs: string[];
+    bodyHtml?: string | null;
+    authors?: unknown;
+  };
+}
+
+export interface ExplainerVideoJobRecord {
+  userId: string;
+  itemType: "explainerJob";
+  ownerUserId: string;
+  jobId: string;
+  status:
+    | "queued"
+    | "planning"
+    | "storyboarding"
+    | "voiceover"
+    | "rendering"
+    | "uploading"
+    | "completed"
+    | "failed";
+  stage: string;
+  progress: number;
+  workerStatus: "pending_deployment" | "queued" | "processing" | "completed" | "failed";
+  message?: string | null;
+  failureCode?: string | null;
+  article: ExplainerArticleRef;
+  videoBrief: ExplainerVideoBrief;
+  plan: ExplainerVideoRenderPlan;
+  artifacts: {
+    source?: ArtifactRef | null;
+    brief: ArtifactRef;
+    plan: ArtifactRef;
+    script?: ArtifactRef | null;
+    transcript?: ArtifactRef | null;
+    captions?: ArtifactRef | null;
+    poster?: ArtifactRef | null;
+    voiceover?: ArtifactRef | null;
+    video?: ArtifactRef | null;
+  };
+  billingSurfaceId: string;
+  billingAccountId?: string;
+  rawBillingSurfaceKey?: string;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface RenderSceneCard {
+  id: string;
+  kind: "hook" | "context" | "insight" | "quote" | "author" | "cta";
+  layout: "hero" | "split" | "quote" | "author" | "cta";
+  eyebrow: string;
+  title: string;
+  body: string;
+  highlight?: string | null;
+  meta?: string | null;
+  ctaLabel?: string | null;
+  supportingPoints?: string[];
+  alignment: "left" | "right";
+  startSeconds: number;
+  durationSeconds: number;
+}
+
+export interface ScriptSegment {
+  id: string;
+  title: string;
+  narration: string;
+  durationSeconds: number;
+}
+
+export interface TimedWord {
+  text: string;
+  start: number;
+  end: number;
+}
+
+export interface ExplainerScript {
+  version: "2026-05-15";
+  targetDurationSeconds: number;
+  fullNarration: string;
+  scenes: RenderSceneCard[];
+  segments: ScriptSegment[];
+}
+
+export interface UserRecord {
+  userId: string;
+  aiBaseUrl?: string | null;
+  aiApiKey?: string | null;
+  aiModel?: string | null;
+  elevenLabsApiKey?: string | null;
+  elevenLabsModelId?: string | null;
+}
+
+export interface CompositionAuthoringSuccess {
+  ok: true;
+  indexHtml: string;
+  narration: Array<{
+    sceneId: string;
+    startSeconds: number;
+    narrationText: string;
+  }>;
+  notes: string | null;
+  attempts: number;
+}
+
+export interface CompositionAuthoringFailure {
+  ok: false;
+  attempts: number;
+  errors: CompositionAttemptError[];
+}
+
+export type CompositionAuthoringResult = CompositionAuthoringSuccess | CompositionAuthoringFailure;
+
+export interface CompositionAttemptError {
+  attempt: number;
+  kind:
+    | "schema_invalid"
+    | "html_invalid"
+    | "lint_failed"
+    | "render_failed"
+    | "sanity_failed"
+    | "llm_timeout"
+    | "llm_error";
+  message: string;
+  detail?: string;
+}
+
+export interface LintFinding {
+  severity: "error" | "warning" | "info";
+  ruleId: string;
+  message: string;
+  line?: number | null;
+}
diff --git a/packages/amplify-video-worker/src/worker.ts b/packages/amplify-video-worker/src/worker.ts
new file mode 100644
index 000000000..e940f225a
--- /dev/null
+++ b/packages/amplify-video-worker/src/worker.ts
@@ -0,0 +1,1865 @@
+import { createServer, type Server } from "node:http";
+import { mkdtempSync, mkdirSync, rmSync, writeFileSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { dirname, join, join as joinPath } from "node:path";
+import { fileURLToPath } from "node:url";
+import { createHash } from "node:crypto";
+import { DeleteMessageCommand, ReceiveMessageCommand, SQSClient } from "@aws-sdk/client-sqs";
+import { createRenderJob, executeRenderJob } from "@hyperframes/producer";
+import {
+  getExplainerVideoJob,
+  getUser,
+  mergeExplainerVideoJob,
+  uploadBufferArtifact,
+  uploadFileArtifact,
+  uploadJsonArtifact,
+  readJsonArtifact,
+} from "./amplify.js";
+import { authorComposition } from "./llm-client.js";
+import {
+  buildNarrationOnlyMessages,
+  dimensionsForAspect,
+  extendCompositionDuration,
+  loadSkillBundle,
+  lintCompositionHtml,
+  NARRATION_JSON_SCHEMA,
+  postRenderSanityCheck,
+  probeDurationWithFfprobe,
+  runCompositionLoop,
+} from "./composition.js";
+import type { SkillBundle } from "./composition.js";
+import { synthesizeSpeechWithTimestamps } from "./elevenlabs.js";
+import {
+  briefWithLocalCover,
+  injectQrCode,
+  prefetchCoverImage,
+  stripCrossoriginOnLocalImages,
+} from "./post-process.js";
+import type {
+  AmplifyQueueMessage,
+  ArtifactRef,
+  ExplainerScript,
+  ExplainerSourceArtifact,
+  ExplainerVideoBrief,
+  ExplainerVideoRenderPlan,
+  RenderSceneCard,
+  ScriptSegment,
+  TimedWord,
+} from "./types.js";
+
+const sqs = new SQSClient({ region: process.env.AWS_REGION || "us-east-1" });
+const queueUrl = process.env.AMPLIFY_VIDEO_QUEUE_URL?.trim() || "";
+const pollWaitSeconds = Number.parseInt(process.env.WORKER_POLL_WAIT_SECONDS || "20", 10);
+const visibilityTimeout = Number.parseInt(
+  process.env.WORKER_VISIBILITY_TIMEOUT_SECONDS || "3600",
+  10,
+);
+const healthPort = Number.parseInt(process.env.PORT || "3000", 10);
+const renderWorkers = Math.max(
+  1,
+  Number.parseInt(process.env.HYPERFRAMES_RENDER_WORKERS || "1", 10),
+);
+
+let currentJobId: string | null = null;
+let processedJobs = 0;
+let failedJobs = 0;
+let shuttingDown = false;
+
+function titleCase(text: string) {
+  return text
+    .split(/\s+/)
+    .filter(Boolean)
+    .map((part) => part.charAt(0).toUpperCase() + part.slice(1).toLowerCase())
+    .join(" ");
+}
+
+function splitSentences(text: string) {
+  return text
+    .split(/(?<=[.!?])\s+/)
+    .map((sentence) => sentence.replace(/\s+/g, " ").trim())
+    .filter(Boolean);
+}
+
+function trimToWords(text: string, maxWords: number) {
+  const words = text.split(/\s+/).filter(Boolean);
+  if (words.length <= maxWords) return words.join(" ");
+  return `${words.slice(0, maxWords).join(" ")}...`;
+}
+
+function sanitizeCandidateParagraph(paragraph: string, article: ExplainerVideoBrief["article"]) {
+  const cleaned = paragraph.replace(/\s+/g, " ").trim();
+  if (!cleaned) return null;
+
+  const lower = cleaned.toLowerCase();
+  const title = article.title.toLowerCase();
+  const subtitle = (article.subtitle || "").toLowerCase();
+
+  if (cleaned.length < 60) return null;
+  if (lower === title || lower === subtitle) return null;
+  if (lower.startsWith("thanks for reading")) return null;
+  if (lower.startsWith("discussion about this post")) return null;
+  if (lower.startsWith("install:")) return null;
+  if (lower.includes("start your substack")) return null;
+  if (lower.includes("privacy ∙ terms")) return null;
+  if (lower.includes("this site requires javascript")) return null;
+
+  return cleaned;
+}
+
+function expandParagraphCandidates(
+  source: ExplainerSourceArtifact,
+  article: ExplainerVideoBrief["article"],
+) {
+  const seed = [...source.article.paragraphs, ...source.article.text.split(/\n+/)];
+
+  const expanded = seed.flatMap((paragraph) => {
+    const cleaned = sanitizeCandidateParagraph(paragraph, article);
+    if (!cleaned) return [];
+    if (cleaned.length <= 420) return [cleaned];
+
+    const sentences = splitSentences(cleaned);
+    const chunks: string[] = [];
+    let current = "";
+    for (const sentence of sentences) {
+      const next = current ? `${current} ${sentence}` : sentence;
+      if (next.length > 360 && current) {
+        chunks.push(current);
+        current = sentence;
+      } else {
+        current = next;
+      }
+    }
+    if (current) chunks.push(current);
+    return chunks;
+  });
+
+  return expanded.filter(Boolean);
+}
+
+function fingerprintText(text: string) {
+  return text
+    .toLowerCase()
+    .replace(/[^a-z0-9\s]/g, " ")
+    .split(/\s+/)
+    .filter((word) => word.length > 2)
+    .slice(0, 12)
+    .join(" ");
+}
+
+function dedupeParagraphs(paragraphs: string[]) {
+  const seen = new Set<string>();
+  return paragraphs.filter((paragraph) => {
+    const key = fingerprintText(paragraph);
+    if (!key || seen.has(key)) return false;
+    seen.add(key);
+    return true;
+  });
+}
+
+function splitSupportPoints(text: string, maxPoints = 3) {
+  return text
+    .split(/[;:]\s+|,\s+(?=[A-Z0-9])/)
+    .map((part) => part.replace(/\s+/g, " ").trim())
+    .filter((part) => part.length >= 18)
+    .slice(0, maxPoints)
+    .map((part) => trimToWords(part, 10));
+}
+
+function pickQuote(text: string) {
+  const sentence =
+    splitSentences(text)
+      .filter((part) => part.length >= 60)
+      .sort((a, b) => b.length - a.length)[0] || text;
+  return trimToWords(sentence.replace(/^["“]|["”]$/g, ""), 24);
+}
+
+function buildNarrationFromParagraph(paragraph: string, maxWords: number, leadIn?: string) {
+  const sentences = splitSentences(paragraph);
+  const joined = [leadIn, sentences[0], sentences[1]]
+    .filter(Boolean)
+    .join(" ")
+    .replace(/\s+/g, " ")
+    .trim();
+  return trimToWords(joined || paragraph, maxWords);
+}
+
+function buildSafeMeta(...values: Array<string | null | undefined>) {
+  return values
+    .map((value) => (value || "").trim())
+    .filter(Boolean)
+    .join(" · ");
+}
+
+function deriveSceneTitle(paragraph: string, fallback: string) {
+  const sentence = splitSentences(paragraph)[0] || paragraph;
+  const words = sentence
+    .replace(/[^A-Za-z0-9\s-]/g, " ")
+    .split(/\s+/)
+    .filter((word) => word.length > 2)
+    .slice(0, 5);
+  return words.length ? titleCase(words.join(" ")) : fallback;
+}
+
+function fitNarration(maxWords: number, ...parts: Array<string | null | undefined>) {
+  const joined = parts
+    .map((part) => (part || "").replace(/\s+/g, " ").trim())
+    .filter(Boolean)
+    .join(" ");
+  return trimToWords(joined, maxWords);
+}
+
+function buildExplainerScript(args: {
+  brief: ExplainerVideoBrief;
+  plan: ExplainerVideoRenderPlan;
+  source: ExplainerSourceArtifact;
+}): ExplainerScript {
+  const paragraphs = dedupeParagraphs(expandParagraphCandidates(args.source, args.brief.article));
+  const primaryAuthor = args.brief.article.primaryAuthor;
+  const ctaUrl = args.plan.cta.url || args.brief.article.url;
+  const publicationName = args.brief.article.publication?.name || "Amplify";
+  const uniqueParagraphs = {
+    context:
+      paragraphs[0] ||
+      args.brief.article.description ||
+      args.brief.article.subtitle ||
+      args.brief.article.title,
+    insight1:
+      paragraphs[1] || paragraphs[0] || args.brief.article.description || args.brief.article.title,
+    insight2:
+      paragraphs[2] ||
+      paragraphs[1] ||
+      paragraphs[0] ||
+      args.brief.article.description ||
+      args.brief.article.title,
+    evidence:
+      paragraphs[3] ||
+      paragraphs[2] ||
+      paragraphs[1] ||
+      paragraphs[0] ||
+      args.brief.article.description ||
+      args.brief.article.title,
+  };
+  const scenes: RenderSceneCard[] = [];
+  const segments: ScriptSegment[] = [];
+  let cursor = 0;
+
+  args.plan.scenes.forEach((scene, index) => {
+    const narrationBudget = Math.max(10, Math.round(scene.durationSeconds * 2.5));
+    const alignment = index % 2 === 0 ? "left" : "right";
+
+    let eyebrow = publicationName;
+    let title = args.brief.article.title;
+    let body = trimToWords(uniqueParagraphs.context, 24);
+    let highlight: string | null = null;
+    let meta: string | null = null;
+    let ctaLabel: string | null = null;
+    let narration = buildNarrationFromParagraph(uniqueParagraphs.context, narrationBudget);
+    let supportingPoints: string[] = [];
+    let kind: RenderSceneCard["kind"] =
+      scene.id === "hook"
+        ? "hook"
+        : scene.id === "context"
+          ? "context"
+          : scene.id === "author"
+            ? "author"
+            : scene.id === "cta"
+              ? "cta"
+              : "insight";
+    let layout: RenderSceneCard["layout"] = "split";
+
+    switch (scene.id) {
+      case "hook":
+        layout = "hero";
+        eyebrow = publicationName;
+        title = args.brief.article.title;
+        body = trimToWords(
+          args.brief.article.subtitle || args.brief.article.description || args.brief.article.title,
+          18,
+        );
+        narration = fitNarration(
+          narrationBudget,
+          args.brief.article.title,
+          args.brief.article.subtitle || args.brief.article.description,
+        );
+        meta =
+          buildSafeMeta(
+            args.brief.article.primaryAuthor?.name,
+            args.brief.article.publication?.name,
+          ) || null;
+        supportingPoints = splitSupportPoints(uniqueParagraphs.context, 3);
+        break;
+      case "context":
+        layout = "split";
+        eyebrow = "Why it matters";
+        title = "The setup";
+        body = trimToWords(uniqueParagraphs.context, 22);
+        narration = buildNarrationFromParagraph(
+          uniqueParagraphs.context,
+          narrationBudget,
+          "Here is the setup.",
+        );
+        supportingPoints = splitSupportPoints(uniqueParagraphs.context, 3);
+        highlight = trimToWords(
+          splitSentences(uniqueParagraphs.context)[0] || uniqueParagraphs.context,
+          14,
+        );
+        break;
+      case "insight-1":
+        layout = "split";
+        eyebrow = "Key point";
+        title = deriveSceneTitle(uniqueParagraphs.insight1, "First insight");
+        body = trimToWords(uniqueParagraphs.insight1, 22);
+        narration = buildNarrationFromParagraph(
+          uniqueParagraphs.insight1,
+          narrationBudget,
+          "The first real shift is this.",
+        );
+        supportingPoints = splitSupportPoints(uniqueParagraphs.insight1, 3);
+        highlight = trimToWords(
+          splitSentences(uniqueParagraphs.insight1)[0] || uniqueParagraphs.insight1,
+          16,
+        );
+        break;
+      case "insight-2":
+        kind = "quote";
+        layout = "quote";
+        eyebrow = "The payoff";
+        title = deriveSceneTitle(uniqueParagraphs.insight2, "What changes");
+        highlight = pickQuote(uniqueParagraphs.evidence);
+        body = trimToWords(uniqueParagraphs.insight2, 22);
+        narration = buildNarrationFromParagraph(
+          uniqueParagraphs.insight2,
+          narrationBudget,
+          "Then the payoff becomes clear.",
+        );
+        supportingPoints = splitSupportPoints(uniqueParagraphs.evidence, 2);
+        break;
+      case "author":
+        layout = "author";
+        eyebrow = "About the author";
+        title = primaryAuthor ? primaryAuthor.name : "Author perspective";
+        body = trimToWords(
+          primaryAuthor?.bio ||
+            [primaryAuthor?.role, args.brief.article.publication?.name]
+              .filter(Boolean)
+              .join(" · ") ||
+            "The article comes from a practitioner perspective grounded in real operating work.",
+          24,
+        );
+        narration = fitNarration(
+          narrationBudget,
+          primaryAuthor
+            ? `${primaryAuthor.name}${primaryAuthor.role ? `, ${primaryAuthor.role}` : ""}.`
+            : "This perspective comes from the author behind the article.",
+          primaryAuthor?.bio,
+        );
+        meta = buildSafeMeta(primaryAuthor?.linkedin, primaryAuthor?.website) || null;
+        break;
+      case "cta":
+        layout = "cta";
+        eyebrow = "Read the full piece";
+        title = args.plan.cta.label;
+        body = trimToWords(
+          args.brief.article.bookletLink?.shortUrl
+            ? "The booklet keeps the argument, examples, and author context together in one link."
+            : "The full article has the complete argument and examples.",
+          24,
+        );
+        narration = fitNarration(
+          narrationBudget,
+          `${args.plan.cta.label}.`,
+          args.brief.article.bookletLink?.shortUrl
+            ? "Use the booklet link for the full argument and examples."
+            : "Use the article link for the full argument and examples.",
+        );
+        meta = args.brief.article.bookletLink?.shortUrl || ctaUrl;
+        ctaLabel = args.plan.cta.label;
+        supportingPoints = [
+          trimToWords(args.brief.article.title, 9),
+          trimToWords(
+            args.brief.article.subtitle ||
+              args.brief.article.description ||
+              "Full argument and examples.",
+            9,
+          ),
+        ];
+        break;
+      default:
+        break;
+    }
+
+    scenes.push({
+      id: scene.id,
+      kind,
+      layout,
+      eyebrow,
+      title,
+      body,
+      highlight,
+      meta,
+      ctaLabel,
+      supportingPoints,
+      alignment,
+      startSeconds: cursor,
+      durationSeconds: scene.durationSeconds,
+    });
+
+    segments.push({
+      id: scene.id,
+      title,
+      narration,
+      durationSeconds: scene.durationSeconds,
+    });
+
+    cursor += scene.durationSeconds;
+  });
+
+  return {
+    version: "2026-05-15",
+    targetDurationSeconds: cursor,
+    fullNarration: segments.map((segment) => segment.narration).join(" "),
+    scenes,
+    segments,
+  };
+}
+
+function buildSyntheticWordTimings(segments: ScriptSegment[]) {
+  const words: TimedWord[] = [];
+  let cursor = 0;
+
+  for (const segment of segments) {
+    const segmentWords = segment.narration.split(/\s+/).filter(Boolean);
+    const step = segmentWords.length
+      ? Math.max(0.16, segment.durationSeconds / segmentWords.length)
+      : segment.durationSeconds;
+    segmentWords.forEach((word, index) => {
+      const start = cursor + index * step;
+      words.push({
+        text: word,
+        start,
+        end: Math.min(cursor + segment.durationSeconds, start + step * 0.82),
+      });
+    });
+    cursor += segment.durationSeconds;
+  }
+
+  return words;
+}
+
+function timestampForSrt(totalSeconds: number) {
+  const hours = Math.floor(totalSeconds / 3600);
+  const minutes = Math.floor((totalSeconds % 3600) / 60);
+  const seconds = Math.floor(totalSeconds % 60);
+  const millis = Math.round((totalSeconds - Math.floor(totalSeconds)) * 1000);
+  return `${String(hours).padStart(2, "0")}:${String(minutes).padStart(2, "0")}:${String(
+    seconds,
+  ).padStart(2, "0")},${String(millis).padStart(3, "0")}`;
+}
+
+function buildCaptionGroups(words: TimedWord[]) {
+  const groups: Array<{ text: string; start: number; end: number }> = [];
+  let current: TimedWord[] = [];
+
+  const flush = () => {
+    if (!current.length) return;
+    groups.push({
+      text: current.map((word) => word.text).join(" "),
+      start: current[0]?.start ?? 0,
+      end: current[current.length - 1]?.end ?? current[0]?.end ?? 0,
+    });
+    current = [];
+  };
+
+  words.forEach((word) => {
+    current.push(word);
+    if (
+      current.length >= 6 ||
+      /[.!?]$/.test(word.text) ||
+      (current[0] && word.end - current[0].start >= 2.4)
+    ) {
+      flush();
+    }
+  });
+
+  flush();
+  return groups;
+}
+
+function buildSrt(words: TimedWord[]) {
+  return buildCaptionGroups(words)
+    .map(
+      (group, index) =>
+        `${index + 1}\n${timestampForSrt(group.start)} --> ${timestampForSrt(group.end)}\n${
+          group.text
+        }\n`,
+    )
+    .join("\n");
+}
+
+function escapeHtml(value: string) {
+  return value
+    .replace(/&/g, "&amp;")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;")
+    .replace(/'/g, "&#39;");
+}
+
+function buildHtmlTemplate(args: {
+  brief: ExplainerVideoBrief;
+  plan: ExplainerVideoRenderPlan;
+  script: ExplainerScript;
+  transcript: TimedWord[];
+  durationSeconds: number;
+  narrationSrc?: string | null;
+}) {
+  const dims = dimensionsForAspect(args.plan.aspectRatio);
+  const palette =
+    args.brief.interview.visualMode === "motion_social"
+      ? {
+          bgA: "#130f40",
+          bgB: "#2b1055",
+          accent: "#fb923c",
+          accentAlt: "#f472b6",
+          text: "#fff7ed",
+          muted: "#fed7aa",
+          panel: "rgba(20, 17, 52, 0.74)",
+        }
+      : args.brief.interview.visualMode === "documentary"
+        ? {
+            bgA: "#0f172a",
+            bgB: "#1e293b",
+            accent: "#f59e0b",
+            accentAlt: "#fcd34d",
+            text: "#f8fafc",
+            muted: "#cbd5e1",
+            panel: "rgba(15, 23, 42, 0.76)",
+          }
+        : args.brief.interview.visualMode === "captions_only"
+          ? {
+              bgA: "#020617",
+              bgB: "#0f172a",
+              accent: "#22c55e",
+              accentAlt: "#34d399",
+              text: "#f8fafc",
+              muted: "#cbd5e1",
+              panel: "rgba(2, 6, 23, 0.78)",
+            }
+          : {
+              bgA: "#07111f",
+              bgB: "#16324f",
+              accent: "#7dd3fc",
+              accentAlt: "#a78bfa",
+              text: "#f8fafc",
+              muted: "#cbd5e1",
+              panel: "rgba(8, 19, 36, 0.74)",
+            };
+
+  const sceneMarkup = args.script.scenes
+    .map((scene, index) => {
+      const points =
+        scene.supportingPoints && scene.supportingPoints.length
+          ? `<div class="scene-points">${scene.supportingPoints
+              .map(
+                (point) =>
+                  `<div class="scene-point scene-animate"><span class="scene-point-dot"></span>${escapeHtml(
+                    point,
+                  )}</div>`,
+              )
+              .join("")}</div>`
+          : "";
+      const authorImage =
+        scene.layout === "author" && args.brief.article.primaryAuthor?.imageUrl
+          ? `<img class="author-photo" src="${escapeHtml(
+              args.brief.article.primaryAuthor.imageUrl,
+            )}" alt="${escapeHtml(args.brief.article.primaryAuthor.name)}" />`
+          : "";
+      const meta = scene.meta
+        ? `<div class="scene-meta scene-animate">${escapeHtml(scene.meta)}</div>`
+        : "";
+      const cta =
+        scene.ctaLabel && args.plan.cta.url
+          ? `<div class="scene-cta scene-animate">${escapeHtml(scene.ctaLabel)}</div>`
+          : "";
+      const highlight = scene.highlight
+        ? `<div class="scene-highlight scene-animate">${escapeHtml(scene.highlight)}</div>`
+        : "";
+      const heroMarkup = `
+        <div class="hero-copy">
+          <div class="scene-eyebrow scene-animate">${escapeHtml(scene.eyebrow)}</div>
+          <h1 class="scene-title scene-animate">${escapeHtml(scene.title)}</h1>
+          <p class="scene-body scene-animate">${escapeHtml(scene.body)}</p>
+          ${meta}
+        </div>
+        <div class="hero-rail scene-animate">
+          ${points}
+        </div>`;
+      const splitMarkup = `
+        <div class="accent-bar scene-animate"></div>
+        <div class="scene-panel split-panel">
+          <div class="scene-eyebrow scene-animate">${escapeHtml(scene.eyebrow)}</div>
+          <h1 class="scene-title scene-animate">${escapeHtml(scene.title)}</h1>
+          ${highlight}
+          <p class="scene-body scene-animate">${escapeHtml(scene.body)}</p>
+          ${meta}
+        </div>
+        <div class="scene-sidecar scene-animate">${points}</div>`;
+      const quoteMarkup = `
+        <div class="quote-frame scene-animate">
+          <div class="quote-mark">“</div>
+          <div class="scene-eyebrow">${escapeHtml(scene.eyebrow)}</div>
+          <div class="quote-text">${escapeHtml(scene.highlight || scene.title)}</div>
+          <div class="quote-support">${escapeHtml(scene.body)}</div>
+          ${points}
+        </div>`;
+      const authorMarkup = `
+        <div class="accent-bar scene-animate"></div>
+        <div class="scene-panel author-panel">
+          <div class="scene-eyebrow scene-animate">${escapeHtml(scene.eyebrow)}</div>
+          <h1 class="scene-title scene-animate">${escapeHtml(scene.title)}</h1>
+          <p class="scene-body scene-animate">${escapeHtml(scene.body)}</p>
+          ${meta}
+        </div>
+        ${authorImage}`;
+      const ctaMarkup = `
+        <div class="cta-board scene-animate">
+          <div class="scene-eyebrow">${escapeHtml(scene.eyebrow)}</div>
+          <h1 class="scene-title">${escapeHtml(scene.title)}</h1>
+          <p class="scene-body">${escapeHtml(scene.body)}</p>
+          ${points}
+          ${cta}
+          ${meta}
+        </div>`;
+
+      const sceneInner =
+        scene.layout === "hero"
+          ? heroMarkup
+          : scene.layout === "quote"
+            ? quoteMarkup
+            : scene.layout === "author"
+              ? authorMarkup
+              : scene.layout === "cta"
+                ? ctaMarkup
+                : splitMarkup;
+
+      return `
+        <section
+          id="scene-${index}"
+          class="scene clip align-${scene.alignment} kind-${scene.kind} layout-${scene.layout}"
+          data-start="${scene.startSeconds}"
+          data-duration="${scene.durationSeconds}"
+          data-track-index="1"
+          style="visibility:hidden;opacity:0"
+        >
+          <div class="scene-shell">
+            <div class="scene-orb scene-orb-a"></div>
+            <div class="scene-orb scene-orb-b"></div>
+            ${sceneInner}
+          </div>
+        </section>`;
+    })
+    .join("\n");
+
+  const coverImage =
+    args.brief.article.coverImage && args.brief.article.coverImage.trim()
+      ? `<img
+          id="cover-image"
+          class="clip cover-image"
+          data-start="0"
+          data-duration="${Math.max(args.script.scenes[0]?.durationSeconds || 8, 8)}"
+          data-track-index="0"
+          src="${escapeHtml(args.brief.article.coverImage)}"
+          alt=""
+        />`
+      : "";
+  const narrationTrack =
+    args.narrationSrc && args.narrationSrc.trim()
+      ? `<audio
+          id="narration-track"
+          src="${escapeHtml(args.narrationSrc)}"
+          data-start="0"
+          data-duration="${args.durationSeconds}"
+          data-track-index="8"
+        ></audio>`
+      : "";
+
+  return `<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>${escapeHtml(args.brief.article.title)}</title>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: ${dims.width}px;
+        height: ${dims.height}px;
+        overflow: hidden;
+        background:
+          radial-gradient(circle at top left, ${palette.bgB} 0%, ${palette.bgA} 55%, #020617 100%);
+        color: ${palette.text};
+        font-family: "Helvetica Neue", Arial, sans-serif;
+      }
+
+      * {
+        box-sizing: border-box;
+      }
+
+      [data-composition-id="amplify-explainer"] {
+        position: relative;
+        width: ${dims.width}px;
+        height: ${dims.height}px;
+        overflow: hidden;
+        background:
+          radial-gradient(circle at top left, rgba(255, 255, 255, 0.08), transparent 38%),
+          radial-gradient(circle at bottom right, rgba(255, 255, 255, 0.05), transparent 32%);
+      }
+
+      .cover-image {
+        position: absolute;
+        inset: 0;
+        width: ${dims.width}px;
+        height: ${dims.height}px;
+        object-fit: cover;
+        filter: brightness(0.32) saturate(1.05);
+      }
+
+      .canvas-wash {
+        position: absolute;
+        inset: 0;
+        background:
+          linear-gradient(135deg, rgba(2, 6, 23, 0.14), rgba(2, 6, 23, 0.58)),
+          linear-gradient(0deg, rgba(2, 6, 23, 0.55), transparent 50%);
+        pointer-events: none;
+      }
+
+      .grain {
+        position: absolute;
+        inset: 0;
+        opacity: 0.14;
+        mix-blend-mode: screen;
+        background-image:
+          radial-gradient(circle at 20% 20%, rgba(255,255,255,0.65) 0 1px, transparent 1px),
+          radial-gradient(circle at 80% 65%, rgba(255,255,255,0.55) 0 1px, transparent 1px),
+          radial-gradient(circle at 40% 80%, rgba(255,255,255,0.4) 0 1px, transparent 1px);
+        background-size: 160px 160px;
+      }
+
+      .brand-lockup {
+        position: absolute;
+        top: 48px;
+        left: 56px;
+        display: flex;
+        flex-direction: column;
+        gap: 10px;
+        z-index: 12;
+      }
+
+      .brand-kicker {
+        display: inline-flex;
+        width: fit-content;
+        padding: 10px 16px;
+        border-radius: 999px;
+        border: 1px solid rgba(255, 255, 255, 0.16);
+        background: rgba(255, 255, 255, 0.06);
+        text-transform: uppercase;
+        letter-spacing: 0.18em;
+        font-size: 15px;
+        font-weight: 700;
+        color: ${palette.muted};
+      }
+
+      .brand-title {
+        font-size: 22px;
+        font-weight: 700;
+        letter-spacing: 0.04em;
+      }
+
+      .scene {
+        position: absolute;
+        inset: 0;
+        padding: 140px 72px 170px;
+      }
+
+      .scene-shell {
+        position: relative;
+        width: 100%;
+        height: 100%;
+      }
+
+      .scene-orb {
+        position: absolute;
+        border-radius: 999px;
+        filter: blur(16px);
+        opacity: 0.22;
+        pointer-events: none;
+      }
+
+      .scene-orb-a {
+        top: 80px;
+        left: 120px;
+        width: 340px;
+        height: 340px;
+        background: ${palette.accent};
+      }
+
+      .scene-orb-b {
+        right: 120px;
+        bottom: 80px;
+        width: 420px;
+        height: 420px;
+        background: ${palette.accentAlt};
+      }
+
+      .accent-bar {
+        position: absolute;
+        top: 0;
+        width: 220px;
+        height: 10px;
+        border-radius: 999px;
+        background: linear-gradient(90deg, ${palette.accent}, ${palette.accentAlt});
+        transform-origin: left center;
+        box-shadow: 0 12px 42px rgba(0, 0, 0, 0.32);
+      }
+
+      .scene.align-left .accent-bar,
+      .scene.align-left .scene-panel {
+        left: 0;
+      }
+
+      .scene.align-right .accent-bar,
+      .scene.align-right .scene-panel {
+        right: 0;
+      }
+
+      .scene-panel {
+        position: absolute;
+        top: 42px;
+        width: 960px;
+        padding: 42px 48px 38px;
+        border-radius: 34px;
+        background: ${palette.panel};
+        border: 1px solid rgba(255, 255, 255, 0.14);
+        backdrop-filter: blur(18px);
+        box-shadow: 0 28px 90px rgba(0, 0, 0, 0.3);
+      }
+
+      .split-panel {
+        left: 0;
+      }
+
+      .scene.align-right .split-panel {
+        left: auto;
+        right: 0;
+      }
+
+      .scene-eyebrow {
+        font-size: 16px;
+        font-weight: 700;
+        letter-spacing: 0.16em;
+        text-transform: uppercase;
+        color: ${palette.muted};
+      }
+
+      .scene-title {
+        margin: 18px 0 0;
+        font-size: 68px;
+        line-height: 1.02;
+        letter-spacing: -0.04em;
+        max-width: 10ch;
+      }
+
+      .layout-hero .scene-title {
+        max-width: 12ch;
+        font-size: 84px;
+      }
+
+      .scene-body {
+        margin: 24px 0 0;
+        font-size: 28px;
+        line-height: 1.38;
+        color: rgba(248, 250, 252, 0.92);
+        max-width: 30ch;
+      }
+
+      .scene-highlight {
+        margin-top: 22px;
+        padding-left: 20px;
+        border-left: 4px solid ${palette.accent};
+        font-size: 24px;
+        line-height: 1.35;
+        color: ${palette.text};
+        max-width: 32ch;
+      }
+
+      .scene-meta {
+        margin-top: 24px;
+        font-size: 18px;
+        line-height: 1.5;
+        color: ${palette.muted};
+        max-width: 30ch;
+      }
+
+      .scene-cta {
+        margin-top: 28px;
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        padding: 14px 22px;
+        border-radius: 999px;
+        font-size: 18px;
+        font-weight: 700;
+        color: #020617;
+        background: linear-gradient(90deg, ${palette.accent}, ${palette.accentAlt});
+      }
+
+      .scene-points {
+        display: grid;
+        gap: 14px;
+        margin-top: 24px;
+      }
+
+      .scene-point {
+        display: flex;
+        align-items: flex-start;
+        gap: 12px;
+        padding: 16px 18px;
+        border-radius: 22px;
+        background: rgba(255, 255, 255, 0.06);
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        font-size: 20px;
+        line-height: 1.35;
+        color: ${palette.text};
+      }
+
+      .scene-point-dot {
+        width: 10px;
+        height: 10px;
+        margin-top: 8px;
+        border-radius: 999px;
+        flex: 0 0 auto;
+        background: linear-gradient(180deg, ${palette.accent}, ${palette.accentAlt});
+      }
+
+      .hero-copy {
+        position: absolute;
+        left: 0;
+        bottom: 100px;
+        max-width: 980px;
+      }
+
+      .hero-rail {
+        position: absolute;
+        top: 40px;
+        right: 0;
+        width: 430px;
+      }
+
+      .layout-hero .scene-body {
+        max-width: 22ch;
+        font-size: 32px;
+      }
+
+      .layout-hero .scene-meta {
+        font-size: 20px;
+      }
+
+      .scene-sidecar {
+        position: absolute;
+        top: 120px;
+        right: 0;
+        width: 460px;
+      }
+
+      .scene.align-right .scene-sidecar {
+        left: 0;
+        right: auto;
+      }
+
+      .quote-frame {
+        position: absolute;
+        inset: 80px 120px 110px;
+        padding: 56px 64px;
+        border-radius: 40px;
+        background:
+          linear-gradient(135deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03)),
+          ${palette.panel};
+        border: 1px solid rgba(255, 255, 255, 0.16);
+        backdrop-filter: blur(18px);
+        box-shadow: 0 28px 90px rgba(0, 0, 0, 0.3);
+      }
+
+      .quote-mark {
+        font-size: 140px;
+        line-height: 0.8;
+        color: ${palette.accent};
+        opacity: 0.9;
+      }
+
+      .quote-text {
+        margin-top: 18px;
+        max-width: 20ch;
+        font-size: 72px;
+        line-height: 1.05;
+        letter-spacing: -0.04em;
+      }
+
+      .quote-support {
+        margin-top: 24px;
+        max-width: 34ch;
+        font-size: 26px;
+        line-height: 1.4;
+        color: rgba(248, 250, 252, 0.92);
+      }
+
+      .quote-frame .scene-points {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        margin-top: 28px;
+      }
+
+      .author-panel {
+        left: 0;
+        width: 860px;
+      }
+
+      .author-photo {
+        position: absolute;
+        right: 96px;
+        bottom: 40px;
+        width: 320px;
+        height: 400px;
+        object-fit: cover;
+        border-radius: 28px;
+        border: 1px solid rgba(255, 255, 255, 0.16);
+        box-shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
+      }
+
+      .scene.align-right .author-photo {
+        left: 96px;
+        right: auto;
+      }
+
+      .cta-board {
+        position: absolute;
+        left: 50%;
+        top: 52%;
+        width: 980px;
+        padding: 56px 64px 48px;
+        transform: translate(-50%, -50%);
+        border-radius: 40px;
+        background:
+          linear-gradient(135deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02)),
+          ${palette.panel};
+        border: 1px solid rgba(255, 255, 255, 0.16);
+        box-shadow: 0 30px 100px rgba(0, 0, 0, 0.34);
+        text-align: center;
+      }
+
+      .cta-board .scene-title,
+      .cta-board .scene-body,
+      .cta-board .scene-meta {
+        margin-left: auto;
+        margin-right: auto;
+      }
+
+      .cta-board .scene-title {
+        max-width: 12ch;
+      }
+
+      .cta-board .scene-points {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        margin-top: 28px;
+      }
+
+      .cta-board .scene-meta {
+        margin-top: 22px;
+        font-size: 16px;
+        letter-spacing: 0.02em;
+        text-transform: none;
+        word-break: break-word;
+      }
+
+      #captions-overlay {
+        position: absolute;
+        left: 72px;
+        right: 72px;
+        bottom: 48px;
+        min-height: 120px;
+        z-index: 14;
+        pointer-events: none;
+      }
+
+      .caption-chip {
+        position: absolute;
+        left: 50%;
+        bottom: 0;
+        transform: translateX(-50%);
+        display: inline-flex;
+        padding: 18px 28px;
+        border-radius: 28px;
+        background: rgba(2, 6, 23, 0.84);
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        box-shadow: 0 20px 56px rgba(0, 0, 0, 0.34);
+        font-size: 30px;
+        line-height: 1.28;
+        font-weight: 700;
+        text-align: center;
+        color: ${palette.text};
+        max-width: 1200px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="root"
+      data-composition-id="amplify-explainer"
+      data-width="${dims.width}"
+      data-height="${dims.height}"
+      data-duration="${args.durationSeconds}"
+    >
+      ${coverImage}
+      <div class="canvas-wash"></div>
+      <div class="grain"></div>
+      ${narrationTrack}
+      <div class="brand-lockup">
+        <div class="brand-kicker">${escapeHtml(
+          args.brief.article.publication?.name || "Amplify explainer",
+        )}</div>
+        <div class="brand-title">${escapeHtml(
+          args.brief.article.primaryAuthor?.name || args.brief.article.title,
+        )}</div>
+      </div>
+      ${sceneMarkup}
+      <div id="captions-overlay"></div>
+    </div>
+
+    <script>
+      const SCENES = ${JSON.stringify(args.script.scenes)};
+      const TRANSCRIPT = ${JSON.stringify(args.transcript)};
+      const DURATION = ${JSON.stringify(args.durationSeconds)};
+      window.__timelines = window.__timelines || {};
+
+      const tl = gsap.timeline({ paused: true });
+      tl.set(".scene", { autoAlpha: 0 }, 0);
+
+      if (document.getElementById("cover-image")) {
+        tl.to(
+          "#cover-image",
+          {
+            scale: 1.06,
+            duration: Math.max(SCENES[0]?.durationSeconds || 8, 8),
+            ease: "none",
+          },
+          0,
+        );
+        tl.to(
+          "#cover-image",
+          {
+            autoAlpha: 0.2,
+            duration: 0.8,
+            ease: "power2.out",
+          },
+          Math.max((SCENES[0]?.durationSeconds || 8) - 0.6, 0.2),
+        );
+      }
+
+      SCENES.forEach((scene, index) => {
+        const selector = "#scene-" + index;
+        const panel = selector + " .scene-panel, " + selector + " .quote-frame, " + selector + " .cta-board";
+        const accent = selector + " .accent-bar";
+        const animateTargets = selector + " .scene-animate";
+        const start = scene.startSeconds;
+        const hold = Math.max(scene.durationSeconds - 0.85, 0.25);
+
+        tl.set(selector, { autoAlpha: 1 }, start);
+        tl.fromTo(accent, { scaleX: 0, opacity: 0 }, { scaleX: 1, opacity: 1, duration: 0.45, ease: "power2.out" }, start + 0.02);
+        tl.fromTo(
+          panel,
+          { y: 40, opacity: 0, scale: 0.98 },
+          { y: 0, opacity: 1, scale: 1, duration: 0.55, ease: "power2.out" },
+          start + 0.04,
+        );
+        tl.fromTo(
+          animateTargets,
+          { y: 24, opacity: 0 },
+          { y: 0, opacity: 1, duration: 0.42, stagger: 0.06, ease: "power2.out" },
+          start + 0.14,
+        );
+        tl.to(
+          panel,
+          { y: -10, duration: hold, ease: "sine.inOut" },
+          start + 0.56,
+        );
+        tl.to(
+          selector,
+          { autoAlpha: 0, duration: 0.28, ease: "power2.in" },
+          Math.max(start + scene.durationSeconds - 0.28, start + 0.8),
+        );
+      });
+
+      function buildCaptionGroups(words) {
+        const groups = [];
+        let current = [];
+        const flush = () => {
+          if (!current.length) return;
+          groups.push({
+            text: current.map((word) => word.text).join(" "),
+            start: current[0].start,
+            end: current[current.length - 1].end,
+          });
+          current = [];
+        };
+
+        words.forEach((word) => {
+          current.push(word);
+          if (
+            current.length >= 6 ||
+            /[.!?]$/.test(word.text) ||
+            word.end - current[0].start >= 2.4
+          ) {
+            flush();
+          }
+        });
+
+        flush();
+        return groups;
+      }
+
+      const captionRoot = document.getElementById("captions-overlay");
+      const captionGroups = buildCaptionGroups(TRANSCRIPT);
+      captionGroups.forEach((group, index) => {
+        const node = document.createElement("div");
+        node.className = "caption-chip";
+        node.id = "caption-group-" + index;
+        node.textContent = group.text;
+        captionRoot.appendChild(node);
+        tl.fromTo(
+          node,
+          { autoAlpha: 0, y: 18, scale: 0.98 },
+          { autoAlpha: 1, y: 0, scale: 1, duration: 0.16, ease: "power2.out" },
+          group.start,
+        );
+        tl.to(
+          node,
+          { autoAlpha: 0, y: 10, duration: 0.16, ease: "power2.in" },
+          group.end + 0.04,
+        );
+      });
+
+      window.__timelines["amplify-explainer"] = tl;
+    </script>
+  </body>
+</html>`;
+}
+
+const __amp_filename = fileURLToPath(import.meta.url);
+const __amp_dirname = dirname(__amp_filename);
+const SKILLS_ROOT =
+  process.env.AMPLIFY_WORKER_SKILLS_ROOT?.trim() || joinPath(__amp_dirname, "..", "skills");
+
+let __cachedSkillBundle: SkillBundle | null = null;
+function getSkillBundleOnce(): SkillBundle {
+  if (!__cachedSkillBundle) {
+    __cachedSkillBundle = loadSkillBundle(SKILLS_ROOT);
+  }
+  return __cachedSkillBundle;
+}
+
+const COMPOSITION_JSON_SCHEMA = {
+  type: "object",
+  additionalProperties: false,
+  required: ["indexHtml", "narration", "notes"],
+  properties: {
+    indexHtml: { type: "string" },
+    narration: {
+      type: "array",
+      items: {
+        type: "object",
+        additionalProperties: false,
+        required: ["sceneId", "startSeconds", "narrationText"],
+        properties: {
+          sceneId: { type: "string" },
+          startSeconds: { type: "number" },
+          narrationText: { type: "string" },
+        },
+      },
+    },
+    notes: { type: ["string", "null"] },
+  },
+} as const;
+
+const COMPOSITION_MAX_ATTEMPTS = Number.parseInt(
+  process.env.AMPLIFY_COMPOSITION_MAX_ATTEMPTS || "5",
+  10,
+);
+const COMPOSITION_LLM_TIMEOUT_MS = Number.parseInt(
+  process.env.AMPLIFY_COMPOSITION_LLM_TIMEOUT_MS || "240000",
+  10,
+);
+
+interface NarrationSegment {
+  sceneId: string;
+  startSeconds: number;
+  narrationText: string;
+}
+
+interface VoiceoverResult {
+  voiceoverArtifact: ArtifactRef | null;
+  narrationSrc: string | null;
+  transcriptWords: TimedWord[];
+}
+
+async function authorNarrationPlan(opts: {
+  brief: ExplainerVideoBrief;
+  plan: ExplainerVideoRenderPlan;
+  source: ExplainerSourceArtifact;
+  skillBundle: SkillBundle;
+  ai: { baseUrl: string; apiKey: string; model: string };
+  timeoutMs: number;
+}): Promise<NarrationSegment[] | null> {
+  try {
+    const narrationMessages = buildNarrationOnlyMessages({
+      brief: opts.brief,
+      plan: opts.plan,
+      source: opts.source,
+      skillBundle: opts.skillBundle,
+    });
+    const result = await authorComposition<{
+      narration: NarrationSegment[];
+      notes: string | null;
+    }>({
+      conversation: narrationMessages,
+      schema: NARRATION_JSON_SCHEMA as object,
+      schemaName: "amplify_explainer_narration",
+      ai: opts.ai,
+      timeoutMs: opts.timeoutMs,
+    });
+    return result.narration && result.narration.length > 0 ? result.narration : null;
+  } catch (err) {
+    console.warn(
+      "[worker] narration authoring failed; will use deterministic fallback script",
+      err,
+    );
+    return null;
+  }
+}
+
+function scriptFromNarration(
+  narration: NarrationSegment[],
+  targetDurationSeconds: number,
+): ExplainerScript {
+  const segments = narration.map((n, idx) => {
+    const next = narration[idx + 1];
+    const duration = next
+      ? Math.max(0.5, next.startSeconds - n.startSeconds)
+      : Math.max(0.5, targetDurationSeconds - n.startSeconds);
+    return {
+      id: n.sceneId,
+      title: n.sceneId,
+      narration: n.narrationText,
+      durationSeconds: duration,
+    };
+  });
+  return {
+    version: "2026-05-15",
+    targetDurationSeconds,
+    fullNarration: narration.map((n) => n.narrationText).join(" "),
+    scenes: [],
+    segments,
+  } as unknown as ExplainerScript;
+}
+
+async function synthesizeVoiceoverIfEnabled(opts: {
+  script: ExplainerScript;
+  plan: ExplainerVideoRenderPlan;
+  projectDir: string;
+  message: AmplifyQueueMessage;
+  jobId: string;
+  existingVoiceover: ArtifactRef | null;
+  onStart: () => Promise<unknown>;
+}): Promise<VoiceoverResult> {
+  if (opts.plan.voice.enabled) {
+    await opts.onStart();
+    const voiceStyle = opts.plan.voice.style || "documentary";
+    const seed = Number.parseInt(
+      createHash("sha256").update(opts.jobId).digest("hex").slice(0, 8),
+      16,
+    );
+    const tts = await synthesizeSpeechWithTimestamps({
+      text: opts.script.fullNarration,
+      style: voiceStyle,
+      seed,
+    });
+    writeFileSync(join(opts.projectDir, "narration.mp3"), tts.audio);
+    const voiceoverArtifact = await uploadBufferArtifact(
+      opts.message.assetsBucket,
+      `${opts.message.baseKey}/voiceover.mp3`,
+      tts.audio,
+      tts.mimeType,
+    );
+    return { voiceoverArtifact, narrationSrc: "narration.mp3", transcriptWords: tts.words };
+  }
+  if (opts.plan.captions.enabled) {
+    return {
+      voiceoverArtifact: opts.existingVoiceover,
+      narrationSrc: null,
+      transcriptWords: buildSyntheticWordTimings(opts.script.segments),
+    };
+  }
+  return {
+    voiceoverArtifact: opts.existingVoiceover,
+    narrationSrc: null,
+    transcriptWords: [],
+  };
+}
+
+async function measureCanonicalDuration(opts: {
+  narrationSrc: string | null;
+  projectDir: string;
+  transcriptWords: TimedWord[];
+  scriptTargetDuration: number;
+}): Promise<number> {
+  let audioDurationSeconds = 0;
+  if (opts.narrationSrc) {
+    try {
+      audioDurationSeconds = await probeDurationWithFfprobe(
+        join(opts.projectDir, opts.narrationSrc),
+      );
+    } catch (err) {
+      console.warn(
+        `[worker] ffprobe failed on ${opts.narrationSrc}; falling back to transcript last-word end`,
+        err,
+      );
+    }
+  }
+  const lastWordEnd = opts.transcriptWords[opts.transcriptWords.length - 1]?.end ?? 0;
+  if (opts.transcriptWords.length > 0 || audioDurationSeconds > 0) {
+    return Math.max(opts.scriptTargetDuration, audioDurationSeconds, lastWordEnd);
+  }
+  return opts.scriptTargetDuration;
+}
+
+async function processRenderJob(message: AmplifyQueueMessage) {
+  let job = await getExplainerVideoJob(message.jobId);
+  const source = await readJsonArtifact<ExplainerSourceArtifact>(
+    message.assetsBucket,
+    message.sourceKey,
+  );
+
+  job = await mergeExplainerVideoJob(message.jobId, {
+    status: "planning",
+    stage: "loading_assets",
+    progress: 0.18,
+    workerStatus: "processing",
+    message: "Worker claimed the job and is loading the render inputs.",
+  });
+
+  let workDir: string | null = null;
+
+  try {
+    const user = await getUser(message.ownerUserId);
+    if (!user.aiBaseUrl || !user.aiApiKey || !user.aiModel) {
+      throw new Error("User AI configuration missing — cannot author composition.");
+    }
+
+    const skillBundle = getSkillBundleOnce();
+    const aiConfig = {
+      baseUrl: user.aiBaseUrl!,
+      apiKey: user.aiApiKey!,
+      model: user.aiModel!,
+    };
+
+    // ── Step 1: LLM authors narration only ──────────────────────────────────
+    // Splitting narration from HTML lets us TTS first and feed the actual audio
+    // length back into the HTML authoring call. Without this, the LLM authors
+    // visual scenes for plan.targetDurationSeconds while ElevenLabs produces
+    // audio of a different length — the canvas freezes once scenes end but
+    // audio keeps playing (bd-33q round 3).
+    await mergeExplainerVideoJob(message.jobId, {
+      status: "planning",
+      stage: "authoring_narration",
+      progress: 0.22,
+      message: "Authoring narration script.",
+    });
+    const narrationFromLlm = await authorNarrationPlan({
+      brief: job.videoBrief,
+      plan: job.plan,
+      source,
+      skillBundle,
+      ai: aiConfig,
+      timeoutMs: COMPOSITION_LLM_TIMEOUT_MS,
+    });
+
+    // ── Step 2: Build initial script (from LLM narration or fallback) ───────
+    workDir = mkdtempSync(join(tmpdir(), "amplify-video-worker-"));
+    const projectDir = join(workDir, "project");
+    mkdirSync(projectDir, { recursive: true });
+
+    // Pre-fetch the cover image so the LLM can reference it as a local path —
+    // Chromium's CORS rules reject Substack-hosted images during canvas capture
+    // (no Access-Control-Allow-Origin), so remote URLs render as alt text.
+    const localCoverPath = await prefetchCoverImage(job.videoBrief, projectDir);
+    const briefForLlm = localCoverPath
+      ? briefWithLocalCover(job.videoBrief, localCoverPath)
+      : job.videoBrief;
+
+    const script: ExplainerScript = narrationFromLlm
+      ? scriptFromNarration(narrationFromLlm, job.plan.targetDurationSeconds)
+      : buildExplainerScript({ brief: job.videoBrief, plan: job.plan, source });
+
+    // ── Step 3: TTS first (before HTML authoring) ───────────────────────────
+    const voiceover = await synthesizeVoiceoverIfEnabled({
+      script,
+      plan: job.plan,
+      projectDir,
+      message,
+      jobId: job.jobId,
+      existingVoiceover: job.artifacts.voiceover ?? null,
+      onStart: async () => {
+        job = await mergeExplainerVideoJob(message.jobId, {
+          status: "voiceover",
+          stage: "synthesizing_voiceover",
+          progress: 0.3,
+          message: "Generating voiceover with ElevenLabs.",
+          billingSurfaceId: "elevenlabs:text-to-speech",
+          rawBillingSurfaceKey: process.env.ELEVENLABS_MODEL_ID || "eleven_multilingual_v2",
+        });
+      },
+    });
+    const { transcriptWords, narrationSrc, voiceoverArtifact } = voiceover;
+
+    // ── Step 4: Probe actual audio duration ─────────────────────────────────
+    const durationSeconds = await measureCanonicalDuration({
+      narrationSrc,
+      projectDir,
+      transcriptWords,
+      scriptTargetDuration: script.targetDurationSeconds,
+    });
+
+    // ── Step 5: LLM authors HTML composition for actual audio duration ──────
+    // Derived plan overrides targetDurationSeconds so the LLM sizes scenes to
+    // match the audio it has not seen but whose duration we now know exactly.
+    const derivedPlan: ExplainerVideoRenderPlan = {
+      ...job.plan,
+      targetDurationSeconds: durationSeconds,
+    };
+    const predeterminedNarration = narrationFromLlm
+      ? {
+          scenes: narrationFromLlm.map((n) => ({
+            sceneId: n.sceneId,
+            startSeconds: n.startSeconds,
+            narrationText: n.narrationText,
+          })),
+          audioDurationSeconds: durationSeconds,
+        }
+      : null;
+
+    let currentAttemptCounter = 0;
+    const loopResult = await runCompositionLoop({
+      brief: briefForLlm,
+      plan: derivedPlan,
+      source,
+      skillBundle,
+      maxAttempts: COMPOSITION_MAX_ATTEMPTS,
+      llmTimeoutMs: COMPOSITION_LLM_TIMEOUT_MS,
+      llm: async (conversation) => {
+        currentAttemptCounter += 1;
+        await mergeExplainerVideoJob(message.jobId, {
+          status: "planning",
+          stage: `composing_attempt_${currentAttemptCounter}`,
+          progress: Math.min(0.55, 0.4 + currentAttemptCounter * 0.04),
+          message: `Authoring composition HTML (attempt ${currentAttemptCounter}/${COMPOSITION_MAX_ATTEMPTS}).`,
+        });
+        return authorComposition({
+          conversation,
+          schema: COMPOSITION_JSON_SCHEMA as object,
+          schemaName: "amplify_explainer_composition",
+          ai: {
+            baseUrl: user.aiBaseUrl!,
+            apiKey: user.aiApiKey!,
+            model: user.aiModel!,
+          },
+          timeoutMs: COMPOSITION_LLM_TIMEOUT_MS,
+        });
+      },
+      lint: lintCompositionHtml,
+      predeterminedNarration,
+    });
+
+    let usingFallback = false;
+    let scriptArtifact: ArtifactRef | null = null;
+    let authoredIndexHtml: string | null = null;
+
+    if (loopResult.ok) {
+      authoredIndexHtml = loopResult.indexHtml;
+      scriptArtifact = await uploadBufferArtifact(
+        message.assetsBucket,
+        `${message.baseKey}/composition.html`,
+        Buffer.from(loopResult.indexHtml, "utf-8"),
+        "text/html",
+      );
+    } else {
+      usingFallback = true;
+      for (const err of loopResult.errors) {
+        const detail = err.detail ? `\n\n${err.detail}` : "";
+        await uploadBufferArtifact(
+          message.assetsBucket,
+          `${message.baseKey}/attempts/attempt-${err.attempt}-error.txt`,
+          Buffer.from(`${err.kind}\n\n${err.message}${detail}`, "utf-8"),
+          "text/plain",
+        );
+      }
+      await mergeExplainerVideoJob(message.jobId, {
+        status: "planning",
+        stage: "fallback_template_render",
+        progress: 0.58,
+        message: `LLM HTML authoring failed after ${COMPOSITION_MAX_ATTEMPTS} attempts — using template renderer.`,
+      });
+      scriptArtifact = await uploadJsonArtifact(
+        message.assetsBucket,
+        `${message.baseKey}/script.json`,
+        script,
+      );
+    }
+
+    const transcriptArtifact =
+      transcriptWords.length > 0
+        ? await uploadJsonArtifact(
+            message.assetsBucket,
+            `${message.baseKey}/transcript.json`,
+            transcriptWords,
+          )
+        : null;
+    const captionsArtifact =
+      transcriptWords.length > 0 && job.plan.captions.exportSrt
+        ? await uploadBufferArtifact(
+            message.assetsBucket,
+            `${message.baseKey}/captions.srt`,
+            Buffer.from(buildSrt(transcriptWords), "utf-8"),
+            "application/x-subrip",
+          )
+        : null;
+
+    job = await mergeExplainerVideoJob(message.jobId, {
+      status: "rendering",
+      stage: "building_composition",
+      progress: 0.62,
+      artifacts: {
+        ...job.artifacts,
+        script: scriptArtifact,
+        transcript: transcriptArtifact,
+        captions: captionsArtifact,
+        voiceover: voiceoverArtifact,
+      },
+      message: usingFallback
+        ? "Template script ready (fallback). Rendering explainer video with Hyperframes."
+        : "LLM-authored composition accepted. Rendering explainer video with Hyperframes.",
+    });
+    if (!usingFallback && authoredIndexHtml) {
+      // The LLM bakes data-duration to script.targetDurationSeconds (per
+      // amplify-constraints.md) but ElevenLabs narration is unbounded.
+      // Extend the root, narration track, and last scene so audio plays
+      // to completion instead of cutting off mid-sentence.
+      const extended = extendCompositionDuration(authoredIndexHtml, durationSeconds);
+      const withoutCrossorigin = stripCrossoriginOnLocalImages(extended.html);
+      const qr = await injectQrCode(withoutCrossorigin, job.plan.cta.url);
+      writeFileSync(join(projectDir, "index.html"), qr.html, "utf-8");
+      if (extended.extended) {
+        console.log(
+          `[worker] extended LLM composition: ${extended.originalRootDurationSeconds}s → ${extended.newRootDurationSeconds}s`,
+          extended.modifications,
+        );
+      }
+      if (qr.injected) {
+        console.log(
+          `[worker] injected qr-code for ${job.plan.cta.url} (fallback=${qr.fallbackAppended})`,
+        );
+      }
+    } else {
+      writeFileSync(
+        join(projectDir, "index.html"),
+        buildHtmlTemplate({
+          brief: job.videoBrief,
+          plan: derivedPlan,
+          script,
+          transcript: transcriptWords,
+          durationSeconds,
+          narrationSrc,
+        }),
+        "utf-8",
+      );
+    }
+
+    const outputPath = join(workDir, "output.mp4");
+    const renderJob = createRenderJob({
+      fps: { num: 30, den: 1 },
+      quality: "high",
+      format: "mp4",
+      workers: renderWorkers,
+      debug: false,
+    });
+
+    await executeRenderJob(renderJob, projectDir, outputPath);
+
+    const sanity = await postRenderSanityCheck(outputPath, job.plan.targetDurationSeconds);
+    if (!sanity.ok) {
+      throw new Error(`Post-render sanity check failed: ${sanity.reason}`);
+    }
+
+    job = await mergeExplainerVideoJob(message.jobId, {
+      status: "uploading",
+      stage: "uploading_artifacts",
+      progress: 0.9,
+      message: "Uploading the finished MP4 and final artifacts.",
+    });
+
+    const videoArtifact = await uploadFileArtifact(
+      message.assetsBucket,
+      `${message.baseKey}/video.mp4`,
+      outputPath,
+      "video/mp4",
+    );
+
+    await mergeExplainerVideoJob(message.jobId, {
+      status: "completed",
+      stage: "complete",
+      progress: 1,
+      workerStatus: "completed",
+      message: usingFallback
+        ? `LLM authoring failed after ${COMPOSITION_MAX_ATTEMPTS} attempts — fell back to the template renderer.`
+        : "Explainer video rendered successfully.",
+      artifacts: {
+        ...job.artifacts,
+        script: scriptArtifact,
+        transcript: transcriptArtifact,
+        captions: captionsArtifact,
+        voiceover: voiceoverArtifact,
+        video: videoArtifact,
+      },
+    });
+  } catch (error) {
+    const messageText = error instanceof Error ? error.message : String(error);
+    await mergeExplainerVideoJob(message.jobId, {
+      status: "failed",
+      stage: "worker_failed",
+      progress: 0,
+      workerStatus: "failed",
+      failureCode: "worker_render_failed",
+      message: messageText,
+    });
+    throw error;
+  } finally {
+    if (workDir) {
+      rmSync(workDir, { recursive: true, force: true });
+    }
+  }
+}
+
+async function deleteMessage(receiptHandle: string) {
+  await sqs.send(
+    new DeleteMessageCommand({
+      QueueUrl: queueUrl,
+      ReceiptHandle: receiptHandle,
+    }),
+  );
+}
+
+async function pollOnce() {
+  const response = await sqs.send(
+    new ReceiveMessageCommand({
+      QueueUrl: queueUrl,
+      MaxNumberOfMessages: 1,
+      WaitTimeSeconds: pollWaitSeconds,
+      VisibilityTimeout: visibilityTimeout,
+    }),
+  );
+
+  const message = response.Messages?.[0];
+  if (!message?.ReceiptHandle || !message.Body) {
+    return;
+  }
+
+  let parsed: AmplifyQueueMessage;
+  try {
+    parsed = JSON.parse(message.Body) as AmplifyQueueMessage;
+  } catch (error) {
+    console.error("Invalid queue message body", error);
+    await deleteMessage(message.ReceiptHandle);
+    return;
+  }
+
+  currentJobId = parsed.jobId;
+  try {
+    await processRenderJob(parsed);
+    processedJobs += 1;
+    await deleteMessage(message.ReceiptHandle);
+  } catch (error) {
+    failedJobs += 1;
+    console.error("Failed to process Amplify explainer job", {
+      jobId: parsed.jobId,
+      error: error instanceof Error ? error.message : String(error),
+    });
+    await deleteMessage(message.ReceiptHandle);
+  } finally {
+    currentJobId = null;
+  }
+}
+
+async function runLoop() {
+  if (!queueUrl) {
+    throw new Error("Missing AMPLIFY_VIDEO_QUEUE_URL");
+  }
+
+  while (!shuttingDown) {
+    try {
+      await pollOnce();
+    } catch (error) {
+      console.error("Worker poll failure", error);
+      await new Promise((resolve) => setTimeout(resolve, 5000));
+    }
+  }
+}
+
+export function startHealthServer() {
+  const server = createServer((req, res) => {
+    if (!req.url || req.url === "/health") {
+      const body = JSON.stringify({
+        ok: true,
+        queueUrlConfigured: Boolean(queueUrl),
+        currentJobId,
+        processedJobs,
+        failedJobs,
+      });
+      res.writeHead(200, { "Content-Type": "application/json" });
+      res.end(body);
+      return;
+    }
+
+    res.writeHead(404, { "Content-Type": "application/json" });
+    res.end(JSON.stringify({ error: "not_found" }));
+  });
+
+  server.listen(healthPort, () => {
+    console.log(`Amplify video worker health server listening on ${healthPort}`);
+  });
+  return server;
+}
+
+export async function startWorker() {
+  const server = startHealthServer();
+
+  const stop = () => {
+    shuttingDown = true;
+    server.close();
+  };
+
+  process.on("SIGINT", stop);
+  process.on("SIGTERM", stop);
+
+  await runLoop();
+}
+
+export type AmplifyWorkerHealthServer = Server;
diff --git a/packages/amplify-video-worker/tests/amplify-getUser.test.ts b/packages/amplify-video-worker/tests/amplify-getUser.test.ts
new file mode 100644
index 000000000..ac9fd873b
--- /dev/null
+++ b/packages/amplify-video-worker/tests/amplify-getUser.test.ts
@@ -0,0 +1,36 @@
+import { describe, expect, test } from "bun:test";
+import { __testHooks } from "../src/amplify";
+import type { UserRecord } from "../src/types";
+
+describe("getUserWithClient", () => {
+  test("returns the user record when present", async () => {
+    const calls: any[] = [];
+    const fakeDynamo = {
+      send: async (cmd: any) => {
+        calls.push(cmd.input);
+        return {
+          Item: {
+            userId: "u-1",
+            aiBaseUrl: "https://api.openai.com/v1",
+            aiApiKey: "sk-test",
+            aiModel: "gpt-5",
+          } satisfies UserRecord,
+        };
+      },
+    };
+
+    const result = await __testHooks.getUserWithClient(fakeDynamo as any, "u-1");
+    expect(result.userId).toBe("u-1");
+    expect(result.aiModel).toBe("gpt-5");
+    expect(calls[0].Key).toEqual({ userId: "u-1" });
+  });
+
+  test("throws a typed error when the user is missing", async () => {
+    const fakeDynamo = {
+      send: async () => ({}),
+    };
+    await expect(__testHooks.getUserWithClient(fakeDynamo as any, "u-missing")).rejects.toThrow(
+      /User record not found/,
+    );
+  });
+});
diff --git a/packages/amplify-video-worker/tests/composition-aspect-author.test.ts b/packages/amplify-video-worker/tests/composition-aspect-author.test.ts
new file mode 100644
index 000000000..c9d13c6a3
--- /dev/null
+++ b/packages/amplify-video-worker/tests/composition-aspect-author.test.ts
@@ -0,0 +1,16 @@
+import { describe, expect, test } from "bun:test";
+import { dimensionsForAspect } from "../src/composition";
+
+describe("dimensionsForAspect", () => {
+  test("16:9 returns 1920×1080", () => {
+    expect(dimensionsForAspect("16:9")).toEqual({ width: 1920, height: 1080 });
+  });
+
+  test("1:1 returns 1080×1080", () => {
+    expect(dimensionsForAspect("1:1")).toEqual({ width: 1080, height: 1080 });
+  });
+
+  test("9:16 returns 1080×1920", () => {
+    expect(dimensionsForAspect("9:16")).toEqual({ width: 1080, height: 1920 });
+  });
+});
diff --git a/packages/amplify-video-worker/tests/composition-duration-extension.test.ts b/packages/amplify-video-worker/tests/composition-duration-extension.test.ts
new file mode 100644
index 000000000..b5152a29a
--- /dev/null
+++ b/packages/amplify-video-worker/tests/composition-duration-extension.test.ts
@@ -0,0 +1,164 @@
+import { describe, expect, test } from "bun:test";
+import { extendCompositionDuration } from "../src/composition";
+
+function buildComposition(opts: {
+  rootDuration: number;
+  narrationDuration?: number | null;
+  scenes?: Array<{ id: string; start: number; duration: number }>;
+}): string {
+  const narration =
+    opts.narrationDuration === null
+      ? ""
+      : `<audio id="narration-track" src="./narration.mp3" data-start="0" data-duration="${opts.narrationDuration ?? opts.rootDuration}" data-track-index="8"></audio>`;
+  const scenes = (opts.scenes ?? [])
+    .map(
+      (s) =>
+        `<div id="${s.id}" class="scene" data-start="${s.start}" data-duration="${s.duration}" data-track-index="1">Scene ${s.id}</div>`,
+    )
+    .join("\n      ");
+  return `<!doctype html>
+<html>
+  <body>
+    <div id="root" data-composition-id="amplify-explainer" data-width="1920" data-height="1080" data-duration="${opts.rootDuration}">
+      ${narration}
+      ${scenes}
+    </div>
+  </body>
+</html>`;
+}
+
+describe("extendCompositionDuration", () => {
+  test("no-op when actual duration is at or below target", () => {
+    const html = buildComposition({
+      rootDuration: 60,
+      scenes: [{ id: "s1", start: 0, duration: 60 }],
+    });
+    const result = extendCompositionDuration(html, 58);
+    expect(result.extended).toBe(false);
+    expect(result.html).toBe(html);
+    expect(result.originalRootDurationSeconds).toBe(60);
+  });
+
+  test("extends root, narration track, and last scene when narration overruns", () => {
+    const html = buildComposition({
+      rootDuration: 60,
+      narrationDuration: 60,
+      scenes: [
+        { id: "s1", start: 0, duration: 20 },
+        { id: "s2", start: 20, duration: 20 },
+        { id: "s3", start: 40, duration: 20 },
+      ],
+    });
+    const result = extendCompositionDuration(html, 72.5);
+
+    expect(result.extended).toBe(true);
+    expect(result.originalRootDurationSeconds).toBe(60);
+    expect(result.newRootDurationSeconds).toBe(72.5);
+
+    expect(result.html).toContain(
+      'data-composition-id="amplify-explainer" data-width="1920" data-height="1080" data-duration="72.5"',
+    );
+    expect(result.html).toContain(
+      'id="narration-track" src="./narration.mp3" data-start="0" data-duration="72.5"',
+    );
+    // s3 starts at 40, so its new duration is 72.5 - 40 = 32.5
+    expect(result.html).toContain('id="s3" class="scene" data-start="40" data-duration="32.5"');
+    // Earlier scenes are untouched
+    expect(result.html).toContain('id="s1" class="scene" data-start="0" data-duration="20"');
+    expect(result.html).toContain('id="s2" class="scene" data-start="20" data-duration="20"');
+
+    expect(result.modifications).toEqual(
+      expect.arrayContaining([
+        { target: "root", from: 60, to: 72.5 },
+        { target: "narration-track", from: 60, to: 72.5 },
+        { target: "last-scene", from: 20, to: 32.5 },
+      ]),
+    );
+  });
+
+  test("works when narration track is absent (voice disabled)", () => {
+    const html = buildComposition({
+      rootDuration: 30,
+      narrationDuration: null,
+      scenes: [
+        { id: "s1", start: 0, duration: 15 },
+        { id: "s2", start: 15, duration: 15 },
+      ],
+    });
+    const result = extendCompositionDuration(html, 42);
+    expect(result.extended).toBe(true);
+    expect(result.html).toContain('data-duration="42"'); // root
+    expect(result.html).toContain('id="s2" class="scene" data-start="15" data-duration="27"');
+    expect(result.modifications.some((m) => m.target === "narration-track")).toBe(false);
+  });
+
+  test("preserves integer formatting for integer durations", () => {
+    const html = buildComposition({
+      rootDuration: 60,
+      scenes: [{ id: "s1", start: 0, duration: 60 }],
+    });
+    const result = extendCompositionDuration(html, 70);
+    expect(result.html).toContain('data-duration="70"');
+    expect(result.html).not.toContain('data-duration="70.0"');
+  });
+
+  test("no-op when root has no data-composition-id (unknown HTML)", () => {
+    const html = `<!doctype html><html><body><div>nothing</div></body></html>`;
+    const result = extendCompositionDuration(html, 90);
+    expect(result.extended).toBe(false);
+    expect(result.html).toBe(html);
+  });
+
+  test("no-op when actual duration is zero or negative", () => {
+    const html = buildComposition({
+      rootDuration: 60,
+      scenes: [{ id: "s1", start: 0, duration: 60 }],
+    });
+    expect(extendCompositionDuration(html, 0).extended).toBe(false);
+    expect(extendCompositionDuration(html, -5).extended).toBe(false);
+    expect(extendCompositionDuration(html, Number.NaN).extended).toBe(false);
+  });
+
+  test("picks the latest-ending clip even when ordering is not last in document", () => {
+    // s2 declared last but ends earlier than s1
+    const html = `<!doctype html>
+<html><body>
+  <div id="root" data-composition-id="amplify-explainer" data-width="1920" data-height="1080" data-duration="60">
+    <audio id="narration-track" src="./narration.mp3" data-start="0" data-duration="60" data-track-index="8"></audio>
+    <div id="s1" data-start="40" data-duration="20" data-track-index="1">end-at-60</div>
+    <div id="s2" data-start="0" data-duration="40" data-track-index="2">end-at-40</div>
+  </div>
+</body></html>`;
+    const result = extendCompositionDuration(html, 75);
+    expect(result.extended).toBe(true);
+    // s1 ends at 60 (latest) → extend it
+    expect(result.html).toContain('id="s1" data-start="40" data-duration="35"');
+    expect(result.html).toContain('id="s2" data-start="0" data-duration="40"');
+  });
+
+  test("handles single-quoted attributes", () => {
+    const html = `<!doctype html><html><body>
+  <div data-composition-id='amplify-explainer' data-width='1920' data-height='1080' data-duration='30'>
+    <audio id='narration-track' src='./narration.mp3' data-start='0' data-duration='30'></audio>
+    <div data-start='0' data-duration='30'>scene</div>
+  </div>
+</body></html>`;
+    const result = extendCompositionDuration(html, 45);
+    expect(result.extended).toBe(true);
+    expect(result.html).toContain(`data-duration="45"`);
+  });
+
+  test("last-scene modification is skipped if last scene already covers actual duration", () => {
+    // Scene end already exceeds actual duration somehow — only root + narration update
+    const html = buildComposition({
+      rootDuration: 60,
+      narrationDuration: 60,
+      scenes: [{ id: "s1", start: 0, duration: 80 }], // end=80 > actual=70
+    });
+    const result = extendCompositionDuration(html, 70);
+    expect(result.extended).toBe(true);
+    expect(result.modifications.some((m) => m.target === "last-scene")).toBe(false);
+    // s1 untouched
+    expect(result.html).toContain('id="s1" class="scene" data-start="0" data-duration="80"');
+  });
+});
diff --git a/packages/amplify-video-worker/tests/composition-lint.test.ts b/packages/amplify-video-worker/tests/composition-lint.test.ts
new file mode 100644
index 000000000..05b33e896
--- /dev/null
+++ b/packages/amplify-video-worker/tests/composition-lint.test.ts
@@ -0,0 +1,171 @@
+import { describe, expect, test } from "bun:test";
+import { lintCompositionHtml, formatLintForFeedback, lintGsapSelectors } from "../src/composition";
+
+const WELL_FORMED = `<!doctype html><html><body>
+  <div data-composition-id="amplify-explainer" data-width="1920" data-height="1080" data-duration="60">
+    <div class="clip scene" data-start="0" data-duration="10" data-track-index="0"></div>
+    <div class="clip scene" data-start="10" data-duration="10" data-track-index="0"></div>
+  </div>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
+  <script>
+    window.__timelines = {};
+    const tl = gsap.timeline({ paused: true });
+    tl.set({}, {}, 20);
+    window.__timelines["amplify-explainer"] = tl;
+  </script>
+</body></html>`;
+
+describe("lintCompositionHtml", () => {
+  test("returns no errors for a well-formed composition", async () => {
+    const result = await lintCompositionHtml(WELL_FORMED);
+    expect(result.errors).toHaveLength(0);
+  });
+
+  test("flags a composition missing data-composition-id", async () => {
+    const broken = WELL_FORMED.replace(' data-composition-id="amplify-explainer"', "");
+    const result = await lintCompositionHtml(broken);
+    expect(result.errors.length).toBeGreaterThan(0);
+  });
+});
+
+describe("lintGsapSelectors (bd-n59)", () => {
+  // Mirrors the failure pattern from job 43d76fe9: the LLM emits a #scene-hook
+  // wrapper that contains .badge, but its inline GSAP timeline animates
+  // #scene-hook .kicker (which doesn't exist), so the kicker never animates in.
+  const BUG_PATTERN = `<!doctype html><html><body>
+  <div data-composition-id="amplify-explainer" data-width="1920" data-height="1080" data-duration="60">
+    <section id="scene-hook" class="clip scene" data-start="0" data-duration="10" data-track-index="0">
+      <div class="badge">Hello</div>
+    </section>
+    <section id="scene-problem" class="clip scene" data-start="10" data-duration="10" data-track-index="0">
+      <div class="modes"><div class="mode">A</div></div>
+      <p class="split-note">note</p>
+    </section>
+  </div>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
+  <script>
+    window.__timelines = {};
+    const tl = gsap.timeline({ paused: true });
+    tl.from("#scene-hook .kicker", { opacity: 0 }, 0);
+    tl.from("#scene-problem .body, #scene-problem .warning, #scene-problem .meta", { y: 20 }, 10);
+    window.__timelines["amplify-explainer"] = tl;
+  </script>
+</body></html>`;
+
+  test("flags the exact bd-n59 selectors as missing", () => {
+    const findings = lintGsapSelectors(BUG_PATTERN);
+    const messages = findings.map((f) => f.message).join("\n");
+    expect(findings.length).toBe(4); // .kicker, .body, .warning, .meta
+    expect(findings.every((f) => f.ruleId === "gsap-selector-missing")).toBe(true);
+    expect(messages).toContain(".kicker");
+    expect(messages).toContain(".body");
+    expect(messages).toContain(".warning");
+    expect(messages).toContain(".meta");
+  });
+
+  test("lintCompositionHtml surfaces gsap selector errors", async () => {
+    const result = await lintCompositionHtml(BUG_PATTERN);
+    const ids = result.errors.map((e) => e.ruleId);
+    expect(ids).toContain("gsap-selector-missing");
+  });
+
+  test("passes when every gsap selector resolves to a DOM token", () => {
+    const html = `<!doctype html><html><body>
+      <div data-composition-id="amplify-explainer" data-duration="10">
+        <section id="scene-a"><div class="kicker">k</div></section>
+      </div>
+      <script>
+        window.__timelines = {};
+        const tl = gsap.timeline({ paused: true });
+        tl.from("#scene-a .kicker", { opacity: 0 }, 0);
+        window.__timelines["amplify-explainer"] = tl;
+      </script>
+    </body></html>`;
+    expect(lintGsapSelectors(html)).toHaveLength(0);
+  });
+
+  test("flags missing id and class in a single compound selector", () => {
+    const html = `<!doctype html><html><body>
+      <div data-composition-id="amplify-explainer">
+        <section id="scene-real"><div class="present">p</div></section>
+      </div>
+      <script>gsap.from("#scene-missing .absent", {});</script>
+    </body></html>`;
+    const findings = lintGsapSelectors(html);
+    expect(findings).toHaveLength(1);
+    expect(findings[0]!.message).toContain("#scene-missing");
+    expect(findings[0]!.message).toContain(".absent");
+  });
+
+  test("splits comma-separated selector lists and only flags missing parts", () => {
+    const html = `<!doctype html><html><body>
+      <div data-composition-id="amplify-explainer">
+        <section id="scene-a"><div class="present">x</div></section>
+      </div>
+      <script>gsap.from("#scene-a .present, #scene-a .gone", {});</script>
+    </body></html>`;
+    const findings = lintGsapSelectors(html);
+    expect(findings).toHaveLength(1);
+    expect(findings[0]!.message).toContain(".gone");
+    expect(findings[0]!.message).not.toContain(".present");
+  });
+
+  test("ignores template-literal selectors that interpolate", () => {
+    const html = `<!doctype html><html><body>
+      <div data-composition-id="amplify-explainer"></div>
+      <script>gsap.from(\`#scene-\${i} .body\`, {});</script>
+    </body></html>`;
+    expect(lintGsapSelectors(html)).toHaveLength(0);
+  });
+
+  test("handles chained timeline calls (tl.to / master.fromTo)", () => {
+    const html = `<!doctype html><html><body>
+      <div data-composition-id="amplify-explainer">
+        <section id="scene-a"><div class="present">x</div></section>
+      </div>
+      <script>
+        const master = gsap.timeline();
+        master.fromTo("#scene-a .missing", { x: 0 }, { x: 1 });
+      </script>
+    </body></html>`;
+    const findings = lintGsapSelectors(html);
+    expect(findings).toHaveLength(1);
+    expect(findings[0]!.message).toContain(".missing");
+  });
+
+  test("returns no findings when html contains no gsap calls", () => {
+    const html = `<!doctype html><html><body><div data-composition-id="amplify-explainer"></div></body></html>`;
+    expect(lintGsapSelectors(html)).toHaveLength(0);
+  });
+});
+
+describe("formatLintForFeedback", () => {
+  test("renders errors and warnings as lines", () => {
+    const formatted = formatLintForFeedback({
+      errors: [{ severity: "error", ruleId: "rule-a", message: "bad thing", line: 12 }],
+      warnings: [
+        {
+          severity: "warning",
+          ruleId: "rule-b",
+          message: "weak thing",
+          line: null,
+        },
+      ],
+    });
+    expect(formatted).toContain("ERROR rule-a");
+    expect(formatted).toContain("(line 12)");
+    expect(formatted).toContain("WARN rule-b");
+  });
+
+  test("truncates to the given limit", () => {
+    const longMessage = "x".repeat(5000);
+    const formatted = formatLintForFeedback(
+      {
+        errors: [{ severity: "error", ruleId: "r", message: longMessage, line: null }],
+        warnings: [],
+      },
+      200,
+    );
+    expect(formatted.length).toBeLessThanOrEqual(200);
+  });
+});
diff --git a/packages/amplify-video-worker/tests/composition-loop.test.ts b/packages/amplify-video-worker/tests/composition-loop.test.ts
new file mode 100644
index 000000000..c3a93316b
--- /dev/null
+++ b/packages/amplify-video-worker/tests/composition-loop.test.ts
@@ -0,0 +1,147 @@
+import { describe, expect, test } from "bun:test";
+import { runCompositionLoop } from "../src/composition";
+import type { SkillBundle } from "../src/composition";
+import type { ConversationMessage } from "../src/llm-client";
+
+const skillBundle: SkillBundle = {
+  hyperframesSkill: "S",
+  houseStyle: "S",
+  patterns: "S",
+  visualStyles: "S",
+  dataInMotion: "S",
+  gsapSkill: "S",
+  amplifyConstraints: "S",
+};
+
+const baseArgs = {
+  brief: { article: { title: "T" } } as any,
+  plan: {
+    targetDurationSeconds: 60,
+    aspectRatio: "16:9",
+    voice: { enabled: false },
+    captions: { enabled: false },
+    cta: { label: "Read" },
+  } as any,
+  source: {
+    article: {
+      paragraphs: ["This is paragraph one and it is well over forty characters."],
+      text: "This is paragraph one and it is well over forty characters.",
+      bodyHtml: null,
+      authors: null,
+    },
+  } as any,
+  skillBundle,
+  maxAttempts: 5,
+  llmTimeoutMs: 1000,
+};
+
+const VALID_HTML = `<!doctype html><html><body>
+  <div data-composition-id="amplify-explainer" data-width="1920" data-height="1080" data-duration="60"></div>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
+  <script>window.__timelines = {}; const tl = gsap.timeline({ paused: true }); window.__timelines["amplify-explainer"] = tl;</script>
+</body></html>`;
+
+describe("runCompositionLoop", () => {
+  test("succeeds on first attempt when LLM output is valid", async () => {
+    let calls = 0;
+    const result = await runCompositionLoop({
+      ...baseArgs,
+      llm: async () => {
+        calls += 1;
+        return { indexHtml: VALID_HTML, narration: [], notes: null };
+      },
+      lint: async () => ({ errors: [], warnings: [] }),
+    });
+    expect(calls).toBe(1);
+    expect(result.ok).toBe(true);
+    if (result.ok) {
+      expect(result.indexHtml).toBe(VALID_HTML);
+      expect(result.attempts).toBe(1);
+    }
+  });
+
+  test("retries on llm error then succeeds", async () => {
+    let calls = 0;
+    const result = await runCompositionLoop({
+      ...baseArgs,
+      llm: async () => {
+        calls += 1;
+        if (calls === 1) throw new Error("LLM blip");
+        return { indexHtml: VALID_HTML, narration: [], notes: null };
+      },
+      lint: async () => ({ errors: [], warnings: [] }),
+    });
+    expect(calls).toBe(2);
+    expect(result.ok).toBe(true);
+    if (result.ok) expect(result.attempts).toBe(2);
+  });
+
+  test("retries on validation failure with html_invalid error recorded", async () => {
+    let calls = 0;
+    const result = await runCompositionLoop({
+      ...baseArgs,
+      llm: async () => {
+        calls += 1;
+        if (calls === 1) {
+          return { indexHtml: "<html>no markers</html>", narration: [], notes: null };
+        }
+        return { indexHtml: VALID_HTML, narration: [], notes: null };
+      },
+      lint: async () => ({ errors: [], warnings: [] }),
+    });
+    expect(result.ok).toBe(true);
+    if (result.ok) expect(result.attempts).toBe(2);
+  });
+
+  test("retries on lint error, passing lint feedback into the retry", async () => {
+    let calls = 0;
+    let secondConversation: ConversationMessage[] = [];
+    const result = await runCompositionLoop({
+      ...baseArgs,
+      llm: async (conversation) => {
+        calls += 1;
+        if (calls === 2) {
+          secondConversation = conversation;
+        }
+        return { indexHtml: VALID_HTML, narration: [], notes: null };
+      },
+      lint: async () => {
+        if (calls === 1) {
+          return {
+            errors: [
+              { severity: "error" as const, ruleId: "bad-rule", message: "bad thing", line: null },
+            ],
+            warnings: [],
+          };
+        }
+        return { errors: [], warnings: [] };
+      },
+    });
+    expect(calls).toBe(2);
+    expect(result.ok).toBe(true);
+    const assistantMsg = secondConversation.find((m) => m.role === "assistant");
+    const lastUser = [...secondConversation].reverse().find((m) => m.role === "user");
+    expect(assistantMsg?.content).toContain("<!doctype html>");
+    expect(lastUser?.content).toContain("bad thing");
+  });
+
+  test("returns failure after maxAttempts", async () => {
+    let calls = 0;
+    const result = await runCompositionLoop({
+      ...baseArgs,
+      maxAttempts: 3,
+      llm: async () => {
+        calls += 1;
+        throw new Error("LLM down");
+      },
+      lint: async () => ({ errors: [], warnings: [] }),
+    });
+    expect(calls).toBe(3);
+    expect(result.ok).toBe(false);
+    if (!result.ok) {
+      expect(result.attempts).toBe(3);
+      expect(result.errors).toHaveLength(3);
+      expect(result.errors[0]?.kind).toBe("llm_error");
+    }
+  });
+});
diff --git a/packages/amplify-video-worker/tests/composition-messages.test.ts b/packages/amplify-video-worker/tests/composition-messages.test.ts
new file mode 100644
index 000000000..2bbc64247
--- /dev/null
+++ b/packages/amplify-video-worker/tests/composition-messages.test.ts
@@ -0,0 +1,98 @@
+import { describe, expect, test } from "bun:test";
+import { buildAuthoringMessages } from "../src/composition";
+import type { ExplainerVideoBrief, ExplainerVideoRenderPlan } from "../src/types";
+
+const minimalBrief = {
+  version: "2026-05-15",
+  article: {
+    title: "Example",
+    url: "https://example.com",
+  } as any,
+  interview: {
+    goal: "exec_summary",
+    audience: "executives",
+    durationSeconds: 60,
+    narrativeStyle: "documentary",
+    textMode: "condense",
+    visualMode: "editorial",
+    voiceoverMode: "ai_voice",
+    ctaMode: "booklet",
+  } as any,
+  defaultsApplied: [],
+  createdAt: "2026-05-18T00:00:00Z",
+} as unknown as ExplainerVideoBrief;
+
+const minimalPlan = {
+  version: "2026-05-15",
+  rendererKind: "hyperframes",
+  compositionKind: "article_explainer",
+  targetDurationSeconds: 60,
+  aspectRatio: "16:9",
+  voice: { enabled: true, provider: "elevenlabs", style: "documentary" },
+  captions: { enabled: true, burnIn: true, exportSrt: true },
+  scenes: [],
+  cta: { mode: "booklet", label: "Read the booklet", url: "https://aicoe.fit/x" },
+  worker: { status: "processing", queueName: null, notes: "" },
+  billing: { billingSurfaceId: "openai:llm-authoring" },
+} as unknown as ExplainerVideoRenderPlan;
+
+const source = {
+  version: "v1",
+  article: {
+    text: "Body paragraph one. Body paragraph two.",
+    paragraphs: [
+      "Body paragraph one is interesting and over forty characters long.",
+      "Body paragraph two is also long enough to survive filtering and clearly informative.",
+    ],
+    bodyHtml: null,
+    authors: null,
+  },
+} as any;
+
+const skillBundle = {
+  hyperframesSkill: "# SKILL\nfake content",
+  houseStyle: "# House style\nfake",
+  patterns: "# Patterns\nfake",
+  visualStyles: "# Visual styles\nfake",
+  dataInMotion: "# Data in motion\nfake",
+  gsapSkill: "# GSAP\nfake",
+  amplifyConstraints: "# Amplify constraints\nfake",
+};
+
+describe("buildAuthoringMessages", () => {
+  test("returns one system message and one user message on first attempt", () => {
+    const conv = buildAuthoringMessages({
+      brief: minimalBrief,
+      plan: minimalPlan,
+      source,
+      skillBundle,
+      retryFeedback: null,
+    });
+    expect(conv).toHaveLength(2);
+    expect(conv[0].role).toBe("system");
+    expect(conv[0].content).toContain("# SKILL");
+    expect(conv[0].content).toContain("# Amplify constraints");
+    expect(conv[1].role).toBe("user");
+    expect(conv[1].content).toContain("Example");
+    expect(conv[1].content).toContain("60");
+    expect(conv[1].content.toLowerCase()).toContain("body paragraph one");
+  });
+
+  test("when retryFeedback is provided, appends an assistant turn and a follow-up user message", () => {
+    const conv = buildAuthoringMessages({
+      brief: minimalBrief,
+      plan: minimalPlan,
+      source,
+      skillBundle,
+      retryFeedback: {
+        previousIndexHtml: "<!doctype html>...",
+        errorText: "ERROR no data-start on clip scene",
+      },
+    });
+    expect(conv).toHaveLength(4);
+    expect(conv[2].role).toBe("assistant");
+    expect(conv[2].content).toContain("<!doctype html>");
+    expect(conv[3].role).toBe("user");
+    expect(conv[3].content).toContain("ERROR no data-start");
+  });
+});
diff --git a/packages/amplify-video-worker/tests/composition-sanity.test.ts b/packages/amplify-video-worker/tests/composition-sanity.test.ts
new file mode 100644
index 000000000..f2bad8a16
--- /dev/null
+++ b/packages/amplify-video-worker/tests/composition-sanity.test.ts
@@ -0,0 +1,51 @@
+import { describe, expect, test } from "bun:test";
+import { mkdtempSync, writeFileSync, rmSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+import { postRenderSanityCheck } from "../src/composition";
+
+describe("postRenderSanityCheck", () => {
+  test("rejects a file under 50KB", async () => {
+    const dir = mkdtempSync(join(tmpdir(), "sanity-"));
+    const path = join(dir, "tiny.mp4");
+    writeFileSync(path, Buffer.alloc(10_000));
+    try {
+      const result = await postRenderSanityCheck(path, 30, {
+        probeDuration: async () => 30,
+      });
+      expect(result.ok).toBe(false);
+      if (!result.ok) expect(result.reason).toMatch(/size/i);
+    } finally {
+      rmSync(dir, { recursive: true, force: true });
+    }
+  });
+
+  test("rejects a file with duration > 50% off the target", async () => {
+    const dir = mkdtempSync(join(tmpdir(), "sanity-"));
+    const path = join(dir, "ok.mp4");
+    writeFileSync(path, Buffer.alloc(500_000));
+    try {
+      const result = await postRenderSanityCheck(path, 60, {
+        probeDuration: async () => 10,
+      });
+      expect(result.ok).toBe(false);
+      if (!result.ok) expect(result.reason).toMatch(/duration/i);
+    } finally {
+      rmSync(dir, { recursive: true, force: true });
+    }
+  });
+
+  test("accepts a healthy file", async () => {
+    const dir = mkdtempSync(join(tmpdir(), "sanity-"));
+    const path = join(dir, "ok.mp4");
+    writeFileSync(path, Buffer.alloc(1_000_000));
+    try {
+      const result = await postRenderSanityCheck(path, 60, {
+        probeDuration: async () => 58.5,
+      });
+      expect(result.ok).toBe(true);
+    } finally {
+      rmSync(dir, { recursive: true, force: true });
+    }
+  });
+});
diff --git a/packages/amplify-video-worker/tests/composition-skill-loader.test.ts b/packages/amplify-video-worker/tests/composition-skill-loader.test.ts
new file mode 100644
index 000000000..70a29371d
--- /dev/null
+++ b/packages/amplify-video-worker/tests/composition-skill-loader.test.ts
@@ -0,0 +1,42 @@
+import { describe, expect, test } from "bun:test";
+import { mkdtempSync, mkdirSync, writeFileSync, rmSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+import { loadSkillBundle } from "../src/composition";
+
+describe("loadSkillBundle", () => {
+  test("reads the seven expected files from the skills root", () => {
+    const root = mkdtempSync(join(tmpdir(), "skills-"));
+    mkdirSync(join(root, "hyperframes"));
+    mkdirSync(join(root, "gsap"));
+    writeFileSync(join(root, "hyperframes", "SKILL.md"), "# hf\n");
+    writeFileSync(join(root, "hyperframes", "house-style.md"), "# hs\n");
+    writeFileSync(join(root, "hyperframes", "patterns.md"), "# p\n");
+    writeFileSync(join(root, "hyperframes", "visual-styles.md"), "# vs\n");
+    writeFileSync(join(root, "hyperframes", "data-in-motion.md"), "# dim\n");
+    writeFileSync(join(root, "gsap", "SKILL.md"), "# gsap\n");
+    writeFileSync(join(root, "amplify-constraints.md"), "# constraints\n");
+
+    try {
+      const bundle = loadSkillBundle(root);
+      expect(bundle.hyperframesSkill).toContain("# hf");
+      expect(bundle.houseStyle).toContain("# hs");
+      expect(bundle.patterns).toContain("# p");
+      expect(bundle.visualStyles).toContain("# vs");
+      expect(bundle.dataInMotion).toContain("# dim");
+      expect(bundle.gsapSkill).toContain("# gsap");
+      expect(bundle.amplifyConstraints).toContain("# constraints");
+    } finally {
+      rmSync(root, { recursive: true, force: true });
+    }
+  });
+
+  test("throws a clear error when a file is missing", () => {
+    const root = mkdtempSync(join(tmpdir(), "skills-"));
+    try {
+      expect(() => loadSkillBundle(root)).toThrow(/SKILL\.md/);
+    } finally {
+      rmSync(root, { recursive: true, force: true });
+    }
+  });
+});
diff --git a/packages/amplify-video-worker/tests/composition-validate.test.ts b/packages/amplify-video-worker/tests/composition-validate.test.ts
new file mode 100644
index 000000000..1013bde36
--- /dev/null
+++ b/packages/amplify-video-worker/tests/composition-validate.test.ts
@@ -0,0 +1,49 @@
+import { describe, expect, test } from "bun:test";
+import { validateCompositionHtml } from "../src/composition";
+
+describe("validateCompositionHtml", () => {
+  test("accepts a minimal compliant document", () => {
+    const html = `<!doctype html><html><body>
+      <div data-composition-id="amplify-explainer" data-width="1920" data-height="1080" data-duration="60"></div>
+      <script>window.__timelines = {}; const tl = gsap.timeline({ paused: true }); window.__timelines["amplify-explainer"] = tl;</script>
+    </body></html>`;
+    const result = validateCompositionHtml(html);
+    expect(result.ok).toBe(true);
+  });
+
+  test("rejects missing doctype", () => {
+    const html = `<html><body>
+      <div data-composition-id="amplify-explainer"></div>
+      <script>window.__timelines = {}; gsap.timeline({ paused: true });</script>
+    </body></html>`;
+    const result = validateCompositionHtml(html);
+    expect(result.ok).toBe(false);
+    if (!result.ok) {
+      expect(result.missing).toContain("doctype");
+    }
+  });
+
+  test("rejects missing composition root", () => {
+    const html = `<!doctype html><html><body>
+      <div></div>
+      <script>window.__timelines = {}; gsap.timeline({ paused: true });</script>
+    </body></html>`;
+    const result = validateCompositionHtml(html);
+    expect(result.ok).toBe(false);
+    if (!result.ok) {
+      expect(result.missing).toContain("data-composition-id");
+    }
+  });
+
+  test("rejects missing timeline registration", () => {
+    const html = `<!doctype html><html><body>
+      <div data-composition-id="amplify-explainer"></div>
+    </body></html>`;
+    const result = validateCompositionHtml(html);
+    expect(result.ok).toBe(false);
+    if (!result.ok) {
+      expect(result.missing).toContain("window.__timelines");
+      expect(result.missing).toContain("gsap.timeline");
+    }
+  });
+});
diff --git a/packages/amplify-video-worker/tests/llm-client.test.ts b/packages/amplify-video-worker/tests/llm-client.test.ts
new file mode 100644
index 000000000..a86f1801d
--- /dev/null
+++ b/packages/amplify-video-worker/tests/llm-client.test.ts
@@ -0,0 +1,156 @@
+import { describe, expect, test } from "bun:test";
+import { authorComposition } from "../src/llm-client";
+
+const dummySchema = {
+  type: "object",
+  additionalProperties: false,
+  required: ["indexHtml", "narration", "notes"],
+  properties: {
+    indexHtml: { type: "string" },
+    narration: { type: "array", items: { type: "object" } },
+    notes: { type: ["string", "null"] },
+  },
+} as const;
+
+describe("authorComposition", () => {
+  test("routes GPT-5 to the Responses API and returns parsed JSON", async () => {
+    let calledUrl = "";
+    let body: any;
+    const fakeFetch = async (url: string | URL | Request, init: any) => {
+      calledUrl = String(url);
+      body = JSON.parse(init.body);
+      return new Response(
+        JSON.stringify({
+          output_text:
+            '{"indexHtml": "<!doctype html><html></html>", "narration": [], "notes": null}',
+        }),
+        { status: 200, headers: { "Content-Type": "application/json" } },
+      );
+    };
+
+    const result = await authorComposition({
+      conversation: [
+        { role: "system", content: "sys" },
+        { role: "user", content: "u" },
+      ],
+      schema: dummySchema,
+      schemaName: "test_schema",
+      ai: { baseUrl: "https://api.openai.com/v1", apiKey: "sk-x", model: "gpt-5" },
+      fetchImpl: fakeFetch as any,
+      timeoutMs: 1000,
+    });
+
+    expect(calledUrl).toContain("/responses");
+    expect(body.model).toBe("gpt-5");
+    expect(body.text.format.schema.required).toContain("indexHtml");
+    expect((result as any).indexHtml).toContain("<!doctype html>");
+  });
+
+  test("routes non-OpenAI / non-GPT-5 to Chat Completions", async () => {
+    let calledUrl = "";
+    const fakeFetch = async (url: string | URL | Request, _init: any) => {
+      calledUrl = String(url);
+      return new Response(
+        JSON.stringify({
+          choices: [
+            {
+              message: {
+                content: '{"indexHtml": "<!doctype html></html>", "narration": [], "notes": null}',
+              },
+            },
+          ],
+        }),
+        { status: 200, headers: { "Content-Type": "application/json" } },
+      );
+    };
+
+    const result = await authorComposition({
+      conversation: [{ role: "user", content: "hi" }],
+      schema: dummySchema,
+      schemaName: "test_schema",
+      ai: {
+        baseUrl: "https://api.fireworks.ai/inference/v1",
+        apiKey: "fw-x",
+        model: "qwen3-coder",
+      },
+      fetchImpl: fakeFetch as any,
+      timeoutMs: 1000,
+    });
+
+    expect(calledUrl).toContain("/chat/completions");
+    expect((result as any).indexHtml).toContain("<!doctype html>");
+  });
+
+  test("throws on empty Responses output", async () => {
+    const fakeFetch = async () =>
+      new Response(JSON.stringify({ output_text: "" }), {
+        status: 200,
+        headers: { "Content-Type": "application/json" },
+      });
+
+    await expect(
+      authorComposition({
+        conversation: [{ role: "user", content: "x" }],
+        schema: dummySchema,
+        schemaName: "test_schema",
+        ai: { baseUrl: "https://api.openai.com/v1", apiKey: "sk-x", model: "gpt-5" },
+        fetchImpl: fakeFetch as any,
+        timeoutMs: 1000,
+      }),
+    ).rejects.toThrow(/empty/i);
+  });
+
+  test("strips markdown fences from Responses output before parsing", async () => {
+    const fakeFetch = async () =>
+      new Response(
+        JSON.stringify({
+          output_text:
+            '```json\n{"indexHtml": "<!doctype html>", "narration": [], "notes": null}\n```',
+        }),
+        { status: 200, headers: { "Content-Type": "application/json" } },
+      );
+
+    const result = await authorComposition({
+      conversation: [{ role: "user", content: "x" }],
+      schema: dummySchema,
+      schemaName: "test_schema",
+      ai: { baseUrl: "https://api.openai.com/v1", apiKey: "sk-x", model: "gpt-5" },
+      fetchImpl: fakeFetch as any,
+      timeoutMs: 1000,
+    });
+
+    expect((result as any).indexHtml).toContain("<!doctype html>");
+  });
+
+  test("strips markdown fences from Chat Completions output before parsing", async () => {
+    const fakeFetch = async () =>
+      new Response(
+        JSON.stringify({
+          choices: [
+            {
+              message: {
+                content:
+                  '```\n{"indexHtml": "<!doctype html>", "narration": [], "notes": null}\n```',
+              },
+            },
+          ],
+        }),
+        { status: 200, headers: { "Content-Type": "application/json" } },
+      );
+
+    const result = await authorComposition({
+      conversation: [{ role: "user", content: "x" }],
+      schema: dummySchema,
+      schemaName: "test_schema",
+      ai: {
+        baseUrl: "https://api.fireworks.ai/inference/v1",
+        apiKey: "fw-x",
+        model: "qwen3-coder",
+      },
+      fetchImpl: fakeFetch as any,
+      timeoutMs: 1000,
+    });
+
+    expect((result as any).indexHtml).toContain("<!doctype html>");
+  });
+});
diff --git a/packages/amplify-video-worker/tests/smoke.test.ts b/packages/amplify-video-worker/tests/smoke.test.ts
new file mode 100644
index 000000000..11fd766fe
--- /dev/null
+++ b/packages/amplify-video-worker/tests/smoke.test.ts
@@ -0,0 +1,7 @@
+import { describe, expect, test } from "bun:test";
+
+describe("smoke", () => {
+  test("test runner is wired", () => {
+    expect(1 + 1).toBe(2);
+  });
+});
diff --git a/packages/amplify-video-worker/tsconfig.json b/packages/amplify-video-worker/tsconfig.json
new file mode 100644
index 000000000..ba8a6903f
--- /dev/null
+++ b/packages/amplify-video-worker/tsconfig.json
@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "strict": true,
+    "noUncheckedIndexedAccess": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "declaration": true,
+    "declarationMap": true,
+    "sourceMap": true,
+    "outDir": "./dist",
+    "rootDir": "./src"
+  },
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "dist"]
+}
diff --git a/scripts/deploy-amplify-worker.sh b/scripts/deploy-amplify-worker.sh
new file mode 100755
index 000000000..383f53034
--- /dev/null
+++ b/scripts/deploy-amplify-worker.sh
@@ -0,0 +1,104 @@
+#!/usr/bin/env bash
+# deploy-amplify-worker.sh — build, push, and roll out the amplify
+# video worker to amplify-dev ECS.
+#
+# Usage:
+#   ./scripts/deploy-amplify-worker.sh                  # full deploy
+#   SKIP_DEPLOY=1 ./scripts/deploy-amplify-worker.sh    # build + push only
+#   SKIP_WAIT=1 ./scripts/deploy-amplify-worker.sh      # don't wait for stable
+#
+# Env overrides: AWS_PROFILE, AWS_REGION, AWS_ACCOUNT, ECR_REPO, IMAGE_TAG,
+# ECS_CLUSTER, ECS_SERVICE.
+
+set -euo pipefail
+
+AWS_PROFILE="${AWS_PROFILE:-prod-aicoe-admin}"
+AWS_REGION="${AWS_REGION:-us-east-1}"
+AWS_ACCOUNT="${AWS_ACCOUNT:-913524910742}"
+ECR_REPO="${ECR_REPO:-$AWS_ACCOUNT.dkr.ecr.$AWS_REGION.amazonaws.com/amplify/dev/video-worker}"
+IMAGE_TAG="${IMAGE_TAG:-$(git rev-parse --short HEAD)}"
+ECS_CLUSTER="${ECS_CLUSTER:-amplify-dev-cluster}"
+ECS_SERVICE="${ECS_SERVICE:-amplify-dev-video-worker}"
+SKIP_DEPLOY="${SKIP_DEPLOY:-0}"
+SKIP_WAIT="${SKIP_WAIT:-0}"
+
+echo "🔐 Logging into ECR ($AWS_ACCOUNT, $AWS_REGION, profile=$AWS_PROFILE)..."
+aws --profile "$AWS_PROFILE" ecr get-login-password --region "$AWS_REGION" \
+  | docker login --username AWS --password-stdin "$AWS_ACCOUNT.dkr.ecr.$AWS_REGION.amazonaws.com"
+
+echo "🐳 Building $ECR_REPO:$IMAGE_TAG (linux/amd64)..."
+docker buildx build \
+  --platform linux/amd64 \
+  -f Dockerfile.amplify-worker \
+  -t "$ECR_REPO:latest" \
+  -t "$ECR_REPO:$IMAGE_TAG" \
+  --push \
+  .
+
+echo "📤 Pushed:"
+echo "    $ECR_REPO:latest"
+echo "    $ECR_REPO:$IMAGE_TAG"
+
+if [[ "$SKIP_DEPLOY" == "1" ]]; then
+  echo "⏭  SKIP_DEPLOY=1 — stopping before ECS rollout."
+  exit 0
+fi
+
+echo "📝 Registering new task definition revision pinned to $IMAGE_TAG..."
+TASKDEF_TMP="$(mktemp -t taskdef-XXXXXX.json)"
+TASKDEF_OUT="$(mktemp -t taskdef-out-XXXXXX.json)"
+trap 'rm -f "$TASKDEF_TMP" "$TASKDEF_OUT"' EXIT
+
+aws ecs describe-task-definition \
+  --task-definition "$ECS_SERVICE" \
+  --profile "$AWS_PROFILE" \
+  --region "$AWS_REGION" \
+  --query 'taskDefinition' \
+  --output json > "$TASKDEF_TMP"
+
+python3 - "$TASKDEF_TMP" "$TASKDEF_OUT" "$ECR_REPO:$IMAGE_TAG" <<'PY'
+import json, sys
+src, dst, new_image = sys.argv[1], sys.argv[2], sys.argv[3]
+with open(src) as f:
+    td = json.load(f)
+for k in ['taskDefinitionArn','revision','status','requiresAttributes','compatibilities','registeredAt','registeredBy','deregisteredAt']:
+    td.pop(k, None)
+td['containerDefinitions'][0]['image'] = new_image
+with open(dst, 'w') as f:
+    json.dump(td, f, indent=2)
+PY
+
+NEW_REVISION_ARN="$(aws ecs register-task-definition \
+  --cli-input-json "file://$TASKDEF_OUT" \
+  --profile "$AWS_PROFILE" \
+  --region "$AWS_REGION" \
+  --query 'taskDefinition.taskDefinitionArn' \
+  --output text)"
+
+echo "    Registered: $NEW_REVISION_ARN"
+
+echo "🚀 Updating $ECS_CLUSTER/$ECS_SERVICE to use new revision..."
+aws ecs update-service \
+  --cluster "$ECS_CLUSTER" \
+  --service "$ECS_SERVICE" \
+  --task-definition "$NEW_REVISION_ARN" \
+  --force-new-deployment \
+  --profile "$AWS_PROFILE" \
+  --region "$AWS_REGION" \
+  --query 'service.{status:status,running:runningCount,desired:desiredCount,td:taskDefinition}' \
+  --output table
+
+if [[ "$SKIP_WAIT" == "1" ]]; then
+  echo "⏭  SKIP_WAIT=1 — rollout in flight; not waiting for stable."
+  echo "✅ Deploy initiated."
+  exit 0
+fi
+
+echo "⏳ Waiting for service to stabilize (this typically takes 3–8 minutes)..."
+aws ecs wait services-stable \
+  --cluster "$ECS_CLUSTER" \
+  --services "$ECS_SERVICE" \
+  --profile "$AWS_PROFILE" \
+  --region "$AWS_REGION"
+
+echo "✅ Deploy complete — $ECS_SERVICE is running $IMAGE_TAG."
diff --git a/videos/amplify-case-study/DESIGN.md b/videos/amplify-case-study/DESIGN.md
new file mode 100644
index 000000000..04ee2b541
--- /dev/null
+++ b/videos/amplify-case-study/DESIGN.md
@@ -0,0 +1,153 @@
+# DESIGN — Amplify Case Study Explainer
+
+Visual system spec for the explainer video accompanying the Substack case study
+_"We Pulled the Storyboard Module — and Got Better Videos."_
+
+Two cuts share this design system:
+
+- **Master cut**: 1920×1080 @ 30fps, ~87s, full narrative arc (8 beats)
+- **Short cut**: 1080×1080 @ 30fps, ~30s, distilled (4 beats)
+
+## Concept
+
+Editorial dev-blog aesthetic — dark canvas, paper-on-ink type, monospace
+typography for code/labels, sans-serif display for headlines. Restraint is the
+design language; the _idea_ should be louder than the chrome.
+
+The video has two structural pillars (Beat 2 _Template Grid_ and Beat 7
+_Bespoke Grid_) that mirror each other. Everything in between is the rotation
+from one pillar to the other.
+
+## Palette
+
+```css
+/* Ink scale (backgrounds + surfaces) */
+--ink: #08090b; /* page background */
+--ink-elevated: #12141a; /* cards, terminals, thumbnails */
+--ink-line: #1f232c; /* hairlines, borders */
+--ink-soft: #2a2f3b; /* hover/active borders */
+
+/* Paper (foreground text) */
+--paper: #f5f2ec; /* primary text */
+--paper-muted: #8b8e96; /* secondary text, labels */
+--paper-dim: #5a5e68; /* tertiary, placeholder */
+
+/* Accents (semantic) */
+--signal: #22d67a; /* "the right answer" — the new path, success */
+--signal-soft: rgba(34, 214, 122, 0.15);
+--warn: #f4a641; /* "the trap" — schema bars, the ceiling */
+--warn-soft: rgba(244, 166, 65, 0.18);
+--code: #7dd3fc; /* code tokens, JSON keys, structured data */
+--code-soft: rgba(125, 211, 252, 0.15);
+```
+
+**Rules**:
+
+- Only one accent dominant per beat. Never two accents fighting.
+- `signal` belongs to the _new pipeline_. `warn` belongs to the _old schema_.
+- `code` shows up wherever real text from the codebase appears.
+
+## Typography
+
+```css
+/* Display — headlines, pull quotes, hook */
+--font-display: "Inter Tight", "Inter", system-ui, sans-serif;
+
+/* Mono — code, terminals, labels, file paths, structured data */
+--font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
+```
+
+**Sizes** (1920×1080 master; scale down proportionally for 1:1):
+
+| Class        | Size  | Weight | Tracking | Use                           |
+| ------------ | ----- | ------ | -------- | ----------------------------- |
+| `display-xl` | 168px | 600    | -0.02em  | The lesson quote (Beat 8)     |
+| `display-l`  | 120px | 500    | -0.015em | Hook headline (Beat 1)        |
+| `display-m`  | 96px  | 500    | -0.01em  | Beat captions                 |
+| `display-s`  | 64px  | 500    | -0.005em | Secondary captions            |
+| `body`       | 32px  | 400    | 0        | Annotations                   |
+| `mono-l`     | 28px  | 500    | 0        | JSON schema field names       |
+| `mono-m`     | 22px  | 400    | 0        | Terminal commands, file paths |
+| `mono-s`     | 14px  | 500    | 0.04em   | UI chips, labels              |
+
+**Pairings**:
+
+- Display headline + mono label above (e.g., `worker / authoring →` above a
+  bold caption).
+- Mono code lines stack tight (1.4 line-height); display headlines stack
+  airy (1.05 line-height).
+
+## Spatial system
+
+- 12-column grid, 80px gutters, 96px outer margin (1728px content width).
+- Type anchors:
+  - **Hook (Beat 1)** and **Lesson (Beat 8)**: center-anchored, full canvas.
+  - **All other beats**: bottom-left anchor for primary caption, top-right
+    anchor for supporting metadata.
+- Persistent hairline element: 1px `signal` line traversing the bottom 8% of
+  the canvas in every beat. **Grows** in length as the video progresses,
+  starting at 8% width in Beat 1 and reaching 100% width by Beat 8.
+  Visualizes "the pipeline coming online."
+
+## Motion language
+
+Default ease: `power3.out` for entrances, `power3.inOut` for transitions,
+`power2.inOut` for ambient.
+
+| Motion                   | Properties                                | Duration        |
+| ------------------------ | ----------------------------------------- | --------------- |
+| Word-by-word reveal      | `y: 24 → 0, opacity 0 → 1`, stagger 0.06s | per word ~250ms |
+| Character reveal (code)  | `opacity 0 → 1`, stagger 0.02s            | per char ~150ms |
+| Line draw (architecture) | `strokeDashoffset: full → 0`              | 700ms           |
+| Thumbnail grid populate  | scale `0.96 → 1`, opacity, stagger 0.08s  | 500ms each      |
+| Beat hold                | full state held                           | ~1.5s minimum   |
+| Beat-to-beat transition  | cross-fade or wipe                        | 400–600ms       |
+
+**Hard rules**:
+
+- Every beat has a ≥1.5s hold at full state before transitioning.
+- No element moves without purpose. Ambient motion is OK (slow pulse on the
+  active node, the green hairline drawing); decorative motion is not.
+- GSAP master timeline is **paused** and registered on
+  `window.__timelines["amplify-case-study-master"]` (and `-short` for the
+  square cut). Each beat owns its own child timeline, added to the master
+  at the beat's start time.
+
+## Sound design
+
+- **Voice (required)**: ElevenLabs TTS. Mid-age male, calm-confident, slight
+  dry edge on Beat 3 and Beat 8 (the contrarian beats). Manifesto-register —
+  economy of words. Same voice family as `synapse-os-explainer` so the two
+  pieces feel related. Fallback if ElevenLabs is unavailable: local Kokoro
+  TTS via the `hyperframes-media` skill (`bm_george` or `am_eric` preset).
+- **Music (nice-to-have, not blocking v1)**: a single sustained pad at
+  –22 LUFS, never lifts. If a permissive-license pad isn't on hand, ship
+  v1 with narration only — silence between sentences is part of the design
+  language. A piano figure (Beat 5 → Beat 8) is a v1.1 enhancement.
+- **SFX (one cue)**: a soft "tick" on the −455 counter (Beat 4). Generated
+  inline via Web Audio API as a 600Hz square-wave envelope (200ms total),
+  no external asset required.
+
+## Asset list
+
+- **Fonts**: Inter Tight (Google Fonts CDN), JetBrains Mono (Google Fonts CDN).
+- **Narration**: generated via the `hyperframes-media` skill or ElevenLabs
+  directly. Files at `videos/amplify-case-study/narration/`.
+- **Music**: none required for v1. If a permissive-license ambient pad is
+  located, drop it at `narration/underscore.mp3` and the composition will
+  mix it at –22 LUFS under the narration.
+- **SFX**: synthesized inline via Web Audio API (no external file).
+- **Code snippets**: shown abbreviated. Schema field names in Beat 3 are
+  the literal field names from the deleted `explainer-storyboard.ts`
+  (`eyebrow`, `title`, `body`, `highlight`, `supportingPoints`, `narration`).
+  No screenshots — all type rendered live for crispness at 1080p.
+
+## What this design is NOT
+
+- Not a brand piece. No company logo, no Trilogy AI CoE branding. The hook is
+  the _idea_, not the institution.
+- Not a feature demo. The video sells the _story_ in the article — not
+  Hyperframes itself. Hyperframes' capability is implicit in the production
+  quality.
+- Not narration-led. The voice is sparse (~110 words total). Visuals carry
+  most of the runtime; the words are punctuation.
diff --git a/videos/amplify-case-study/PLAN.md b/videos/amplify-case-study/PLAN.md
new file mode 100644
index 000000000..849ad96a7
--- /dev/null
+++ b/videos/amplify-case-study/PLAN.md
@@ -0,0 +1,1907 @@
+# Amplify Case Study Explainer — Implementation Plan
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** Build two HyperFrames compositions — an 87-second 16:9 master cut and a 30-second 1:1 short cut — accompanying the Substack case study _"We Pulled the Storyboard Module — and Got Better Videos."_
+
+**Architecture:** Each beat is authored as a standalone `compositions/beat-N.html` (independently previewable, lintable, snapshot-able), then composed into a single `index.html` master file. Both cuts share design tokens defined in `shared/tokens.css`. Narration is ElevenLabs-or-Kokoro TTS, written to a single MP3 per cut and referenced as an `<audio>` element in the master composition.
+
+**Tech Stack:** HyperFrames 0.6.x (CLI for `lint`/`validate`/`snapshot`/`render`/`tts`), GSAP (paused-and-registered timelines), Inter Tight + JetBrains Mono via Google Fonts CDN, vanilla HTML/CSS/JS (no bundler).
+
+**Reference docs:**
+
+- `videos/amplify-case-study/DESIGN.md` — visual system (palette, type, motion)
+- `videos/amplify-case-study/STORYBOARD.md` — beat-by-beat plan
+- `videos/amplify-case-study/SCRIPT.md` — narration script + voice settings
+- `skills/hyperframes/SKILL.md` — framework authoring rules (READ BEFORE EACH BEAT TASK)
+- `skills/gsap/SKILL.md` — GSAP timeline conventions (READ BEFORE EACH BEAT TASK)
+- `videos/synapse-os-explainer/compositions/beat-1-question.html` — reference for the `<template>`-wrapped beat HTML structure already proven in this repo
+
+**Universal beat conventions:**
+
+- File path: `videos/amplify-case-study/master/compositions/beat-<N>-<slug>.html`
+- Root element: `<div data-composition-id="amplify-case-study-beat-<N>" data-start="0" data-duration="<seconds>" data-width="1920" data-height="1080">`
+- Class prefix: `b<N>-` on every selector inside the beat (avoids collisions when merged into master)
+- GSAP timeline: created paused, registered as `window.__timelines["amplify-case-study-beat-<N>"] = tl`
+- Fonts: load via `<link>` to Google Fonts inside `<head>` (Inter Tight 400/500/600, JetBrains Mono 400/500)
+- Standalone wrapping: wrap the scene markup in `<template id="beat-<N>-<slug>-template">` per the `synapse-os-explainer` convention
+
+---
+
+## Task 0: Project scaffold + shared tokens
+
+**Files:**
+
+- Create: `videos/amplify-case-study/shared/tokens.css`
+- Create: `videos/amplify-case-study/shared/base.html` (reference template for beats)
+
+**Why:** Hoist palette + type + motion tokens into one CSS file every beat imports. Lock the design system in one place so subagents authoring each beat can't drift.
+
+- [ ] **Step 1: Write `shared/tokens.css`**
+
+```css
+/* Design tokens — see DESIGN.md for rationale */
+:root {
+  /* Ink scale */
+  --ink: #08090b;
+  --ink-elevated: #12141a;
+  --ink-line: #1f232c;
+  --ink-soft: #2a2f3b;
+
+  /* Paper */
+  --paper: #f5f2ec;
+  --paper-muted: #8b8e96;
+  --paper-dim: #5a5e68;
+
+  /* Accents */
+  --signal: #22d67a;
+  --signal-soft: rgba(34, 214, 122, 0.15);
+  --warn: #f4a641;
+  --warn-soft: rgba(244, 166, 65, 0.18);
+  --code: #7dd3fc;
+  --code-soft: rgba(125, 211, 252, 0.15);
+
+  /* Type families */
+  --font-display: "Inter Tight", "Inter", system-ui, sans-serif;
+  --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
+}
+
+/* Universal beat reset */
+[data-composition-id^="amplify-case-study"] {
+  position: absolute;
+  inset: 0;
+  background: var(--ink);
+  color: var(--paper);
+  font-family: var(--font-display);
+  overflow: hidden;
+}
+
+/* Persistent bottom hairline carried across all master beats */
+.hf-hairline {
+  position: absolute;
+  bottom: 80px;
+  left: 96px;
+  height: 1px;
+  background: var(--signal);
+  transform-origin: left center;
+}
+```
+
+- [ ] **Step 2: Write `shared/base.html`**
+
+```html
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>amplify-case-study beat (preview)</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="../shared/tokens.css" />
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        background: #000;
+      }
+    </style>
+  </head>
+  <body>
+    <!-- BEAT TEMPLATE GOES HERE — copy the synapse-os-explainer beat-1-question.html
+         <template> wrapper pattern, with the scene inside. -->
+
+    <script>
+      // GSAP loaded by HyperFrames runtime at preview/render time.
+      // Each beat script:
+      //   1) Builds a paused GSAP timeline
+      //   2) Registers it on window.__timelines["amplify-case-study-beat-<N>"]
+    </script>
+  </body>
+</html>
+```
+
+- [ ] **Step 3: Commit**
+
+```bash
+git add videos/amplify-case-study/shared/
+git commit -m "feat(videos/amplify-case-study): add shared tokens and base template"
+```
+
+---
+
+## Task 1: Build Beat 1 — HOOK (7 seconds, silent)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/master/compositions/beat-1-hook.html`
+- Create: `videos/amplify-case-study/master/snapshots/beat-1/` (will be populated by snapshot)
+
+**Reference:** STORYBOARD.md → BEAT 1 — HOOK
+
+- [ ] **Step 1: Read framework rules**
+
+```bash
+cat skills/hyperframes/SKILL.md skills/gsap/SKILL.md
+```
+
+Note in particular:
+
+- Root composition element needs `data-composition-id`, `data-width="1920"`, `data-height="1080"`, `data-duration="7"`.
+- GSAP timeline MUST be `gsap.timeline({ paused: true })`.
+- The timeline MUST be registered on `window.__timelines["amplify-case-study-beat-1"] = tl` (exact key).
+- No inline `visibility: hidden` on scene wrappers — let HyperFrames runtime handle visibility.
+
+- [ ] **Step 2: Author the beat HTML**
+
+Single-line headline, center-anchored, 96px Inter Tight 500 `--paper`. Reveals word-by-word over ~4.5s, then holds 2s. Persistent green hairline at 8% width along the bottom 8% of canvas, anchored 96px from left.
+
+The full text:
+
+> "Click. Wait two minutes. Get a video that actually looks like your article."
+
+Wrap the scene in `<template id="beat-1-hook-template">` like the synapse-os-explainer convention.
+
+Words ("Click.", "Wait", "two", "minutes.", "Get", "a", "video", "that", "actually", "looks", "like", "your", "article.") in individual `<span class="b1-word">` for staggered animation.
+
+GSAP timeline:
+
+```js
+const tl = gsap.timeline({ paused: true });
+tl.from(".b1-word", {
+  y: 24,
+  opacity: 0,
+  duration: 0.6,
+  ease: "power3.out",
+  stagger: 0.16,
+});
+tl.to(".b1-hairline", { scaleX: 1, duration: 1.2, ease: "power2.out" }, 0.2);
+window.__timelines["amplify-case-study-beat-1"] = tl;
+```
+
+The `.b1-hairline` starts at `width: 8%` baseline; the timeline animates its `scaleX` from `0.0 → 1.0` during the beat so that by the end of Beat 1 it has reached its target width.
+
+- [ ] **Step 3: Lint composition**
+
+```bash
+npx hyperframes lint videos/amplify-case-study/master/compositions/beat-1-hook.html
+```
+
+Expected: `✓ No issues found.`
+
+- [ ] **Step 4: Validate composition (headless Chrome)**
+
+```bash
+npx hyperframes validate videos/amplify-case-study/master/compositions/beat-1-hook.html
+```
+
+Expected: PASS — no JS errors, fonts load, GSAP timeline registers on window.
+
+- [ ] **Step 5: Snapshot key frames**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/master/compositions/beat-1-hook.html \
+  --times 0,1.5,3.5,5.0,7.0 \
+  --output videos/amplify-case-study/master/snapshots/beat-1/
+```
+
+Read each PNG and verify:
+
+- t=0: empty canvas + faint hairline at bottom-left only
+- t=1.5: first 3 words ("Click. Wait two") visible
+- t=3.5: most of headline visible
+- t=5.0: full headline + hairline near full
+- t=7.0: held final state, hairline at scaleX=1
+
+- [ ] **Step 6: Commit**
+
+```bash
+git add videos/amplify-case-study/master/compositions/beat-1-hook.html
+git commit -m "feat(videos/amplify-case-study): build beat 1 — hook"
+```
+
+---
+
+## Task 2: Build Beat 2 — TEMPLATE GRID (10 seconds)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/master/compositions/beat-2-template-grid.html`
+- Snapshots: `videos/amplify-case-study/master/snapshots/beat-2/`
+
+**Reference:** STORYBOARD.md → BEAT 2 — TEMPLATE GRID
+
+- [ ] **Step 1: Read framework rules**
+
+```bash
+cat skills/hyperframes/SKILL.md skills/gsap/SKILL.md
+```
+
+- [ ] **Step 2: Author the beat HTML**
+
+Root: `data-composition-id="amplify-case-study-beat-2"`, `data-duration="10"`.
+
+Layout (1920×1080 canvas):
+
+- Top-right `mono-s` label: `amplify / 2026-05-15` at top: 60px, right: 96px, JetBrains Mono 14px `--paper-muted`, letter-spacing 0.04em.
+- 3×2 thumbnail grid centered horizontally, anchored ~150px from top. Cells 480×270, 40px gap between cells.
+- Cells 1–5: identical templated thumbnails. Cell 6: caption space.
+- Each cell: `--ink-elevated` background, 1px `--ink-line` border, 24px padding.
+- Inside each cell:
+  - Eyebrow at top: 14px JetBrains Mono 500 `--paper-muted`, letter-spacing 0.06em, uppercase
+  - Title in middle: 32px Inter Tight 500 `--paper`, line-height 1.15, max-width 380px
+  - Accent bar at bottom: 4px tall, 60% width, `--warn`
+- Cell contents (only text differs):
+  1. eyebrow `EPISODE 014` / title `Dev Day Recap: What Agents Got Right`
+  2. eyebrow `EARNINGS Q1` / title `Reading the Numbers Behind the Pivot`
+  3. eyebrow `BENCHMARK` / title `Agent Performance Across Six Frontier Models`
+  4. eyebrow `MODEL DROP` / title `What Changed in This Week's Release`
+  5. eyebrow `TOOLS WEEKLY` / title `Twenty Builders, Twenty Stacks`
+  6. (caption cell — empty until 11s)
+
+GSAP timeline:
+
+```js
+const tl = gsap.timeline({ paused: true });
+// Top-right label fades in immediately
+tl.from(".b2-label", { opacity: 0, duration: 0.4 }, 0);
+// Cells populate one-by-one with subtle scale
+tl.from(
+  ".b2-cell",
+  {
+    opacity: 0,
+    scale: 0.96,
+    duration: 0.5,
+    ease: "power3.out",
+    stagger: 0.12,
+  },
+  0.3,
+);
+// All cells "breathe together" — synchronized opacity oscillation 3→4s
+tl.to(
+  ".b2-cell",
+  {
+    keyframes: [{ opacity: 0.85 }, { opacity: 1.0 }, { opacity: 0.85 }],
+    duration: 2.5,
+    ease: "sine.inOut",
+    repeat: 0,
+  },
+  3,
+);
+// Caption appears in cell 6 at 4s
+tl.from(
+  ".b2-caption .b2-word",
+  {
+    y: 24,
+    opacity: 0,
+    duration: 0.4,
+    ease: "power3.out",
+    stagger: 0.1,
+  },
+  4,
+);
+// At 9.5s, cells dim and cell 3 enlarges/zooms toward viewer
+tl.to(".b2-cell:not(.b2-cell--zoom)", { opacity: 0.3, duration: 0.5 }, 9.5);
+tl.to(".b2-cell--zoom", { scale: 2.4, zIndex: 10, duration: 0.5, ease: "power2.in" }, 9.5);
+
+window.__timelines["amplify-case-study-beat-2"] = tl;
+```
+
+Mark cell 3 with extra class `b2-cell--zoom` so it can be targeted.
+
+Caption text (in cell 6, hidden until 4s into beat): "Every video looked like every other video." Words wrapped in `<span class="b2-word">`.
+
+Persistent hairline at bottom continues from Beat 1's end-state; this beat's timeline doesn't animate the hairline (Beat 1 already set its `scaleX`).
+
+- [ ] **Step 3: Lint composition**
+
+```bash
+npx hyperframes lint videos/amplify-case-study/master/compositions/beat-2-template-grid.html
+```
+
+Expected: PASS
+
+- [ ] **Step 4: Validate composition**
+
+```bash
+npx hyperframes validate videos/amplify-case-study/master/compositions/beat-2-template-grid.html
+```
+
+Expected: PASS
+
+- [ ] **Step 5: Snapshot key frames**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/master/compositions/beat-2-template-grid.html \
+  --times 0,1.0,2.5,4.5,6.5,9.0,9.9 \
+  --output videos/amplify-case-study/master/snapshots/beat-2/
+```
+
+Read PNGs and verify:
+
+- t=0: top-right label visible only
+- t=1.0: cells 1-3 visible
+- t=2.5: all 5 cells visible
+- t=4.5: caption beginning to appear in cell 6
+- t=6.5: full caption visible, all cells at full opacity
+- t=9.0: cells dimming begin
+- t=9.9: cell 3 enlarged, others dimmed
+
+- [ ] **Step 6: Commit**
+
+```bash
+git add videos/amplify-case-study/master/compositions/beat-2-template-grid.html
+git commit -m "feat(videos/amplify-case-study): build beat 2 — template grid"
+```
+
+---
+
+## Task 3: Build Beat 3 — SCHEMA REVEAL (13 seconds)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/master/compositions/beat-3-schema-reveal.html`
+- Snapshots: `videos/amplify-case-study/master/snapshots/beat-3/`
+
+**Reference:** STORYBOARD.md → BEAT 3 — SCHEMA REVEAL
+
+- [ ] **Step 1: Read framework rules** (`skills/hyperframes/SKILL.md`, `skills/gsap/SKILL.md`)
+
+- [ ] **Step 2: Author the beat HTML**
+
+Root: `data-composition-id="amplify-case-study-beat-3"`, `data-duration="13"`.
+
+Layout:
+
+- Left third (x=96 to x=816): zoomed thumbnail carryover from Beat 2 (visual continuation). At t=1, it dissolves (`opacity 0`, `scale 1 → 1.05` over 700ms) revealing code panel beneath.
+- Code panel: positioned absolute, left=96px, top=240px, width=720px, padding=28px, `--ink-elevated` background, 1px `--code-soft` border, border-radius=8px.
+
+Code panel contents (as `<pre><code>` with manual line wrapping):
+
+```
+{
+  "eyebrow":        "",
+  "title":          "",
+  "body":           "",
+  "highlight":      "",
+  "supportingPoints": [],
+  "narration":      ""
+}
+```
+
+- Keys (`"eyebrow"`, `"title"`, etc.) in `--code` color
+- Values (the empty `""` and `[]`) in `--paper-dim`
+- Braces, colons, commas in `--paper-muted`
+- Each line wrapped in `<div class="b3-line">` for character reveal animation
+
+Right side: vertical stack of constraint labels, positioned absolute, right=96px, top=300px:
+
+- `layout       ← worker`
+- `color        ← worker`
+- `motion       ← worker`
+- `composition  ← worker`
+
+JetBrains Mono 22px `--paper-muted`, line-height 1.8, each line in `<div class="b3-constraint">`.
+
+Big caption: bottom-center, top=820px, width=1728px, text-align center. Inter Tight 500 96px `--paper`, words in `<span class="b3-cap-word">`. Text: "The schema was the ceiling." — the word "ceiling" in extra span `<span class="b3-ceiling">ceiling.</span>` so it can be colored `--warn`.
+
+GSAP timeline:
+
+```js
+const tl = gsap.timeline({ paused: true });
+// Thumbnail carryover dissolve
+tl.to(".b3-carryover", { opacity: 0, scale: 1.05, duration: 0.7 }, 1.0);
+// Code panel fades in as carryover dissolves
+tl.from(".b3-panel", { opacity: 0, duration: 0.5 }, 1.5);
+// Schema lines character-reveal one by one
+tl.from(
+  ".b3-line",
+  {
+    opacity: 0,
+    duration: 0.3,
+    ease: "power2.out",
+    stagger: 0.4,
+  },
+  1.8,
+);
+// Constraint labels slide in from right, staggered
+tl.from(
+  ".b3-constraint",
+  {
+    x: 40,
+    opacity: 0,
+    duration: 0.4,
+    ease: "power2.out",
+    stagger: 0.18,
+  },
+  3.0,
+);
+// Warn sweep across schema keys at t=6.5s
+tl.to(
+  ".b3-key",
+  {
+    color: "var(--warn)",
+    duration: 0.18,
+    ease: "power2.inOut",
+    yoyo: true,
+    repeat: 1,
+    stagger: 0.1,
+  },
+  6.5,
+);
+// Big caption word-by-word at t=8.5s
+tl.from(
+  ".b3-cap-word",
+  {
+    y: 24,
+    opacity: 0,
+    duration: 0.5,
+    ease: "power3.out",
+    stagger: 0.18,
+  },
+  8.5,
+);
+// At 11.5s, code panel + constraints dim to 0.15 opacity (Beat 3 starts exiting)
+tl.to(
+  [".b3-panel", ".b3-constraints"],
+  {
+    opacity: 0.15,
+    duration: 0.6,
+  },
+  11.5,
+);
+
+window.__timelines["amplify-case-study-beat-3"] = tl;
+```
+
+Schema field name spans should have class `b3-key` so the warn sweep can target them.
+
+The word "ceiling." in the caption needs `style="color: var(--warn);"` once revealed — set initially via the GSAP `.from` so the warn color shows up on entry.
+
+- [ ] **Step 3: Lint + validate** (same commands as Task 2)
+
+- [ ] **Step 4: Snapshot key frames**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/master/compositions/beat-3-schema-reveal.html \
+  --times 0,1.5,3.0,4.5,7.0,9.5,11.0,13.0 \
+  --output videos/amplify-case-study/master/snapshots/beat-3/
+```
+
+Verify:
+
+- t=0: carryover thumbnail visible left third
+- t=1.5: thumbnail dissolving, panel appearing
+- t=3.0: schema fields populating, constraints starting
+- t=4.5: schema + constraints visible
+- t=7.0: warn sweep mid-flight
+- t=9.5: caption mid-reveal
+- t=11.0: full caption visible
+- t=13.0: caption holds, panel dimmed
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add videos/amplify-case-study/master/compositions/beat-3-schema-reveal.html
+git commit -m "feat(videos/amplify-case-study): build beat 3 — schema reveal"
+```
+
+---
+
+## Task 4: Build Beat 4 — THE DELETE (10 seconds)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/master/compositions/beat-4-delete.html`
+- Snapshots: `videos/amplify-case-study/master/snapshots/beat-4/`
+
+**Reference:** STORYBOARD.md → BEAT 4 — THE DELETE
+
+- [ ] **Step 1: Read framework rules**
+
+- [ ] **Step 2: Author the beat HTML**
+
+Root: `data-composition-id="amplify-case-study-beat-4"`, `data-duration="10"`.
+
+Layout: full-canvas terminal frame.
+
+- Terminal container: 1600×800 centered (x=160, y=140), `--ink-elevated` background, 1px `--ink-line` border, border-radius=12px.
+- Title bar (top 48px of terminal): three traffic-light dots (12px circles, 16px gap) at left, padding-left=20px, each in `--paper-dim`. Title text center: `~/amplify — apps/web` in JetBrains Mono 14px `--paper-muted`.
+- Body: JetBrains Mono 22px `--paper`, line-height 1.6, padding 40px.
+
+Lines (all initially `opacity: 0`):
+
+```
+$ git log --oneline apps/web/src/lib/explainer-storyboard.ts | head -3
+e0f0f28 chore: storyboard module
+1a2b3c4 feat: explainer interview
+d4e5f6a feat: video pipeline scaffolding
+
+$ rm src/lib/explainer-storyboard.ts
+
+$ git diff --stat HEAD~1
+ apps/web/src/lib/explainer-storyboard.ts | <span class="b4-counter">000</span> ----------------------------
+
+$ git commit -m "delete the ceiling"
+```
+
+Wrap each line in `<div class="b4-line">`. The deletion counter (`000`) is wrapped in `<span class="b4-counter">` for tween. The line-of-minuses (`----------------------------`) in `<span class="b4-dashes">`.
+
+GSAP timeline:
+
+```js
+const tl = gsap.timeline({ paused: true });
+
+// Lines 1-4 (git log + 3 commit lines) fade in at t=0.5, staggered
+tl.from(
+  ".b4-line.b4-log",
+  {
+    opacity: 0,
+    duration: 0.3,
+    stagger: 0.35,
+  },
+  0.5,
+);
+
+// Prompt line "$ rm ..." typed out character-by-character at t=2.0
+const rmLine = document.querySelector(".b4-line-rm .b4-typed");
+const rmText = "$ rm src/lib/explainer-storyboard.ts";
+rmLine.textContent = "";
+tl.to(
+  {},
+  {
+    duration: rmText.length * 0.04,
+    onUpdate: function () {
+      const progress = this.progress();
+      const chars = Math.floor(progress * rmText.length);
+      rmLine.textContent = rmText.slice(0, chars);
+    },
+  },
+  2.0,
+);
+
+// SFX tick at t=4.0 (when rm line completes)
+tl.call(
+  () => {
+    if (window.__sfxTick) window.__sfxTick();
+  },
+  [],
+  4.0,
+);
+
+// "git diff --stat" line fades in at t=5.0
+tl.from(".b4-line-diffcmd", { opacity: 0, duration: 0.3 }, 5.0);
+tl.from(".b4-line-diffstat", { opacity: 0, duration: 0.3 }, 5.3);
+
+// Counter ticks 0 → 455 in --signal over 1.2s starting at t=5.6
+tl.to(
+  ".b4-counter",
+  {
+    innerText: 455,
+    duration: 1.2,
+    snap: { innerText: 1 },
+    ease: "power2.out",
+    color: "var(--signal)",
+  },
+  5.6,
+);
+
+// Dashes draw right-to-left in --signal
+tl.from(
+  ".b4-dashes",
+  {
+    width: 0,
+    duration: 1.0,
+    ease: "power2.out",
+    color: "var(--signal)",
+  },
+  5.8,
+);
+
+// Commit line types at t=7.5
+const commitLine = document.querySelector(".b4-line-commit .b4-typed");
+const commitText = '$ git commit -m "delete the ceiling"';
+commitLine.textContent = "";
+tl.to(
+  {},
+  {
+    duration: commitText.length * 0.03,
+    onUpdate: function () {
+      const progress = this.progress();
+      const chars = Math.floor(progress * commitText.length);
+      commitLine.textContent = commitText.slice(0, chars);
+    },
+  },
+  7.5,
+);
+
+// Commit line briefly turns --signal then fades
+tl.to(".b4-line-commit", { color: "var(--signal)", duration: 0.2 }, 8.6);
+tl.to(".b4-line-commit", { opacity: 0.4, duration: 0.3 }, 9.0);
+
+// Hold the terminal until exit at end of beat
+window.__timelines["amplify-case-study-beat-4"] = tl;
+```
+
+**Inline SFX (Web Audio):**
+
+```html
+<script>
+  // Inline SFX generator — called by the timeline at the tick moment
+  window.__sfxTick = function () {
+    const ctx = new (window.AudioContext || window.webkitAudioContext)();
+    const o = ctx.createOscillator();
+    const g = ctx.createGain();
+    o.type = "square";
+    o.frequency.value = 600;
+    g.gain.value = 0.08;
+    o.connect(g).connect(ctx.destination);
+    o.start();
+    g.gain.exponentialRampToValueAtTime(0.0001, ctx.currentTime + 0.2);
+    o.stop(ctx.currentTime + 0.2);
+  };
+</script>
+```
+
+**Note**: SFX may not play during HyperFrames render mode (which doesn't capture audio from `AudioContext`). If the render pipeline doesn't capture inline-generated audio, the SFX is a visual-only beat — the counter and color change still land. Confirm via render output; if missing, add a tick.mp3 to `narration/` and switch to `<audio>` element triggered by the timeline.
+
+- [ ] **Step 3: Lint + validate**
+
+- [ ] **Step 4: Snapshot key frames**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/master/compositions/beat-4-delete.html \
+  --times 0,0.8,1.8,3.5,5.5,6.8,8.0,9.5 \
+  --output videos/amplify-case-study/master/snapshots/beat-4/
+```
+
+Verify:
+
+- t=0: empty terminal
+- t=0.8: first log line visible
+- t=1.8: all log lines visible
+- t=3.5: rm line mid-type
+- t=5.5: diff stat line appearing
+- t=6.8: counter at ~455, dashes drawn
+- t=8.0: commit line mid-type
+- t=9.5: terminal complete with all lines
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add videos/amplify-case-study/master/compositions/beat-4-delete.html
+git commit -m "feat(videos/amplify-case-study): build beat 4 — delete"
+```
+
+---
+
+## Task 5: Build Beat 5 — NEW PIPELINE (18 seconds)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/master/compositions/beat-5-new-pipeline.html`
+- Snapshots: `videos/amplify-case-study/master/snapshots/beat-5/`
+
+**Reference:** STORYBOARD.md → BEAT 5 — NEW PIPELINE
+
+This is the most complex beat. Read the storyboard section carefully before authoring.
+
+- [ ] **Step 1: Read framework rules + storyboard section**
+
+```bash
+cat skills/hyperframes/SKILL.md skills/gsap/SKILL.md
+grep -A 80 "BEAT 5 — NEW PIPELINE" videos/amplify-case-study/STORYBOARD.md
+```
+
+- [ ] **Step 2: Author the beat HTML**
+
+Root: `data-composition-id="amplify-case-study-beat-5"`, `data-duration="18"`.
+
+Architecture diagram structure:
+
+- 9 node "pills" in 2 rows
+  - Row 1 (top, y=240px): `[interview]` → `[brief]` → `[SQS]` → `[worker]`
+  - Row 2 (bottom, y=620px, anchored under [worker]): `[LLM composes]` → `[validate]` → `[render]` → `[MP4]`
+  - Vertical connector from [worker] down to [LLM composes]
+  - Retry arrow from [validate] back to [LLM composes] (curves up over the row)
+
+Pill styling:
+
+- 32px tall, padding 0 24px, border-radius 999px
+- 1px `--ink-line` border, `--ink-elevated` background
+- JetBrains Mono 18px `--paper-muted`
+- Active state: border becomes `--signal`, background becomes `--signal-soft`, text becomes `--paper`
+- Each pill is positioned absolutely (or use flex containers per row)
+
+Connector hairlines: SVG `<line>` elements with `stroke-dasharray` for "draw-in" effect. Use `strokeDashoffset` from full length to 0.
+
+GSAP timeline (~12s of motion + 6s hold):
+
+```js
+const tl = gsap.timeline({ paused: true });
+
+// Top-right label
+tl.from(".b5-label", { opacity: 0, duration: 0.4 }, 0);
+
+// Row 1 nodes activate sequentially (each: 600ms apart)
+["interview", "brief", "sqs", "worker"].forEach((id, i) => {
+  tl.add(activateNode(`#b5-${id}`), 0.5 + i * 0.6);
+  if (i < 3) {
+    tl.add(drawLine(`#b5-line-${id}-to-${["brief", "sqs", "worker"][i]}`), 0.5 + i * 0.6 + 0.2);
+  }
+});
+
+// Worker pulse (extra emphasis)
+tl.to(
+  "#b5-worker .b5-pill",
+  {
+    scale: 1.06,
+    duration: 0.3,
+    yoyo: true,
+    repeat: 1,
+  },
+  2.9,
+);
+
+// Vertical drop from worker to Row 2
+tl.add(drawLine("#b5-line-worker-down"), 3.5);
+
+// Row 2 nodes activate sequentially
+["llm", "validate", "render", "mp4"].forEach((id, i) => {
+  tl.add(activateNode(`#b5-${id}`), 4.0 + i * 0.8);
+  if (i < 3) {
+    tl.add(drawLine(`#b5-line-${id}-to-${["validate", "render", "mp4"][i]}`), 4.0 + i * 0.8 + 0.2);
+  }
+});
+
+// LLM code snippet panel slides in at t=4.5
+tl.from(
+  ".b5-code-panel",
+  {
+    x: -30,
+    opacity: 0,
+    duration: 0.5,
+    ease: "power3.out",
+  },
+  4.5,
+);
+
+// Retry arrow draws back at t=6.0
+tl.add(drawLine("#b5-retry-arrow"), 6.0);
+tl.from(".b5-retry-label", { opacity: 0, duration: 0.4 }, 6.4);
+
+// Retry loop flash — two cycles
+tl.add(retryFlash(), 7.5);
+
+// Final caption at t=10.0
+tl.from(
+  ".b5-caption .b5-word",
+  {
+    y: 24,
+    opacity: 0,
+    duration: 0.5,
+    ease: "power3.out",
+    stagger: 0.15,
+  },
+  10.0,
+);
+
+// Ambient pulse on retry arrow for the remaining hold
+tl.to(
+  "#b5-retry-arrow",
+  {
+    opacity: 0.6,
+    duration: 1.0,
+    ease: "sine.inOut",
+    repeat: -1,
+    yoyo: true,
+  },
+  12.0,
+);
+
+window.__timelines["amplify-case-study-beat-5"] = tl;
+
+// --- Helpers, defined inline at top of script block ---
+function activateNode(selector) {
+  return gsap.to(selector + " .b5-pill", {
+    borderColor: "var(--signal)",
+    backgroundColor: "var(--signal-soft)",
+    color: "var(--paper)",
+    duration: 0.4,
+  });
+}
+function drawLine(selector) {
+  return gsap.fromTo(
+    selector,
+    { strokeDashoffset: "var(--len)" },
+    { strokeDashoffset: 0, duration: 0.6, ease: "power2.inOut" },
+  );
+}
+function retryFlash() {
+  const t = gsap.timeline();
+  t.to("#b5-llm .b5-pill, #b5-validate .b5-pill", { scale: 1.03, duration: 0.2 });
+  t.to("#b5-llm .b5-pill, #b5-validate .b5-pill", { scale: 1.0, duration: 0.2 });
+  t.to("#b5-llm .b5-pill, #b5-validate .b5-pill", { scale: 1.03, duration: 0.2 });
+  t.to("#b5-llm .b5-pill, #b5-validate .b5-pill", { scale: 1.0, duration: 0.2 });
+  return t;
+}
+```
+
+Code snippet panel: positioned absolute right side of Row 2 area. Show 4-5 lines of representative LLM call code in JetBrains Mono 14px `--paper`:
+
+```
+await openai.responses.create({
+  model: 'gpt-5',
+  input: [
+    { role: 'system', content: skillBundle },
+    { role: 'user', content: brief },
+  ],
+});
+```
+
+Caption text (top=920px, JetBrains Mono 18px not display — this is a small label, not the big caption): "The worker authors the whole composition." Wrap words in `<span class="b5-word">`. Actually use 56px Inter Tight 500 `--paper` per storyboard.
+
+SVG architecture for connector lines:
+
+- Each line: `<line>` with `stroke="var(--ink-soft)"`, stroke-width="1", initial `stroke-dasharray="var(--len)"`, `stroke-dashoffset="var(--len)"`. Define `--len` per line based on its actual length.
+
+- [ ] **Step 3: Lint + validate**
+
+- [ ] **Step 4: Snapshot key frames**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/master/compositions/beat-5-new-pipeline.html \
+  --times 0,1.5,3.0,4.5,6.0,8.0,10.5,13.0,17.0 \
+  --output videos/amplify-case-study/master/snapshots/beat-5/
+```
+
+Verify each frame matches storyboard description.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add videos/amplify-case-study/master/compositions/beat-5-new-pipeline.html
+git commit -m "feat(videos/amplify-case-study): build beat 5 — new pipeline"
+```
+
+---
+
+## Task 6: Build Beat 6 — THE FALLBACK (8 seconds)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/master/compositions/beat-6-fallback.html`
+- Snapshots: `videos/amplify-case-study/master/snapshots/beat-6/`
+
+**Reference:** STORYBOARD.md → BEAT 6 — THE FALLBACK
+
+- [ ] **Step 1: Read framework rules**
+
+- [ ] **Step 2: Author the beat HTML**
+
+Root: `data-composition-id="amplify-case-study-beat-6"`, `data-duration="8"`.
+
+This beat starts with the Beat 5 diagram already on screen (visually carried over). Since each beat is rendered independently, this beat needs to re-create the dimmed pipeline diagram in its initial state. Implementation:
+
+- Statically render the pipeline diagram from Beat 5 in its end-state (all nodes activated), but at 60% opacity from the start of this beat.
+- Position it in the upper 60% of canvas (transform: scale(0.85) translateY(-30px)).
+
+Then animate:
+
+- A horizontal hairline draws across the canvas at y=750px in `--ink-soft`, full width (1728px). 600ms.
+- A `--ink-elevated` block draws in below the hairline (full width 1728px, height 120px, top=780px, centered horizontally, 1px `--ink-line` border, border-radius 8px).
+- Center label: `template renderer (fallback)`, 28px JetBrains Mono 500 `--paper-muted`.
+- 8px-thick base plate beneath the block (just an `--ink-line` rect at y=908px, full width, 4px tall).
+- Dotted hairlines connecting the [MP4] node above to the fallback block below.
+- At t=3.0: caption appears: "Floor solid. Ceiling ambitious." (56px Inter Tight 500 `--paper`, bottom-left at top=860px... wait, the fallback block is around there. Move caption to bottom-left of canvas: x=96, y=960px? No, that's below the canvas. Place caption above the pipeline at top=180px.)
+
+Re-layout: put the caption at the TOP of the beat, above the pipeline carryover. Then the pipeline + hairline + fallback block stack below.
+
+Hard-code the "Floor" word to land in `--paper` and "Ceiling" to land in `--signal`.
+
+GSAP timeline:
+
+```js
+const tl = gsap.timeline({ paused: true });
+// Hairline draws
+tl.from(
+  ".b6-divider",
+  { scaleX: 0, duration: 0.6, ease: "power2.inOut", transformOrigin: "left center" },
+  0.5,
+);
+// Fallback block draws
+tl.from(
+  ".b6-fallback-block",
+  { opacity: 0, scaleX: 0, duration: 0.6, ease: "power3.out", transformOrigin: "center" },
+  1.0,
+);
+tl.from(".b6-fallback-label", { opacity: 0, duration: 0.4 }, 1.5);
+// Dotted connector lines
+tl.from(".b6-dotted-connector", { strokeDashoffset: "var(--len)", duration: 0.6 }, 1.8);
+// Caption word-by-word
+tl.from(
+  ".b6-cap-word",
+  { y: 24, opacity: 0, duration: 0.5, ease: "power3.out", stagger: 0.18 },
+  3.0,
+);
+// Final hold (no animation)
+window.__timelines["amplify-case-study-beat-6"] = tl;
+```
+
+- [ ] **Step 3: Lint + validate**
+
+- [ ] **Step 4: Snapshot key frames**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/master/compositions/beat-6-fallback.html \
+  --times 0,0.8,1.5,2.5,4.0,7.0 \
+  --output videos/amplify-case-study/master/snapshots/beat-6/
+```
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add videos/amplify-case-study/master/compositions/beat-6-fallback.html
+git commit -m "feat(videos/amplify-case-study): build beat 6 — fallback"
+```
+
+---
+
+## Task 7: Build Beat 7 — BESPOKE GRID (12 seconds)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/master/compositions/beat-7-bespoke-grid.html`
+- Snapshots: `videos/amplify-case-study/master/snapshots/beat-7/`
+
+**Reference:** STORYBOARD.md → BEAT 7 — BESPOKE GRID
+
+- [ ] **Step 1: Read framework rules**
+
+- [ ] **Step 2: Author the beat HTML**
+
+Root: `data-composition-id="amplify-case-study-beat-7"`, `data-duration="12"`.
+
+Same 3×2 grid layout as Beat 2 (cells 480×270, 40px gap, anchored 150px from top), but each cell is a **visibly distinct mini-composition**. Top-right label: `amplify / 2026-05-19+`.
+
+Cell designs (each rendered as inline HTML/CSS inside its `b7-cell`):
+
+**Cell 1 — Warm-cream serif:**
+
+```html
+<div class="b7-cell b7-cell--warmpaper">
+  <div class="b7-warmpaper-eyebrow">ESSAY · 02</div>
+  <div class="b7-warmpaper-title">On The Quiet Power of Subtraction</div>
+  <div class="b7-warmpaper-byline">— d. proctor</div>
+</div>
+```
+
+Cell background: `#F7F1E6` (cream). Title in serif (use Google Font: `Lora` 600 italic 28px). Eyebrow: 11px caps mono `#7A6A55`. Byline: 12px italic.
+
+**Cell 2 — Deep-navy oversized number:**
+
+```html
+<div class="b7-cell b7-cell--navynumber">
+  <div class="b7-navynumber-num">42<span class="b7-navynumber-pct">%</span></div>
+  <div class="b7-navynumber-cap">of agents that read the docs</div>
+</div>
+```
+
+Cell background: gradient `linear-gradient(135deg, #0A1F3D, #1A3F75)`. Number in `--paper` 120px Inter Tight 600. Caption JetBrains Mono 14px `#B8C5DC`.
+
+**Cell 3 — Mono paper manifesto:**
+
+```html
+<div class="b7-cell b7-cell--manifesto">
+  <div class="b7-manifesto-bar"></div>
+  <div class="b7-manifesto-title">Make<br />It<br />Move.</div>
+  <div class="b7-manifesto-rule"></div>
+</div>
+```
+
+Cell background: `#F2F0E8` paper. Title: 56px Inter Tight 500 `#0A0A0A`. Rule: 2px `#0A0A0A` 30% width at bottom. Bar at top: 12px tall `#22D67A` 60% width.
+
+**Cell 4 — Gradient mesh + isometric icons:**
+
+```html
+<div class="b7-cell b7-cell--mesh">
+  <div class="b7-mesh-bg"></div>
+  <div class="b7-mesh-title">Six tools that ship</div>
+  <div class="b7-mesh-icons">
+    <span class="b7-mesh-ico">◆</span>
+    <span class="b7-mesh-ico">▲</span>
+    <span class="b7-mesh-ico">●</span>
+    <span class="b7-mesh-ico">■</span>
+    <span class="b7-mesh-ico">★</span>
+  </div>
+</div>
+```
+
+Background: conic-gradient mesh from `#FF6B9D` through `#9D6BFF` and `#6BFFD8`. Title overlay: 24px Inter Tight 500 white. Icons: 32px white, spaced.
+
+**Cell 5 — Dark terminal aesthetic:**
+
+```html
+<div class="b7-cell b7-cell--terminal">
+  <div class="b7-terminal-chrome"><span></span><span></span><span></span></div>
+  <div class="b7-terminal-body">
+    <div><span class="b7-terminal-prompt">$</span> deploy --env prod</div>
+    <div class="b7-terminal-out">→ shipping…</div>
+    <div><span class="b7-terminal-dot"></span> <span class="b7-terminal-success">ok</span></div>
+  </div>
+</div>
+```
+
+Background: `#08090B`. Mono 14px. Prompt in `--code`. Dot pulses `--signal`.
+
+GSAP timeline:
+
+```js
+const tl = gsap.timeline({ paused: true });
+// Label appears immediately
+tl.from(".b7-label", { opacity: 0, duration: 0.4 }, 0);
+// Cells populate one-by-one (stagger 0.4s)
+tl.from(
+  ".b7-cell",
+  { opacity: 0, scale: 0.96, duration: 0.5, ease: "power3.out", stagger: 0.4 },
+  0.3,
+);
+// Ambient motion per cell — each gets its own little life
+tl.add(ambientCell2(), 3.0); // counter ticking
+tl.add(ambientCell4(), 3.5); // mesh drift
+tl.add(ambientCell5(), 3.8); // pulsing dot
+// Caption at t=7.0
+tl.from(
+  ".b7-cap-word",
+  { y: 24, opacity: 0, duration: 0.5, ease: "power3.out", stagger: 0.12 },
+  7.0,
+);
+// Hold the final state until exit
+window.__timelines["amplify-case-study-beat-7"] = tl;
+
+function ambientCell2() {
+  return gsap.fromTo(
+    ".b7-navynumber-num",
+    { innerText: 0 },
+    {
+      innerText: 42,
+      duration: 2.5,
+      snap: { innerText: 1 },
+      repeat: -1,
+      yoyo: true,
+      repeatDelay: 1,
+    },
+  );
+}
+function ambientCell4() {
+  return gsap.to(".b7-mesh-bg", {
+    rotation: 360,
+    duration: 18,
+    ease: "none",
+    repeat: -1,
+    transformOrigin: "center",
+  });
+}
+function ambientCell5() {
+  return gsap.to(".b7-terminal-dot", {
+    opacity: 0.3,
+    duration: 0.6,
+    ease: "sine.inOut",
+    yoyo: true,
+    repeat: -1,
+  });
+}
+```
+
+Caption: "Now every video is its own thing." (caption styling same as Beat 2's, in cell 6).
+
+- [ ] **Step 3: Lint + validate**
+
+- [ ] **Step 4: Snapshot key frames**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/master/compositions/beat-7-bespoke-grid.html \
+  --times 0,1.0,2.5,4.5,7.5,10.0,11.5 \
+  --output videos/amplify-case-study/master/snapshots/beat-7/
+```
+
+Verify cells are **visibly distinct**.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add videos/amplify-case-study/master/compositions/beat-7-bespoke-grid.html
+git commit -m "feat(videos/amplify-case-study): build beat 7 — bespoke grid"
+```
+
+---
+
+## Task 8: Build Beat 8 — LESSON (9 seconds)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/master/compositions/beat-8-lesson.html`
+- Snapshots: `videos/amplify-case-study/master/snapshots/beat-8/`
+
+**Reference:** STORYBOARD.md → BEAT 8 — LESSON
+
+- [ ] **Step 1: Read framework rules**
+
+- [ ] **Step 2: Author the beat HTML**
+
+Root: `data-composition-id="amplify-case-study-beat-8"`, `data-duration="9"`.
+
+Pure ink canvas. Persistent hairline at bottom now spans the full 1728px width in `--signal` (this beat ANIMATES the hairline from its Beat 7 end-state to `scaleX: 1.0` of the full canvas).
+
+Center pull-quote, 168px Inter Tight 600, line-height 1.05, center-aligned:
+
+```
+The shape of the schema
+is the shape of the ceiling.
+```
+
+Two lines. Words wrapped in `<span class="b8-q-word">`. Special spans:
+
+- The word "shape" (first occurrence in each line, so two `shape` words) in `<span class="b8-q-shape">` → color `--signal`
+- The word "ceiling." in `<span class="b8-q-ceiling">` → color `--warn`
+
+CTA: below the quote, 64px below the bottom edge of the quote. JetBrains Mono 22px `--paper-muted`, text:
+
+```
+read the full case study →
+```
+
+GSAP timeline:
+
+```js
+const tl = gsap.timeline({ paused: true });
+// Hairline grows to full
+tl.fromTo(
+  ".hf-hairline, .b8-hairline",
+  { scaleX: 0.85 },
+  { scaleX: 1.0, duration: 1.0, ease: "power2.inOut", transformOrigin: "left center" },
+  0,
+);
+// Pull quote words reveal
+tl.from(
+  ".b8-q-word",
+  {
+    y: 24,
+    opacity: 0,
+    duration: 0.6,
+    ease: "power3.out",
+    stagger: 0.18,
+  },
+  0.5,
+);
+// Hold 3s after the last word
+// CTA fades in at t=6.0
+tl.from(".b8-cta", { opacity: 0, duration: 0.6 }, 6.0);
+// Hold until end of beat
+// Final fade to black at end of beat
+tl.to(".b8-root", { opacity: 0, duration: 0.6 }, 8.4);
+
+window.__timelines["amplify-case-study-beat-8"] = tl;
+```
+
+- [ ] **Step 3: Lint + validate**
+
+- [ ] **Step 4: Snapshot key frames**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/master/compositions/beat-8-lesson.html \
+  --times 0,1.5,3.5,5.5,7.0,9.0 \
+  --output videos/amplify-case-study/master/snapshots/beat-8/
+```
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add videos/amplify-case-study/master/compositions/beat-8-lesson.html
+git commit -m "feat(videos/amplify-case-study): build beat 8 — lesson"
+```
+
+---
+
+## Task 9: Generate master narration MP3
+
+**Files:**
+
+- Create: `videos/amplify-case-study/narration/master-narration.mp3`
+- Create: `videos/amplify-case-study/narration/master-transcript.json`
+
+Use HyperFrames' built-in `tts` (Kokoro local model) as the default. If ElevenLabs is preferred and credentials are configured, use ElevenLabs directly.
+
+- [ ] **Step 1: Construct the input script with per-line timing markers**
+
+Build a text file `narration/master-script.txt` with one line per beat narration (per SCRIPT.md). The HyperFrames `tts` command will produce a single MP3 plus a transcript with word-level timestamps.
+
+```
+Three weeks ago, every explainer video our platform made looked the same.
+The model only filled in strings. Layout, color, motion — all on us. The schema was the ceiling.
+So we deleted it. Four hundred and fifty-five lines, gone.
+Now the worker reads the brief, calls the model, and the model writes the whole composition. We validate. We retry. We ship.
+The old template renderer is still there. Underneath. A floor we can trust. So the ceiling can be ambitious.
+Now every video is its own thing. Same runtime. Different design.
+The shape of the schema is the shape of the ceiling.
+```
+
+- [ ] **Step 2: Generate with Kokoro (default — no external API needed)**
+
+```bash
+npx hyperframes tts \
+  --input videos/amplify-case-study/narration/master-script.txt \
+  --output videos/amplify-case-study/narration/master-narration.mp3 \
+  --voice am_eric \
+  --speed 1.0 \
+  --transcript videos/amplify-case-study/narration/master-transcript.json
+```
+
+(If `--voice` flag differs from `am_eric` syntax, run `npx hyperframes tts --help` and adjust. The voice should be a calm-confident American male.)
+
+- [ ] **Step 3: Verify**
+
+```bash
+ls -la videos/amplify-case-study/narration/
+ffprobe -v error -show_entries format=duration videos/amplify-case-study/narration/master-narration.mp3
+```
+
+Expected: MP3 exists, duration is approximately 30–50 seconds (depends on Kokoro pace).
+
+- [ ] **Step 4: Listen (manual check)**
+
+```bash
+afplay videos/amplify-case-study/narration/master-narration.mp3
+```
+
+Confirm clarity, pace, no garbled words.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add videos/amplify-case-study/narration/
+git commit -m "feat(videos/amplify-case-study): generate master narration MP3"
+```
+
+---
+
+## Task 10: Compose master/index.html
+
+**Files:**
+
+- Create: `videos/amplify-case-study/master/index.html`
+
+This task assembles the 8 beat HTMLs into a single 87-second composition. Each beat becomes a `<div class="clip">` child of the root composition, with `data-start` and `data-duration` driving HyperFrames' visibility runtime. Beat-level GSAP timelines are stitched into a master timeline.
+
+- [ ] **Step 1: Scaffold the root structure**
+
+```html
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>Amplify Case Study — Master</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600&family=JetBrains+Mono:wght@400;500&family=Lora:ital,wght@1,600&display=swap"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="../shared/tokens.css" />
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        background: var(--ink);
+      }
+      /* Per-beat styles merged below */
+    </style>
+  </head>
+  <body>
+    <div
+      id="stage"
+      data-composition-id="amplify-case-study-master"
+      data-start="0"
+      data-duration="87"
+      data-width="1920"
+      data-height="1080"
+    >
+      <!-- 8 beats as <div class="clip"> children -->
+      <!-- Beat 1 -->
+      <div class="clip b1-root" data-start="0" data-duration="7" data-track-index="0">
+        <!-- (Beat 1 scene markup copied in, with <style> moved to head) -->
+      </div>
+      <!-- Beat 2 -->
+      <div class="clip b2-root" data-start="7" data-duration="10" data-track-index="0">
+        <!-- (Beat 2 scene markup copied in) -->
+      </div>
+      <!-- ... continues for beats 3–8 ... -->
+
+      <!-- Audio narration -->
+      <audio
+        id="narration"
+        data-start="0"
+        data-duration="87"
+        data-track-index="1"
+        data-volume="1.0"
+        src="../narration/master-narration.mp3"
+      ></audio>
+    </div>
+
+    <script>
+      window.__timelines = window.__timelines || {};
+      // Each beat's <script> block was already moved into the body
+      // (see merge step below). Each beat's <script> registers
+      // window.__timelines["amplify-case-study-beat-N"] = tl
+      // synchronously when the beat's clip becomes active.
+      // The HyperFrames runtime drives each beat's timeline via
+      // its `data-start` offset and the registered timeline key.
+    </script>
+  </body>
+</html>
+```
+
+- [ ] **Step 2: Merge beat content**
+
+For each beat HTML (`compositions/beat-1-hook.html` through `compositions/beat-8-lesson.html`):
+
+1. Extract the `<template>` contents — the actual scene markup.
+2. Wrap in `<div class="clip b<N>-root" data-start="<offset>" data-duration="<N>">` inside `#stage`.
+3. Move the beat's `<style>` block to the master `<head>` `<style>` block.
+4. Move the beat's `<script>` block to the bottom of `<body>`. Each beat's script must self-defend: check `if (!document.querySelector('[data-composition-id="amplify-case-study-beat-N"]')) return;` before running.
+
+`data-start` offsets per beat:
+
+| Beat | data-start | data-duration |
+| ---- | ---------- | ------------- |
+| 1    | 0          | 7             |
+| 2    | 7          | 10            |
+| 3    | 17         | 13            |
+| 4    | 30         | 10            |
+| 5    | 40         | 18            |
+| 6    | 58         | 8             |
+| 7    | 66         | 12            |
+| 8    | 78         | 9             |
+
+- [ ] **Step 3: Lint composition**
+
+```bash
+npx hyperframes lint videos/amplify-case-study/master/index.html
+```
+
+Expected: PASS.
+
+- [ ] **Step 4: Validate composition**
+
+```bash
+npx hyperframes validate videos/amplify-case-study/master/index.html
+```
+
+Expected: PASS. All 8 beat timelines register on `window.__timelines`.
+
+- [ ] **Step 5: Preview in browser**
+
+```bash
+npx hyperframes preview videos/amplify-case-study/master/index.html
+```
+
+Open the localhost URL it prints. Scrub the timeline. Verify each beat transitions smoothly into the next.
+
+- [ ] **Step 6: Commit**
+
+```bash
+git add videos/amplify-case-study/master/index.html
+git commit -m "feat(videos/amplify-case-study): compose master cut index.html"
+```
+
+---
+
+## Task 11: Render master MP4
+
+**Files:**
+
+- Create: `videos/amplify-case-study/renders/master-16x9.mp4`
+
+- [ ] **Step 1: Render**
+
+```bash
+npx hyperframes render videos/amplify-case-study/master/index.html \
+  --output videos/amplify-case-study/renders/master-16x9.mp4 \
+  --width 1920 \
+  --height 1080 \
+  --fps 30
+```
+
+Expected: completes in 1–3 minutes (single-machine render). On macOS, expect screenshot-mode fallback (a diagnostic will appear); on Linux with `chrome-headless-shell`, BeginFrame mode runs.
+
+- [ ] **Step 2: Verify output**
+
+```bash
+ls -la videos/amplify-case-study/renders/
+ffprobe -v error -show_entries format=duration -show_entries stream=width,height,codec_name videos/amplify-case-study/renders/master-16x9.mp4
+```
+
+Expected:
+
+- Duration: ~87s
+- Width: 1920, Height: 1080
+- Codec: h264 (or hevc on Apple Silicon depending on hyperframes default)
+
+- [ ] **Step 3: Watch end-to-end (manual)**
+
+```bash
+open videos/amplify-case-study/renders/master-16x9.mp4
+```
+
+Watch in full. Check for:
+
+- All 8 beats visible
+- Narration synced to beats
+- No frozen/empty frames
+- No clipped/runaway animations
+
+If any beat is broken, identify it and return to that beat's task to fix.
+
+- [ ] **Step 4: Commit**
+
+```bash
+git add videos/amplify-case-study/renders/master-16x9.mp4
+git commit -m "feat(videos/amplify-case-study): render master 16:9 MP4"
+```
+
+---
+
+## Task 12: Generate short narration MP3
+
+**Files:**
+
+- Create: `videos/amplify-case-study/narration/short-narration.mp3`
+- Create: `videos/amplify-case-study/narration/short-transcript.json`
+
+Same procedure as Task 9, with the short cut script (per SCRIPT.md).
+
+- [ ] **Step 1: Write `narration/short-script.txt`**
+
+```
+Three weeks ago, every explainer video looked the same.
+So we deleted it. Four hundred and fifty-five lines, gone.
+Now every video is its own thing.
+The shape of the schema is the shape of the ceiling.
+```
+
+- [ ] **Step 2: Generate**
+
+```bash
+npx hyperframes tts \
+  --input videos/amplify-case-study/narration/short-script.txt \
+  --output videos/amplify-case-study/narration/short-narration.mp3 \
+  --voice am_eric \
+  --speed 1.0 \
+  --transcript videos/amplify-case-study/narration/short-transcript.json
+```
+
+- [ ] **Step 3: Verify**
+
+```bash
+ffprobe -v error -show_entries format=duration videos/amplify-case-study/narration/short-narration.mp3
+```
+
+Expected: ~15–22 seconds.
+
+- [ ] **Step 4: Commit**
+
+```bash
+git add videos/amplify-case-study/narration/short-script.txt videos/amplify-case-study/narration/short-narration.mp3 videos/amplify-case-study/narration/short-transcript.json
+git commit -m "feat(videos/amplify-case-study): generate short narration MP3"
+```
+
+---
+
+## Task 13: Short Beat 1 — Template Grid (8s, 1:1)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/short/compositions/sbeat-1-template-grid.html`
+
+Adapted from Master Beat 2, recomposed for 1080×1080. 2×2 grid (4 templated thumbnails). Caption full-width at bottom.
+
+- [ ] **Step 1: Read framework rules**
+
+- [ ] **Step 2: Author**
+
+Root: `data-composition-id="amplify-case-study-short-1"`, `data-duration="8"`, `data-width="1080"`, `data-height="1080"`.
+
+Layout:
+
+- 2×2 grid centered (cells 440×248 with 32px gap), anchored 120px from top
+- 4 templated thumbnails using same eyebrow+title+warn-bar layout from Beat 2 (first 4 entries)
+- Caption full-width at bottom, y=900px, x=64, width=952px, Inter Tight 500 56px `--paper`: "Every video looked the same." (word-by-word reveal)
+
+GSAP timeline: same as Master Beat 2 (cells populate stagger, synced pulse, caption reveal). Compress to 8s by tightening stagger.
+
+- [ ] **Step 3: Lint + validate + snapshot**
+
+```bash
+npx hyperframes lint videos/amplify-case-study/short/compositions/sbeat-1-template-grid.html
+npx hyperframes validate videos/amplify-case-study/short/compositions/sbeat-1-template-grid.html
+npx hyperframes snapshot videos/amplify-case-study/short/compositions/sbeat-1-template-grid.html \
+  --times 0,1.5,3.5,6.0,7.8 \
+  --output videos/amplify-case-study/short/snapshots/sbeat-1/
+```
+
+- [ ] **Step 4: Commit**
+
+```bash
+git add videos/amplify-case-study/short/compositions/sbeat-1-template-grid.html
+git commit -m "feat(videos/amplify-case-study): build short beat 1 — template grid"
+```
+
+---
+
+## Task 14: Short Beat 2 — The Delete (6s, 1:1)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/short/compositions/sbeat-2-delete.html`
+
+Adapted from Master Beat 4. Terminal sequence compressed.
+
+- [ ] **Step 1: Read framework rules**
+
+- [ ] **Step 2: Author**
+
+Root: `data-composition-id="amplify-case-study-short-2"`, `data-duration="6"`, `data-width="1080"`, `data-height="1080"`.
+
+Layout:
+
+- Terminal centered, 920×620, padding 32px
+- Show only:
+  - `$ rm src/lib/explainer-storyboard.ts` (typed in over 1.5s, starting at t=0.3)
+  - `−455 lines` ticker (starts at t=2.5, ticks for 1.2s)
+- Both in JetBrains Mono 32px (larger than master beat 4 to compensate for square aspect)
+
+Skip the git-log preamble and the commit line (no time for them).
+
+- [ ] **Step 3: Lint + validate + snapshot**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/short/compositions/sbeat-2-delete.html \
+  --times 0,1.0,2.5,4.0,5.5 \
+  --output videos/amplify-case-study/short/snapshots/sbeat-2/
+```
+
+- [ ] **Step 4: Commit**
+
+```bash
+git add videos/amplify-case-study/short/compositions/sbeat-2-delete.html
+git commit -m "feat(videos/amplify-case-study): build short beat 2 — delete"
+```
+
+---
+
+## Task 15: Short Beat 3 — Bespoke Grid (10s, 1:1)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/short/compositions/sbeat-3-bespoke-grid.html`
+
+Adapted from Master Beat 7. 2×2 grid with 4 distinct designs (pick the strongest 4 from Master Beat 7's 5 cells).
+
+- [ ] **Step 1: Read framework rules**
+
+- [ ] **Step 2: Author**
+
+Same 2×2 grid as Short Beat 1, but each cell is a distinct mini-composition (pick Master Beat 7's Cell 1, Cell 2, Cell 3, and Cell 5 — skip Cell 4 mesh since it's the busiest and may not read at smaller size).
+
+Caption full-width at bottom: "Now every video is its own thing."
+
+GSAP timeline: cell-by-cell reveal, ambient motion inside each cell, caption reveal at t=6.5.
+
+- [ ] **Step 3: Lint + validate + snapshot**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/short/compositions/sbeat-3-bespoke-grid.html \
+  --times 0,1.5,3.5,5.5,7.5,9.5 \
+  --output videos/amplify-case-study/short/snapshots/sbeat-3/
+```
+
+- [ ] **Step 4: Commit**
+
+```bash
+git add videos/amplify-case-study/short/compositions/sbeat-3-bespoke-grid.html
+git commit -m "feat(videos/amplify-case-study): build short beat 3 — bespoke grid"
+```
+
+---
+
+## Task 16: Short Beat 4 — Lesson (6s, 1:1)
+
+**Files:**
+
+- Create: `videos/amplify-case-study/short/compositions/sbeat-4-lesson.html`
+
+Adapted from Master Beat 8. Pull quote sized for 1:1.
+
+- [ ] **Step 1: Read framework rules**
+
+- [ ] **Step 2: Author**
+
+Root: `data-composition-id="amplify-case-study-short-4"`, `data-duration="6"`, `data-width="1080"`, `data-height="1080"`.
+
+Layout:
+
+- Center pull-quote, 88px Inter Tight 600, two lines, center-anchored at y=400px:
+
+  ```
+  The shape of the schema
+  is the shape of the ceiling.
+  ```
+
+- "shape" words in `--signal`, "ceiling." in `--warn`.
+- CTA below, y=720px, JetBrains Mono 20px `--paper-muted`: `read the full case study →`
+- Persistent hairline along bottom (full width in `--signal`)
+
+GSAP timeline: word reveal, hold, CTA fade-in, final fade-to-black.
+
+- [ ] **Step 3: Lint + validate + snapshot**
+
+```bash
+npx hyperframes snapshot videos/amplify-case-study/short/compositions/sbeat-4-lesson.html \
+  --times 0,1.5,3.0,4.5,6.0 \
+  --output videos/amplify-case-study/short/snapshots/sbeat-4/
+```
+
+- [ ] **Step 4: Commit**
+
+```bash
+git add videos/amplify-case-study/short/compositions/sbeat-4-lesson.html
+git commit -m "feat(videos/amplify-case-study): build short beat 4 — lesson"
+```
+
+---
+
+## Task 17: Compose short/index.html
+
+**Files:**
+
+- Create: `videos/amplify-case-study/short/index.html`
+
+Same merging procedure as Task 10, but for the short cut.
+
+- [ ] **Step 1: Scaffold**
+
+```html
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>Amplify Case Study — Short</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600&family=JetBrains+Mono:wght@400;500&family=Lora:ital,wght@1,600&display=swap"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="../shared/tokens.css" />
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1080px;
+        height: 1080px;
+        background: var(--ink);
+      }
+      /* Per-beat styles merged below */
+    </style>
+  </head>
+  <body>
+    <div
+      id="stage"
+      data-composition-id="amplify-case-study-short"
+      data-start="0"
+      data-duration="30"
+      data-width="1080"
+      data-height="1080"
+    >
+      <!-- Short Beats -->
+      <div class="clip sb1-root" data-start="0" data-duration="8" data-track-index="0"></div>
+      <div class="clip sb2-root" data-start="8" data-duration="6" data-track-index="0"></div>
+      <div class="clip sb3-root" data-start="14" data-duration="10" data-track-index="0"></div>
+      <div class="clip sb4-root" data-start="24" data-duration="6" data-track-index="0"></div>
+      <audio
+        id="narration"
+        data-start="0"
+        data-duration="30"
+        data-track-index="1"
+        data-volume="1.0"
+        src="../narration/short-narration.mp3"
+      ></audio>
+    </div>
+    <script>
+      window.__timelines = window.__timelines || {};
+    </script>
+  </body>
+</html>
+```
+
+- [ ] **Step 2: Merge beat content** (same procedure as Task 10 Step 2, but for the 4 short beats)
+
+- [ ] **Step 3: Lint + validate + preview**
+
+```bash
+npx hyperframes lint videos/amplify-case-study/short/index.html
+npx hyperframes validate videos/amplify-case-study/short/index.html
+npx hyperframes preview videos/amplify-case-study/short/index.html
+```
+
+- [ ] **Step 4: Commit**
+
+```bash
+git add videos/amplify-case-study/short/index.html
+git commit -m "feat(videos/amplify-case-study): compose short cut index.html"
+```
+
+---
+
+## Task 18: Render short MP4
+
+**Files:**
+
+- Create: `videos/amplify-case-study/renders/short-1x1.mp4`
+
+- [ ] **Step 1: Render**
+
+```bash
+npx hyperframes render videos/amplify-case-study/short/index.html \
+  --output videos/amplify-case-study/renders/short-1x1.mp4 \
+  --width 1080 \
+  --height 1080 \
+  --fps 30
+```
+
+- [ ] **Step 2: Verify**
+
+```bash
+ffprobe -v error -show_entries format=duration -show_entries stream=width,height videos/amplify-case-study/renders/short-1x1.mp4
+```
+
+Expected: duration ~30s, 1080×1080.
+
+- [ ] **Step 3: Watch (manual)**
+
+```bash
+open videos/amplify-case-study/renders/short-1x1.mp4
+```
+
+- [ ] **Step 4: Commit**
+
+```bash
+git add videos/amplify-case-study/renders/short-1x1.mp4
+git commit -m "feat(videos/amplify-case-study): render short 1:1 MP4"
+```
+
+---
+
+## Task 19: Final verification + project README
+
+**Files:**
+
+- Create: `videos/amplify-case-study/README.md`
+
+- [ ] **Step 1: Watch both renders end-to-end (manual)**
+
+```bash
+open videos/amplify-case-study/renders/master-16x9.mp4
+open videos/amplify-case-study/renders/short-1x1.mp4
+```
+
+Verify:
+
+- Narration syncs to visuals in both cuts
+- No frozen frames or black frames
+- All 8 master beats visible
+- All 4 short beats visible
+- Color palette consistent across both cuts
+- Typography consistent across both cuts
+
+- [ ] **Step 2: Write README**
+
+````markdown
+# Amplify Case Study Explainer
+
+Two HyperFrames compositions accompanying the Substack case study
+_"We Pulled the Storyboard Module — and Got Better Videos."_
+
+## Outputs
+
+- `renders/master-16x9.mp4` — 87-second master cut, 1920×1080. For embedding
+  at the top of the article and full-width social posts.
+- `renders/short-1x1.mp4` — 30-second short cut, 1080×1080. For LinkedIn
+  feed and Substack Notes.
+
+## Build
+
+```bash
+# Render both cuts
+npx hyperframes render master/index.html --output renders/master-16x9.mp4 --width 1920 --height 1080 --fps 30
+npx hyperframes render short/index.html --output renders/short-1x1.mp4 --width 1080 --height 1080 --fps 30
+```
+````
+
+## Source
+
+- `DESIGN.md` — visual system
+- `STORYBOARD.md` — beat-by-beat plan
+- `SCRIPT.md` — narration script
+- `PLAN.md` — implementation plan
+- `master/compositions/` — individual beat HTML files
+- `short/compositions/` — short cut beat HTMLs
+- `shared/tokens.css` — shared design tokens
+
+````
+
+- [ ] **Step 3: Commit**
+
+```bash
+git add videos/amplify-case-study/README.md
+git commit -m "docs(videos/amplify-case-study): add project README"
+```
+
+- [ ] **Step 4: Push**
+
+```bash
+git push origin main
+```
+
+---
+
+## Self-Review Checklist (done)
+
+- **Spec coverage:** Every beat in `STORYBOARD.md` maps to a task (Beats 1–8 → Tasks 1–8; short cut → Tasks 13–16). Narration → Tasks 9 + 12. Renders → Tasks 11 + 18. Design system → Task 0 (shared tokens). All visual-system rules from `DESIGN.md` are referenced inline in beat tasks.
+
+- **Placeholder scan:** No TBDs. Every step has actual content. The `am_eric` voice flag may need adjustment based on the actual `hyperframes tts --help` output — flagged inline at Task 9 Step 2.
+
+- **Type consistency:** Composition IDs use consistent naming: `amplify-case-study-beat-<N>` for master, `amplify-case-study-short-<N>` for short cut. Timeline registration keys match. Beat class prefixes (`b1-` through `b8-`, `sb1-` through `sb4-`) are unique.
+
+- **Scope check:** 19 tasks is a lot, but each is a self-contained beat or pipeline step. Subagent-driven-development is the right execution sub-skill — one subagent per task, two-stage review between.
+
+---
+
+## Execution
+
+Plan complete. Two execution options:
+
+1. **Subagent-Driven (recommended)** — Fresh subagent per task, spec-compliance review + code-quality review between tasks, fast iteration. Good for this plan because each beat is independent and benefits from clean context.
+
+2. **Inline Execution** — Execute tasks in this session using `executing-plans`, batch execution with checkpoints. Lower overhead but context accumulates across tasks.
+````
diff --git a/videos/amplify-case-study/SCRIPT.md b/videos/amplify-case-study/SCRIPT.md
new file mode 100644
index 000000000..b94e1b4e1
--- /dev/null
+++ b/videos/amplify-case-study/SCRIPT.md
@@ -0,0 +1,104 @@
+# SCRIPT — Amplify Case Study Explainer
+
+Narration script for both cuts. ElevenLabs TTS. Voice: mid-age male,
+calm-confident, slight dry edge on the contrarian beats (Beat 3 and
+Beat 8). Manifesto-register. Same voice as `synapse-os-explainer` for
+sibling-piece consistency.
+
+## Master cut (87s · 110 words narration · ~44s of audio · ~50% silence)
+
+### Beat 1 — HOOK (0.0s – 7.0s)
+
+_(silent — type-only)_
+
+### Beat 2 — TEMPLATE GRID (7.0s – 17.0s)
+
+> Three weeks ago, every explainer video our platform made looked the same.
+
+_Start: 8.0s · End: ~12.5s · Pace: measured, level_
+
+### Beat 3 — SCHEMA REVEAL (17.0s – 30.0s)
+
+> The model only filled in strings. Layout, color, motion — all on us. The schema was the ceiling.
+
+_Start: 17.5s · End: ~23.0s · Pace: dry, slight emphasis on "ceiling"_
+
+### Beat 4 — THE DELETE (30.0s – 40.0s)
+
+> So we deleted it. Four hundred and fifty-five lines, gone.
+
+_Start: 31.0s · End: ~34.5s · Pace: punchy, declarative_
+
+### Beat 5 — NEW PIPELINE (40.0s – 58.0s)
+
+> Now the worker reads the brief, calls the model, and the model writes the whole composition. We validate. We retry. We ship.
+
+_Start: 41.0s · End: ~49.0s · Pace: flowing into the trio of short sentences at the end ("validate. retry. ship.") with deliberate pauses between them_
+
+### Beat 6 — THE FALLBACK (58.0s – 66.0s)
+
+> The old template renderer is still there. Underneath. A floor we can trust. So the ceiling can be ambitious.
+
+_Start: 58.5s · End: ~64.0s · Pace: reassuring, slows on "ceiling can be ambitious"_
+
+### Beat 7 — BESPOKE GRID (66.0s – 78.0s)
+
+> Now every video is its own thing. Same runtime. Different design.
+
+_Start: 66.5s · End: ~71.0s · Pace: confident, the three sentences hit like beats_
+
+### Beat 8 — LESSON (78.0s – 87.0s)
+
+> The shape of the schema is the shape of the ceiling.
+
+_Start: 78.5s · End: ~82.5s · Pace: slow, deliberate, the closer_
+
+---
+
+## Short cut (30s · ~50 words narration · ~20s of audio · ~33% silence)
+
+### Short Beat 1 — TEMPLATE GRID (0.0s – 8.0s)
+
+> Three weeks ago, every explainer video looked the same.
+
+### Short Beat 2 — THE DELETE (8.0s – 14.0s)
+
+> So we deleted it. Four hundred and fifty-five lines, gone.
+
+### Short Beat 3 — BESPOKE GRID (14.0s – 24.0s)
+
+> Now every video is its own thing.
+
+### Short Beat 4 — LESSON (24.0s – 30.0s)
+
+> The shape of the schema is the shape of the ceiling.
+
+---
+
+## Generation notes
+
+- Generate master narration as a single MP3 with internal silence between
+  beats. Easier than concatenating per-beat clips and risking drift.
+- ElevenLabs `voice_settings`: stability 0.45, similarity 0.85, style 0.30,
+  speaker_boost true. Reduce stability if the read sounds too rigid; raise
+  style if it sounds too monotone.
+- Generate the short cut narration separately (different timing).
+- ElevenLabs returns timestamp metadata — save to
+  `narration/transcript.json`. The composition can use these for accurate
+  beat-start timing if needed (or, simpler, hand-tune from the file's
+  audio waveform).
+- If ElevenLabs isn't available, fall back to local Kokoro via the
+  `hyperframes-media` skill. Voice presets there: `bm_george` (British
+  male) or `am_eric` (American male) are closest to the calm-confident
+  register we want.
+
+## Editorial notes
+
+The script is intentionally sparse. The visuals carry most of the runtime;
+the narration is punctuation. Per the article: _"the silence between
+sentences is a feature."_
+
+The two lines that need to land hardest are Beat 3's "the schema was the
+ceiling" and Beat 8's "the shape of the schema is the shape of the
+ceiling." These are the article's load-bearing claims. Voice direction
+slows on both.
diff --git a/videos/amplify-case-study/STORYBOARD.md b/videos/amplify-case-study/STORYBOARD.md
new file mode 100644
index 000000000..8731cb77b
--- /dev/null
+++ b/videos/amplify-case-study/STORYBOARD.md
@@ -0,0 +1,402 @@
+# STORYBOARD — Amplify Case Study Explainer
+
+Beat-by-beat plan. Both cuts (master 16:9 + short 1:1) derive from the same
+beat catalog defined here. See `DESIGN.md` for the visual system and
+`SCRIPT.md` for narration timing.
+
+## Global guardrails
+
+- Ink canvas every beat. Never invert.
+- One signal color dominant per beat (`signal` for the new path; `warn` for
+  the old schema/ceiling; `code` for structured data).
+- Persistent 1px `signal` hairline along bottom 8% — grows from 8% width
+  (Beat 1) → 100% width (Beat 8).
+- Ambient motion in every beat (slow pulse on active element, hairline draw,
+  ticker, breathing node). No static frames.
+- Every beat carries at least one piece of "real" text from the article or
+  the codebase — file paths, schema fields, line counts. The truth is the
+  proof.
+- Master GSAP timeline is paused; each beat is a child timeline.
+
+---
+
+## MASTER CUT (1920×1080 · 87s · 8 beats)
+
+### BEAT 1 — HOOK (0.0s – 7.0s · 7.0s)
+
+**VO:** _(silent — pure type + ambient pad)_
+
+**Concept:** Cold open. The video's thesis as a single sentence delivered
+typographically. No chrome, no labels, just words landing on ink.
+
+**Visual layers:**
+
+1. Background: pure `--ink`. A faint `signal` hairline at the very bottom
+   begins life at 8% width, anchored left.
+2. Headline (center, 96px Inter Tight 500, `--paper`):
+   > "Click. Wait two minutes. Get a video that actually looks like your article."
+   > Reveals word-by-word over 4.5s (stagger 0.16s, `y: 24 → 0, opacity 0 → 1,
+power3.out`).
+3. Held for 2s after the last word lands. No supporting text. No CTA.
+
+**Motion:** word reveal only. Ambient: the hairline begins a slow imperceptible
+pulse (3% opacity oscillation, 4s loop).
+
+**Exit:** beat-to-beat crossfade over 500ms into Beat 2.
+
+---
+
+### BEAT 2 — TEMPLATE GRID (7.0s – 17.0s · 10.0s)
+
+**VO:** "Three weeks ago, every explainer video our platform made looked
+the same." _(starts at 8.0s, ends ~12.5s)_
+
+**Concept:** The before-pillar. A grid of five video thumbnails — different
+articles, identical layouts. They cycle/pulse to emphasize sameness.
+
+**Visual layers:**
+
+1. Top-right `mono-s` label in `--paper-muted`: `amplify / 2026-05-15`.
+2. 3×2 grid centered horizontally, anchored ~150px from top. Cells are 480×270
+   (16:9). Five filled cells, sixth cell occupied by caption text.
+3. Each cell is `--ink-elevated` with a 1px `--ink-line` border. Inside each
+   cell, a stylized "fake explainer" — same layout per cell: eyebrow at top
+   (24px mono `--paper-muted`), title in middle (40px Inter Tight 500 `--paper`),
+   accent bar (4px `--warn`, 60% width) at bottom. Only the _text_ differs across
+   cells: "DEV DAY RECAP", "QUARTERLY EARNINGS", "AGENT BENCHMARKS",
+   "MODEL UPDATE", "TOOL ROUNDUP".
+4. Each cell populates with scale `0.96 → 1` + opacity, staggered 0.12s.
+5. Once all 5 are in place (~3s), a 3s hold while a subtle pulse loops
+   across all cells in sync — _they all breathe together_. This is the
+   visual punch: the sameness is the message.
+6. Caption appears in cell 6 at 11.0s (bottom-left of that cell, 56px
+   Inter Tight 500 `--paper`):
+   > "Every video looked like every other video."
+   > Word-by-word reveal, stagger 0.1s.
+
+**Exit:** at 16.5s, the five thumbnails fade to `opacity: 0.3` and one
+thumbnail (cell 3) enlarges and zooms toward the camera. Hold zoom into Beat 3.
+
+---
+
+### BEAT 3 — SCHEMA REVEAL (17.0s – 30.0s · 13.0s)
+
+**VO:** "The model only filled in strings. Layout, color, motion — all on us.
+The schema was the ceiling." _(starts at 17.5s, ends ~23.0s)_
+
+**Concept:** The intellectual hinge — Part 1. The video the model "made"
+dissolves to reveal the JSON schema that constrained it. The schema is the
+cage.
+
+**Visual layers:**
+
+1. Continuation from Beat 2's zoom — the enlarged thumbnail occupies the
+   left third. At 18.0s, it dissolves (opacity → 0, scale 1 → 1.05, over
+   700ms) revealing a code panel beneath.
+2. Code panel (anchored left, 720px wide, `--ink-elevated`, 1px `--code-soft`
+   border, 28px padding):
+   ```
+   {
+     "eyebrow":        "",
+     "title":          "",
+     "body":           "",
+     "highlight":      "",
+     "supportingPoints": [],
+     "narration":      ""
+   }
+   ```
+   Keys in `--code`, empty string values in `--paper-dim`. Fields populate
+   line-by-line with character reveal, stagger 0.08s per line.
+3. Right side: a vertical stack of constraint labels in `mono-m`
+   `--paper-muted`, 80px from top:
+   - `layout       ← worker`
+   - `color        ← worker`
+   - `motion       ← worker`
+   - `composition  ← worker`
+     Each line reveals with a 200ms `power2.out` slide from the right.
+4. After the schema and constraint labels are in place (~24s), a `--warn`
+   highlight sweeps across the _schema field names_ — each `eyebrow`,
+   `title`, `body`, `highlight`, `supportingPoints` briefly glows `--warn`.
+5. Big caption appears bottom-center at 26.0s (96px Inter Tight 500 `--paper`):
+   > "The schema was the ceiling."
+   > Word-by-word reveal, stagger 0.18s. The word _ceiling_ lands in `--warn`.
+6. Hold for 2s.
+
+**Motion:** schema fields character-reveal; constraint labels slide-in;
+the warn-sweep across schema keys.
+
+**Exit:** at 29.5s, the code panel and constraint labels fade to
+`opacity: 0.15`. The "ceiling" caption holds and translates upward as Beat 4
+loads underneath.
+
+---
+
+### BEAT 4 — THE DELETE (30.0s – 40.0s · 10.0s)
+
+**VO:** "So we deleted it. Four hundred and fifty-five lines, gone."
+_(starts at 31.0s, ends ~34.5s)_
+
+**Concept:** A terminal sequence. The single most satisfying visual in the
+video. Subtraction.
+
+**Visual layers:**
+
+1. Full-canvas terminal frame. `--ink-elevated` background, 1px `--ink-line`
+   chrome with three traffic-light dots at top-left in `--paper-dim`.
+   Terminal title bar: `~/amplify — apps/web`.
+2. Lines fade in one at a time at the top, in `mono-m` `--paper`:
+   ```
+   $ git log --oneline apps/web/src/lib/explainer-storyboard.ts | head -3
+   e0f0f28 chore: storyboard module
+   1a2b3c4 feat: explainer interview
+   d4e5f6a feat: video pipeline scaffolding
+   ```
+   Reveal 350ms apart.
+3. At ~32.0s, a new prompt line types out, character-by-character (stagger
+   0.04s):
+   ```
+   $ rm src/lib/explainer-storyboard.ts
+   ```
+4. At ~34.0s, soft SFX "tick" coincides with the line completing. The line
+   sits on screen, cursor pulsing.
+5. At ~35.0s a new line appears: `$ git diff --stat HEAD~1` and below it
+   the line:
+   ```
+    apps/web/src/lib/explainer-storyboard.ts | 455 ----------------------------
+   ```
+   The `455` ticks up from `0 → 455` in `--signal`, counter style, over
+   1.2s. The `----------------------------` segment draws right-to-left
+   in `--signal`.
+6. At ~37.5s, a final line types: `$ git commit -m "delete the ceiling"`
+   in `--paper` then turns `--signal` briefly on Enter, then fades.
+7. Hold for 1.5s on the completed terminal before Beat 5.
+
+**Motion:** typed character reveals; counter tick; line draws.
+
+**Exit:** terminal collapses inward (scale `1 → 0.4`, opacity `1 → 0`,
+650ms `power3.inOut`) and reveals an architecture canvas underneath.
+
+---
+
+### BEAT 5 — NEW PIPELINE (40.0s – 58.0s · 18.0s)
+
+**VO:** "Now the worker reads the brief, calls the model, and the model
+writes the whole composition. We validate. We retry. We ship."
+_(starts at 41.0s, ends ~49.0s)_
+
+**Concept:** Architecture diagram comes alive. The new pipeline as a flow
+of activating nodes connected by drawn hairlines.
+
+**Visual layers:**
+
+1. Top-right `mono-s` label: `amplify-video-worker / 2026-05-19`.
+2. Nine nodes arranged left-to-right in two rows. Each is a `--ink-elevated`
+   pill with 1px `--ink-line` border, 32px tall, label inside in `mono-m`:
+
+   Row 1 (top, the request path):
+
+   ```
+   [interview] → [brief] → [SQS] → [worker]
+   ```
+
+   Row 2 (bottom, the authoring loop, anchored under [worker]):
+
+   ```
+   [LLM composes] → [validate] → [render] → [MP4]
+   ```
+
+   With an arrow looping from [validate] back to [LLM composes], labeled
+   `linter stderr → retry`.
+
+3. **Sequence (0–8s of beat):**
+   - t=0.0: [interview] activates (border `--signal`, fill `--signal-soft`,
+     400ms fade-in). Hairline draws from [interview] → [brief] (400ms).
+   - t=0.6: [brief] activates. Hairline → [SQS].
+   - t=1.2: [SQS] activates. Hairline → [worker].
+   - t=1.8: [worker] activates with a brief 600ms `--signal` pulse.
+     Worker spawns a vertical hairline downward to Row 2.
+   - t=2.4: [LLM composes] activates. Real code snippet (8 lines, the LLM
+     authoring prompt summary) types into a small `--ink-elevated` panel
+     to the right of Row 2.
+   - t=4.0: [validate] activates. The retry arrow draws back to [LLM
+     composes], its label appearing.
+   - t=5.0: The retry loop _flashes_ twice — [LLM composes] → [validate]
+     → [LLM composes] — each cycle 600ms.
+   - t=6.5: [render] activates. The retry loop dims to background.
+   - t=7.5: [MP4] activates. A small MP4 thumbnail (just a tinted rectangle
+     with a play triangle) appears next to it.
+
+4. Bottom-left caption appears at 50.0s in `display-m` `--paper`:
+
+   > "The worker authors the whole composition."
+   > Word-by-word reveal.
+
+5. Hold the full diagram + caption for 5s. Subtle ambient pulse on the
+   retry arrow continues throughout the hold.
+
+**Exit:** the diagram contracts to fill only the top 60% of the canvas
+(scale `1 → 0.85`, translate down 60px), making room for Beat 6 to draw
+underneath.
+
+---
+
+### BEAT 6 — THE FALLBACK (58.0s – 66.0s · 8.0s)
+
+**VO:** "The old template renderer is still there. Underneath. A floor we
+can trust. So the ceiling can be ambitious." _(starts at 58.5s, ends ~64.0s)_
+
+**Concept:** The architecture is still on screen, contracted. A _floor_
+draws in beneath it, visualizing the template renderer as a safety net.
+
+**Visual layers:**
+
+1. Above (carried from Beat 5): the contracted pipeline diagram, dimmed to
+   60% opacity.
+2. A horizontal hairline draws across the canvas at ~75% vertical, in
+   `--ink-soft`, full width. 600ms.
+3. Below it, a labeled `--ink-elevated` block draws in (full width, 120px
+   tall, 1px `--ink-line` border). Center label, `mono-l` `--paper-muted`:
+   `template renderer (fallback)`. The block has a subtle 8px-thick
+   "foundation" indicator beneath it — like a base plate.
+4. Dotted hairlines connect [MP4] from the upper diagram down into the
+   fallback block, indicating "this is the path we fall back to".
+5. Bottom-left caption appears at 61.0s:
+   > "Floor solid. Ceiling ambitious."
+   > `display-m` Inter Tight 500 `--paper`. The word "Floor" reveals in
+   > `--paper`, "Ceiling" reveals in `--signal`.
+6. Hold for 2s.
+
+**Exit:** entire architecture (upper + lower) fades to `opacity: 0` over
+600ms, ink canvas clears.
+
+---
+
+### BEAT 7 — BESPOKE GRID (66.0s – 78.0s · 12.0s)
+
+**VO:** "Now every video is its own thing. Same runtime. Different design."
+_(starts at 66.5s, ends ~71.0s)_
+
+**Concept:** The after-pillar. The 3×2 grid returns, but every thumbnail
+is visibly different — different palettes, different layouts, different
+motion suggestions. The opposite of Beat 2.
+
+**Visual layers:**
+
+1. Top-right `mono-s` label: `amplify / 2026-05-19+`.
+2. Same 3×2 grid as Beat 2 (same cell dimensions, same positions). Five
+   filled cells, sixth holds caption.
+3. **Each thumbnail is visually distinct:**
+   - Cell 1: warm-cream background, large serif title, photo-grid layout.
+   - Cell 2: deep navy gradient, oversized number ("42%") + small caption.
+   - Cell 3: monochrome paper, hand-drawn-style accent lines, manifesto type.
+   - Cell 4: gradient mesh background, isometric icon grid (5 small icons).
+   - Cell 5: dark mode terminal aesthetic, mono type, signal-green accent.
+
+   Each cell renders as actual HTML inside the cell (not screenshots) — Inter
+   Tight + JetBrains Mono variations, different background-gradient or solid,
+   different layout primitives. The "five different artists" effect.
+
+4. Cells populate one-by-one (stagger 0.4s), with brief ambient motion
+   inside each — a counter ticking in Cell 2, a slow drift in Cell 4, a
+   pulsing accent dot in Cell 5. Cells _feel alive_ unlike Beat 2's static
+   uniformity.
+
+5. Caption appears in cell 6 at 73.0s:
+   > "Now every video is its own thing."
+   > Same type treatment as Beat 2's caption (intentional callback).
+
+**Exit:** all five cells fade simultaneously to `opacity: 0` while caption
+text persists and translates to center. 600ms.
+
+---
+
+### BEAT 8 — LESSON (78.0s – 87.0s · 9.0s)
+
+**VO:** "The shape of the schema is the shape of the ceiling."
+_(starts at 78.5s, ends ~82.5s)_
+
+**Concept:** The thesis statement, big. Then a quiet CTA.
+
+**Visual layers:**
+
+1. Canvas: pure `--ink`. The persistent hairline now spans the full 100%
+   bottom width in `--signal`.
+2. Center pull-quote, `display-xl` (168px) Inter Tight 600, `--paper`:
+   > "The shape of the schema
+   > is the shape of the ceiling."
+   > Two lines, center-aligned, line-height 1.05. Word-by-word reveal with
+   > `power3.out`, stagger 0.18s. The word "ceiling" lands in `--warn`,
+   > the word "shape" lands in `--signal` (so the contrast is encoded into
+   > the type itself).
+3. Hold the pull quote for 3s.
+4. Below the quote at 84.0s, a thin CTA appears in `mono-m` `--paper-muted`:
+   ```
+   read the full case study →
+   ```
+   Fade-in 600ms. No URL — the article context provides it.
+5. Hold for 2s on full state, then fade entire canvas to black over 600ms.
+
+**Exit:** end of video.
+
+---
+
+## SHORT CUT (1080×1080 · 30s · 4 beats)
+
+The short cut is _not_ a separate composition — it is a recomposed selection
+of the master beats, rebuilt for the 1:1 frame. Same visual system, same
+typography, same accents.
+
+### SHORT BEAT 1 — TEMPLATE GRID (0.0s – 8.0s)
+
+Adapted from Master Beat 2. The grid is now a 2×2 instead of 3×2 (four
+templated thumbnails, no caption cell — caption is full-width across the
+bottom):
+
+```
++---+---+
+| 1 | 2 |
++---+---+
+| 3 | 4 |
++---+---+
+
+"Every video looked the same."
+```
+
+**VO:** "Three weeks ago, every explainer video looked the same."
+_(starts at 1.0s, ends ~6.0s)_
+
+### SHORT BEAT 2 — THE DELETE (8.0s – 14.0s)
+
+Adapted from Master Beat 4. Same terminal sequence but compressed to ~6s:
+
+- `rm explainer-storyboard.ts`
+- `−455 lines` ticker
+
+**VO:** "So we deleted it. Four hundred and fifty-five lines, gone."
+
+### SHORT BEAT 3 — BESPOKE GRID (14.0s – 24.0s)
+
+Adapted from Master Beat 7. Same 2×2 grid but with five different bespoke
+thumbnails (only 4 fit). Caption full-width: "Now every video is its own thing."
+
+**VO:** "Now every video is its own thing."
+
+### SHORT BEAT 4 — LESSON (24.0s – 30.0s)
+
+Adapted from Master Beat 8. Pull quote sized for 1:1: 96px Inter Tight 600,
+two lines, center-anchored. CTA below.
+
+**VO:** "The shape of the schema is the shape of the ceiling."
+
+---
+
+## Production notes
+
+- Build the master cut first beat-by-beat. Lint and validate each beat HTML
+  before moving on (`npx hyperframes lint && npx hyperframes validate`).
+- Compose the master `index.html` once all 8 beats are stable.
+- Render the master MP4.
+- Build the short cut by recomposing selected beats for 1080×1080.
+- Render the short MP4.
+- Both renders should be byte-stable; if BeginFrame fallback to screenshot
+  occurs on macOS that's expected — output should still be correct.
diff --git a/videos/amplify-case-study/master/assets/cta-qr.svg b/videos/amplify-case-study/master/assets/cta-qr.svg
new file mode 100644
index 000000000..1af6dc559
--- /dev/null
+++ b/videos/amplify-case-study/master/assets/cta-qr.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="utf-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 45 45" shape-rendering="crispEdges"><path fill="#ffffff" d="M0 0h45v45H0z"/><path stroke="#000000" d="M4 4.5h7m1 0h2m4 0h1m1 0h2m1 0h4m2 0h2m3 0h7M4 5.5h1m5 0h1m2 0h2m1 0h1m4 0h2m1 0h2m6 0h1m1 0h1m5 0h1M4 6.5h1m1 0h3m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m2 0h1m1 0h3m3 0h1m1 0h1m2 0h1m1 0h3m1 0h1M4 7.5h1m1 0h3m1 0h1m3 0h1m1 0h1m1 0h1m2 0h2m1 0h4m1 0h3m2 0h1m1 0h3m1 0h1M4 8.5h1m1 0h3m1 0h1m2 0h3m1 0h1m2 0h1m1 0h1m2 0h2m3 0h1m3 0h1m1 0h3m1 0h1M4 9.5h1m5 0h1m1 0h1m6 0h4m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m5 0h1M4 10.5h7m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h7M13 11.5h1m3 0h3m1 0h1m1 0h2m5 0h1M4 12.5h1m1 0h1m3 0h2m1 0h7m1 0h1m2 0h5m3 0h1m2 0h1m2 0h1m1 0h1M4 13.5h1m4 0h1m2 0h1m1 0h1m2 0h2m5 0h2m1 0h3m1 0h1m1 0h3m2 0h3M10 14.5h2m3 0h2m1 0h2m1 0h1m2 0h1m1 0h2m1 0h4m1 0h2m1 0h2m1 0h1M5 15.5h2m1 0h2m6 0h1m1 0h1m3 0h3m1 0h1m3 0h1m1 0h1m4 0h1M4 16.5h1m3 0h1m1 0h2m1 0h1m1 0h2m2 0h2m1 0h1m1 0h1m1 0h3m1 0h2m2 0h1m2 0h1m2 0h1M5 17.5h5m1 0h2m3 0h1m2 0h2m2 0h1m1 0h1m1 0h3m1 0h5m1 0h1m2 0h1M5 18.5h3m2 0h2m7 0h1m1 0h4m2 0h2m2 0h1m1 0h1m3 0h2m1 0h1M6 19.5h2m1 0h1m1 0h1m1 0h1m3 0h1m2 0h1m1 0h1m2 0h1m2 0h1m1 0h4m1 0h3M4 20.5h2m1 0h1m1 0h5m5 0h5m1 0h1m1 0h2m2 0h2m1 0h1m5 0h1M9 21.5h1m1 0h1m3 0h1m4 0h3m2 0h1m1 0h3m1 0h2m1 0h2m1 0h1m1 0h2M6 22.5h3m1 0h5m1 0h2m2 0h2m1 0h1m3 0h1m3 0h4m3 0h1m1 0h1M4 23.5h4m4 0h1m4 0h4m1 0h1m5 0h1m2 0h1m2 0h3M4 24.5h2m1 0h1m1 0h3m1 0h2m1 0h2m2 0h1m2 0h1m7 0h2m1 0h2m1 0h1m1 0h1M4 25.5h2m1 0h3m2 0h2m1 0h2m2 0h6m2 0h2m1 0h3m1 0h1m4 0h2M5 26.5h3m2 0h5m2 0h4m2 0h1m1 0h3m1 0h1m1 0h1m1 0h2m2 0h2m1 0h1M4 27.5h1m4 0h1m3 0h3m4 0h2m1 0h2m1 0h2m3 0h2m1 0h4m1 0h1M6 28.5h1m2 0h2m3 0h1m6 0h1m2 0h5m5 0h2M5 29.5h1m3 0h1m1 0h1m1 0h4m1 0h1m5 0h1m1 0h2m2 0h3m1 0h2m1 0h2m1 0h1M4 30.5h2m1 0h1m1 0h3m2 0h1m3 0h2m1 0h2m1 0h1m1 0h2m2 0h2m1 0h1m1 0h2m1 0h1m1 0h1M7 31.5h3m3 0h2m8 0h2m1 0h1m1 0h1m1 0h1m2 0h1m1 0h1m1 0h1M4 32.5h2m2 0h4m2 0h1m1 0h5m3 0h1m2 0h1m3 0h6m3 0h1M12 33.5h1m2 0h1m2 0h3m1 0h2m1 0h1m1 0h2m1 0h1m1 0h1m3 0h1m3 0h1M4 34.5h7m1 0h2m1 0h1m1 0h1m1 0h5m3 0h3m2 0h1m1 0h1m1 0h1m2 0h2M4 35.5h1m5 0h1m3 0h3m3 0h1m1 0h1m1 0h2m1 0h1m2 0h3m3 0h1M4 36.5h1m1 0h3m1 0h1m3 0h1m1 0h3m1 0h3m2 0h1m1 0h2m2 0h6m3 0h1M4 37.5h1m1 0h3m1 0h1m2 0h6m1 0h1m1 0h1m2 0h1m1 0h2m4 0h1m2 0h1M4 38.5h1m1 0h3m1 0h1m1 0h2m1 0h1m4 0h2m1 0h1m3 0h3m3 0h1m1 0h2m3 0h1M4 39.5h1m5 0h1m2 0h2m2 0h1m1 0h2m1 0h1m3 0h1m1 0h1m1 0h1m1 0h3m1 0h2M4 40.5h7m1 0h2m2 0h3m1 0h1m2 0h2m3 0h1m3 0h1m2 0h1m4 0h1"/></svg>
diff --git a/videos/amplify-case-study/master/index.html b/videos/amplify-case-study/master/index.html
new file mode 100644
index 000000000..6f73a8c25
--- /dev/null
+++ b/videos/amplify-case-study/master/index.html
@@ -0,0 +1,213 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>Amplify Case Study — Master</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600&family=JetBrains+Mono:wght@400;500&family=Lora:ital,wght@1,600&display=swap"
+      rel="stylesheet"
+    />
+    <style>
+      /* Design tokens — mirrors shared/tokens.css. Inlined so master/ is
+         self-contained for `hyperframes validate` (which serves only from
+         the project root). Keep in sync with ../shared/tokens.css. */
+      :root {
+        --ink: #08090b;
+        --ink-elevated: #12141a;
+        --ink-line: #1f232c;
+        --ink-soft: #2a2f3b;
+        --paper: #f5f2ec;
+        --paper-muted: #8b8e96;
+        --paper-dim: #5a5e68;
+        --signal: #22d67a;
+        --signal-soft: rgba(34, 214, 122, 0.15);
+        --warn: #f4a641;
+        --warn-soft: rgba(244, 166, 65, 0.18);
+        --code: #7dd3fc;
+        --code-soft: rgba(125, 211, 252, 0.15);
+        --font-display: "Inter Tight", "Inter", system-ui, sans-serif;
+        --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
+      }
+      [data-composition-id^="amplify-case-study"] {
+        position: absolute;
+        inset: 0;
+        background: var(--ink);
+        color: var(--paper);
+        font-family: "Inter Tight", "Inter", system-ui, sans-serif;
+        overflow: hidden;
+      }
+      .hf-hairline {
+        position: absolute;
+        bottom: 80px;
+        left: 96px;
+        height: 1px;
+        background: var(--signal);
+        transform-origin: left center;
+      }
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        background: #08090b;
+      }
+      #stage {
+        position: relative;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: var(--ink);
+      }
+      .clip {
+        position: absolute;
+        inset: 0;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="stage"
+      data-composition-id="amplify-case-study-master"
+      data-start="0"
+      data-duration="87"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div
+        class="clip"
+        data-composition-id="amplify-case-study-beat-1"
+        data-composition-src="compositions/beat-1-hook.html"
+        data-start="0"
+        data-duration="7"
+        data-track-index="0"
+      ></div>
+
+      <div
+        class="clip"
+        data-composition-id="amplify-case-study-beat-2"
+        data-composition-src="compositions/beat-2-template-grid.html"
+        data-start="7"
+        data-duration="10"
+        data-track-index="0"
+      ></div>
+
+      <div
+        class="clip"
+        data-composition-id="amplify-case-study-beat-3"
+        data-composition-src="compositions/beat-3-schema-reveal.html"
+        data-start="17"
+        data-duration="13"
+        data-track-index="0"
+      ></div>
+
+      <div
+        class="clip"
+        data-composition-id="amplify-case-study-beat-4"
+        data-composition-src="compositions/beat-4-delete.html"
+        data-start="30"
+        data-duration="10"
+        data-track-index="0"
+      ></div>
+
+      <div
+        class="clip"
+        data-composition-id="amplify-case-study-beat-5"
+        data-composition-src="compositions/beat-5-new-pipeline.html"
+        data-start="40"
+        data-duration="18"
+        data-track-index="0"
+      ></div>
+
+      <div
+        class="clip"
+        data-composition-id="amplify-case-study-beat-6"
+        data-composition-src="compositions/beat-6-fallback.html"
+        data-start="58"
+        data-duration="8"
+        data-track-index="0"
+      ></div>
+
+      <div
+        class="clip"
+        data-composition-id="amplify-case-study-beat-7"
+        data-composition-src="compositions/beat-7-bespoke-grid.html"
+        data-start="66"
+        data-duration="12"
+        data-track-index="0"
+      ></div>
+
+      <div
+        class="clip"
+        data-composition-id="amplify-case-study-beat-8"
+        data-composition-src="compositions/beat-8-lesson.html"
+        data-start="78"
+        data-duration="9"
+        data-track-index="0"
+      ></div>
+
+      <audio
+        data-start="8.0"
+        data-duration="10"
+        data-track-index="1"
+        data-volume="1.0"
+        src="narration/lines/line-1.mp3"
+      ></audio>
+      <audio
+        data-start="17.5"
+        data-duration="13"
+        data-track-index="1"
+        data-volume="1.0"
+        src="narration/lines/line-2.mp3"
+      ></audio>
+      <audio
+        data-start="31.0"
+        data-duration="9"
+        data-track-index="1"
+        data-volume="1.0"
+        src="narration/lines/line-3.mp3"
+      ></audio>
+      <audio
+        data-start="41.0"
+        data-duration="17"
+        data-track-index="1"
+        data-volume="1.0"
+        src="narration/lines/line-4.mp3"
+      ></audio>
+      <audio
+        data-start="58.5"
+        data-duration="7"
+        data-track-index="1"
+        data-volume="1.0"
+        src="narration/lines/line-5.mp3"
+      ></audio>
+      <audio
+        data-start="66.5"
+        data-duration="11"
+        data-track-index="1"
+        data-volume="1.0"
+        src="narration/lines/line-6.mp3"
+      ></audio>
+      <audio
+        data-start="78.5"
+        data-duration="8"
+        data-track-index="1"
+        data-volume="1.0"
+        src="narration/lines/line-7.mp3"
+      ></audio>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      // Master timeline is just a paused stub — each beat owns its own
+      // child timeline. The runtime activates each clip when the playhead
+      // enters its data-start..data-start+data-duration window.
+      window.__timelines = window.__timelines || {};
+      window.__timelines["amplify-case-study-master"] = gsap.timeline({
+        paused: true,
+      });
+    </script>
+  </body>
+</html>
diff --git a/videos/amplify-case-study/master/narration b/videos/amplify-case-study/master/narration
new file mode 120000
index 000000000..0997430d3
--- /dev/null
+++ b/videos/amplify-case-study/master/narration
@@ -0,0 +1 @@
+../narration
\ No newline at end of file
diff --git a/videos/amplify-case-study/master/snapshots/beat-1/frame-00-at-0.0s.png b/videos/amplify-case-study/master/snapshots/beat-1/frame-00-at-0.0s.png
new file mode 100644
index 000000000..9b2a9baf0
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-1/frame-00-at-0.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-1/frame-01-at-1.5s.png b/videos/amplify-case-study/master/snapshots/beat-1/frame-01-at-1.5s.png
new file mode 100644
index 000000000..39cd07c7b
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-1/frame-01-at-1.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-1/frame-02-at-3.5s.png b/videos/amplify-case-study/master/snapshots/beat-1/frame-02-at-3.5s.png
new file mode 100644
index 000000000..123a9f66e
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-1/frame-02-at-3.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-1/frame-03-at-5.0s.png b/videos/amplify-case-study/master/snapshots/beat-1/frame-03-at-5.0s.png
new file mode 100644
index 000000000..029e81046
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-1/frame-03-at-5.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-1/frame-04-at-7.0s.png b/videos/amplify-case-study/master/snapshots/beat-1/frame-04-at-7.0s.png
new file mode 100644
index 000000000..f9311f28b
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-1/frame-04-at-7.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-2/frame-00-at-0.0s.png b/videos/amplify-case-study/master/snapshots/beat-2/frame-00-at-0.0s.png
new file mode 100644
index 000000000..0d8ec8d4b
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-2/frame-00-at-0.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-2/frame-01-at-1.0s.png b/videos/amplify-case-study/master/snapshots/beat-2/frame-01-at-1.0s.png
new file mode 100644
index 000000000..610aa99b1
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-2/frame-01-at-1.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-2/frame-02-at-2.5s.png b/videos/amplify-case-study/master/snapshots/beat-2/frame-02-at-2.5s.png
new file mode 100644
index 000000000..b6bc3fc72
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-2/frame-02-at-2.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-2/frame-03-at-4.5s.png b/videos/amplify-case-study/master/snapshots/beat-2/frame-03-at-4.5s.png
new file mode 100644
index 000000000..70a277fe1
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-2/frame-03-at-4.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-2/frame-04-at-6.5s.png b/videos/amplify-case-study/master/snapshots/beat-2/frame-04-at-6.5s.png
new file mode 100644
index 000000000..6dd07a53b
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-2/frame-04-at-6.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-2/frame-05-at-9.0s.png b/videos/amplify-case-study/master/snapshots/beat-2/frame-05-at-9.0s.png
new file mode 100644
index 000000000..6dd07a53b
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-2/frame-05-at-9.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-2/frame-06-at-9.9s.png b/videos/amplify-case-study/master/snapshots/beat-2/frame-06-at-9.9s.png
new file mode 100644
index 000000000..cdc2e959d
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-2/frame-06-at-9.9s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-3/frame-00-at-0.0s.png b/videos/amplify-case-study/master/snapshots/beat-3/frame-00-at-0.0s.png
new file mode 100644
index 000000000..d4bccd3cc
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-3/frame-00-at-0.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-3/frame-01-at-1.5s.png b/videos/amplify-case-study/master/snapshots/beat-3/frame-01-at-1.5s.png
new file mode 100644
index 000000000..ab2fbf4e3
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-3/frame-01-at-1.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-3/frame-02-at-3.0s.png b/videos/amplify-case-study/master/snapshots/beat-3/frame-02-at-3.0s.png
new file mode 100644
index 000000000..7b5e01f42
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-3/frame-02-at-3.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-3/frame-03-at-4.5s.png b/videos/amplify-case-study/master/snapshots/beat-3/frame-03-at-4.5s.png
new file mode 100644
index 000000000..6d6e40b49
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-3/frame-03-at-4.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-3/frame-04-at-7.0s.png b/videos/amplify-case-study/master/snapshots/beat-3/frame-04-at-7.0s.png
new file mode 100644
index 000000000..c9a8b3b76
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-3/frame-04-at-7.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-3/frame-05-at-9.5s.png b/videos/amplify-case-study/master/snapshots/beat-3/frame-05-at-9.5s.png
new file mode 100644
index 000000000..48817a834
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-3/frame-05-at-9.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-3/frame-06-at-11.0s.png b/videos/amplify-case-study/master/snapshots/beat-3/frame-06-at-11.0s.png
new file mode 100644
index 000000000..4a8bf9ddd
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-3/frame-06-at-11.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-3/frame-07-at-13.0s.png b/videos/amplify-case-study/master/snapshots/beat-3/frame-07-at-13.0s.png
new file mode 100644
index 000000000..2ecfee41a
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-3/frame-07-at-13.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-4/frame-00-at-0.0s.png b/videos/amplify-case-study/master/snapshots/beat-4/frame-00-at-0.0s.png
new file mode 100644
index 000000000..52e0f7ceb
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-4/frame-00-at-0.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-4/frame-01-at-0.8s.png b/videos/amplify-case-study/master/snapshots/beat-4/frame-01-at-0.8s.png
new file mode 100644
index 000000000..16b4a00c3
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-4/frame-01-at-0.8s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-4/frame-02-at-1.8s.png b/videos/amplify-case-study/master/snapshots/beat-4/frame-02-at-1.8s.png
new file mode 100644
index 000000000..eb9d67c0c
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-4/frame-02-at-1.8s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-4/frame-03-at-3.5s.png b/videos/amplify-case-study/master/snapshots/beat-4/frame-03-at-3.5s.png
new file mode 100644
index 000000000..e395dac93
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-4/frame-03-at-3.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-4/frame-04-at-5.5s.png b/videos/amplify-case-study/master/snapshots/beat-4/frame-04-at-5.5s.png
new file mode 100644
index 000000000..099f7e0c3
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-4/frame-04-at-5.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-4/frame-05-at-6.8s.png b/videos/amplify-case-study/master/snapshots/beat-4/frame-05-at-6.8s.png
new file mode 100644
index 000000000..baae03af3
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-4/frame-05-at-6.8s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-4/frame-06-at-8.0s.png b/videos/amplify-case-study/master/snapshots/beat-4/frame-06-at-8.0s.png
new file mode 100644
index 000000000..47897e2ac
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-4/frame-06-at-8.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-4/frame-07-at-9.5s.png b/videos/amplify-case-study/master/snapshots/beat-4/frame-07-at-9.5s.png
new file mode 100644
index 000000000..084d9d486
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-4/frame-07-at-9.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-5/frame-00-at-0.0s.png b/videos/amplify-case-study/master/snapshots/beat-5/frame-00-at-0.0s.png
new file mode 100644
index 000000000..64cf495f2
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-5/frame-00-at-0.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-5/frame-01-at-1.5s.png b/videos/amplify-case-study/master/snapshots/beat-5/frame-01-at-1.5s.png
new file mode 100644
index 000000000..b6171f7dd
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-5/frame-01-at-1.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-5/frame-02-at-3.0s.png b/videos/amplify-case-study/master/snapshots/beat-5/frame-02-at-3.0s.png
new file mode 100644
index 000000000..4ad8a5ddc
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-5/frame-02-at-3.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-5/frame-03-at-4.5s.png b/videos/amplify-case-study/master/snapshots/beat-5/frame-03-at-4.5s.png
new file mode 100644
index 000000000..ac9c9b917
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-5/frame-03-at-4.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-5/frame-04-at-6.0s.png b/videos/amplify-case-study/master/snapshots/beat-5/frame-04-at-6.0s.png
new file mode 100644
index 000000000..95f19c84c
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-5/frame-04-at-6.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-5/frame-05-at-8.0s.png b/videos/amplify-case-study/master/snapshots/beat-5/frame-05-at-8.0s.png
new file mode 100644
index 000000000..912e05c9c
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-5/frame-05-at-8.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-5/frame-06-at-10.5s.png b/videos/amplify-case-study/master/snapshots/beat-5/frame-06-at-10.5s.png
new file mode 100644
index 000000000..29a624c72
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-5/frame-06-at-10.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-5/frame-07-at-13.0s.png b/videos/amplify-case-study/master/snapshots/beat-5/frame-07-at-13.0s.png
new file mode 100644
index 000000000..4c9409249
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-5/frame-07-at-13.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-5/frame-08-at-17.0s.png b/videos/amplify-case-study/master/snapshots/beat-5/frame-08-at-17.0s.png
new file mode 100644
index 000000000..764923eb1
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-5/frame-08-at-17.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-6/frame-00-at-0.0s.png b/videos/amplify-case-study/master/snapshots/beat-6/frame-00-at-0.0s.png
new file mode 100644
index 000000000..7e39dbf0a
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-6/frame-00-at-0.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-6/frame-01-at-0.8s.png b/videos/amplify-case-study/master/snapshots/beat-6/frame-01-at-0.8s.png
new file mode 100644
index 000000000..f9b1d63a1
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-6/frame-01-at-0.8s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-6/frame-02-at-1.5s.png b/videos/amplify-case-study/master/snapshots/beat-6/frame-02-at-1.5s.png
new file mode 100644
index 000000000..1ef520f26
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-6/frame-02-at-1.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-6/frame-03-at-2.5s.png b/videos/amplify-case-study/master/snapshots/beat-6/frame-03-at-2.5s.png
new file mode 100644
index 000000000..67476f1ed
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-6/frame-03-at-2.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-6/frame-04-at-4.0s.png b/videos/amplify-case-study/master/snapshots/beat-6/frame-04-at-4.0s.png
new file mode 100644
index 000000000..411d7d91a
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-6/frame-04-at-4.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-6/frame-05-at-7.0s.png b/videos/amplify-case-study/master/snapshots/beat-6/frame-05-at-7.0s.png
new file mode 100644
index 000000000..411d7d91a
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-6/frame-05-at-7.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-7/frame-00-at-0.0s.png b/videos/amplify-case-study/master/snapshots/beat-7/frame-00-at-0.0s.png
new file mode 100644
index 000000000..0f8fd7d33
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-7/frame-00-at-0.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-7/frame-01-at-1.0s.png b/videos/amplify-case-study/master/snapshots/beat-7/frame-01-at-1.0s.png
new file mode 100644
index 000000000..e414924e8
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-7/frame-01-at-1.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-7/frame-02-at-2.5s.png b/videos/amplify-case-study/master/snapshots/beat-7/frame-02-at-2.5s.png
new file mode 100644
index 000000000..fe8bb51f2
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-7/frame-02-at-2.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-7/frame-03-at-4.5s.png b/videos/amplify-case-study/master/snapshots/beat-7/frame-03-at-4.5s.png
new file mode 100644
index 000000000..4b428f81c
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-7/frame-03-at-4.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-7/frame-04-at-7.5s.png b/videos/amplify-case-study/master/snapshots/beat-7/frame-04-at-7.5s.png
new file mode 100644
index 000000000..e779555cd
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-7/frame-04-at-7.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-7/frame-05-at-10.0s.png b/videos/amplify-case-study/master/snapshots/beat-7/frame-05-at-10.0s.png
new file mode 100644
index 000000000..87110d893
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-7/frame-05-at-10.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-7/frame-06-at-11.5s.png b/videos/amplify-case-study/master/snapshots/beat-7/frame-06-at-11.5s.png
new file mode 100644
index 000000000..1e9720cb7
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-7/frame-06-at-11.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-8/frame-00-at-0.0s.png b/videos/amplify-case-study/master/snapshots/beat-8/frame-00-at-0.0s.png
new file mode 100644
index 000000000..cc61d631e
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-8/frame-00-at-0.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-8/frame-01-at-1.5s.png b/videos/amplify-case-study/master/snapshots/beat-8/frame-01-at-1.5s.png
new file mode 100644
index 000000000..338cb3456
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-8/frame-01-at-1.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-8/frame-02-at-3.5s.png b/videos/amplify-case-study/master/snapshots/beat-8/frame-02-at-3.5s.png
new file mode 100644
index 000000000..be99ee957
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-8/frame-02-at-3.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-8/frame-03-at-5.5s.png b/videos/amplify-case-study/master/snapshots/beat-8/frame-03-at-5.5s.png
new file mode 100644
index 000000000..be99ee957
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-8/frame-03-at-5.5s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-8/frame-04-at-7.0s.png b/videos/amplify-case-study/master/snapshots/beat-8/frame-04-at-7.0s.png
new file mode 100644
index 000000000..6d4a3e40e
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-8/frame-04-at-7.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/beat-8/frame-05-at-9.0s.png b/videos/amplify-case-study/master/snapshots/beat-8/frame-05-at-9.0s.png
new file mode 100644
index 000000000..9b2a9baf0
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/beat-8/frame-05-at-9.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/frame-00-at-3.0s.png b/videos/amplify-case-study/master/snapshots/frame-00-at-3.0s.png
new file mode 100644
index 000000000..72e558fd2
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/frame-00-at-3.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/frame-01-at-12.0s.png b/videos/amplify-case-study/master/snapshots/frame-01-at-12.0s.png
new file mode 100644
index 000000000..30a3b2d6b
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/frame-01-at-12.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/frame-02-at-24.0s.png b/videos/amplify-case-study/master/snapshots/frame-02-at-24.0s.png
new file mode 100644
index 000000000..38873444e
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/frame-02-at-24.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/frame-03-at-35.0s.png b/videos/amplify-case-study/master/snapshots/frame-03-at-35.0s.png
new file mode 100644
index 000000000..38873444e
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/frame-03-at-35.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/frame-04-at-50.0s.png b/videos/amplify-case-study/master/snapshots/frame-04-at-50.0s.png
new file mode 100644
index 000000000..38873444e
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/frame-04-at-50.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/frame-05-at-62.0s.png b/videos/amplify-case-study/master/snapshots/frame-05-at-62.0s.png
new file mode 100644
index 000000000..38873444e
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/frame-05-at-62.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/frame-06-at-72.0s.png b/videos/amplify-case-study/master/snapshots/frame-06-at-72.0s.png
new file mode 100644
index 000000000..38873444e
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/frame-06-at-72.0s.png differ
diff --git a/videos/amplify-case-study/master/snapshots/frame-07-at-82.0s.png b/videos/amplify-case-study/master/snapshots/frame-07-at-82.0s.png
new file mode 100644
index 000000000..38873444e
Binary files /dev/null and b/videos/amplify-case-study/master/snapshots/frame-07-at-82.0s.png differ
diff --git a/videos/amplify-case-study/narration/lines/line-1.mp3 b/videos/amplify-case-study/narration/lines/line-1.mp3
new file mode 100644
index 000000000..bb869e308
Binary files /dev/null and b/videos/amplify-case-study/narration/lines/line-1.mp3 differ
diff --git a/videos/amplify-case-study/narration/lines/line-1.txt b/videos/amplify-case-study/narration/lines/line-1.txt
new file mode 100644
index 000000000..5b51729ba
--- /dev/null
+++ b/videos/amplify-case-study/narration/lines/line-1.txt
@@ -0,0 +1 @@
+Three weeks ago, every explainer video our platform made looked the same.
diff --git a/videos/amplify-case-study/narration/lines/line-2.mp3 b/videos/amplify-case-study/narration/lines/line-2.mp3
new file mode 100644
index 000000000..04867c5ec
Binary files /dev/null and b/videos/amplify-case-study/narration/lines/line-2.mp3 differ
diff --git a/videos/amplify-case-study/narration/lines/line-2.txt b/videos/amplify-case-study/narration/lines/line-2.txt
new file mode 100644
index 000000000..1310df213
--- /dev/null
+++ b/videos/amplify-case-study/narration/lines/line-2.txt
@@ -0,0 +1 @@
+The model only filled in strings. Layout, color, motion — all on us. The schema was the ceiling.
diff --git a/videos/amplify-case-study/narration/lines/line-3.mp3 b/videos/amplify-case-study/narration/lines/line-3.mp3
new file mode 100644
index 000000000..ebe9ecc63
Binary files /dev/null and b/videos/amplify-case-study/narration/lines/line-3.mp3 differ
diff --git a/videos/amplify-case-study/narration/lines/line-3.txt b/videos/amplify-case-study/narration/lines/line-3.txt
new file mode 100644
index 000000000..303075786
--- /dev/null
+++ b/videos/amplify-case-study/narration/lines/line-3.txt
@@ -0,0 +1 @@
+So we deleted it. Four hundred and fifty-five lines, gone.
diff --git a/videos/amplify-case-study/narration/lines/line-4.mp3 b/videos/amplify-case-study/narration/lines/line-4.mp3
new file mode 100644
index 000000000..2ce06355c
Binary files /dev/null and b/videos/amplify-case-study/narration/lines/line-4.mp3 differ
diff --git a/videos/amplify-case-study/narration/lines/line-4.txt b/videos/amplify-case-study/narration/lines/line-4.txt
new file mode 100644
index 000000000..9b6fad4ce
--- /dev/null
+++ b/videos/amplify-case-study/narration/lines/line-4.txt
@@ -0,0 +1 @@
+Now the worker reads the brief, calls the model, and the model writes the whole composition. We validate. We retry. We ship.
diff --git a/videos/amplify-case-study/narration/lines/line-5.mp3 b/videos/amplify-case-study/narration/lines/line-5.mp3
new file mode 100644
index 000000000..8fbf55a0c
Binary files /dev/null and b/videos/amplify-case-study/narration/lines/line-5.mp3 differ
diff --git a/videos/amplify-case-study/narration/lines/line-5.txt b/videos/amplify-case-study/narration/lines/line-5.txt
new file mode 100644
index 000000000..96f478bb3
--- /dev/null
+++ b/videos/amplify-case-study/narration/lines/line-5.txt
@@ -0,0 +1 @@
+The old template renderer is still there. Underneath. A floor we can trust. So the ceiling can be ambitious.
diff --git a/videos/amplify-case-study/narration/lines/line-6.mp3 b/videos/amplify-case-study/narration/lines/line-6.mp3
new file mode 100644
index 000000000..995c4a060
Binary files /dev/null and b/videos/amplify-case-study/narration/lines/line-6.mp3 differ
diff --git a/videos/amplify-case-study/narration/lines/line-6.txt b/videos/amplify-case-study/narration/lines/line-6.txt
new file mode 100644
index 000000000..f10e2965c
--- /dev/null
+++ b/videos/amplify-case-study/narration/lines/line-6.txt
@@ -0,0 +1 @@
+Now every video is its own thing. Same runtime. Different design.
diff --git a/videos/amplify-case-study/narration/lines/line-7.mp3 b/videos/amplify-case-study/narration/lines/line-7.mp3
new file mode 100644
index 000000000..2872f8a71
Binary files /dev/null and b/videos/amplify-case-study/narration/lines/line-7.mp3 differ
diff --git a/videos/amplify-case-study/narration/lines/line-7.txt b/videos/amplify-case-study/narration/lines/line-7.txt
new file mode 100644
index 000000000..d687451f3
--- /dev/null
+++ b/videos/amplify-case-study/narration/lines/line-7.txt
@@ -0,0 +1 @@
+The shape of the schema is the shape of the ceiling.
diff --git a/videos/amplify-case-study/narration/master-narration.mp3 b/videos/amplify-case-study/narration/master-narration.mp3
new file mode 100644
index 000000000..5b91a3b8a
Binary files /dev/null and b/videos/amplify-case-study/narration/master-narration.mp3 differ
diff --git a/videos/amplify-case-study/narration/master-script.txt b/videos/amplify-case-study/narration/master-script.txt
new file mode 100644
index 000000000..153a17c7a
--- /dev/null
+++ b/videos/amplify-case-study/narration/master-script.txt
@@ -0,0 +1,7 @@
+Three weeks ago, every explainer video our platform made looked the same.
+The model only filled in strings. Layout, color, motion — all on us. The schema was the ceiling.
+So we deleted it. Four hundred and fifty-five lines, gone.
+Now the worker reads the brief, calls the model, and the model writes the whole composition. We validate. We retry. We ship.
+The old template renderer is still there. Underneath. A floor we can trust. So the ceiling can be ambitious.
+Now every video is its own thing. Same runtime. Different design.
+The shape of the schema is the shape of the ceiling.
diff --git a/videos/amplify-case-study/shared/base.html b/videos/amplify-case-study/shared/base.html
new file mode 100644
index 000000000..62d147b34
--- /dev/null
+++ b/videos/amplify-case-study/shared/base.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>amplify-case-study beat (preview)</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="../shared/tokens.css" />
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        background: #000;
+      }
+    </style>
+  </head>
+  <body>
+    <!-- BEAT TEMPLATE GOES HERE — copy the synapse-os-explainer beat-1-question.html
+         <template> wrapper pattern, with the scene inside. -->
+
+    <script>
+      // GSAP loaded by HyperFrames runtime at preview/render time.
+      // Each beat script:
+      //   1) Builds a paused GSAP timeline
+      //   2) Registers it on window.__timelines["amplify-case-study-beat-<N>"]
+    </script>
+  </body>
+</html>
diff --git a/videos/amplify-case-study/shared/tokens.css b/videos/amplify-case-study/shared/tokens.css
new file mode 100644
index 000000000..b0754f86f
--- /dev/null
+++ b/videos/amplify-case-study/shared/tokens.css
@@ -0,0 +1,45 @@
+/* Design tokens — see DESIGN.md for rationale */
+:root {
+  /* Ink scale */
+  --ink: #08090b;
+  --ink-elevated: #12141a;
+  --ink-line: #1f232c;
+  --ink-soft: #2a2f3b;
+
+  /* Paper */
+  --paper: #f5f2ec;
+  --paper-muted: #8b8e96;
+  --paper-dim: #5a5e68;
+
+  /* Accents */
+  --signal: #22d67a;
+  --signal-soft: rgba(34, 214, 122, 0.15);
+  --warn: #f4a641;
+  --warn-soft: rgba(244, 166, 65, 0.18);
+  --code: #7dd3fc;
+  --code-soft: rgba(125, 211, 252, 0.15);
+
+  /* Type families */
+  --font-display: "Inter Tight", "Inter", system-ui, sans-serif;
+  --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
+}
+
+/* Universal beat reset */
+[data-composition-id^="amplify-case-study"] {
+  position: absolute;
+  inset: 0;
+  background: var(--ink);
+  color: var(--paper);
+  font-family: var(--font-display);
+  overflow: hidden;
+}
+
+/* Persistent bottom hairline carried across all master beats */
+.hf-hairline {
+  position: absolute;
+  bottom: 80px;
+  left: 96px;
+  height: 1px;
+  background: var(--signal);
+  transform-origin: left center;
+}
diff --git a/videos/the-bug-case-study/DESIGN.md b/videos/the-bug-case-study/DESIGN.md
new file mode 100644
index 000000000..4189e2ce0
--- /dev/null
+++ b/videos/the-bug-case-study/DESIGN.md
@@ -0,0 +1,123 @@
+# DESIGN — The Bug That Kept Cutting Our AI Videos Off
+
+Visual system spec for the Part 2 explainer video accompanying the Substack case study
+_"The Bug That Kept Cutting Our AI Videos Off Mid-Sentence."_
+
+- **Cut**: 1920×1080 @ 30fps, ~68s, full narrative arc (6 beats)
+
+## Concept
+
+Cinematic dev-incident aesthetic — deep void background with high-contrast type,
+electric green for the fix, hard red for the bug. The video should _feel_ the
+bug viscerally: a sound that should be there, then isn't. The visual language is
+audio waveforms, timeline rulers, and code attributes that disagree.
+
+The narrative pillar: a clock and a voice that don't agree. Every beat returns
+to that mismatch and resolves it.
+
+## Palette
+
+```css
+/* Void scale (backgrounds) */
+--void: #050510; /* page background */
+--void-elevated: #0d0d1a; /* cards, code panels */
+--void-line: #1a1a2e; /* hairlines, borders */
+--void-soft: #2a2a40; /* hover, active borders */
+
+/* Paper (foreground text) */
+--paper: #ffffff; /* primary text */
+--paper-muted: #9999b3; /* secondary text */
+--paper-dim: #5a5a73; /* tertiary, placeholders */
+
+/* Accents (semantic) */
+--signal: #00ff88; /* electric green: the fix, success, alignment */
+--signal-soft: rgba(0, 255, 136, 0.18);
+--signal-glow: rgba(0, 255, 136, 0.4);
+--danger: #ff3355; /* hard red: the bug, the cut */
+--danger-soft: rgba(255, 51, 85, 0.18);
+--danger-glow: rgba(255, 51, 85, 0.5);
+--code: #7dd3fc; /* code tokens, attribute values */
+--code-soft: rgba(125, 211, 252, 0.15);
+--warn: #ffb84d; /* the original target value before the fix */
+```
+
+**Rules**:
+
+- One accent dominates per beat. Never two accents in equal weight.
+- `signal` belongs to the _fix_, the _aligned_ state, the _resolved_ moment.
+- `danger` belongs to the _bug_, the _cut_, the _truncation_.
+- `code` shows up wherever real text from the codebase or HTML appears.
+- `warn` only appears as the original locked duration value before the fix.
+
+## Typography
+
+```css
+--font-display: "Inter Tight", "Inter", system-ui, sans-serif;
+--font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
+```
+
+**Sizes** (1920×1080):
+
+| Class        | Size  | Weight | Tracking | Use                          |
+| ------------ | ----- | ------ | -------- | ---------------------------- |
+| `display-xl` | 160px | 600    | -0.02em  | Lesson quote (Beat 6)        |
+| `display-l`  | 120px | 500    | -0.015em | Hook headline (Beat 1)       |
+| `display-m`  | 84px  | 500    | -0.01em  | Beat captions                |
+| `display-s`  | 56px  | 500    | -0.005em | Secondary captions           |
+| `body`       | 32px  | 400    | 0        | Annotations                  |
+| `mono-l`     | 30px  | 500    | 0        | Code, attribute values       |
+| `mono-m`     | 22px  | 400    | 0        | Inline code, file paths      |
+| `mono-s`     | 16px  | 500    | 0.06em   | UI chips, timecodes, labels  |
+
+## Motion language
+
+Default eases:
+- Entrances: `power3.out`
+- Transitions: `power2.inOut`
+- Glitch flashes: `power4.in` (sharp, decisive)
+- Number ticks: `power2.out` with snap
+
+| Motion                   | Properties                                | Duration        |
+| ------------------------ | ----------------------------------------- | --------------- |
+| Word-by-word reveal      | `y: 24 → 0, opacity 0 → 1`, stagger 0.06s | per word ~250ms |
+| Waveform pulse           | `scaleY: 0.2 → 1.0`, sine.inOut, repeat   | 80ms per bar    |
+| Waveform sudden cut      | `opacity: 1 → 0`, sharp ease              | 100ms           |
+| Glitch flash             | `x: ±4`, `opacity: 1 → 0.4 → 1`           | 200ms (3 cycles) |
+| Number tick              | `innerText`, snap to integer              | 600-1200ms      |
+| Code char reveal         | `opacity 0 → 1`, stagger 0.02s            | per char ~150ms |
+| Beat-to-beat transition  | cross-fade with hard cut moment           | 350ms           |
+
+## Visual motifs (recurring)
+
+- **Audio waveform**: A row of 60 vertical bars representing audio amplitude.
+  Bars pulse with sine wave. Width=8px, gap=4px. When the bug strikes, bars
+  freeze and turn `--danger`. When the fix lands, bars resume in `--signal`.
+- **Timeline ruler**: A horizontal axis with tick marks every 5 seconds.
+  Two parallel tracks: "video timeline" (top) and "narration audio" (bottom).
+  Misalignment = bug. Alignment = fix.
+- **data-duration attribute**: The literal HTML attribute appears multiple
+  times, with the number value highlighted and capable of mutation (from `30`
+  to `42` etc.).
+- **Three highlight box**: Beat 4 — three rounded rectangles labeled `root`,
+  `narration`, `last scene` — each pulses signal-green when rewritten.
+
+## Sound design
+
+- **Voice (required)**: ElevenLabs TTS. The same pipeline the article describes
+  — meta-acceptance test. Calm-confident American male. Manifesto-register.
+  ~60 words total.
+- **Music (none for v1)**: silence between sentences is part of the design.
+- **SFX**: none in v1. The waveform cut visual carries the audible weight.
+
+## Asset list
+
+- **Fonts**: Inter Tight (Google Fonts CDN), JetBrains Mono (Google Fonts CDN).
+- **Narration**: `narration/master-narration.mp3` (ElevenLabs).
+- **QR code**: `assets/qr-article.svg` — generated for `https://aicoe.fit/the-bug-that-kept-cutting-our-ai`. Style: white modules on transparent background, signal-green eye corners.
+
+## What this design is NOT
+
+- Not a recap of Part 1. This stands alone; the bug story has its own arc.
+- Not narration-led. The voice is sparse. Visuals carry most of the runtime.
+- Not subtle. The bug is dramatic; the fix is dramatic. Restraint of Part 1
+  is replaced with cinematic punctuation.
diff --git a/videos/the-bug-case-study/SCRIPT.md b/videos/the-bug-case-study/SCRIPT.md
new file mode 100644
index 000000000..a9c7b45e8
--- /dev/null
+++ b/videos/the-bug-case-study/SCRIPT.md
@@ -0,0 +1,48 @@
+# SCRIPT — The Bug That Kept Cutting Our AI Videos Off
+
+Narration for the Part 2 explainer video. Manifesto-register. ~60 words.
+The voice is sparse; the visuals carry most of the runtime.
+
+## Voice settings (ElevenLabs)
+
+- Style: `documentary` (calm, confident, declarative)
+- Model: `eleven_multilingual_v2`
+- Voice: env `ELEVENLABS_VOICE_ID`
+
+## Full master script (single MP3)
+
+The script is generated as a single MP3 and the audio drives a single
+`<audio>` element in the master composition.
+
+```
+Last week, we shipped a bug.
+
+Our AI-generated videos cut off mid-sentence. The visuals finished. The voice did not.
+
+The model locked the duration. Then ElevenLabs ran longer than it said it would.
+
+The fix: one pure function. After the voice came back, rewrite data-duration on three elements. Root. Narration track. Last scene.
+
+Timelines now match within zero point two seconds. Zero truncated videos in forty-eight hours.
+
+When the model owns a dimension, audit every dimension that depends on it.
+```
+
+## Beat-by-beat timing (target)
+
+| Beat | Caption                                                          | Target narration window |
+| ---- | ---------------------------------------------------------------- | ----------------------- |
+| 1    | HOOK — "Last week, we shipped a bug."                            | 0.0s → ~3.5s            |
+| 2    | SYMPTOM — "Our AI-generated videos cut off mid-sentence. The visuals finished. The voice did not." | ~4.0s → ~13.0s |
+| 3    | ROOT CAUSE — "The model locked the duration. Then ElevenLabs ran longer than it said it would." | ~14.0s → ~22.0s |
+| 4    | THE FIX — "The fix: one pure function. After the voice came back, rewrite data-duration on three elements. Root. Narration track. Last scene." | ~23.0s → ~37.0s |
+| 5    | RESULT — "Timelines now match within zero point two seconds. Zero truncated videos in forty-eight hours." | ~38.0s → ~48.0s |
+| 6    | LESSON + CTA — "When the model owns a dimension, audit every dimension that depends on it." | ~49.0s → ~57.0s, then ~10s silent hold on QR + CTA |
+
+## Meta acceptance test
+
+We're using the exact pipeline the article describes. The fix described in the
+article — `extendCompositionDuration` — is what makes _this_ video play all
+the way through. If the narration overruns the planned beat durations, the
+final master composition will be extended by the fix. The video about the bug
+is rendered by the bug-free version of the system.
diff --git a/videos/the-bug-case-study/master/assets/qr-article.svg b/videos/the-bug-case-study/master/assets/qr-article.svg
new file mode 100644
index 000000000..eb8c59f4b
--- /dev/null
+++ b/videos/the-bug-case-study/master/assets/qr-article.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="600" height="600" viewBox="0 0 35 35" shape-rendering="crispEdges"><path stroke="#ffffff" d="M1 1.5h7m2 0h2m1 0h3m1 0h4m3 0h2m1 0h7M1 2.5h1m5 0h1m2 0h2m1 0h6m2 0h1m1 0h1m3 0h1m5 0h1M1 3.5h1m1 0h3m1 0h1m1 0h1m3 0h2m1 0h1m1 0h2m1 0h3m3 0h1m1 0h3m1 0h1M1 4.5h1m1 0h3m1 0h1m1 0h1m1 0h1m3 0h3m3 0h1m1 0h1m1 0h1m1 0h1m1 0h3m1 0h1M1 5.5h1m1 0h3m1 0h1m1 0h1m1 0h3m2 0h1m1 0h2m3 0h2m2 0h1m1 0h3m1 0h1M1 6.5h1m5 0h1m1 0h2m1 0h2m1 0h3m3 0h1m1 0h1m3 0h1m5 0h1M1 7.5h7m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h7M9 8.5h2m1 0h1m3 0h1m5 0h1M1 9.5h1m1 0h5m2 0h1m3 0h1m1 0h1m1 0h1m4 0h3m1 0h5M1 10.5h1m7 0h1m1 0h1m5 0h1m1 0h4m1 0h1m2 0h2m1 0h4M1 11.5h1m1 0h1m1 0h6m1 0h2m2 0h1m2 0h1m2 0h2m2 0h1m2 0h1m1 0h2M1 12.5h1m2 0h2m3 0h2m1 0h1m2 0h2m5 0h3m4 0h4M2 13.5h1m1 0h1m1 0h3m1 0h1m2 0h1m5 0h2m2 0h4m2 0h2m1 0h1M1 14.5h1m1 0h2m4 0h1m1 0h7m3 0h7m3 0h3M7 15.5h2m2 0h2m1 0h1m3 0h3m2 0h1m2 0h2m3 0h2M9 16.5h3m1 0h1m1 0h1m1 0h1m1 0h4m1 0h1m1 0h2m2 0h2M1 17.5h3m2 0h5m3 0h1m3 0h1m1 0h1m2 0h1m1 0h2m1 0h3m2 0h1M1 18.5h3m4 0h2m2 0h1m1 0h2m1 0h2m1 0h3m1 0h1m2 0h2m1 0h2m1 0h1M2 19.5h2m1 0h4m2 0h2m3 0h1m1 0h1m7 0h1m1 0h2m1 0h2M4 20.5h1m1 0h1m6 0h1m2 0h4m1 0h2m1 0h2m2 0h6M2 21.5h2m1 0h6m5 0h2m7 0h2m2 0h2m2 0h1M1 22.5h1m3 0h1m3 0h1m1 0h2m1 0h3m2 0h1m4 0h1m2 0h1m2 0h2m1 0h1M1 23.5h1m3 0h1m1 0h1m5 0h2m1 0h2m3 0h2m2 0h1m3 0h1m1 0h2M1 24.5h1m1 0h2m1 0h1m3 0h2m1 0h1m1 0h2m5 0h3m1 0h1m1 0h1m2 0h1m1 0h1M1 25.5h1m1 0h1m1 0h3m4 0h1m1 0h5m1 0h2m1 0h7M9 26.5h3m2 0h1m2 0h1m1 0h3m1 0h1m1 0h1m3 0h1m1 0h1m1 0h1M1 27.5h7m2 0h4m1 0h3m1 0h1m1 0h5m1 0h1m1 0h1m1 0h2M1 28.5h1m5 0h1m1 0h2m2 0h1m1 0h3m2 0h6m3 0h4M1 29.5h1m1 0h3m1 0h1m1 0h4m6 0h2m2 0h1m1 0h6m1 0h2M1 30.5h1m1 0h3m1 0h1m1 0h9m2 0h3m1 0h3m2 0h2m1 0h2M1 31.5h1m1 0h3m1 0h1m1 0h1m2 0h1m5 0h1m2 0h3m3 0h2m1 0h2M1 32.5h1m5 0h1m2 0h2m5 0h1m4 0h1m4 0h1m1 0h3M1 33.5h7m1 0h7m2 0h2m4 0h3m1 0h1m3 0h1"/></svg>
diff --git a/videos/the-bug-case-study/master/index.html b/videos/the-bug-case-study/master/index.html
new file mode 100644
index 000000000..f2dce9c86
--- /dev/null
+++ b/videos/the-bug-case-study/master/index.html
@@ -0,0 +1,1192 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>The Bug That Kept Cutting Our AI Videos Off — Case Study Explainer</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap"
+      rel="stylesheet"
+    />
+    <style>
+      /* Design tokens — see DESIGN.md for rationale */
+      :root {
+        --void: #050510;
+        --void-elevated: #0d0d1a;
+        --void-line: #1a1a2e;
+        --void-soft: #2a2a40;
+        --paper: #ffffff;
+        --paper-muted: #b5b8cc;
+        --paper-dim: #8a8da8;
+        --signal: #00ff88;
+        --signal-soft: rgba(0, 255, 136, 0.18);
+        --signal-glow: rgba(0, 255, 136, 0.4);
+        --danger: #ff3355;
+        --danger-soft: rgba(255, 51, 85, 0.18);
+        --danger-glow: rgba(255, 51, 85, 0.5);
+        --code: #7dd3fc;
+        --code-soft: rgba(125, 211, 252, 0.15);
+        --warn: #ffb84d;
+        --font-display: "Inter Tight", "Inter", system-ui, sans-serif;
+        --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
+      }
+      [data-composition-id^="bug-case-study"] {
+        position: absolute;
+        inset: 0;
+        background: var(--void);
+        color: var(--paper);
+        font-family: var(--font-display);
+        overflow: hidden;
+      }
+      [data-composition-id^="bug-case-study"]::after {
+        content: "";
+        position: absolute;
+        inset: 0;
+        background: radial-gradient(ellipse at center, transparent 50%, rgba(0, 0, 0, 0.4) 100%);
+        pointer-events: none;
+        z-index: 100;
+      }
+    </style>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        background: var(--void);
+        overflow: hidden;
+      }
+
+      /* ============================================================ */
+      /* BEAT 1 — HOOK                                                */
+      /* ============================================================ */
+      .b1-root {
+        position: absolute;
+        inset: 0;
+      }
+      .b1-stage {
+        position: absolute;
+        inset: 0;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        gap: 80px;
+      }
+      .b1-waveform {
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        height: 280px;
+        width: 1200px;
+        justify-content: center;
+      }
+      .b1-bar {
+        width: 12px;
+        background: var(--paper);
+        border-radius: 6px;
+        transform-origin: center;
+        will-change: transform;
+        box-shadow: 0 0 24px var(--signal-glow);
+      }
+      .b1-headline {
+        font-family: var(--font-display);
+        font-size: 144px;
+        font-weight: 600;
+        letter-spacing: -0.02em;
+        color: var(--paper);
+        line-height: 1;
+        text-align: center;
+      }
+      .b1-headline .b1-word {
+        display: inline-block;
+      }
+      .b1-headline .b1-bug {
+        color: var(--danger);
+        text-shadow: 0 0 60px var(--danger-glow);
+      }
+      .b1-flash {
+        position: absolute;
+        inset: 0;
+        background: var(--danger);
+        opacity: 0;
+        mix-blend-mode: screen;
+      }
+      .b1-eyebrow {
+        font-family: var(--font-mono);
+        font-size: 18px;
+        font-weight: 500;
+        letter-spacing: 0.4em;
+        color: var(--paper-muted);
+        text-transform: uppercase;
+      }
+      .b1-timecode {
+        position: absolute;
+        top: 60px;
+        left: 96px;
+        font-family: var(--font-mono);
+        font-size: 16px;
+        color: var(--paper-dim);
+        letter-spacing: 0.06em;
+      }
+      .b1-timecode .b1-tc-num {
+        color: var(--paper-muted);
+      }
+
+      /* ============================================================ */
+      /* BEAT 2 — SYMPTOM (two timelines diverge)                     */
+      /* ============================================================ */
+      .b2-root {
+        position: absolute;
+        inset: 0;
+        padding: 80px 96px;
+        box-sizing: border-box;
+      }
+      .b2-label {
+        font-family: var(--font-mono);
+        font-size: 16px;
+        font-weight: 500;
+        letter-spacing: 0.06em;
+        color: var(--paper-muted);
+        text-transform: uppercase;
+      }
+      .b2-stage {
+        display: flex;
+        flex-direction: column;
+        gap: 56px;
+        padding-top: 140px;
+      }
+      .b2-track {
+        display: flex;
+        flex-direction: column;
+        gap: 14px;
+        position: relative;
+      }
+      .b2-track-label {
+        font-family: var(--font-mono);
+        font-size: 22px;
+        font-weight: 500;
+        color: var(--paper-muted);
+        letter-spacing: 0.04em;
+      }
+      .b2-track-canvas {
+        position: relative;
+        height: 120px;
+        background: var(--void-elevated);
+        border: 1px solid var(--void-line);
+        border-radius: 4px;
+      }
+      /* Top track — VIDEO: a solid bar that ends at 30s */
+      .b2-video-bar {
+        position: absolute;
+        left: 0;
+        top: 0;
+        bottom: 0;
+        width: 0%;
+        background: linear-gradient(90deg, var(--void-soft), var(--paper-muted));
+        border-right: 3px solid var(--danger);
+      }
+      /* Bottom track — NARRATION: waveform that runs to 42s */
+      .b2-wave-row {
+        position: absolute;
+        inset: 0;
+        display: flex;
+        align-items: center;
+        gap: 3px;
+        padding: 0 6px;
+        box-sizing: border-box;
+      }
+      .b2-wave-bar {
+        flex: 1;
+        background: var(--paper-muted);
+        border-radius: 2px;
+        will-change: transform;
+      }
+      .b2-wave-bar.b2-overrun {
+        background: var(--danger);
+        box-shadow: 0 0 12px var(--danger-glow);
+      }
+      .b2-cutline {
+        position: absolute;
+        top: -40px;
+        bottom: -40px;
+        width: 2px;
+        background: var(--danger);
+        opacity: 0;
+        box-shadow: 0 0 20px var(--danger-glow);
+      }
+      .b2-cutline-label {
+        position: absolute;
+        top: -76px;
+        font-family: var(--font-mono);
+        font-size: 14px;
+        font-weight: 600;
+        color: var(--danger);
+        white-space: nowrap;
+        transform: translateX(-50%);
+        letter-spacing: 0.06em;
+        text-transform: uppercase;
+        opacity: 0;
+      }
+      .b2-tick-row {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 12px;
+        font-family: var(--font-mono);
+        font-size: 14px;
+        color: var(--paper-dim);
+        letter-spacing: 0.04em;
+      }
+      .b2-tick-row span.b2-target {
+        color: var(--warn);
+        font-weight: 600;
+      }
+      .b2-tick-row span.b2-actual {
+        color: var(--danger);
+        font-weight: 600;
+      }
+      .b2-caption {
+        position: absolute;
+        bottom: 80px;
+        left: 96px;
+        font-family: var(--font-display);
+        font-size: 72px;
+        font-weight: 500;
+        letter-spacing: -0.01em;
+        color: var(--paper);
+        line-height: 1.1;
+      }
+      .b2-caption .b2-word {
+        display: inline-block;
+        margin-right: 0.25em;
+      }
+      .b2-caption .b2-not {
+        color: var(--danger);
+      }
+
+      /* ============================================================ */
+      /* BEAT 3 — ROOT CAUSE (the disagreement)                       */
+      /* ============================================================ */
+      .b3-root {
+        position: absolute;
+        inset: 0;
+        padding: 100px 120px;
+        box-sizing: border-box;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        gap: 60px;
+      }
+      .b3-row {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 80px;
+        width: 100%;
+      }
+      .b3-block {
+        background: var(--void-elevated);
+        border: 1px solid var(--void-line);
+        border-radius: 12px;
+        padding: 36px 48px;
+        flex: 0 0 auto;
+        position: relative;
+      }
+      .b3-block-label {
+        font-family: var(--font-mono);
+        font-size: 14px;
+        font-weight: 600;
+        letter-spacing: 0.16em;
+        color: var(--paper-dim);
+        text-transform: uppercase;
+        margin-bottom: 18px;
+      }
+      .b3-block-content {
+        font-family: var(--font-mono);
+        font-size: 28px;
+        font-weight: 500;
+        color: var(--paper);
+        white-space: nowrap;
+      }
+      .b3-block .b3-attr-key {
+        color: var(--code);
+      }
+      .b3-block .b3-attr-value {
+        color: var(--warn);
+        position: relative;
+        padding: 0 6px;
+      }
+      .b3-block.b3-actual {
+        border-color: var(--danger-soft);
+      }
+      .b3-block.b3-actual .b3-attr-value {
+        color: var(--danger);
+      }
+      .b3-vs {
+        font-family: var(--font-mono);
+        font-size: 56px;
+        font-weight: 700;
+        color: var(--paper-dim);
+        letter-spacing: 0.04em;
+      }
+      .b3-vs-line {
+        height: 2px;
+        background: linear-gradient(90deg, var(--warn), var(--danger));
+        width: 240px;
+        position: relative;
+        transform-origin: left center;
+      }
+      .b3-vs-line::after {
+        content: "≠";
+        position: absolute;
+        top: -40px;
+        left: 50%;
+        transform: translateX(-50%);
+        font-family: var(--font-mono);
+        font-size: 56px;
+        font-weight: 700;
+        color: var(--danger);
+        background: var(--void);
+        padding: 0 16px;
+      }
+      .b3-caption {
+        font-family: var(--font-display);
+        font-size: 64px;
+        font-weight: 500;
+        letter-spacing: -0.01em;
+        color: var(--paper);
+        text-align: center;
+      }
+      .b3-caption .b3-word {
+        display: inline-block;
+        margin-right: 0.25em;
+      }
+      .b3-caption .b3-reconcile {
+        color: var(--danger);
+      }
+
+      /* ============================================================ */
+      /* BEAT 4 — THE FIX (extendCompositionDuration)                 */
+      /* ============================================================ */
+      .b4-root {
+        position: absolute;
+        inset: 0;
+        padding: 80px 96px;
+        box-sizing: border-box;
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        column-gap: 80px;
+        align-items: center;
+      }
+      .b4-left {
+        display: flex;
+        flex-direction: column;
+        gap: 28px;
+      }
+      .b4-section-label {
+        font-family: var(--font-mono);
+        font-size: 16px;
+        font-weight: 600;
+        letter-spacing: 0.16em;
+        color: var(--paper-dim);
+        text-transform: uppercase;
+      }
+      .b4-section-label .b4-section-accent {
+        color: var(--signal);
+      }
+      .b4-code-panel {
+        background: var(--void-elevated);
+        border: 1px solid var(--void-line);
+        border-left: 3px solid var(--signal);
+        border-radius: 10px;
+        padding: 36px 40px;
+        font-family: var(--font-mono);
+        font-size: 22px;
+        line-height: 1.7;
+        color: var(--paper);
+      }
+      .b4-code-line {
+        white-space: nowrap;
+      }
+      .b4-code-token-keyword {
+        color: var(--code);
+      }
+      .b4-code-token-fn {
+        color: var(--signal);
+        font-weight: 600;
+      }
+      .b4-code-token-arg {
+        color: var(--paper-muted);
+      }
+      .b4-code-token-comment {
+        color: var(--paper-dim);
+        font-style: italic;
+      }
+      .b4-right {
+        display: flex;
+        flex-direction: column;
+        gap: 26px;
+      }
+      .b4-target {
+        background: var(--void-elevated);
+        border: 1px solid var(--void-line);
+        border-radius: 10px;
+        padding: 22px 30px;
+        display: flex;
+        align-items: center;
+        gap: 24px;
+        position: relative;
+        opacity: 0.35;
+      }
+      .b4-target.b4-fired {
+        opacity: 1;
+        border-color: var(--signal);
+        background: linear-gradient(90deg, var(--void-elevated), var(--signal-soft));
+        box-shadow: 0 0 40px var(--signal-glow);
+      }
+      .b4-target-icon {
+        width: 14px;
+        height: 14px;
+        border-radius: 50%;
+        background: var(--paper-dim);
+        flex: 0 0 14px;
+        position: relative;
+      }
+      .b4-target.b4-fired .b4-target-icon {
+        background: var(--signal);
+        box-shadow: 0 0 16px var(--signal-glow);
+      }
+      .b4-target-label {
+        font-family: var(--font-mono);
+        font-size: 22px;
+        font-weight: 500;
+        color: var(--paper-muted);
+        letter-spacing: 0.02em;
+        flex: 1;
+      }
+      .b4-target.b4-fired .b4-target-label {
+        color: var(--paper);
+      }
+      .b4-target-values {
+        display: flex;
+        align-items: center;
+        gap: 16px;
+        font-family: var(--font-mono);
+        font-size: 22px;
+        font-weight: 600;
+      }
+      .b4-target-old {
+        color: var(--warn);
+        text-decoration: line-through;
+        text-decoration-color: var(--danger);
+        opacity: 0.7;
+      }
+      .b4-target-arrow {
+        color: var(--paper-dim);
+      }
+      .b4-target-new {
+        color: var(--signal);
+        opacity: 0;
+      }
+      .b4-target.b4-fired .b4-target-new {
+        opacity: 1;
+      }
+      .b4-fn-title {
+        font-family: var(--font-display);
+        font-size: 28px;
+        font-weight: 500;
+        color: var(--paper);
+        letter-spacing: -0.01em;
+      }
+      .b4-fn-title .b4-fn-name {
+        font-family: var(--font-mono);
+        color: var(--signal);
+        font-weight: 600;
+        font-size: 24px;
+      }
+
+      /* ============================================================ */
+      /* BEAT 5 — RESULT                                              */
+      /* ============================================================ */
+      .b5-root {
+        position: absolute;
+        inset: 0;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        gap: 56px;
+        padding: 80px;
+        box-sizing: border-box;
+      }
+      .b5-eyebrow {
+        font-family: var(--font-mono);
+        font-size: 18px;
+        font-weight: 600;
+        letter-spacing: 0.32em;
+        color: var(--signal);
+        text-transform: uppercase;
+      }
+      .b5-big {
+        font-family: var(--font-display);
+        font-size: 320px;
+        font-weight: 700;
+        letter-spacing: -0.04em;
+        color: var(--signal);
+        line-height: 0.9;
+        text-shadow: 0 0 80px var(--signal-glow);
+      }
+      .b5-big-unit {
+        font-size: 120px;
+        color: var(--paper);
+        font-weight: 500;
+      }
+      .b5-subcap {
+        font-family: var(--font-display);
+        font-size: 48px;
+        font-weight: 500;
+        color: var(--paper);
+        letter-spacing: -0.005em;
+        text-align: center;
+      }
+      .b5-stats {
+        display: flex;
+        gap: 96px;
+        padding-top: 32px;
+      }
+      .b5-stat {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 8px;
+      }
+      .b5-stat-num {
+        font-family: var(--font-display);
+        font-size: 80px;
+        font-weight: 700;
+        color: var(--paper);
+        font-variant-numeric: tabular-nums;
+      }
+      .b5-stat-num.b5-zero {
+        color: var(--signal);
+      }
+      .b5-stat-label {
+        font-family: var(--font-mono);
+        font-size: 16px;
+        font-weight: 500;
+        letter-spacing: 0.1em;
+        color: var(--paper-muted);
+        text-transform: uppercase;
+        text-align: center;
+        line-height: 1.4;
+      }
+
+      /* ============================================================ */
+      /* BEAT 6 — LESSON + CTA                                        */
+      /* ============================================================ */
+      .b6-root {
+        position: absolute;
+        inset: 0;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        padding: 80px;
+        box-sizing: border-box;
+      }
+      .b6-stage {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 0;
+        position: relative;
+        width: 100%;
+        height: 100%;
+        justify-content: center;
+      }
+      .b6-quote {
+        font-family: var(--font-display);
+        font-size: 96px;
+        font-weight: 500;
+        line-height: 1.12;
+        letter-spacing: -0.02em;
+        color: var(--paper);
+        text-align: center;
+        max-width: 1500px;
+        margin: 0 auto;
+      }
+      .b6-quote .b6-word {
+        display: inline-block;
+        margin-right: 0.22em;
+      }
+      .b6-quote .b6-key {
+        color: var(--signal);
+      }
+      .b6-quote-mark {
+        font-family: var(--font-display);
+        font-size: 240px;
+        font-weight: 700;
+        color: var(--signal);
+        line-height: 0.6;
+        opacity: 0.6;
+        margin-bottom: -40px;
+        text-align: center;
+      }
+      .b6-cta {
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+        display: flex;
+        align-items: center;
+        gap: 64px;
+        opacity: 0;
+        background: var(--void-elevated);
+        border: 1px solid var(--void-line);
+        border-radius: 24px;
+        padding: 56px 72px;
+      }
+      .b6-qr {
+        width: 240px;
+        height: 240px;
+        background: var(--paper);
+        border-radius: 16px;
+        padding: 20px;
+        box-sizing: border-box;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        flex: 0 0 240px;
+      }
+      .b6-qr svg {
+        width: 100%;
+        height: 100%;
+        display: block;
+      }
+      .b6-qr svg path {
+        stroke: var(--void) !important;
+      }
+      .b6-cta-text {
+        display: flex;
+        flex-direction: column;
+        gap: 16px;
+      }
+      .b6-cta-eyebrow {
+        font-family: var(--font-mono);
+        font-size: 18px;
+        font-weight: 600;
+        letter-spacing: 0.24em;
+        color: var(--signal);
+        text-transform: uppercase;
+      }
+      .b6-cta-title {
+        font-family: var(--font-display);
+        font-size: 44px;
+        font-weight: 500;
+        color: var(--paper);
+        letter-spacing: -0.015em;
+        line-height: 1.1;
+        max-width: 540px;
+      }
+      .b6-cta-url {
+        font-family: var(--font-mono);
+        font-size: 28px;
+        color: var(--paper-muted);
+        letter-spacing: 0.02em;
+      }
+      .b6-cta-url .b6-cta-url-accent {
+        color: var(--signal);
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="stage"
+      data-composition-id="bug-case-study-master"
+      data-start="0"
+      data-duration="52"
+      data-width="1920"
+      data-height="1080"
+    >
+      <!-- BEAT 1: HOOK -->
+      <div id="beat-1-hook" class="clip b1-root" data-start="0" data-duration="6.1" data-track-index="0">
+        <div class="b1-stage">
+          <div class="b1-eyebrow">PART 02 · CASE STUDY</div>
+          <div class="b1-waveform" id="b1-waveform"></div>
+          <div class="b1-headline">
+            <span class="b1-word">We</span>
+            <span class="b1-word">shipped</span>
+            <span class="b1-word">a</span>
+            <span class="b1-word b1-bug">bug.</span>
+          </div>
+        </div>
+        <div class="b1-flash"></div>
+        <div class="b1-timecode">
+          <span class="b1-tc-num">00:00:00</span> · master cut
+        </div>
+      </div>
+
+      <!-- BEAT 2: SYMPTOM -->
+      <div id="beat-2-symptom" class="clip b2-root" data-start="6.1" data-duration="6.1" data-track-index="0">
+        <div class="b2-label">amplifier-video-worker / production · 2026-05-19</div>
+        <div class="b2-stage">
+          <!-- Top track: VIDEO timeline -->
+          <div class="b2-track">
+            <div class="b2-track-label">VIDEO ▸ data-duration=&quot;30&quot;</div>
+            <div class="b2-track-canvas" id="b2-video-canvas">
+              <div class="b2-video-bar"></div>
+              <div class="b2-cutline" style="left: 71.4%">
+                <div class="b2-cutline-label">video ends</div>
+              </div>
+            </div>
+          </div>
+          <!-- Bottom track: NARRATION audio -->
+          <div class="b2-track">
+            <div class="b2-track-label">NARRATION ▸ elevenlabs.mp3 (42s actual)</div>
+            <div class="b2-track-canvas" id="b2-narration-canvas">
+              <div class="b2-wave-row" id="b2-wave-row"></div>
+              <div class="b2-cutline" style="left: 71.4%">
+                <div class="b2-cutline-label" style="top: 100%; padding-top: 12px">truncated here</div>
+              </div>
+            </div>
+            <div class="b2-tick-row">
+              <span>0s</span>
+              <span>10s</span>
+              <span>20s</span>
+              <span class="b2-target">30s TARGET</span>
+              <span class="b2-actual">42s ACTUAL</span>
+            </div>
+          </div>
+        </div>
+        <div class="b2-caption">
+          <span class="b2-word">The</span>
+          <span class="b2-word">visuals</span>
+          <span class="b2-word">finished.</span>
+          <span class="b2-word">The</span>
+          <span class="b2-word">voice</span>
+          <span class="b2-word b2-not">did&nbsp;not.</span>
+        </div>
+      </div>
+
+      <!-- BEAT 3: ROOT CAUSE -->
+      <div id="beat-3-root-cause" class="clip b3-root" data-start="12.2" data-duration="4.8" data-track-index="0">
+        <div class="b3-row">
+          <div class="b3-block">
+            <div class="b3-block-label">LLM authors HTML</div>
+            <div class="b3-block-content">
+              <span class="b3-attr-key">data-duration</span>=<span class="b3-attr-value">"30"</span>
+            </div>
+          </div>
+          <div class="b3-vs-line"></div>
+          <div class="b3-block b3-actual">
+            <div class="b3-block-label">ElevenLabs returns</div>
+            <div class="b3-block-content">
+              <span class="b3-attr-key">narration.mp3</span> → <span class="b3-attr-value">42s</span>
+            </div>
+          </div>
+        </div>
+        <div class="b3-caption">
+          <span class="b3-word">Two</span>
+          <span class="b3-word">systems.</span>
+          <span class="b3-word">Two</span>
+          <span class="b3-word">durations.</span>
+          <span class="b3-word b3-reconcile">No reconciliation.</span>
+        </div>
+      </div>
+
+      <!-- BEAT 4: THE FIX -->
+      <div id="beat-4-the-fix" class="clip b4-root" data-start="17" data-duration="11.3" data-track-index="0">
+        <div class="b4-left">
+          <div class="b4-section-label">The <span class="b4-section-accent">fix</span> · packages/amplify-video-worker/src/composition.ts</div>
+          <div class="b4-code-panel">
+            <div class="b4-code-line"><span class="b4-code-token-keyword">export function</span> <span class="b4-code-token-fn">extendCompositionDuration</span>(</div>
+            <div class="b4-code-line">&nbsp;&nbsp;<span class="b4-code-token-arg">html</span>: string,</div>
+            <div class="b4-code-line">&nbsp;&nbsp;<span class="b4-code-token-arg">actualDurationSeconds</span>: number,</div>
+            <div class="b4-code-line">): {</div>
+            <div class="b4-code-line">&nbsp;&nbsp;html: string;</div>
+            <div class="b4-code-line">&nbsp;&nbsp;extended: boolean;</div>
+            <div class="b4-code-line">&nbsp;&nbsp;modifications: Array&lt;{ target: string; from: number; to: number }&gt;;</div>
+            <div class="b4-code-line">}</div>
+            <div class="b4-code-line" style="margin-top: 18px"><span class="b4-code-token-comment">// pure. one job. no DOM.</span></div>
+          </div>
+        </div>
+        <div class="b4-right">
+          <div class="b4-fn-title">Rewrite <span class="b4-fn-name">data-duration</span> on three elements:</div>
+          <div class="b4-target" id="b4-target-1">
+            <div class="b4-target-icon"></div>
+            <div class="b4-target-label">root composition</div>
+            <div class="b4-target-values">
+              <span class="b4-target-old">30</span>
+              <span class="b4-target-arrow">→</span>
+              <span class="b4-target-new">42</span>
+            </div>
+          </div>
+          <div class="b4-target" id="b4-target-2">
+            <div class="b4-target-icon"></div>
+            <div class="b4-target-label">narration track</div>
+            <div class="b4-target-values">
+              <span class="b4-target-old">30</span>
+              <span class="b4-target-arrow">→</span>
+              <span class="b4-target-new">42</span>
+            </div>
+          </div>
+          <div class="b4-target" id="b4-target-3">
+            <div class="b4-target-icon"></div>
+            <div class="b4-target-label">last scene clip</div>
+            <div class="b4-target-values">
+              <span class="b4-target-old">30</span>
+              <span class="b4-target-arrow">→</span>
+              <span class="b4-target-new">42</span>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- BEAT 5: RESULT -->
+      <div id="beat-5-result" class="clip b5-root" data-start="28.3" data-duration="7.2" data-track-index="0">
+        <div class="b5-eyebrow">POST-FIX · MEDIAN DEVIATION</div>
+        <div class="b5-big">≤ 0.2<span class="b5-big-unit">s</span></div>
+        <div class="b5-subcap">timelines now match narration length</div>
+        <div class="b5-stats">
+          <div class="b5-stat">
+            <div class="b5-stat-num b5-zero">0</div>
+            <div class="b5-stat-label">truncated videos<br/>in 48 hours</div>
+          </div>
+          <div class="b5-stat">
+            <div class="b5-stat-num">9</div>
+            <div class="b5-stat-label">tests covering<br/>the rewriter</div>
+          </div>
+          <div class="b5-stat">
+            <div class="b5-stat-num">1</div>
+            <div class="b5-stat-label">pure function,<br/>one call site</div>
+          </div>
+        </div>
+      </div>
+
+      <!-- BEAT 6: LESSON + CTA -->
+      <div id="beat-6-lesson-cta" class="clip b6-root" data-start="35.5" data-duration="16.5" data-track-index="0">
+        <div class="b6-stage">
+          <div class="b6-quote-mark">"</div>
+          <div class="b6-quote">
+            <span class="b6-word">When</span>
+            <span class="b6-word">the</span>
+            <span class="b6-word">model</span>
+            <span class="b6-word b6-key">owns</span>
+            <span class="b6-word">a</span>
+            <span class="b6-word">dimension,</span>
+            <br/>
+            <span class="b6-word">audit</span>
+            <span class="b6-word">every</span>
+            <span class="b6-word">dimension</span>
+            <span class="b6-word">that</span>
+            <span class="b6-word b6-key">depends</span>
+            <span class="b6-word">on</span>
+            <span class="b6-word">it.</span>
+          </div>
+          <div class="b6-cta">
+            <div class="b6-qr" id="b6-qr"></div>
+            <div class="b6-cta-text">
+              <div class="b6-cta-eyebrow">SCAN TO READ THE CASE STUDY</div>
+              <div class="b6-cta-title">The Bug That Kept Cutting Our AI Videos Off</div>
+              <div class="b6-cta-url"><span class="b6-cta-url-accent">aicoe.fit</span>/the-bug-that-kept-cutting-our-ai</div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- AUDIO NARRATION -->
+      <audio
+        id="narration-track"
+        data-start="4.5"
+        data-duration="36.08"
+        data-track-index="1"
+        data-volume="1.0"
+        src="narration/master-narration.mp3"
+      ></audio>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+      const SCOPE = '[data-composition-id="bug-case-study-master"] ';
+      const sel = (s) => SCOPE + s;
+
+      // -------- Build dynamic waveform bars for Beat 1 --------
+      (function buildB1Waveform() {
+        const root = document.getElementById("b1-waveform");
+        if (!root) return;
+        const N = 64;
+        // Deterministic pseudo-random amplitudes via mulberry32
+        let seed = 1234567;
+        function rand() {
+          seed |= 0;
+          seed = (seed + 0x6d2b79f5) | 0;
+          let t = Math.imul(seed ^ (seed >>> 15), 1 | seed);
+          t = (t + Math.imul(t ^ (t >>> 7), 61 | t)) ^ t;
+          return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
+        }
+        for (let i = 0; i < N; i++) {
+          const bar = document.createElement("div");
+          bar.className = "b1-bar";
+          // base height varies; the timeline will pulse via scaleY
+          const baseHeight = 30 + Math.floor(rand() * 220);
+          bar.style.height = baseHeight + "px";
+          bar.dataset.phase = String(i * 0.12);
+          bar.dataset.amp = String(0.4 + rand() * 0.5);
+          root.appendChild(bar);
+        }
+      })();
+
+      // -------- Build dynamic narration waveform for Beat 2 --------
+      (function buildB2Waveform() {
+        const row = document.getElementById("b2-wave-row");
+        if (!row) return;
+        // 42 bars representing 42 seconds of audio. Bars 0-29 are within target, 30-41 are overrun.
+        const N = 84; // 2 bars per second visual density
+        let seed = 91011;
+        function rand() {
+          seed |= 0;
+          seed = (seed + 0x6d2b79f5) | 0;
+          let t = Math.imul(seed ^ (seed >>> 15), 1 | seed);
+          t = (t + Math.imul(t ^ (t >>> 7), 61 | t)) ^ t;
+          return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
+        }
+        const overrunStart = Math.floor(N * (30 / 42));
+        for (let i = 0; i < N; i++) {
+          const bar = document.createElement("div");
+          bar.className = "b2-wave-bar" + (i >= overrunStart ? " b2-overrun" : "");
+          const h = 18 + Math.floor(rand() * 90);
+          bar.style.height = h + "px";
+          row.appendChild(bar);
+        }
+      })();
+
+      // -------- Inject QR SVG into Beat 6 --------
+      (function injectQR() {
+        const slot = document.getElementById("b6-qr");
+        if (!slot) return;
+        // Use fetch synchronously? No — we use XHR fallback to keep init sync-friendly.
+        // The runtime reads __timelines synchronously, so we inline the QR fetch with XHR.
+        const xhr = new XMLHttpRequest();
+        xhr.open("GET", "assets/qr-article.svg", false); // sync
+        try {
+          xhr.send();
+          if (xhr.status === 200 || xhr.status === 0) {
+            slot.innerHTML = xhr.responseText;
+          }
+        } catch (e) {
+          // fall back: tiny placeholder
+          slot.innerHTML = '<svg viewBox="0 0 1 1"><rect width="1" height="1" fill="#000"/></svg>';
+        }
+      })();
+
+      // ============================================================
+      // MASTER timeline — all beats on one timeline, absolute master_t
+      // ============================================================
+      const tl = gsap.timeline({ paused: true });
+
+      // Beat offsets (master_t in seconds)
+      const B1 = 0;       // HOOK
+      const B2 = 6.1;     // SYMPTOM
+      const B3 = 12.2;    // ROOT CAUSE
+      const B4 = 17.0;    // THE FIX
+      const B5 = 28.3;    // RESULT
+      const B6 = 35.5;    // LESSON + CTA
+
+      // ---------- BEAT 1 — HOOK ----------
+      tl.from(sel(".b1-eyebrow"), { opacity: 0, y: 8, duration: 0.5, ease: "power2.out" }, B1);
+
+      // Waveform bars pulse — each bar oscillates scaleY with phase offset
+      const b1Bars = document.querySelectorAll(sel(".b1-bar"));
+      b1Bars.forEach((bar, i) => {
+        const phase = parseFloat(bar.dataset.phase || "0");
+        const amp = parseFloat(bar.dataset.amp || "0.6");
+        tl.set(bar, { scaleY: 0.2, opacity: 0 }, B1);
+        tl.to(bar, { opacity: 1, duration: 0.4, ease: "power2.out" }, B1 + 0.3 + i * 0.012);
+        const cycle = 0.42;
+        const cycles = Math.ceil(4.3 / cycle);
+        for (let c = 0; c < cycles; c++) {
+          const startT = B1 + 0.5 + c * cycle + (phase % cycle);
+          tl.to(bar, { scaleY: amp + 0.3, duration: cycle / 2, ease: "sine.inOut" }, startT);
+          tl.to(bar, { scaleY: 0.25, duration: cycle / 2, ease: "sine.inOut" }, startT + cycle / 2);
+        }
+      });
+
+      // Headline reveals at ~4.5s into beat 1 (sync to "We shipped a bug")
+      tl.from(sel(".b1-word"), { y: 60, opacity: 0, duration: 0.5, ease: "power3.out", stagger: 0.12 }, B1 + 4.5);
+
+      // At ~5.85s, bars freeze → danger color → collapse
+      tl.to(sel(".b1-bar"), { backgroundColor: "var(--danger)", duration: 0.1, ease: "power4.in" }, B1 + 5.85);
+      tl.to(sel(".b1-bar"), { opacity: 0, scaleY: 0.05, duration: 0.2, ease: "power4.in" }, B1 + 5.95);
+
+      // Danger flash
+      tl.to(sel(".b1-flash"), { opacity: 0.25, duration: 0.08, ease: "power4.in" }, B1 + 5.9);
+      tl.to(sel(".b1-flash"), { opacity: 0, duration: 0.2, ease: "power2.out" }, B1 + 5.98);
+
+      // ---------- BEAT 2 — SYMPTOM ----------
+      tl.from(sel(".b2-label"), { opacity: 0, y: -8, duration: 0.4, ease: "power2.out" }, B2);
+      tl.from(sel(".b2-track-label"), { opacity: 0, x: -20, duration: 0.4, ease: "power2.out", stagger: 0.15 }, B2 + 0.3);
+
+      // Video bar grows to 71.4% (30 of 42)
+      tl.to(sel(".b2-video-bar"), { width: "71.4%", duration: 1.2, ease: "power2.out" }, B2 + 0.5);
+
+      // Narration waveform bars reveal left-to-right (animate FROM hidden state)
+      tl.fromTo(sel(".b2-wave-bar"),
+        { opacity: 0, scaleY: 0.1, transformOrigin: "center" },
+        { opacity: 1, scaleY: 1, duration: 0.5, ease: "power2.out", stagger: 0.012 },
+        B2 + 0.7);
+
+      // Tick row
+      tl.from(sel(".b2-tick-row"), { opacity: 0, y: 10, duration: 0.4, ease: "power2.out" }, B2 + 1.5);
+
+      // Cutlines + labels appear at ~2.5s
+      tl.to(sel(".b2-cutline"), { opacity: 1, duration: 0.3, ease: "power3.out" }, B2 + 2.5);
+      tl.to(sel(".b2-cutline-label"), { opacity: 1, duration: 0.4, ease: "power2.out" }, B2 + 2.7);
+
+      // Overrun bars pulse danger glow
+      tl.to(sel(".b2-wave-bar.b2-overrun"), {
+        boxShadow: "0 0 24px var(--danger-glow)",
+        duration: 0.6, ease: "sine.inOut", yoyo: true, repeat: 3,
+      }, B2 + 2.5);
+
+      // Caption word-by-word (slight lead before "The visuals finished")
+      tl.from(sel(".b2-caption .b2-word"), {
+        y: 30, opacity: 0, duration: 0.45, ease: "power3.out", stagger: 0.13,
+      }, B2 + 2.8);
+
+      // ---------- BEAT 3 — ROOT CAUSE ----------
+      tl.from(sel(".b3-row .b3-block:first-child"), {
+        x: -40, opacity: 0, duration: 0.5, ease: "power3.out",
+      }, B3 + 0.2);
+      tl.from(sel(".b3-vs-line"), {
+        scaleX: 0, duration: 0.5, ease: "power2.inOut", transformOrigin: "left center",
+      }, B3 + 0.7);
+      tl.from(sel(".b3-row .b3-block:last-child"), {
+        x: 40, opacity: 0, duration: 0.5, ease: "power3.out",
+      }, B3 + 1.0);
+
+      // Pulse the values
+      tl.to(sel(".b3-block:first-child .b3-attr-value"), {
+        scale: 1.15, duration: 0.2, yoyo: true, repeat: 1, ease: "power2.inOut",
+      }, B3 + 1.6);
+      tl.to(sel(".b3-block:last-child .b3-attr-value"), {
+        scale: 1.15, duration: 0.2, yoyo: true, repeat: 1, ease: "power2.inOut",
+      }, B3 + 1.8);
+
+      // Caption
+      tl.from(sel(".b3-caption .b3-word"), {
+        y: 28, opacity: 0, duration: 0.45, ease: "power3.out", stagger: 0.13,
+      }, B3 + 2.4);
+
+      // ---------- BEAT 4 — THE FIX ----------
+      tl.from(sel(".b4-section-label"), { opacity: 0, y: -8, duration: 0.4, ease: "power2.out" }, B4);
+      tl.from(sel(".b4-code-panel"), { x: -40, opacity: 0, duration: 0.6, ease: "power3.out" }, B4 + 0.2);
+      tl.from(sel(".b4-code-line"), {
+        opacity: 0, y: 8, duration: 0.3, ease: "power2.out", stagger: 0.08,
+      }, B4 + 0.5);
+      tl.from(sel(".b4-fn-title"), { opacity: 0, x: 30, duration: 0.5, ease: "power3.out" }, B4 + 1.4);
+
+      // Three target boxes enter in dimmed (unfired) state
+      tl.fromTo(sel(".b4-target"),
+        { opacity: 0, x: 40 },
+        { opacity: 0.35, x: 0, duration: 0.5, ease: "power3.out", stagger: 0.15 },
+        B4 + 1.7);
+
+      // Fire each target one-by-one in sync with "Root. Narration track. Last scene."
+      // Narration says these around master_t ~25-27 → beat_t ~8-10
+      const fireTarget = (id, beatT) => {
+        tl.to(sel("#" + id), {
+          opacity: 1,
+          duration: 0.01,
+          onComplete: () => {
+            const el = document.getElementById(id);
+            if (el) el.classList.add("b4-fired");
+          },
+        }, B4 + beatT);
+        tl.fromTo(sel("#" + id),
+          { scale: 1.0 },
+          { scale: 1.04, duration: 0.2, yoyo: true, repeat: 1, ease: "power2.inOut" },
+          B4 + beatT);
+      };
+      fireTarget("b4-target-1", 6.8);
+      fireTarget("b4-target-2", 7.8);
+      fireTarget("b4-target-3", 8.8);
+
+      // ---------- BEAT 5 — RESULT ----------
+      tl.from(sel(".b5-eyebrow"), { opacity: 0, y: -8, duration: 0.4, ease: "power2.out" }, B5);
+      tl.from(sel(".b5-big"), {
+        scale: 0.85, opacity: 0, duration: 0.7, ease: "back.out(1.6)",
+      }, B5 + 0.3);
+      tl.to(sel(".b5-big"), {
+        textShadow: "0 0 120px var(--signal-glow)",
+        duration: 1.2, ease: "sine.inOut", yoyo: true, repeat: 2,
+      }, B5 + 1.2);
+      tl.from(sel(".b5-subcap"), { opacity: 0, y: 24, duration: 0.5, ease: "power3.out" }, B5 + 1.0);
+      tl.from(sel(".b5-stat"), {
+        opacity: 0, y: 30, duration: 0.5, ease: "power3.out", stagger: 0.18,
+      }, B5 + 1.8);
+
+      // Stat numbers tick from 0
+      const tickStat = (selector, target, beatT) => {
+        const el = document.querySelector(sel(selector));
+        if (!el) return;
+        const obj = { v: 0 };
+        tl.to(obj, {
+          v: target,
+          duration: 0.8,
+          ease: "power2.out",
+          snap: { v: 1 },
+          onUpdate: () => { el.textContent = Math.round(obj.v); },
+        }, B5 + beatT);
+      };
+      tickStat(".b5-stat:nth-child(1) .b5-stat-num", 0, 1.9);
+      tickStat(".b5-stat:nth-child(2) .b5-stat-num", 9, 2.05);
+      tickStat(".b5-stat:nth-child(3) .b5-stat-num", 1, 2.2);
+
+      // ---------- BEAT 6 — LESSON + CTA ----------
+      // Beat duration: 16.5s. Narration ends at beat_t=5.08.
+      // 0.0-5.5s: quote reveals + holds
+      // 5.5-6.1s: quote exits (fade + scale out)
+      // 5.9-6.8s: CTA card slides into center (overlaps tail of exit)
+      // 6.8-15.5s: hold for scanning (~8.7s of clear time + ambient breath)
+      // 15.5-16.5s: final fade to black
+
+      tl.from(sel(".b6-quote-mark"), {
+        opacity: 0, y: 60, scale: 0.6, duration: 0.6, ease: "back.out(2)",
+      }, B6 + 0.2);
+      tl.from(sel(".b6-quote .b6-word"), {
+        y: 40, opacity: 0, duration: 0.5, ease: "power3.out", stagger: 0.16,
+      }, B6 + 0.5);
+
+      // Quote exits as narration finishes
+      tl.to(sel(".b6-quote, .b6-quote-mark"), {
+        opacity: 0, y: -40, scale: 0.94, duration: 0.6, ease: "power2.in",
+      }, B6 + 5.5);
+
+      // CTA card enters center — overlaps the tail of the quote exit for a smooth handoff
+      tl.fromTo(sel(".b6-cta"),
+        { opacity: 0, y: 40, scale: 0.94 },
+        { opacity: 1, y: 0, scale: 1.0, duration: 0.9, ease: "power3.out" },
+        B6 + 5.9);
+
+      // QR glow pulse on entry
+      tl.fromTo(sel(".b6-qr"),
+        { boxShadow: "0 0 0 0 rgba(0,255,136,0)" },
+        { boxShadow: "0 0 60px 12px rgba(0,255,136,0.4)", duration: 0.5, yoyo: true, repeat: 1, ease: "sine.inOut" },
+        B6 + 6.6);
+
+      // Ambient slow breath on CTA — fits within the hold window
+      tl.to(sel(".b6-cta"), {
+        scale: 1.015, duration: 2.2, ease: "sine.inOut", yoyo: true, repeat: 3,
+      }, B6 + 7.5);
+
+      // Final fade-to-black
+      tl.to(sel(".b6-root"), { opacity: 0, duration: 1.0, ease: "power2.in" }, B6 + 15.5);
+
+      window.__timelines["bug-case-study-master"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/videos/the-bug-case-study/master/narration/master-narration.mp3 b/videos/the-bug-case-study/master/narration/master-narration.mp3
new file mode 100644
index 000000000..4a51cd3df
Binary files /dev/null and b/videos/the-bug-case-study/master/narration/master-narration.mp3 differ
diff --git a/videos/the-bug-case-study/master/snapshots/contact-sheet.jpg b/videos/the-bug-case-study/master/snapshots/contact-sheet.jpg
new file mode 100644
index 000000000..897fab371
Binary files /dev/null and b/videos/the-bug-case-study/master/snapshots/contact-sheet.jpg differ
diff --git a/videos/the-bug-case-study/master/snapshots/frame-00-at-16.0s.png b/videos/the-bug-case-study/master/snapshots/frame-00-at-16.0s.png
new file mode 100644
index 000000000..be5ac57cb
Binary files /dev/null and b/videos/the-bug-case-study/master/snapshots/frame-00-at-16.0s.png differ
diff --git a/videos/the-bug-case-study/master/snapshots/frame-01-at-40.0s.png b/videos/the-bug-case-study/master/snapshots/frame-01-at-40.0s.png
new file mode 100644
index 000000000..f42fe84dd
Binary files /dev/null and b/videos/the-bug-case-study/master/snapshots/frame-01-at-40.0s.png differ
diff --git a/videos/the-bug-case-study/master/snapshots/frame-02-at-42.0s.png b/videos/the-bug-case-study/master/snapshots/frame-02-at-42.0s.png
new file mode 100644
index 000000000..b35fa112b
Binary files /dev/null and b/videos/the-bug-case-study/master/snapshots/frame-02-at-42.0s.png differ
diff --git a/videos/the-bug-case-study/narration/generate.mjs b/videos/the-bug-case-study/narration/generate.mjs
new file mode 100644
index 000000000..4649af76f
--- /dev/null
+++ b/videos/the-bug-case-study/narration/generate.mjs
@@ -0,0 +1,101 @@
+#!/usr/bin/env node
+// Generate ElevenLabs narration MP3 + word-level transcript JSON.
+// Usage: node generate.mjs
+//   Reads master-script.txt, writes master-narration.mp3 + master-transcript.json
+
+import { readFileSync, writeFileSync } from "node:fs";
+import { join, dirname } from "node:path";
+import { fileURLToPath } from "node:url";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const scriptPath = join(__dirname, "master-script.txt");
+const audioPath = join(__dirname, "master-narration.mp3");
+const transcriptPath = join(__dirname, "master-transcript.json");
+
+const apiKey = process.env.ELEVENLABS_API_KEY?.trim();
+const voiceId = process.env.ELEVENLABS_VOICE_ID?.trim();
+const modelId = process.env.ELEVENLABS_MODEL_ID?.trim() || "eleven_multilingual_v2";
+
+if (!apiKey) throw new Error("Missing ELEVENLABS_API_KEY");
+if (!voiceId) throw new Error("Missing ELEVENLABS_VOICE_ID");
+
+const text = readFileSync(scriptPath, "utf-8").trim();
+console.log(`Synthesizing ${text.length} chars with voice ${voiceId} (model ${modelId})...`);
+
+const response = await fetch(
+  `https://api.elevenlabs.io/v1/text-to-speech/${voiceId}/with-timestamps`,
+  {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      "xi-api-key": apiKey,
+    },
+    body: JSON.stringify({
+      text,
+      model_id: modelId,
+      seed: 42,
+    }),
+  },
+);
+
+const raw = await response.text();
+if (!response.ok) {
+  console.error(`ElevenLabs request failed (${response.status}):`, raw.slice(0, 800));
+  process.exit(1);
+}
+
+const parsed = JSON.parse(raw);
+if (!parsed.audio_base64) {
+  console.error("Response missing audio_base64");
+  process.exit(1);
+}
+
+const audio = Buffer.from(parsed.audio_base64, "base64");
+writeFileSync(audioPath, audio);
+console.log(`Wrote ${audioPath} (${audio.length} bytes)`);
+
+const alignment = parsed.alignment || parsed.normalized_alignment;
+if (!alignment) {
+  console.error("Response missing alignment");
+  process.exit(1);
+}
+
+const chars = alignment.characters || [];
+const starts = alignment.character_start_times_seconds || [];
+const ends = alignment.character_end_times_seconds || [];
+
+const words = [];
+let current = "";
+let wordStart = null;
+let wordEnd = null;
+
+for (let i = 0; i < chars.length; i++) {
+  const char = chars[i];
+  const start = starts[i] ?? wordEnd ?? 0;
+  const end = ends[i] ?? start;
+  if (/\s/.test(char)) {
+    if (current && wordStart !== null && wordEnd !== null) {
+      words.push({ text: current, start: wordStart, end: wordEnd });
+    }
+    current = "";
+    wordStart = null;
+    wordEnd = null;
+    continue;
+  }
+  current += char;
+  if (wordStart === null) wordStart = start;
+  wordEnd = end;
+}
+if (current && wordStart !== null && wordEnd !== null) {
+  words.push({ text: current, start: wordStart, end: wordEnd });
+}
+
+const totalDuration = words.length ? words[words.length - 1].end : 0;
+const transcript = {
+  voiceId,
+  modelId,
+  totalDurationSeconds: totalDuration,
+  words,
+};
+writeFileSync(transcriptPath, JSON.stringify(transcript, null, 2));
+console.log(`Wrote ${transcriptPath} (${words.length} words, ${totalDuration.toFixed(2)}s total)`);
diff --git a/videos/the-bug-case-study/narration/master-narration.mp3 b/videos/the-bug-case-study/narration/master-narration.mp3
new file mode 100644
index 000000000..4a51cd3df
Binary files /dev/null and b/videos/the-bug-case-study/narration/master-narration.mp3 differ
diff --git a/videos/the-bug-case-study/narration/master-script.txt b/videos/the-bug-case-study/narration/master-script.txt
new file mode 100644
index 000000000..97c437e63
--- /dev/null
+++ b/videos/the-bug-case-study/narration/master-script.txt
@@ -0,0 +1 @@
+Last week, we shipped a bug. Our AI-generated videos cut off mid-sentence. The visuals finished. The voice did not. The model locked the duration. Then ElevenLabs ran longer than it said it would. The fix: one pure function. After the voice came back, rewrite data-duration on three elements. Root. Narration track. Last scene. Timelines now match within zero point two seconds. Zero truncated videos in forty-eight hours. When the model owns a dimension, audit every dimension that depends on it.
diff --git a/videos/the-bug-case-study/narration/master-transcript.json b/videos/the-bug-case-study/narration/master-transcript.json
new file mode 100644
index 000000000..53f0e5b30
--- /dev/null
+++ b/videos/the-bug-case-study/narration/master-transcript.json
@@ -0,0 +1,407 @@
+{
+  "voiceId": "nPczCjzI2devNBz1zQrb",
+  "modelId": "eleven_multilingual_v2",
+  "totalDurationSeconds": 36.084,
+  "words": [
+    {
+      "text": "Last",
+      "start": 0,
+      "end": 0.337
+    },
+    {
+      "text": "week,",
+      "start": 0.383,
+      "end": 0.569
+    },
+    {
+      "text": "we",
+      "start": 0.592,
+      "end": 0.662
+    },
+    {
+      "text": "shipped",
+      "start": 0.708,
+      "end": 0.929
+    },
+    {
+      "text": "a",
+      "start": 0.952,
+      "end": 0.975
+    },
+    {
+      "text": "bug.",
+      "start": 1.022,
+      "end": 1.451
+    },
+    {
+      "text": "Our",
+      "start": 1.834,
+      "end": 2.009
+    },
+    {
+      "text": "AI-generated",
+      "start": 2.078,
+      "end": 2.926
+    },
+    {
+      "text": "videos",
+      "start": 2.972,
+      "end": 3.379
+    },
+    {
+      "text": "cut",
+      "start": 3.437,
+      "end": 3.576
+    },
+    {
+      "text": "off",
+      "start": 3.622,
+      "end": 3.738
+    },
+    {
+      "text": "mid-sentence.",
+      "start": 3.82,
+      "end": 4.69
+    },
+    {
+      "text": "The",
+      "start": 5.016,
+      "end": 5.132
+    },
+    {
+      "text": "visuals",
+      "start": 5.19,
+      "end": 5.631
+    },
+    {
+      "text": "finished.",
+      "start": 5.689,
+      "end": 6.223
+    },
+    {
+      "text": "The",
+      "start": 6.548,
+      "end": 6.664
+    },
+    {
+      "text": "voice",
+      "start": 6.722,
+      "end": 6.954
+    },
+    {
+      "text": "did",
+      "start": 6.989,
+      "end": 7.129
+    },
+    {
+      "text": "not.",
+      "start": 7.187,
+      "end": 7.57
+    },
+    {
+      "text": "The",
+      "start": 7.953,
+      "end": 8.069
+    },
+    {
+      "text": "model",
+      "start": 8.127,
+      "end": 8.359
+    },
+    {
+      "text": "locked",
+      "start": 8.44,
+      "end": 8.684
+    },
+    {
+      "text": "the",
+      "start": 8.707,
+      "end": 8.777
+    },
+    {
+      "text": "duration.",
+      "start": 8.812,
+      "end": 9.451
+    },
+    {
+      "text": "Then",
+      "start": 9.834,
+      "end": 10.019
+    },
+    {
+      "text": "ElevenLabs",
+      "start": 10.089,
+      "end": 10.774
+    },
+    {
+      "text": "ran",
+      "start": 10.832,
+      "end": 11.029
+    },
+    {
+      "text": "longer",
+      "start": 11.099,
+      "end": 11.378
+    },
+    {
+      "text": "than",
+      "start": 11.424,
+      "end": 11.54
+    },
+    {
+      "text": "it",
+      "start": 11.587,
+      "end": 11.645
+    },
+    {
+      "text": "said",
+      "start": 11.691,
+      "end": 11.854
+    },
+    {
+      "text": "it",
+      "start": 11.889,
+      "end": 11.947
+    },
+    {
+      "text": "would.",
+      "start": 11.981,
+      "end": 12.307
+    },
+    {
+      "text": "The",
+      "start": 12.69,
+      "end": 12.817
+    },
+    {
+      "text": "fix:",
+      "start": 12.91,
+      "end": 13.514
+    },
+    {
+      "text": "one",
+      "start": 13.723,
+      "end": 14.013
+    },
+    {
+      "text": "pure",
+      "start": 14.083,
+      "end": 14.373
+    },
+    {
+      "text": "function.",
+      "start": 14.431,
+      "end": 15.023
+    },
+    {
+      "text": "After",
+      "start": 15.464,
+      "end": 15.789
+    },
+    {
+      "text": "the",
+      "start": 15.836,
+      "end": 15.905
+    },
+    {
+      "text": "voice",
+      "start": 15.952,
+      "end": 16.172
+    },
+    {
+      "text": "came",
+      "start": 16.207,
+      "end": 16.393
+    },
+    {
+      "text": "back,",
+      "start": 16.428,
+      "end": 16.834
+    },
+    {
+      "text": "rewrite",
+      "start": 17.078,
+      "end": 17.542
+    },
+    {
+      "text": "data-duration",
+      "start": 17.589,
+      "end": 18.344
+    },
+    {
+      "text": "on",
+      "start": 18.425,
+      "end": 18.541
+    },
+    {
+      "text": "three",
+      "start": 18.599,
+      "end": 18.808
+    },
+    {
+      "text": "elements.",
+      "start": 18.843,
+      "end": 19.4
+    },
+    {
+      "text": "Root.",
+      "start": 20.004,
+      "end": 20.433
+    },
+    {
+      "text": "Narration",
+      "start": 20.944,
+      "end": 21.467
+    },
+    {
+      "text": "track.",
+      "start": 21.525,
+      "end": 21.977
+    },
+    {
+      "text": "Last",
+      "start": 22.674,
+      "end": 22.976
+    },
+    {
+      "text": "scene.",
+      "start": 23.034,
+      "end": 23.533
+    },
+    {
+      "text": "Timelines",
+      "start": 24.137,
+      "end": 24.775
+    },
+    {
+      "text": "now",
+      "start": 24.868,
+      "end": 25.043
+    },
+    {
+      "text": "match",
+      "start": 25.159,
+      "end": 25.426
+    },
+    {
+      "text": "within",
+      "start": 25.472,
+      "end": 25.751
+    },
+    {
+      "text": "zero",
+      "start": 25.844,
+      "end": 26.192
+    },
+    {
+      "text": "point",
+      "start": 26.273,
+      "end": 26.494
+    },
+    {
+      "text": "two",
+      "start": 26.54,
+      "end": 26.703
+    },
+    {
+      "text": "seconds.",
+      "start": 26.784,
+      "end": 27.423
+    },
+    {
+      "text": "Zero",
+      "start": 28.119,
+      "end": 28.56
+    },
+    {
+      "text": "truncated",
+      "start": 28.63,
+      "end": 29.199
+    },
+    {
+      "text": "videos",
+      "start": 29.257,
+      "end": 29.768
+    },
+    {
+      "text": "in",
+      "start": 29.814,
+      "end": 29.872
+    },
+    {
+      "text": "forty-eight",
+      "start": 29.942,
+      "end": 30.337
+    },
+    {
+      "text": "hours.",
+      "start": 30.36,
+      "end": 30.847
+    },
+    {
+      "text": "When",
+      "start": 31.289,
+      "end": 31.474
+    },
+    {
+      "text": "the",
+      "start": 31.509,
+      "end": 31.579
+    },
+    {
+      "text": "model",
+      "start": 31.649,
+      "end": 31.997
+    },
+    {
+      "text": "owns",
+      "start": 32.078,
+      "end": 32.31
+    },
+    {
+      "text": "a",
+      "start": 32.357,
+      "end": 32.38
+    },
+    {
+      "text": "dimension,",
+      "start": 32.45,
+      "end": 33.158
+    },
+    {
+      "text": "audit",
+      "start": 33.402,
+      "end": 33.831
+    },
+    {
+      "text": "every",
+      "start": 33.982,
+      "end": 34.307
+    },
+    {
+      "text": "dimension",
+      "start": 34.365,
+      "end": 34.841
+    },
+    {
+      "text": "that",
+      "start": 34.899,
+      "end": 35.027
+    },
+    {
+      "text": "depends",
+      "start": 35.074,
+      "end": 35.457
+    },
+    {
+      "text": "on",
+      "start": 35.515,
+      "end": 35.619
+    },
+    {
+      "text": "it.",
+      "start": 35.666,
+      "end": 36.084
+    }
+  ]
+}
\ No newline at end of file
diff --git a/videos/the-bug-case-study/shared/tokens.css b/videos/the-bug-case-study/shared/tokens.css
new file mode 100644
index 000000000..7a2120267
--- /dev/null
+++ b/videos/the-bug-case-study/shared/tokens.css
@@ -0,0 +1,48 @@
+/* Design tokens — see DESIGN.md for rationale */
+:root {
+  /* Void scale */
+  --void: #050510;
+  --void-elevated: #0d0d1a;
+  --void-line: #1a1a2e;
+  --void-soft: #2a2a40;
+
+  /* Paper */
+  --paper: #ffffff;
+  --paper-muted: #9999b3;
+  --paper-dim: #5a5a73;
+
+  /* Accents */
+  --signal: #00ff88;
+  --signal-soft: rgba(0, 255, 136, 0.18);
+  --signal-glow: rgba(0, 255, 136, 0.4);
+  --danger: #ff3355;
+  --danger-soft: rgba(255, 51, 85, 0.18);
+  --danger-glow: rgba(255, 51, 85, 0.5);
+  --code: #7dd3fc;
+  --code-soft: rgba(125, 211, 252, 0.15);
+  --warn: #ffb84d;
+
+  /* Type families */
+  --font-display: "Inter Tight", "Inter", system-ui, sans-serif;
+  --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
+}
+
+/* Universal beat reset */
+[data-composition-id^="bug-case-study"] {
+  position: absolute;
+  inset: 0;
+  background: var(--void);
+  color: var(--paper);
+  font-family: var(--font-display);
+  overflow: hidden;
+}
+
+/* Subtle film grain via radial vignette */
+[data-composition-id^="bug-case-study"]::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  background: radial-gradient(ellipse at center, transparent 50%, rgba(0, 0, 0, 0.4) 100%);
+  pointer-events: none;
+  z-index: 100;
+}