@litfamily/litopencode 1.0.31 → 1.0.33

package/skills/lit-typographic-motion/engine/sound.mjs

@@ -7,53 +7,16 @@
 import { spawnSync } from "node:child_process";
 import { existsSync, readFileSync, writeFileSync } from "node:fs";
 import path from "node:path";
+import { PEAK_CEILING_DBFS, RATE, TARGET_LUFS, dbfs, integratedLoudness, samplePeakDbfs, wavBytes } from "./loudness.mjs";
+import { accentsFor } from "./accents.mjs";
+import { writeScore } from "./score.mjs";
 import { mulberry32, fnv1a32 } from "./text.mjs";
 
+// The meter, the sample peak and the WAV writer live in loudness.mjs; the gate and the tests still read them here.
+export { RATE, accentsFor, integratedLoudness, samplePeakDbfs, wavBytes };
 export const SOUND_EXIT = 20;
-export const RATE = 48000;
-const TARGET_LUFS = -16;
-const PEAK_CEILING_DBFS = -2;
 const fadeSec = 0.05;
 
-// ---- ITU-R BS.1770-4: K-weighting at 48 kHz, 400 ms blocks with 75 % overlap, -70 LUFS absolute and
-// -10 LU relative gates ----
-const shelf = { b: [1.53512485958697, -2.69169618940638, 1.19839281085285], a: [1, -1.69065929318241, 0.73248077421585] };
-const highPass = { b: [1, -2, 1], a: [1, -1.99004745483398, 0.99007225036621] };
-function biquad(input, { b, a }) {
-  const out = new Float64Array(input.length);
-  let x1 = 0, x2 = 0, y1 = 0, y2 = 0;
-  for (let i = 0; i < input.length; i++) {
-    const x = input[i];
-    const y = b[0] * x + b[1] * x1 + b[2] * x2 - a[1] * y1 - a[2] * y2;
-    x2 = x1; x1 = x; y2 = y1; y1 = y;
-    out[i] = y;
-  }
-  return out;
-}
-export function integratedLoudness(channels, rate = RATE) {
-  if (rate !== RATE) throw new Error("the loudness meter's K-weighting coefficients are for 48 kHz");
-  const weighted = channels.map((channel) => biquad(biquad(channel, shelf), highPass));
-  const block = Math.round(0.4 * rate), hop = Math.round(0.1 * rate);
-  const blocks = [];
-  for (let start = 0; start + block <= weighted[0].length; start += hop) {
-    let sum = 0;
-    for (const channel of weighted) { let s = 0; for (let i = start; i < start + block; i++) s += channel[i] * channel[i]; sum += s / block; }
-    blocks.push(sum);
-  }
-  const loudness = (z) => -0.691 + 10 * Math.log10(z);
-  const absolute = blocks.filter((z) => loudness(z) > -70);
-  if (absolute.length === 0) return -Infinity;
-  const relativeGate = loudness(absolute.reduce((s, z) => s + z, 0) / absolute.length) - 10;
-  const gated = absolute.filter((z) => loudness(z) > relativeGate);
-  return loudness(gated.reduce((s, z) => s + z, 0) / gated.length);
-}
-
-const dbfs = (value) => (value > 0 ? 20 * Math.log10(value) : -Infinity);
-export function samplePeakDbfs(channels) {
-  let peak = 0;
-  for (const channel of channels) for (const v of channel) peak = Math.max(peak, Math.abs(v));
-  return dbfs(peak);
-}
 // The longest run of 50 ms windows under `floorDb` RMS inside [0, untilSec).
 export function quietestStretchSec(channels, rate, untilSec = 3, floorDb = -50) {
   const win = Math.round(0.05 * rate), end = Math.min(channels[0].length, Math.round(untilSec * rate));
@@ -89,12 +52,6 @@ const palettes = {
   air: { pad: (f, t) => 0.5 * Math.sin(2 * Math.PI * f * t) + 0.12 * Math.sin(2 * Math.PI * 1.5 * f * t), pulse: 0.25, noise: 0.08 }
 };
 
-// Accent words a beat's `sound` field may carry.
-export function accentsFor(beat) {
-  const text = String(beat.sound ?? "").toLowerCase();
-  return { hit: /\bhits?\b|\bimpact\b|\bboom\b|\bstab\b/u.test(text), rise: /\brise\b|\briser\b|\bswell\b|\bbuild\b/u.test(text), cadence: /\bcadence\b|\bresolve\b|\bfinal chord\b/u.test(text), thin: /\bthin(?:s|ned)?\b|\bsparse\b|\bpared back\b/u.test(text) };
-}
-
 // cuts[i] is the film time where beat i starts on screen (the render's own cut times).
 export function buildBed(treatment, { frameCount, fps, cuts }) {
   const sound = treatment.sound;
@@ -207,15 +164,6 @@ export function buildBed(treatment, { frameCount, fps, cuts }) {
   return { pcm, cues, stats: { samples: length, durationSec: duration, lufs: Number(integratedLoudness(decoded).toFixed(2)), peakDbfs: Number(samplePeakDbfs(decoded).toFixed(2)), palette: sound.palette, key: sound.key, tempo: sound.tempo } };
 }
 
-export function wavBytes(pcm, rate = RATE, channels = 2) {
-  const data = Buffer.from(pcm.buffer, pcm.byteOffset, pcm.byteLength);
-  const header = Buffer.alloc(44);
-  header.write("RIFF", 0); header.writeUInt32LE(36 + data.length, 4); header.write("WAVEfmt ", 8);
-  header.writeUInt32LE(16, 16); header.writeUInt16LE(1, 20); header.writeUInt16LE(channels, 22); header.writeUInt32LE(rate, 24);
-  header.writeUInt32LE(rate * channels * 2, 28); header.writeUInt16LE(channels * 2, 32); header.writeUInt16LE(16, 34); header.write("data", 36); header.writeUInt32LE(data.length, 40);
-  return Buffer.concat([header, data]);
-}
-
 // Writes <out>/sound.wav and <out>/sound-cues.json for a generated bed; returns the stats.
 export function writeBed(out, treatment, timing) {
   const bed = buildBed(treatment, timing);
@@ -230,6 +178,10 @@ export function resolveTrack(out, treatment, timing, briefAudio) {
   const mode = treatment.sound.mode;
   if (mode === "none") return { mode };
   if (mode === "generated") return { mode, ...writeBed(out, treatment, timing), label: "generated" };
+  if (mode === "score") {
+    const summary = writeScore({ treatment, frameCount: timing.frameCount, fps: timing.fps, cuts: timing.cuts, dir: out });
+    return { mode, file: summary.file, label: "score", lufs: summary.lufs, peakDbfs: summary.peakDbfs, key: summary.key, tempo: summary.tempo, palette: summary.genre };
+  }
   const named = treatment.sound.file ?? briefAudio;
   const file = named ? path.resolve(out, named) : null;
   if (!file || !existsSync(file)) throw Object.assign(new Error(`SOUND_INVALID (20): the ${mode} track ${named ?? "(none named)"} is missing`), { exitCode: SOUND_EXIT });

package/skills/lit-typographic-motion/engine/stage/capture.mjs

@@ -12,12 +12,18 @@ export const stageHost = "lit.stage";
 export const stageOrigin = `http://${stageHost}`;
 const here = path.dirname(fileURLToPath(import.meta.url));
 const kitSource = () => readFileSync(path.join(here, "stage-kit.js"), "utf8");
+const threeRoot = path.join(here, "..", "vendor", "three");
 const clockSource = () => readFileSync(path.join(here, "clock.js"), "utf8");
 
-// The Wave 1 software rung (SwiftShader, CPU raster; keychain flags included) plus the stage flags.
-export function stageChromeFlags(width, height) {
-  const software = chromeFlagRungs().find((rung) => rung.name === "swiftshader").flags;
-  return [...software,
+// The stage's Chrome flags on one rung. "swiftshader" (the default) is the software rung: CPU raster,
+// the same pixels on every machine. "gpu" asks the platform's native ANGLE backend for WebGL, so a
+// three.js film draws in real time on the graphics card; page raster stays on the CPU, which keeps the
+// text and the capture path identical to the software rung.
+export function stageChromeFlags(width, height, rung = "swiftshader", platform = process.platform) {
+  const found = chromeFlagRungs(platform).find((candidate) => candidate.name === rung);
+  if (!found) throw new Error(`unknown Chrome rung "${rung}" (gpu or swiftshader)`);
+  const base = rung === "gpu" ? [...found.flags.filter((flag) => flag !== "--enable-gpu-rasterization"), "--disable-gpu-rasterization"] : found.flags;
+  return [...base,
     "--run-all-compositor-stages-before-draw", "--disable-checker-imaging", "--disable-new-content-rendering-timeout",
     "--disable-threaded-animation", "--disable-threaded-scrolling", "--disable-image-animation-resync", "--disable-lcd-text",
     "--force-color-profile=srgb", "--hide-scrollbars", "--mute-audio", "--force-device-scale-factor=1", `--window-size=${width},${height}`,
@@ -47,7 +53,7 @@ export function stageFonts(skillRoot, state, pins) {
 }
 
 // Serve the stage origin from disk through request interception: the product's scripts and faces
-// under /lit/, every other path from inside `stageDir` only. Anything else is recorded, never fetched:
+// under /lit/ (fonts, and the pinned three.js under /lit/three/), every other path from inside `stageDir` only. Anything else is recorded, never fetched:
 // another origin in `blocked`, a path that leaves the directory or has no stage type in `refused`, a
 // file that is not there in `missing`. The stage and the cover browsers both use it.
 export async function serveStage(context, { stageDir, fonts, scripts }) {
@@ -59,12 +65,19 @@ export async function serveStage(context, { stageDir, fonts, scripts }) {
     const url = new URL(route.request().url());
     if (url.origin !== stageOrigin) { blocked.push(url.href); return route.abort("blockedbyclient"); }
     const pathname = decodeURIComponent(url.pathname);
-    if (Object.hasOwn(scripts, pathname)) return route.fulfill({ status: 200, contentType: contentTypes[".js"], body: scripts[pathname] });
+    if (Object.hasOwn(scripts, pathname)) return route.fulfill({ status: 200, contentType: contentTypes[path.extname(pathname)] ?? contentTypes[".js"], body: scripts[pathname] });
     if (pathname === "/lit/fonts.css") return route.fulfill({ status: 200, contentType: contentTypes[".css"], body: fonts.css });
     if (pathname.startsWith("/lit/fonts/")) {
       const file = fonts.files.get(pathname.slice("/lit/fonts/".length));
       return file && existsSync(file) ? route.fulfill({ status: 200, contentType: contentTypes[path.extname(file)], body: readFileSync(file) }) : route.fulfill({ status: 404, body: "" });
     }
+    if (pathname.startsWith("/lit/three/")) {
+      // The pinned three.js build and its two addons, JavaScript only; the licence and anything else is not served.
+      const sub = pathname.slice("/lit/three/".length);
+      const file = path.join(threeRoot, sub);
+      const ok = !sub.split("/").includes("..") && sub.endsWith(".js") && insideDir(threeRoot, file) && existsSync(file);
+      return ok ? route.fulfill({ status: 200, contentType: contentTypes[".js"], body: readFileSync(file) }) : route.fulfill({ status: 404, body: "" });
+    }
     const rel = pathname.replace(/^\/+/u, "") || "index.html";
     if (rel.split("/").includes("..")) { refused.push(rel); return route.fulfill({ status: 404, body: "" }); }
     const full = path.join(root, rel);
@@ -79,10 +92,11 @@ export async function serveStage(context, { stageDir, fonts, scripts }) {
 }
 
 // Launch one stage browser. `profile` is a short directory under the run's .run/, removed on close.
-export async function openStage(chromium, { chromePath, profile, stageDir, width, height, fps, seed, fonts, extraInit }) {
+// `styleFiles` maps /lit/style.css and /lit/style.js to the film's house style, written per treatment.
+export async function openStage(chromium, { chromePath, profile, stageDir, width, height, fps, seed, fonts, extraInit, styleFiles = {}, rung = "swiftshader" }) {
   rmSync(profile, { recursive: true, force: true });
   mkdirSync(profile, { recursive: true });
-  const flags = stageChromeFlags(width, height);
+  const flags = stageChromeFlags(width, height, rung);
   let context;
   try {
     context = await chromium.launchPersistentContext(profile, {
@@ -94,7 +108,7 @@ export async function openStage(chromium, { chromePath, profile, stageDir, width
     const line = String(error?.message ?? error).split("\n").find((part) => part.trim()) ?? String(error);
     throw Object.assign(new Error(`BLOCKED_NO_CHROME (10): Chrome failed to launch headless: ${line}; fix: check that Chrome can start headless in this sandbox`), { exitCode: 10 });
   }
-  const { blocked, refused, missing } = await serveStage(context, { stageDir, fonts, scripts: { "/lit/stage-kit.js": kitSource() } });
+  const { blocked, refused, missing } = await serveStage(context, { stageDir, fonts, scripts: { "/lit/stage-kit.js": kitSource(), ...styleFiles } });
   await context.addInitScript({ content: `window.__litStageConfig = ${JSON.stringify({ seed: seed >>> 0, fps })};\n${clockSource()}` });
   if (extraInit) await context.addInitScript({ content: extraInit });
   const page = context.pages()[0] ?? await context.newPage();

package/skills/lit-typographic-motion/engine/stage/clock.js

@@ -65,12 +65,18 @@
   new MutationObserver((list) => { for (const m of list) for (const node of m.addedNodes) inspect(node); }).observe(document, { childList: true, subtree: true });
 
   // ---- canvas: WebGL keeps its drawing buffer for capture; 2D text calls are listed for the QA ----
-  const webgl = { requested: false, failed: false };
+  const webgl = { requested: false, failed: false, renderer: null };
   const nativeGetContext = HTMLCanvasElement.prototype.getContext;
   HTMLCanvasElement.prototype.getContext = function (type, attributes, ...rest) {
     const isGl = /webgl/iu.test(String(type));
     const ctx = nativeGetContext.call(this, type, isGl ? { ...(attributes ?? {}), preserveDrawingBuffer: true } : attributes, ...rest);
-    if (isGl) { webgl.requested = true; if (!ctx) webgl.failed = true; }
+    if (isGl) {
+      webgl.requested = true;
+      if (!ctx) webgl.failed = true;
+      else if (!webgl.renderer) {
+        try { const info = ctx.getExtension("WEBGL_debug_renderer_info"); webgl.renderer = info ? String(ctx.getParameter(info.UNMASKED_RENDERER_WEBGL)) : String(ctx.getParameter(ctx.RENDERER)); } catch { webgl.renderer = null; }
+      }
+    }
     return ctx;
   };
   const canvasTexts = new Set();

package/skills/lit-typographic-motion/engine/stage/cover-init.js

@@ -23,7 +23,18 @@
   CoverDate.UTC = RealDate.UTC;
   Object.defineProperty(window, "Date", { value: CoverDate, writable: true, configurable: true });
   Object.defineProperty(Performance.prototype, "now", { value: refuse("performance.now", fromT), writable: true, configurable: true });
-  Math.random = refuse("Math.random", "use LitLoop.rng(seed) for layout and t for motion");
+  // Building a scene before window.ready may draw ids from Math.random (three.js names every object it
+  // makes): that phase gets a fixed-seed sequence, the same in every browser. Once the page is ready,
+  // frames are drawn in any order, so a call then is misuse.
+  const refusedRandom = refuse("Math.random", "use LitLoop.rng(seed) for layout and t for motion");
+  let seed = 0x9e3779b9;
+  Math.random = function random() {
+    if (window.ready === true) return refusedRandom();
+    seed = (seed + 0x6d2b79f5) | 0;
+    let x = Math.imul(seed ^ (seed >>> 15), 1 | seed);
+    x = (x + Math.imul(x ^ (x >>> 7), 61 | x)) ^ x;
+    return ((x ^ (x >>> 14)) >>> 0) / 4294967296;
+  };
   window.requestAnimationFrame = refuse("requestAnimationFrame", "the renderer calls renderFrame(t); a cover page runs no loop of its own");
   window.setInterval = refuse("setInterval", "the renderer calls renderFrame(t); a cover page runs no loop of its own");
   if (window.crypto) Object.defineProperty(window.crypto, "getRandomValues", { value: refuse("crypto.getRandomValues", "use LitLoop.rng(seed)"), configurable: true });

package/skills/lit-typographic-motion/engine/stage/frame-worker.mjs

@@ -4,6 +4,7 @@
 import { createHash } from "node:crypto";
 import { parentPort } from "node:worker_threads";
 import { auditCells, flashGeometryFor, linearLut } from "../flash.mjs";
+import { busyShare } from "../fill.mjs";
 import { areaResize, decodePng, encodePng } from "../png.mjs";
 
 function toRgba(image) {
@@ -16,14 +17,20 @@ function toRgba(image) {
   return out;
 }
 
-// p99.5 of linear luminance, the near-black statistic MO-D-03 reads.
-function p995(rgba) {
+// The 0.5 % and 99.5 % points of linear luminance. MO-D-03 reads the upper one (near-black), and
+// FLAT-FRAME reads the spread between them: a frame of one flat colour, light or dark, has almost none.
+function spread(rgba) {
   const bins = new Uint32Array(1024);
   for (let i = 0; i < rgba.length; i += 4) bins[Math.min(1023, Math.floor((0.2126 * linearLut[rgba[i]] + 0.7152 * linearLut[rgba[i + 1]] + 0.0722 * linearLut[rgba[i + 2]]) * 1024))]++;
-  const target = (rgba.length / 4) * 0.995;
-  let acc = 0;
-  for (let b = 0; b < 1024; b++) { acc += bins[b]; if (acc >= target) return (b + 1) / 1024; }
-  return 1;
+  const total = rgba.length / 4;
+  const high = total * 0.995, low = total * 0.005;
+  let acc = 0, p005 = null, p995 = 1;
+  for (let b = 0; b < 1024; b++) {
+    acc += bins[b];
+    if (p005 === null && acc >= low) p005 = b / 1024;
+    if (acc >= high) { p995 = (b + 1) / 1024; break; }
+  }
+  return { p005: p005 ?? 0, p995 };
 }
 
 parentPort.on("message", ({ id, png, width, height, preview }) => {
@@ -36,7 +43,8 @@ parentPort.on("message", ({ id, png, width, height, preview }) => {
     const rgba = toRgba(image);
     const cells = auditCells(rgba, width, height, flashGeometryFor(width, height));
     const hash = createHash("sha256").update(rgba).digest("hex");
-    const out = { id, hash, p995L: Number(p995(rgba).toFixed(5)), cells };
+    const { p005, p995 } = spread(rgba);
+    const out = { id, hash, p995L: Number(p995.toFixed(5)), p005L: Number(p005.toFixed(5)), busy: Number(busyShare(rgba, width, height).toFixed(4)), cells };
     if (preview) out.previewPng = encodePng(preview.width, preview.height, areaResize(rgba, width, height, preview.width, preview.height, 4), 4, 1);
     const copy = rgba.byteOffset === 0 && rgba.byteLength === rgba.buffer.byteLength ? new Uint8Array(rgba.buffer) : Uint8Array.from(rgba);
     out.rgba = copy;

package/skills/lit-typographic-motion/engine/stage/gate.mjs

@@ -11,6 +11,47 @@ import { soundChecks } from "../sound.mjs";
 
 const pass = (detail = "") => ({ pass: true, detail });
 const fail = (detail) => ({ pass: false, detail });
+const notMeasured = (detail) => ({ pass: true, na: true, detail });
+
+// The empty-frame rules. A frame of one flat colour (0.5-99.5 % luminance spread under 0.02) may hold
+// for a second (a second more at the open or the close); a frame where fewer than 2.5 % of its 48 px
+// cells carry anything may hold for 0.5 s, with 0.4 s more to build at the open and 0.6 s more to
+// fade at the close. Measured on earlier films, a known dead frame sat at 1.1 % and drawn shots at 5 %
+// and up.
+export const stageGate = Object.freeze({ flatSpread: 0.02, flatHoldSec: 1, flatEdgeSec: 1, deadBusy: 0.025, deadHoldSec: 0.5, deadOpenSec: 0.4, deadCloseSec: 0.6 });
+
+// The longest run of frames where `hit` holds that exceeds its allowance, or null.
+function longestRun(count, hit, limit, allowance) {
+  let worst = null;
+  let start = -1;
+  for (let f = 0; f <= count; f++) {
+    if (f < count && hit(f)) {
+      if (start < 0) start = f;
+      continue;
+    }
+    if (start >= 0) {
+      const length = f - start;
+      if (length > limit + allowance(start === 0, f === count) && (!worst || length > worst.length)) worst = { length, from: start };
+      start = -1;
+    }
+  }
+  return worst;
+}
+
+function flatFrames(frameLines, fps) {
+  if (!frameLines.length || frameLines.some((line) => typeof line.p005L !== "number")) return notMeasured("per-frame luminance spread not recorded");
+  const flat = frameLines.map((line) => line.p995L - line.p005L < stageGate.flatSpread);
+  const edge = stageGate.flatEdgeSec * fps;
+  const worst = longestRun(flat.length, (f) => flat[f], stageGate.flatHoldSec * fps, (open, close) => (open || close ? edge : 0));
+  return worst ? fail(`${(worst.length / fps).toFixed(2)} s of empty frames from ${(worst.from / fps).toFixed(2)} s (nothing but one flat colour; limit ${stageGate.flatHoldSec} s)`) : pass(`no run of empty frames longer than ${stageGate.flatHoldSec} s`);
+}
+
+function deadAir(frameLines, fps) {
+  if (!frameLines.length || frameLines.some((line) => typeof line.busy !== "number")) return notMeasured("per-frame busy share not recorded");
+  const dead = frameLines.map((line) => line.busy < stageGate.deadBusy);
+  const worst = longestRun(dead.length, (f) => dead[f], stageGate.deadHoldSec * fps, (open, close) => (open ? stageGate.deadOpenSec * fps : 0) + (close ? stageGate.deadCloseSec * fps : 0));
+  return worst ? fail(`${(worst.length / fps).toFixed(2)} s of near-empty frames from ${(worst.from / fps).toFixed(2)} s (under ${stageGate.deadBusy * 100} % of the frame carries anything; limit ${stageGate.deadHoldSec} s)`) : pass(`no near-empty run longer than ${stageGate.deadHoldSec} s`);
+}
 
 function probe(file) {
   const result = spawnSync("ffprobe", ["-v", "error", "-show_entries", "stream=codec_type,codec_name,width,height,r_frame_rate,pix_fmt,color_range,color_space,color_transfer,color_primaries,duration,sample_rate,channels:format=duration", "-of", "json", file], { encoding: "utf8" });
@@ -41,7 +82,7 @@ export function checkStageRun(root) {
     : !previewLines.length ? fail(`preview frames were not audited; ${flashDetail}`)
     : general <= limits.flashLimitGeneral && red <= limits.flashLimitRed ? pass(flashDetail) : fail(flashDetail);
 
-  if (manifest.webgl?.requested) checks["MO-C-02"] = manifest.webgl.failed ? fail("the page asked for WebGL and got none") : pass("WebGL on the stage's software rung (SwiftShader), labelled software");
+  if (manifest.webgl?.requested) checks["MO-C-02"] = manifest.webgl.failed ? fail("the page asked for WebGL and got none") : pass(manifest.rung === "gpu" ? `WebGL on the GPU rung (${manifest.renderer ?? "native ANGLE"})` : `WebGL on the stage's software rung (SwiftShader), labelled software${manifest.warnings?.length ? "; the 3D route fell back here, see the notice" : ""}`);
 
   const det = readJson(path.join(root, ".run", "determinism.json"));
   const mismatch = det?.frames?.find((entry) => entry.master !== entry.replay);
@@ -82,6 +123,8 @@ export function checkStageRun(root) {
     if (run > allowance + edge) { emptyError = `${run} near-black frames ending at frame ${line.frame}`; break; }
   }
   checks["MO-D-03"] = emptyError ? fail(emptyError) : pass(`no near-black run past ${allowance} frames`);
+  checks["FLAT-FRAME"] = flatFrames(frameLines, fps);
+  checks["DEAD-AIR"] = deadAir(frameLines, fps);
 
   if (manifest.sound?.mode) Object.assign(checks, soundChecks(film, manifest.durationSec, manifest.sound.mode));
   const qa = readJson(path.join(root, ".run", "qa.json"));
@@ -94,7 +137,7 @@ export function checkStageRun(root) {
   return { manifest, checks, warnings, failed, passed: failed.length === 0, sizes, flash: { master, preview } };
 }
 
-const order = ["MO-C-03", "MO-C-02", "MO-C-09", "MO-C-10", "MO-C-11", "MO-C-12", "MO-C-13", "MO-C-14", "MO-D-03"];
+const order = ["MO-C-03", "MO-C-02", "MO-C-09", "MO-C-10", "MO-C-11", "MO-C-12", "MO-C-13", "MO-C-14", "MO-D-03", "FLAT-FRAME", "DEAD-AIR"];
 export function formatStageReport(result, context) {
   const { manifest, checks } = result;
   const out = (name) => path.join(context.exportDir, name);
@@ -102,7 +145,8 @@ export function formatStageReport(result, context) {
     "lit-typographic-motion — render report (stage)",
     `outputs: ${out("film.mp4")} · ${out(manifest.previewEncoder === "gif" ? "preview.gif" : "preview.webp")} (encoder: ${manifest.previewEncoder}) · ${out("poster.png")} · ${out("reduced-motion.png")}`,
     `format / fps / length: ${manifest.format} ${manifest.resolution.join("x")} @ ${manifest.fps} fps, ${manifest.durationSec.toFixed(2)} s (treatment ${manifest.targetDurationSec} s)`,
-    `renderer: stage software rung (flags: ${(manifest.chromeFlags ?? []).join(" ")})`,
+    `renderer: stage ${manifest.rung === "gpu" ? `GPU rung (${manifest.renderer ?? "native ANGLE"})` : "software rung"} (flags: ${(manifest.chromeFlags ?? []).join(" ")})`,
+    ...(manifest.warnings ?? []).map((note) => `notice: ${note}`),
     `timing: master ${manifest.timing?.masterSec ?? "?"} s, per frame p50 ${manifest.timing?.frameP50 ?? "?"} ms / p95 ${manifest.timing?.frameP95 ?? "?"} ms, total ${manifest.timing?.totalSec ?? "?"} s`,
     "",
     `QA gate: ${result.passed ? "PASS" : "FAIL"}`
@@ -110,7 +154,7 @@ export function formatStageReport(result, context) {
   const ids = [...order.filter((id) => checks[id]), ...Object.keys(checks).filter((id) => !order.includes(id))];
   for (const id of ids) {
     const check = checks[id];
-    lines.push(`  ${id} ${check.pass ? "PASS" : check.warn ? "WARN" : "FAIL"}${check.detail ? `  (${check.detail})` : ""}`);
+    lines.push(`  ${id} ${check.na ? "N/A" : check.pass ? "PASS" : check.warn ? "WARN" : "FAIL"}${check.detail ? `  (${check.detail})` : ""}`);
   }
   lines.push("", `craft rounds run: ${manifest.craftRound} / 3 max`, `frames actually viewed this run: ${context.viewed} (confirmed looked, not just rendered)`);
   if (result.warnings.length) lines.push(`warnings: ${result.warnings.join("; ")}`);

package/skills/lit-typographic-motion/engine/stage/qa-page.js

@@ -37,6 +37,8 @@
     }
     return out.map(([x0, y0, x1, y1]) => [Math.max(0, x0), Math.max(0, y0), Math.min(innerWidth, x1), Math.min(innerHeight, y1)]).filter(([x0, y0, x1, y1]) => x1 > x0 && y1 > y0);
   }
+  const firstFamily = (style) => String(style.fontFamily).split(",")[0].trim().replace(/^["']|["']$/gu, "");
+
   function runRoot(textNode) {
     const parent = textNode.parentElement;
     const marked = parent.closest("[data-lit-text]");
@@ -60,7 +62,7 @@
     for (const [root, nodes] of groups) {
       const range = document.createRange();
       const rects = [], elements = new Set();
-      let opacity = 1, fontSize = 0, weight = 400, scale = 1, gradient = false;
+      let opacity = 1, fontSize = 0, weight = 400, scale = 1, gradient = false, color = "", family = "";
       for (const node of nodes) {
         range.selectNodeContents(node);
         rects.push(...clipRects(node.parentElement, [...range.getClientRects()]));
@@ -69,11 +71,11 @@
         opacity = Math.min(opacity, opacityChain(el));
         const style = getComputedStyle(el);
         const size = parseFloat(style.fontSize), s = scaleOf(el);
-        if (size * s > fontSize * scale) { fontSize = size; scale = s; weight = Number(style.fontWeight) || 400; }
+        if (size * s > fontSize * scale) { fontSize = size; scale = s; weight = Number(style.fontWeight) || 400; color = style.color; family = firstFamily(style); }
         if (/text/u.test(style.webkitBackgroundClip || style.backgroundClip) || /url\(|gradient/u.test(style.fill)) gradient = true;
       }
       const text = nodes.map((node) => node.nodeValue).join("").replace(/\s+/gu, " ").trim();
-      runs.push({ text, norm: normalize(text), rects, opacity, fontSize, scale, weight, gradient, decor: root.closest("[data-lit-decor]") !== null, kind: root instanceof SVGElement ? "svg" : "dom", elements: [...elements] });
+      runs.push({ text, norm: normalize(text), rects, opacity, fontSize, scale, weight, gradient, color, family, decor: root.closest("[data-lit-decor]") !== null, kind: root instanceof SVGElement ? "svg" : "dom", elements: [...elements] });
     }
     for (const el of document.querySelectorAll("body *")) {
       for (const pseudo of ["::before", "::after"]) {
@@ -82,7 +84,7 @@
         const text = content.slice(1, -1).trim();
         if (!text) continue;
         const style = getComputedStyle(el, pseudo);
-        runs.push({ text, norm: normalize(text), rects: clipRects(el, [el.getBoundingClientRect()]), opacity: opacityChain(el), fontSize: parseFloat(style.fontSize), scale: scaleOf(el), weight: Number(style.fontWeight) || 400, gradient: false, decor: el.closest("[data-lit-decor]") !== null, kind: "pseudo", elements: [el] });
+        runs.push({ text, norm: normalize(text), rects: clipRects(el, [el.getBoundingClientRect()]), opacity: opacityChain(el), fontSize: parseFloat(style.fontSize), scale: scaleOf(el), weight: Number(style.fontWeight) || 400, gradient: false, color: style.color, family: firstFamily(style), decor: el.closest("[data-lit-decor]") !== null, kind: "pseudo", elements: [el] });
       }
     }
     for (const entry of window.__litStage.registered()) {
@@ -147,7 +149,16 @@
       probeFaces(families) {
         const box = document.createElement("div");
         box.style.cssText = "position:absolute;left:0;top:0;opacity:0;pointer-events:none";
-        families.forEach((family, i) => { const el = document.createElement("span"); el.dataset.litQaProbe = String(i); el.style.fontFamily = `"${family}"`; el.textContent = "Aa가"; box.appendChild(el); });
+        // Each family at every weight and width the page can ask for: a static instance reports the file's own
+        // family name (Archivo at 900 is "Archivo Black"), so one default-weight probe would call it foreign.
+        let i = 0;
+        for (const family of families) for (const weight of [400, 700, 900]) for (const stretch of [75, 100, 125]) {
+          const el = document.createElement("span");
+          el.dataset.litQaProbe = String(i++);
+          el.style.cssText = `font-family:"${family}";font-weight:${weight};font-stretch:${stretch}%`;
+          el.textContent = "Aa가";
+          box.appendChild(el);
+        }
         document.body.appendChild(box);
         return () => box.remove();
       },