fix(ci): scope LOC check to studio, split useTimelinePlayer + hyperframes-player under 500 LOC (#750)

* refactor: split useTimelinePlayer.ts and hyperframes-player.ts into focused modules (<500 LOC each)

* fix(ci): scope 500 LOC check to packages/studio, add allowlist for grandfathered files

* feat(cli): Linux ARM64 support — auto-install Chromium on DGX Spark / GB10 / Jetson

Chrome Headless Shell has no Linux ARM64 binary. On arm64 Linux:
- Detects the platform automatically
- Tries to auto-install system Chromium via apt-get (works on Ubuntu/Debian ARM)
- Falls back to clear manual instructions with exact commands
- 'hyperframes browser ensure' guides through the setup interactively
- After setup, all render commands work without any flags

* fix(ci): disable Windows Defender real-time monitoring to prevent EPERM builds

Path exclusions are insufficient — Defender re-scans new files created
during bun install before the exclusion takes effect. Disable real-time
monitoring for the entire job duration instead (standard CI practice).

* refactor(studio): split all files >500 LOC + extract useToast, delete allowlist

All 11 large files split into focused modules under 500 LOC.
App.tsx extracted toast logic into useToast hook (493 LOC now).
.filesize-allowlist deleted — no longer needed.

* fix: remove unused imports from split files, extract useToast from App.tsx

App.tsx: 504 → 493 lines (toast logic extracted to useToast hook)
timelineDOM.ts: remove unused imports from re-export pattern
MotionPanel.tsx: remove unused clampStudioCustomEasePoints import
studioMotionOps.ts: remove unused StudioGsapMotionDirection import

* fix(ci): use Set-MpPreference to fully disable Windows Defender (both jobs)

* fix(producer): use node --experimental-strip-types instead of tsx for build:fonts

Eliminates the tsx binary dependency that Windows Defender locks during
bun install, causing EPERM errors. Node 22.6+ strips TypeScript types
natively with no external binary.

* chore: remove .filesize-allowlist — App.tsx is now 493 lines (<500)

* fix(ci): disable Windows Defender before checkout to prevent all EPERM races

* fix(producer): skip build:fonts if fontData.generated.ts already exists

The generated file is tracked in git, so CI doesn't need to regenerate
it. This avoids @fontsource/inter node_modules access on Windows which
triggers EPERM from Defender scanning during bun install.

packages/player/src/iframe-dom.ts

@@ -0,0 +1,73 @@
+/**
+ * DOM setup helpers for the player's shadow root.
+ *
+ * Keeps constructor boilerplate out of the web component class body.
+ */
+
+// Cached Constructable Stylesheet shared across all player instances.
+let _sharedSheet: CSSStyleSheet | null = null;
+
+/**
+ * Adopt `cssText` into `shadow` via a shared Constructable Stylesheet when the
+ * browser supports it, falling back to a `<style>` element injection. The sheet
+ * is cached on first creation and reused across all player instances.
+ */
+export function adoptShadowStyles(shadow: ShadowRoot, cssText: string): void {
+  if (typeof CSSStyleSheet !== "undefined") {
+    try {
+      if (!_sharedSheet) {
+        _sharedSheet = new CSSStyleSheet();
+        _sharedSheet.replaceSync(cssText);
+      }
+      shadow.adoptedStyleSheets = [_sharedSheet];
+      return;
+    } catch {
+      /* fallthrough */
+    }
+  }
+  const style = document.createElement("style");
+  style.textContent = cssText;
+  shadow.appendChild(style);
+}
+
+/**
+ * Creates and configures the iframe element that hosts the composition, plus
+ * the wrapper container div. Returns handles to both so the constructor can
+ * attach them to the shadow root and track references without inlining the
+ * boilerplate.
+ */
+export function createCompositionIframe(): {
+  container: HTMLDivElement;
+  iframe: HTMLIFrameElement;
+} {
+  const container = document.createElement("div");
+  container.className = "hfp-container";
+
+  const iframe = document.createElement("iframe");
+  iframe.className = "hfp-iframe";
+  iframe.sandbox.add("allow-scripts", "allow-same-origin");
+  iframe.allow = "autoplay; fullscreen";
+  iframe.referrerPolicy = "no-referrer";
+  iframe.title = "HyperFrames Composition";
+
+  container.appendChild(iframe);
+  return { container, iframe };
+}
+
+/**
+ * Scale the iframe so the composition fits inside the player element while
+ * preserving aspect ratio. No-ops when the player has no painted size yet.
+ */
+export function scaleIframeToFit(
+  playerElement: HTMLElement,
+  iframe: HTMLIFrameElement,
+  compositionWidth: number,
+  compositionHeight: number,
+): void {
+  const rect = playerElement.getBoundingClientRect();
+  if (rect.width === 0 || rect.height === 0) return;
+  const scale = Math.min(rect.width / compositionWidth, rect.height / compositionHeight);
+  iframe.style.width = `${compositionWidth}px`;
+  iframe.style.height = `${compositionHeight}px`;
+  iframe.style.transform = `translate(-50%, -50%) scale(${scale})`;
+}