fix: add media rendering guardrails to prevent silent failures (#112)

## Summary

- **Lint rules** catch media elements missing `id` (renderer silently skips them), missing `src`, `preload="none"` (blocks renderer), and video nested in timed divs (freezes playback). Upgraded `video_nested_in_timed_element` from warning to error.
- **Compiler** strips `preload="none"` from media during compilation. Runs parallel, cached keyframe interval analysis via ffprobe — warns on sparse keyframes (>2s) that cause seek failures and audio/video desync. Suggested ffmpeg command preserves audio (`-c:a copy`).
- **Pre-render lint** lints `index.html` + all `compositions/*.html` sub-compositions before render via shared `lintProject()` helper. Warns by default; `--strict` blocks on errors, `--strict-all` blocks on errors + warnings.
- **Render orchestrator** logs a hint to retry with `--workers 1` when parallel capture times out on video-heavy compositions.
- **Refactor**: extracted `runFfprobe()` + `parseProbeJson()` helpers to deduplicate ~80 lines of spawn boilerplate across 3 ffprobe functions. Extracted `shouldBlockRender()` so strict flag tests exercise production code. Shared `lintProject()` used by both `lint` and `render` commands.

## Context

Discovered during a real composition build session where:
1. `<audio>` without `id` rendered silently (preview worked fine because runtime queries `[data-start]`, but renderer queries `[id][src]`)
2. `<video>` inside timed `<div>` froze on first frame
3. `preload="none"` caused 45s renderer timeout
4. YouTube clips with sparse keyframes from `yt-dlp --download-sections` caused audio/video desync
5. Parallel workers timed out on video-heavy compositions

## Test plan

- [x] Core: 365/365 tests passing (5 new lint tests)
- [x] Engine: 24/24 tests passing
- [x] CLI: 14/14 tests passing (7 lintProject + 7 shouldBlockRender)
- [x] Lint + format hooks pass
- [ ] Manual: create a composition with `<audio data-start="0" src="test.wav">` (no id) — verify `npx hyperframes lint` catches it
- [ ] Manual: run `npx hyperframes render --strict` with lint errors — verify it blocks
- [ ] Manual: run `npx hyperframes render --strict-all` with lint warnings — verify it blocks

packages/cli/src/commands/lint.ts

@@ -1,11 +1,8 @@
 import { defineCommand } from "citty";
-import { readFileSync } from "node:fs";
-import { join } from "node:path";
-import { lintHyperframeHtml } from "@hyperframes/core/lint";
-import type { HyperframeLintFinding } from "@hyperframes/core/lint";
-import { walkDir } from "@hyperframes/core/studio-api";
 import { c } from "../ui/colors.js";
 import { resolveProject } from "../utils/project.js";
+import { lintProject } from "../utils/lintProject.js";
+import { formatLintFindings } from "../utils/lintFormat.js";
 import { withMeta } from "../utils/updateCheck.js";
 
 export default defineCommand({
@@ -16,62 +13,32 @@ export default defineCommand({
   },
   async run({ args }) {
     const project = resolveProject(args.dir);
-    const htmlFiles = walkDir(project.dir).filter((f) => f.endsWith(".html"));
-
-    const allFindings: (HyperframeLintFinding & { file: string })[] = [];
-    let totalErrors = 0;
-    let totalWarnings = 0;
-
-    for (const file of htmlFiles) {
-      const html = readFileSync(join(project.dir, file), "utf-8");
-      const result = lintHyperframeHtml(html, { filePath: file });
-      for (const f of result.findings) {
-        allFindings.push({ ...f, file });
-      }
-      totalErrors += result.errorCount;
-      totalWarnings += result.warningCount;
-    }
+    const lintResult = lintProject(project);
 
     if (args.json) {
-      console.log(
-        JSON.stringify(
-          withMeta({
-            ok: totalErrors === 0,
-            findings: allFindings,
-            errorCount: totalErrors,
-            warningCount: totalWarnings,
-            filesScanned: htmlFiles.length,
-          }),
-          null,
-          2,
-        ),
-      );
-      process.exit(totalErrors > 0 ? 1 : 0);
+      const combined = {
+        ok: lintResult.totalErrors === 0,
+        errorCount: lintResult.totalErrors,
+        warningCount: lintResult.totalWarnings,
+        findings: lintResult.results.flatMap((r) => r.result.findings),
+      };
+      console.log(JSON.stringify(withMeta(combined), null, 2));
+      process.exit(combined.ok ? 0 : 1);
     }
 
-    console.log(
-      `${c.accent("◆")}  Linting ${c.accent(project.name)} (${htmlFiles.length} HTML files)`,
-    );
+    const fileCount = lintResult.results.length;
+    const fileLabel = fileCount === 1 ? lintResult.results[0]!.file : `${fileCount} files`;
+    console.log(`${c.accent("◆")}  Linting ${c.accent(project.name + "/" + fileLabel)}`);
     console.log();
 
-    if (allFindings.length === 0) {
+    if (lintResult.totalErrors === 0 && lintResult.totalWarnings === 0) {
       console.log(`${c.success("◇")}  ${c.success("0 errors, 0 warnings")}`);
       return;
     }
 
-    for (const finding of allFindings) {
-      const prefix = finding.severity === "error" ? c.error("✗") : c.warn("⚠");
-      const loc = finding.elementId ? ` ${c.accent(`[${finding.elementId}]`)}` : "";
-      console.log(
-        `${prefix}  ${c.bold(finding.code)}${loc}: ${finding.message} ${c.dim(finding.file)}`,
-      );
-      if (finding.fixHint) {
-        console.log(`   ${c.dim(`Fix: ${finding.fixHint}`)}`);
-      }
-    }
+    const lines = formatLintFindings(lintResult, { showElementId: true, showSummary: true });
+    for (const line of lines) console.log(line);
 
-    const summaryIcon = totalErrors > 0 ? c.error("◇") : c.success("◇");
-    console.log(`\n${summaryIcon}  ${totalErrors} error(s), ${totalWarnings} warning(s)`);
-    process.exit(totalErrors > 0 ? 1 : 0);
+    process.exit(lintResult.totalErrors > 0 ? 1 : 0);
   },
 });