@hyperframes/studio-server 0.7.15

package/dist/index.js

@@ -0,0 +1,3869 @@
+// src/createStudioApi.ts
+import { Hono } from "hono";
+
+// src/routes/projects.ts
+import { readFile } from "fs/promises";
+import { join as join2 } from "path";
+
+// src/helpers/safePath.ts
+import { join } from "path";
+import { readdirSync } from "fs";
+import { isSafePath, resolveWithinProject } from "@hyperframes/core";
+var IGNORE_DIRS = /* @__PURE__ */ new Set([".thumbnails", "node_modules", ".git"]);
+function shouldIgnoreDir(rel) {
+  return rel === ".hyperframes/backup";
+}
+function isInHiddenOrVendorDir(relPath) {
+  const segments = relPath.split("/");
+  return segments.slice(0, -1).some((seg) => seg.startsWith(".") || seg === "node_modules");
+}
+function walkDir(dir, prefix = "") {
+  const files = [];
+  for (const entry of readdirSync(dir, { withFileTypes: true })) {
+    const rel = prefix ? `${prefix}/${entry.name}` : entry.name;
+    if (IGNORE_DIRS.has(entry.name) || shouldIgnoreDir(rel)) continue;
+    if (entry.isDirectory()) {
+      files.push(...walkDir(join(dir, entry.name), rel));
+    } else {
+      files.push(rel);
+    }
+  }
+  return files;
+}
+
+// src/routes/projects.ts
+var COMPOSITION_ID_RE = /data-composition-id\s*=/;
+async function filterCompositionFiles(projectDir, files) {
+  const htmlFiles = files.filter((f) => f.endsWith(".html") && !isInHiddenOrVendorDir(f));
+  const checks = await Promise.all(
+    htmlFiles.map(async (f) => {
+      try {
+        const content = await readFile(join2(projectDir, f), "utf-8");
+        return COMPOSITION_ID_RE.test(content);
+      } catch {
+        return false;
+      }
+    })
+  );
+  return htmlFiles.filter((_, i) => checks[i]);
+}
+function registerProjectRoutes(api, adapter) {
+  api.get("/projects", async (c) => {
+    const projects = await adapter.listProjects();
+    return c.json({ projects });
+  });
+  api.get("/resolve-session/:sessionId", async (c) => {
+    if (!adapter.resolveSession) {
+      return c.json({ error: "not available" }, 404);
+    }
+    const { sessionId } = c.req.param();
+    const result = await adapter.resolveSession(sessionId);
+    if (!result) return c.json({ error: "Session not found" }, 404);
+    return c.json(result);
+  });
+  api.get("/projects/:id", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    const files = walkDir(project.dir);
+    const compositions = await filterCompositionFiles(project.dir, files);
+    return c.json({ id: project.id, dir: project.dir, title: project.title, files, compositions });
+  });
+}
+
+// src/routes/storyboard.ts
+import { existsSync, readFileSync } from "fs";
+import {
+  parseStoryboard,
+  SCRIPT_FILENAME,
+  STORYBOARD_FILENAME
+} from "@hyperframes/core/storyboard";
+function resolveFrames(projectDir, frames) {
+  return frames.map((frame) => {
+    let srcExists = false;
+    if (frame.src) {
+      const abs = resolveWithinProject(projectDir, frame.src);
+      srcExists = abs ? existsSync(abs) : false;
+    }
+    return { ...frame, srcExists };
+  });
+}
+function readScript(projectDir) {
+  const abs = resolveWithinProject(projectDir, SCRIPT_FILENAME);
+  if (abs && existsSync(abs)) {
+    try {
+      return { exists: true, path: SCRIPT_FILENAME, content: readFileSync(abs, "utf-8") };
+    } catch {
+    }
+  }
+  return { exists: false, path: SCRIPT_FILENAME, content: "" };
+}
+function registerStoryboardRoutes(api, adapter) {
+  api.get("/projects/:id/storyboard", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    const abs = resolveWithinProject(project.dir, STORYBOARD_FILENAME);
+    if (!abs || !existsSync(abs)) {
+      return c.json({
+        exists: false,
+        path: STORYBOARD_FILENAME,
+        globals: { extra: {} },
+        frames: [],
+        warnings: [],
+        script: readScript(project.dir)
+      });
+    }
+    let source;
+    try {
+      source = readFileSync(abs, "utf-8");
+    } catch {
+      return c.json({ error: "failed to read storyboard" }, 500);
+    }
+    const manifest = parseStoryboard(source);
+    return c.json({
+      exists: true,
+      path: STORYBOARD_FILENAME,
+      globals: manifest.globals,
+      frames: resolveFrames(project.dir, manifest.frames),
+      warnings: manifest.warnings,
+      script: readScript(project.dir)
+    });
+  });
+}
+
+// src/routes/files.ts
+import { bodyLimit } from "hono/body-limit";
+import {
+  existsSync as existsSync3,
+  readFileSync as readFileSync3,
+  writeFileSync as writeFileSync4,
+  mkdirSync as mkdirSync3,
+  unlinkSync as unlinkSync2,
+  rmSync as rmSync2,
+  statSync,
+  renameSync,
+  readdirSync as readdirSync3
+} from "fs";
+import { resolve as resolve2, dirname, join as join6 } from "path";
+
+// src/helpers/mime.ts
+var MIME_TYPES = {
+  ".html": "text/html",
+  ".css": "text/css",
+  ".js": "text/javascript",
+  ".mjs": "text/javascript",
+  ".json": "application/json",
+  ".svg": "image/svg+xml",
+  ".png": "image/png",
+  ".jpg": "image/jpeg",
+  ".jpeg": "image/jpeg",
+  ".gif": "image/gif",
+  ".webp": "image/webp",
+  ".ico": "image/x-icon",
+  ".mp4": "video/mp4",
+  ".mov": "video/quicktime",
+  ".webm": "video/webm",
+  ".mp3": "audio/mpeg",
+  ".wav": "audio/wav",
+  ".ogg": "audio/ogg",
+  ".m4a": "audio/mp4",
+  ".aac": "audio/aac",
+  ".flac": "audio/flac",
+  ".opus": "audio/ogg",
+  ".woff": "font/woff",
+  ".woff2": "font/woff2",
+  ".ttf": "font/ttf",
+  ".otf": "font/otf",
+  ".txt": "text/plain",
+  ".md": "text/markdown",
+  ".cube": "text/plain; charset=utf-8"
+};
+function getMimeType(path) {
+  const ext = path.slice(path.lastIndexOf(".")).toLowerCase();
+  return MIME_TYPES[ext] || "application/octet-stream";
+}
+function isAudioFile(name) {
+  return (getMimeType(name) ?? "").startsWith("audio/");
+}
+
+// src/helpers/waveform.ts
+import { spawn } from "child_process";
+import { existsSync as existsSync2, writeFileSync, mkdirSync } from "fs";
+import { join as join3, resolve } from "path";
+var SAMPLE_RATE = 4e3;
+var PEAK_COUNT = 4e3;
+var WAVEFORM_CACHE_VERSION = "v2";
+function buildWaveformCacheKey(assetPath) {
+  return `${WAVEFORM_CACHE_VERSION}_${assetPath.replace(/[/\\]/g, "_")}.json`;
+}
+function computePeaks(floats, count) {
+  const step = floats.length / count;
+  const peaks = [];
+  for (let i = 0; i < count; i++) {
+    const start = Math.floor(i * step);
+    const end = Math.min(Math.floor((i + 1) * step), floats.length);
+    let max = 0;
+    for (let j = start; j < end; j++) {
+      const abs = Math.abs(floats[j] ?? 0);
+      if (abs > max) max = abs;
+    }
+    peaks.push(max);
+  }
+  const maxPeak = Math.max(...peaks, 1e-3);
+  return peaks.map((p) => p / maxPeak);
+}
+function ffmpegBinary() {
+  const configured = process.env.HYPERFRAMES_FFMPEG_PATH?.trim();
+  if (configured) return resolve(configured);
+  return "ffmpeg";
+}
+function decodeAudioPeaks(audioPath) {
+  return new Promise((resolvePromise, reject) => {
+    const proc = spawn(
+      ffmpegBinary(),
+      [
+        "-i",
+        audioPath,
+        "-af",
+        "atrim=start_sample=1152",
+        "-f",
+        "f32le",
+        "-ac",
+        "1",
+        "-ar",
+        String(SAMPLE_RATE),
+        "-vn",
+        "pipe:1"
+      ],
+      { stdio: ["ignore", "pipe", "ignore"] }
+    );
+    const chunks = [];
+    proc.stdout?.on("data", (chunk) => chunks.push(chunk));
+    proc.on("close", (code) => {
+      if (code !== 0 && chunks.length === 0) {
+        reject(new Error(`ffmpeg exited with code ${code}`));
+        return;
+      }
+      const buf = Buffer.concat(chunks);
+      const numSamples = Math.floor(buf.length / 4);
+      if (numSamples === 0) {
+        reject(new Error("ffmpeg produced no audio samples"));
+        return;
+      }
+      const ab = buf.buffer.slice(buf.byteOffset, buf.byteOffset + numSamples * 4);
+      resolvePromise(computePeaks(new Float32Array(ab), PEAK_COUNT));
+    });
+    proc.on("error", reject);
+  });
+}
+async function generateWaveformCache(projectDir, assetPath) {
+  const audioPath = join3(projectDir, assetPath);
+  if (!existsSync2(audioPath)) return;
+  const cacheDir = join3(projectDir, ".waveform-cache");
+  const cachePath = join3(cacheDir, buildWaveformCacheKey(assetPath));
+  if (existsSync2(cachePath)) return;
+  const peaks = await decodeAudioPeaks(audioPath);
+  mkdirSync(cacheDir, { recursive: true });
+  writeFileSync(cachePath, JSON.stringify(peaks));
+}
+
+// src/helpers/mediaValidation.ts
+import { spawnSync } from "child_process";
+import { mkdtempSync, rmSync, writeFileSync as writeFileSync2 } from "fs";
+import { tmpdir } from "os";
+import { basename, join as join4 } from "path";
+var VIDEO_EXT = /\.(mp4|webm|mov)$/i;
+var AUDIO_EXT = /\.(mp3|wav|ogg|m4a|aac)$/i;
+function validateUploadedMedia(filePath, runner = spawnSync) {
+  const isVideo = VIDEO_EXT.test(filePath);
+  const isAudio = AUDIO_EXT.test(filePath);
+  if (!isVideo && !isAudio) {
+    return { ok: true };
+  }
+  const result = runner("ffprobe", [
+    "-v",
+    "error",
+    "-show_entries",
+    "stream=codec_type",
+    "-of",
+    "json",
+    filePath
+  ]);
+  if (result.error?.code === "ENOENT") {
+    return { ok: true };
+  }
+  if (result.status !== 0) {
+    return { ok: false, reason: "ffprobe failed to read the media file" };
+  }
+  try {
+    const parsed = JSON.parse(String(result.stdout || "{}"));
+    const streams = parsed.streams ?? [];
+    const hasVideo = streams.some((stream) => stream.codec_type === "video");
+    const hasAudio = streams.some((stream) => stream.codec_type === "audio");
+    if (isVideo && !hasVideo) {
+      return { ok: false, reason: "no supported video stream found" };
+    }
+    if (isAudio && !hasAudio) {
+      return { ok: false, reason: "no supported audio stream found" };
+    }
+    return { ok: true };
+  } catch {
+    return { ok: false, reason: "ffprobe returned unreadable media metadata" };
+  }
+}
+function validateUploadedMediaBuffer(fileName, buffer, runner = spawnSync) {
+  const tempDir = mkdtempSync(join4(tmpdir(), "hyperframes-upload-"));
+  const tempPath = join4(tempDir, basename(fileName));
+  try {
+    writeFileSync2(tempPath, buffer);
+    return validateUploadedMedia(tempPath, runner);
+  } finally {
+    rmSync(tempDir, { recursive: true, force: true });
+  }
+}
+
+// src/helpers/backupJournal.ts
+import { mkdirSync as mkdirSync2, readdirSync as readdirSync2, readFileSync as readFileSync2, unlinkSync, writeFileSync as writeFileSync3 } from "fs";
+import { Buffer as Buffer2 } from "buffer";
+import { join as join5, relative } from "path";
+var DEFAULT_KEEP_PER_FILE = 10;
+function backupKeyForPath(path) {
+  return Buffer2.from(path, "utf-8").toString("base64url");
+}
+function timestampPrefix() {
+  return (/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-");
+}
+function backupPathForResponse(projectDir, backupPath) {
+  if (!backupPath) return null;
+  const rel = relative(projectDir, backupPath);
+  if (!rel || rel.startsWith("..")) return null;
+  return rel.split("\\").join("/");
+}
+function snapshotBeforeWrite(projectDir, absPath, options = {}) {
+  if (!isSafePath(projectDir, absPath)) return { backupPath: null };
+  try {
+    const content = readFileSync2(absPath);
+    const relativePath = relative(projectDir, absPath);
+    const backupDir = join5(projectDir, ".hyperframes", "backup");
+    mkdirSync2(backupDir, { recursive: true });
+    const backupKey = backupKeyForPath(relativePath);
+    const backupPath = nextBackupPath(backupDir, backupKey);
+    writeFileSync3(backupPath, content);
+    pruneBackups(backupDir, backupKey, options.keepPerFile ?? DEFAULT_KEEP_PER_FILE);
+    return { backupPath };
+  } catch (error) {
+    if (error && typeof error === "object" && "code" in error && (error.code === "ENOENT" || error.code === "EISDIR")) {
+      return { backupPath: null };
+    }
+    return { backupPath: null, error: error instanceof Error ? error.message : String(error) };
+  }
+}
+function nextBackupPath(backupDir, backupKey) {
+  const base = `${timestampPrefix()}-${backupKey}`;
+  let candidate = join5(backupDir, base);
+  let counter = 2;
+  while (true) {
+    try {
+      readFileSync2(candidate);
+    } catch (error) {
+      if (error && typeof error === "object" && "code" in error && error.code === "ENOENT") {
+        return candidate;
+      }
+      throw error;
+    }
+    candidate = join5(backupDir, `${base}-${counter}`);
+    counter += 1;
+  }
+}
+function pruneBackups(backupDir, backupKey, keepPerFile) {
+  const keep = Math.max(1, Math.floor(keepPerFile));
+  const suffix = `-${backupKey}`;
+  const numberedSuffix = new RegExp(`-${backupKey}-\\d+$`);
+  const matches = readdirSync2(backupDir).filter((name) => name.endsWith(suffix) || numberedSuffix.test(name)).map((name) => join5(backupDir, name)).sort((a, b) => {
+    return b.localeCompare(a);
+  });
+  for (const file of matches.slice(keep)) {
+    try {
+      unlinkSync(file);
+    } catch {
+    }
+  }
+}
+
+// src/helpers/finiteMutation.ts
+function findUnsafeMutationValues(value, path = "body", options = {}) {
+  if (value === null) {
+    return options.allowNullPath?.(path) ? [] : [{ path, reason: "null" }];
+  }
+  if (typeof value === "number") {
+    return Number.isFinite(value) ? [] : [{ path, reason: "non-finite-number" }];
+  }
+  if (!value || typeof value !== "object") return [];
+  if (Array.isArray(value)) {
+    return value.flatMap(
+      (item, index) => findUnsafeMutationValues(item, `${path}[${index}]`, options)
+    );
+  }
+  return Object.entries(value).flatMap(
+    ([key, item]) => findUnsafeMutationValues(item, `${path}.${key}`, options)
+  );
+}
+var DOM_PATCH_NULL_VALUE_PATH = /^body\.operations\[\d+\]\.value$/;
+function findUnsafeDomPatchValues(value) {
+  return findUnsafeMutationValues(value, "body", {
+    allowNullPath: (path) => DOM_PATCH_NULL_VALUE_PATH.test(path)
+  });
+}
+
+// src/routes/files.ts
+import { classifyPropertyGroup } from "@hyperframes/parsers/gsap-constants";
+import { parseGsapScriptAcorn } from "@hyperframes/parsers/gsap-parser-acorn";
+import { unrollComputedTimeline } from "@hyperframes/parsers";
+import {
+  updateAnimationInScript,
+  addAnimationToScript,
+  removeAnimationFromScript,
+  addKeyframeToScript,
+  removeKeyframeFromScript,
+  updateKeyframeInScript,
+  convertToKeyframesFromScript,
+  removeAllKeyframesFromScript,
+  materializeKeyframesFromScript,
+  unrollDynamicAnimations,
+  setArcPathInScript,
+  updateArcSegmentInScript,
+  removeArcPathFromScript,
+  addAnimationWithKeyframesToScript,
+  splitAnimationsInScript,
+  splitIntoPropertyGroupsFromScript,
+  shiftPositionsInScript,
+  scalePositionsInScript
+} from "@hyperframes/parsers/gsap-writer-acorn";
+
+// src/helpers/sourceMutation.ts
+import { parseHTML } from "linkedom";
+import postcss from "postcss";
+import selectorParser from "postcss-selector-parser";
+import { isAllowedHtmlAttribute, isSafeAttributeValue } from "@hyperframes/core/html-attr-safety";
+function parseSourceDocument(source) {
+  const hasDocumentShell = /<!doctype|<html[\s>]/i.test(source);
+  if (hasDocumentShell) {
+    return { document: parseHTML(source).document, wrappedFragment: false };
+  }
+  return {
+    document: parseHTML(`<!DOCTYPE html><html><head></head><body>${source}</body></html>`).document,
+    wrappedFragment: true
+  };
+}
+function duplicateCssRulesForId(document2, originalId, newId) {
+  const idToken = `#${originalId}`;
+  const transform = selectorParser((selectors) => {
+    selectors.walkIds((node) => {
+      if (node.value === originalId) node.value = newId;
+    });
+  });
+  for (const styleEl of document2.querySelectorAll("style")) {
+    const css = styleEl.textContent ?? "";
+    let root;
+    try {
+      root = postcss.parse(css);
+    } catch {
+      continue;
+    }
+    const clones = [];
+    root.walkRules((rule) => {
+      if (!rule.selector.includes(idToken)) return;
+      const newSelector = transform.processSync(rule.selector);
+      if (newSelector === rule.selector) return;
+      const clone = rule.clone({ selector: newSelector });
+      clones.push(clone);
+    });
+    if (clones.length > 0) {
+      for (const c of clones) root.append(c);
+      styleEl.textContent = root.toString();
+    }
+  }
+}
+function querySelectorAllWithTemplates(root, selector) {
+  const matches = Array.from(root.querySelectorAll(selector));
+  if (matches.length > 0) return matches;
+  const templates = Array.from(root.querySelectorAll("template"));
+  for (const tmpl of templates) {
+    const inner = tmpl.querySelectorAll(selector);
+    if (inner.length > 0) return Array.from(inner);
+  }
+  return [];
+}
+function escapeCssAttrValue(value) {
+  return value.replace(/\\/g, "\\\\").replace(/"/g, '\\"');
+}
+function findByHfId(document2, hfId) {
+  try {
+    const matches = querySelectorAllWithTemplates(
+      document2,
+      `[data-hf-id="${escapeCssAttrValue(hfId)}"]`
+    );
+    if (matches.length > 1) {
+      console.warn(
+        `sourceMutation: data-hf-id "${hfId}" matched ${matches.length} elements; using the first. ids must be unique per document.`
+      );
+    }
+    return matches[0] ?? null;
+  } catch {
+    return null;
+  }
+}
+function findTargetElement(document2, target) {
+  if (target.hfId) {
+    const el = findByHfId(document2, target.hfId);
+    if (el) return el;
+  }
+  if (target.id) {
+    const byId = document2.getElementById(target.id);
+    if (byId) return byId;
+  }
+  if (!target.selector) return null;
+  try {
+    const matches = querySelectorAllWithTemplates(document2, target.selector);
+    return matches[target.selectorIndex ?? 0] ?? null;
+  } catch {
+    return null;
+  }
+}
+function removeElementFromHtml(source, target) {
+  const { document: document2, wrappedFragment } = parseSourceDocument(source);
+  const element = findTargetElement(document2, target);
+  if (!element) return source;
+  element.remove();
+  return wrappedFragment ? document2.body.innerHTML || "" : document2.toString();
+}
+function isHTMLElement(el) {
+  const HTMLEl = el.ownerDocument.defaultView?.HTMLElement;
+  return HTMLEl ? el instanceof HTMLEl : "style" in el;
+}
+function patchStyleAttrString(style, property, value) {
+  const props = /* @__PURE__ */ new Map();
+  const order = [];
+  let i = 0;
+  while (i < style.length) {
+    let depth = 0;
+    let inSingle = false;
+    let inDouble = false;
+    const start = i;
+    while (i < style.length) {
+      const ch = style[i];
+      if (ch === "'" && !inDouble) inSingle = !inSingle;
+      else if (ch === '"' && !inSingle) inDouble = !inDouble;
+      else if (!inSingle && !inDouble) {
+        if (ch === "(") depth++;
+        else if (ch === ")") depth = Math.max(0, depth - 1);
+        else if (ch === ";" && depth === 0) break;
+      }
+      i++;
+    }
+    const decl = style.slice(start, i).trim();
+    i++;
+    if (!decl) continue;
+    const colon = decl.indexOf(":");
+    if (colon < 0) continue;
+    const key = decl.slice(0, colon).trim();
+    const val = decl.slice(colon + 1).trim();
+    if (!key) continue;
+    if (!props.has(key)) order.push(key);
+    props.set(key, val);
+  }
+  if (value === null) {
+    props.delete(property);
+    const idx = order.indexOf(property);
+    if (idx >= 0) order.splice(idx, 1);
+  } else {
+    if (!props.has(property)) order.push(property);
+    props.set(property, value);
+  }
+  return order.map((k) => `${k}: ${props.get(k) ?? ""}`).filter((d) => d.trim()).join("; ");
+}
+function patchElementInHtml(source, target, operations) {
+  const { document: document2, wrappedFragment } = parseSourceDocument(source);
+  const el = findTargetElement(document2, target);
+  if (!el || !isHTMLElement(el)) return { html: source, matched: false };
+  const htmlEl = el;
+  for (const op of operations) {
+    switch (op.type) {
+      case "inline-style":
+        {
+          const raw = htmlEl.getAttribute("style") ?? "";
+          const patched = patchStyleAttrString(raw, op.property, op.value);
+          htmlEl.setAttribute("style", patched);
+        }
+        break;
+      case "attribute":
+        {
+          const fullAttr = op.property.startsWith("data-") ? op.property : `data-${op.property}`;
+          if (op.value != null) {
+            htmlEl.setAttribute(fullAttr, op.value);
+          } else {
+            htmlEl.removeAttribute(fullAttr);
+          }
+        }
+        break;
+      case "html-attribute":
+        if (!isAllowedHtmlAttribute(op.property)) break;
+        if (op.value != null) {
+          if (!isSafeAttributeValue(op.property, op.value)) break;
+          htmlEl.setAttribute(op.property, op.value);
+        } else {
+          htmlEl.removeAttribute(op.property);
+        }
+        break;
+      case "text-content":
+        if (op.value != null) {
+          const inner = htmlEl.children.length === 1 ? htmlEl.firstElementChild : null;
+          const textTarget = inner && isHTMLElement(inner) ? inner : htmlEl;
+          textTarget.textContent = op.value;
+        }
+        break;
+    }
+  }
+  return {
+    html: wrappedFragment ? document2.body.innerHTML || "" : document2.toString(),
+    matched: true
+  };
+}
+function probeElementInSource(source, target) {
+  if (!target.id && !target.hfId && !target.selector) return false;
+  const { document: document2 } = parseSourceDocument(source);
+  const el = findTargetElement(document2, target);
+  return el != null && isHTMLElement(el);
+}
+function resolveElementTiming(el) {
+  const start = parseFloat(el.getAttribute("data-start") ?? "0") || 0;
+  const usesDataEnd = el.hasAttribute("data-end");
+  const duration = usesDataEnd ? parseFloat(el.getAttribute("data-end") ?? "") - start || 0 : parseFloat(el.getAttribute("data-duration") ?? "0") || 0;
+  return { start, duration, usesDataEnd };
+}
+function setElementDuration(el, start, duration, usesDataEnd) {
+  if (usesDataEnd) {
+    const endTime = String(Math.round((start + duration) * 1e3) / 1e3);
+    el.setAttribute("data-end", endTime);
+    el.removeAttribute("data-duration");
+  } else {
+    el.setAttribute("data-duration", String(Math.round(duration * 1e3) / 1e3));
+    el.removeAttribute("data-end");
+  }
+}
+function splitElementInHtml(source, target, splitTime, newId, fallbackTiming) {
+  const { document: document2, wrappedFragment } = parseSourceDocument(source);
+  const el = findTargetElement(document2, target);
+  if (!el || !isHTMLElement(el)) return { html: source, matched: false, newId: null };
+  const timing = resolveElementTiming(el);
+  const { usesDataEnd } = timing;
+  let { start, duration } = timing;
+  if (duration <= 0 && fallbackTiming && fallbackTiming.duration > 0) {
+    start = fallbackTiming.start;
+    duration = fallbackTiming.duration;
+  }
+  if (duration <= 0 || splitTime <= start || splitTime >= start + duration) {
+    return { html: source, matched: false, newId: null };
+  }
+  if (document2.getElementById(newId)) {
+    let suffix = 2;
+    const base = newId;
+    while (document2.getElementById(newId)) {
+      newId = `${base}-${suffix++}`;
+    }
+  }
+  const firstDuration = splitTime - start;
+  const secondDuration = duration - firstDuration;
+  const clone = el.cloneNode(true);
+  clone.setAttribute("id", newId);
+  clone.removeAttribute("data-hf-id");
+  for (const node of clone.querySelectorAll("[data-hf-id]")) node.removeAttribute("data-hf-id");
+  clone.setAttribute("data-start", String(Math.round(splitTime * 1e3) / 1e3));
+  setElementDuration(clone, splitTime, secondDuration, usesDataEnd);
+  const playbackStartAttr = el.hasAttribute("data-playback-start") ? "data-playback-start" : el.hasAttribute("data-media-start") ? "data-media-start" : null;
+  if (playbackStartAttr) {
+    const currentTrim = parseFloat(el.getAttribute(playbackStartAttr) ?? "0") || 0;
+    const rateRaw = parseFloat(el.getAttribute("data-playback-rate") ?? "");
+    const rate = Number.isFinite(rateRaw) ? rateRaw : 1;
+    clone.setAttribute(
+      playbackStartAttr,
+      String(Math.round((currentTrim + firstDuration * rate) * 1e3) / 1e3)
+    );
+  }
+  const originalId = el.getAttribute("id");
+  if (originalId) {
+    duplicateCssRulesForId(document2, originalId, newId);
+  }
+  el.setAttribute("data-start", String(Math.round(start * 1e3) / 1e3));
+  setElementDuration(el, start, firstDuration, usesDataEnd);
+  if (el.nextSibling) {
+    el.parentElement.insertBefore(clone, el.nextSibling);
+  } else {
+    el.parentElement.appendChild(clone);
+  }
+  return {
+    html: wrappedFragment ? document2.body.innerHTML || "" : document2.toString(),
+    matched: true,
+    newId
+  };
+}
+
+// src/routes/files.ts
+import { parseHTML as parseHTML2 } from "linkedom";
+function isAcornGsapWriterEnabled() {
+  const val = process.env["STUDIO_SDK_CUTOVER_ENABLED"];
+  return val === "true" || val === "1";
+}
+async function loadGsapParser() {
+  return import("@hyperframes/parsers/gsap-parser-recast");
+}
+async function resolveProjectPath(c, adapter, pathPrefix, opts) {
+  const id = c.req.param("id");
+  const project = await adapter.resolveProject(id);
+  if (!project) {
+    return { error: c.json({ error: "not found" }, 404) };
+  }
+  const filePath = decodeURIComponent(c.req.path.replace(pathPrefix(project.id), ""));
+  if (filePath.includes("\0")) {
+    return { error: c.json({ error: "forbidden" }, 403) };
+  }
+  const absPath = resolveWithinProject(project.dir, filePath);
+  if (!absPath) {
+    return { error: c.json({ error: "forbidden" }, 403) };
+  }
+  if (opts?.mustExist && !existsSync3(absPath)) {
+    return { error: c.json({ error: "not found" }, 404) };
+  }
+  return { project, filePath, absPath };
+}
+function resolveProjectFile(c, adapter, opts) {
+  return resolveProjectPath(c, adapter, (id) => `/projects/${id}/files/`, opts);
+}
+function resolveFileMutationContext(c, adapter, operation) {
+  return resolveProjectPath(c, adapter, (id) => `/projects/${id}/file-mutations/${operation}/`);
+}
+function writeIfChanged(c, projectDir, filePath, absPath, original, next) {
+  if (next === original) {
+    return c.json({ ok: true, changed: false, content: original, path: filePath });
+  }
+  const backup = snapshotBeforeWrite(projectDir, absPath);
+  if (backup.error) console.warn(`Failed to create backup for ${filePath}: ${backup.error}`);
+  writeFileSync4(absPath, next, "utf-8");
+  return c.json({
+    ok: true,
+    changed: true,
+    content: next,
+    path: filePath,
+    backupPath: backupPathForResponse(projectDir, backup.backupPath)
+  });
+}
+function rejectUnsafeMutationValues(c, unsafeFields) {
+  return c.json(
+    {
+      error: "mutation contains unsafe values",
+      fields: unsafeFields.map((field) => field.path),
+      unsafeValues: unsafeFields
+    },
+    400
+  );
+}
+async function parseMutationBody(c) {
+  const body = await c.req.json().catch(() => null);
+  if (!body?.target) {
+    return { error: c.json({ error: "target required" }, 400) };
+  }
+  return { target: body.target, body };
+}
+function ensureDir(filePath) {
+  const dir = dirname(filePath);
+  if (!existsSync3(dir)) mkdirSync3(dir, { recursive: true });
+}
+function generateCopyPath(projectDir, originalPath) {
+  const ext = originalPath.includes(".") ? "." + originalPath.split(".").pop() : "";
+  const base = ext ? originalPath.slice(0, -ext.length) : originalPath;
+  const copyMatch = base.match(/ \(copy(?: (\d+))?\)$/);
+  const cleanBase = copyMatch ? base.slice(0, -copyMatch[0].length) : base;
+  let num = copyMatch ? copyMatch[1] ? parseInt(copyMatch[1]) + 1 : 2 : 1;
+  let candidate = num === 1 ? `${cleanBase} (copy)${ext}` : `${cleanBase} (copy ${num})${ext}`;
+  while (existsSync3(resolve2(projectDir, candidate))) {
+    num++;
+    candidate = `${cleanBase} (copy ${num})${ext}`;
+  }
+  return candidate;
+}
+function walkFiles(dir, filter) {
+  const results = [];
+  for (const entry of readdirSync3(dir, { withFileTypes: true })) {
+    const full = join6(dir, entry.name);
+    if (entry.isDirectory()) {
+      if (entry.name === "node_modules" || entry.name === ".thumbnails" || entry.name === "renders")
+        continue;
+      results.push(...walkFiles(full, filter));
+    } else if (filter(entry.name)) {
+      results.push(full);
+    }
+  }
+  return results;
+}
+function updateReferences(projectDir, oldPath, newPath) {
+  const textFiles = walkFiles(
+    projectDir,
+    (name) => /\.(html|css|js|jsx|ts|tsx|json|mjs|cjs|md|mdx)$/i.test(name)
+  );
+  let updatedCount = 0;
+  for (const file of textFiles) {
+    const content = readFileSync3(file, "utf-8");
+    if (!content.includes(oldPath)) continue;
+    const updated = content.split(oldPath).join(newPath);
+    if (updated !== content) {
+      writeFileSync4(file, updated, "utf-8");
+      updatedCount++;
+    }
+  }
+  return updatedCount;
+}
+function extractGsapScriptBlock(html) {
+  const { document: document2 } = parseHTML2(html);
+  const scripts = [
+    ...document2.querySelectorAll("script:not([src])"),
+    ...Array.from(document2.querySelectorAll("template")).flatMap(
+      (tmpl) => Array.from(tmpl.querySelectorAll("script:not([src])"))
+    )
+  ];
+  for (const script of scripts) {
+    const content = script.textContent || "";
+    if (content.includes("gsap.timeline") || content.includes(".set(") || content.includes(".to(")) {
+      return {
+        scriptText: content,
+        document: document2,
+        replaceScript(newText) {
+          script.textContent = newText;
+          return document2.toString();
+        }
+      };
+    }
+  }
+  return null;
+}
+function stripStudioEditsFromTarget(document2, selector) {
+  if (!selector) return 0;
+  let stripped = 0;
+  try {
+    for (const el of document2.querySelectorAll(selector)) {
+      if (!isHTMLElement(el)) continue;
+      const htmlEl = el;
+      let touched = false;
+      if (el.getAttribute("data-hf-studio-path-offset")) {
+        const originalTranslate = el.getAttribute("data-hf-studio-original-inline-translate");
+        htmlEl.style.removeProperty("--hf-studio-offset-x");
+        htmlEl.style.removeProperty("--hf-studio-offset-y");
+        if (originalTranslate) {
+          htmlEl.style.setProperty("translate", originalTranslate);
+        } else {
+          htmlEl.style.removeProperty("translate");
+        }
+        el.removeAttribute("data-hf-studio-path-offset");
+        el.removeAttribute("data-hf-studio-original-translate");
+        el.removeAttribute("data-hf-studio-original-inline-translate");
+        touched = true;
+      }
+      if (el.getAttribute("data-hf-studio-rotation")) {
+        const originalRotate = el.getAttribute("data-hf-studio-original-inline-rotate");
+        const originalOrigin = el.getAttribute("data-hf-studio-original-rotation-transform-origin");
+        htmlEl.style.removeProperty("--hf-studio-rotation");
+        if (originalRotate) {
+          htmlEl.style.setProperty("rotate", originalRotate);
+        } else {
+          htmlEl.style.removeProperty("rotate");
+        }
+        if (originalOrigin) {
+          htmlEl.style.setProperty("transform-origin", originalOrigin);
+        } else {
+          htmlEl.style.removeProperty("transform-origin");
+        }
+        el.removeAttribute("data-hf-studio-rotation");
+        el.removeAttribute("data-hf-studio-rotation-draft");
+        el.removeAttribute("data-hf-studio-original-rotate");
+        el.removeAttribute("data-hf-studio-original-inline-rotate");
+        el.removeAttribute("data-hf-studio-original-rotation-transform-origin");
+        touched = true;
+      }
+      if (touched) stripped++;
+    }
+  } catch {
+  }
+  return stripped;
+}
+function keyframesWritePosition(keyframes) {
+  return keyframes.some(
+    (kf) => Object.keys(kf.properties).some((k) => classifyPropertyGroup(k) === "position")
+  );
+}
+function keyframesWriteRotation(keyframes) {
+  return keyframes.some(
+    (kf) => Object.keys(kf.properties).some((k) => classifyPropertyGroup(k) === "rotation")
+  );
+}
+function lastKeyframeOpacity(kfs) {
+  if (!kfs) return void 0;
+  for (let i = kfs.keyframes.length - 1; i >= 0; i--) {
+    if ("opacity" in kfs.keyframes[i].properties) return kfs.keyframes[i].properties.opacity;
+  }
+  return void 0;
+}
+function resolveFinalOpacity(anim) {
+  if (anim.method === "from") return null;
+  const raw = anim.keyframes ? lastKeyframeOpacity(anim.keyframes) : anim.properties.opacity;
+  if (raw == null) return null;
+  if (typeof raw === "string" && /^[+\-*]=/.test(raw)) return null;
+  const num = Number(raw);
+  return Number.isFinite(num) && num !== 0 ? num : null;
+}
+function bakeVisibilityOnDelete(document2, anim) {
+  const opacity = resolveFinalOpacity(anim);
+  if (opacity === null) return;
+  try {
+    for (const el of document2.querySelectorAll(anim.targetSelector)) {
+      if (isHTMLElement(el)) el.style.setProperty("opacity", String(opacity));
+    }
+  } catch {
+  }
+}
+var HOLD_SYNC_MUTATION_TYPES = /* @__PURE__ */ new Set([
+  "add-keyframe",
+  "update-keyframe",
+  "remove-keyframe",
+  "remove-all-keyframes",
+  "add-with-keyframes",
+  "replace-with-keyframes",
+  "convert-to-keyframes",
+  "materialize-keyframes",
+  "update-motion-path-point",
+  "add-motion-path-point",
+  "remove-motion-path-point",
+  // Authors a fresh motionPath tween whose parsed first keyframe is (0,0); if it lands
+  // at position > 0 the element snaps home at t=0 without a pre-tween hold-`set`.
+  "add-motion-path",
+  // Can move a tween's `position` (start) across the t=0 boundary, which flips whether a
+  // keyframed position tween needs a hold (started at 0 → moved later, or vice versa).
+  "update-meta",
+  // Time-shift / time-scale tweens, which can move a keyframed position tween's start
+  // across t=0, flipping hold need; stale holds are not repositioned by these ops.
+  "shift-positions",
+  "scale-positions",
+  // Retargets keyframed position tweens to a cloned element's selector; the old hold is
+  // keyed to the prior selector, so holds must be rebuilt for the new target.
+  "split-animations",
+  "delete",
+  "delete-all-for-selector"
+]);
+async function executeGsapMutation(body, block, respond) {
+  if (!isAcornGsapWriterEnabled()) {
+    return executeGsapMutationRecast(body, block, respond);
+  }
+  return executeGsapMutationAcorn(body, block, respond);
+}
+function executeGsapMutationAcorn(body, block, respond) {
+  function requireAnimation(scriptText, animationId) {
+    const parsed = parseGsapScriptAcorn(scriptText);
+    const anim = parsed.animations.find((a) => a.id === animationId);
+    if (!anim) return { err: respond({ error: "animation not found" }, 404) };
+    return { anim };
+  }
+  function requireFromToAnimation(scriptText, animationId) {
+    const result = requireAnimation(scriptText, animationId);
+    if ("err" in result) return result;
+    if (result.anim.method !== "fromTo")
+      return { err: respond({ error: "animation is not a fromTo" }, 400) };
+    return result;
+  }
+  switch (body.type) {
+    case "update-property":
+    case "add-property": {
+      const r = requireAnimation(block.scriptText, body.animationId);
+      if ("err" in r) return r.err;
+      const val = body.type === "update-property" ? body.value : body.defaultValue;
+      return updateAnimationInScript(block.scriptText, body.animationId, {
+        properties: { ...r.anim.properties, [body.property]: val }
+      });
+    }
+    case "update-properties": {
+      const r = requireAnimation(block.scriptText, body.animationId);
+      if ("err" in r) return r.err;
+      return updateAnimationInScript(block.scriptText, body.animationId, {
+        properties: { ...r.anim.properties, ...body.properties }
+      });
+    }
+    case "update-from-property":
+    case "add-from-property": {
+      const r = requireFromToAnimation(block.scriptText, body.animationId);
+      if ("err" in r) return r.err;
+      const val = body.type === "update-from-property" ? body.value : body.defaultValue;
+      return updateAnimationInScript(block.scriptText, body.animationId, {
+        fromProperties: { ...r.anim.fromProperties ?? {}, [body.property]: val }
+      });
+    }
+    case "update-meta": {
+      return updateAnimationInScript(block.scriptText, body.animationId, body.updates);
+    }
+    case "add": {
+      if (body.fromProperties && body.method !== "fromTo") {
+        return respond({ error: "fromProperties is only valid for method=fromTo" }, 400);
+      }
+      const result = addAnimationToScript(block.scriptText, {
+        targetSelector: body.targetSelector,
+        method: body.method,
+        position: body.position,
+        duration: body.duration,
+        ease: body.ease,
+        properties: body.properties,
+        fromProperties: body.fromProperties,
+        ...body.global ? { global: true } : {}
+      });
+      return result.script;
+    }
+    case "delete": {
+      const delTarget = requireAnimation(block.scriptText, body.animationId);
+      if (!("err" in delTarget) && body.stripStudioEdits) {
+        stripStudioEditsFromTarget(block.document, delTarget.anim.targetSelector);
+        bakeVisibilityOnDelete(block.document, delTarget.anim);
+      }
+      return removeAnimationFromScript(block.scriptText, body.animationId);
+    }
+    case "delete-all-for-selector": {
+      const parsed = parseGsapScriptAcorn(block.scriptText);
+      const matching = parsed.animations.filter((a) => a.targetSelector === body.targetSelector);
+      if (matching.length === 0) return block.scriptText;
+      stripStudioEditsFromTarget(block.document, body.targetSelector);
+      let script = block.scriptText;
+      for (const anim of matching.reverse()) {
+        script = removeAnimationFromScript(script, anim.id);
+      }
+      return script;
+    }
+    case "remove-property": {
+      const r = requireAnimation(block.scriptText, body.animationId);
+      if ("err" in r) return r.err;
+      const filtered = { ...r.anim.properties };
+      delete filtered[body.property];
+      return updateAnimationInScript(block.scriptText, body.animationId, {
+        properties: filtered
+      });
+    }
+    case "remove-from-property": {
+      const r = requireFromToAnimation(block.scriptText, body.animationId);
+      if ("err" in r) return r.err;
+      const filtered = { ...r.anim.fromProperties ?? {} };
+      delete filtered[body.property];
+      return updateAnimationInScript(block.scriptText, body.animationId, {
+        fromProperties: filtered
+      });
+    }
+    case "add-keyframe": {
+      return addKeyframeToScript(
+        block.scriptText,
+        body.animationId,
+        body.percentage,
+        body.properties,
+        body.ease,
+        body.backfillDefaults
+      );
+    }
+    case "remove-keyframe": {
+      return removeKeyframeFromScript(block.scriptText, body.animationId, body.percentage);
+    }
+    case "update-keyframe": {
+      return updateKeyframeInScript(
+        block.scriptText,
+        body.animationId,
+        body.percentage,
+        body.properties,
+        body.ease
+      );
+    }
+    case "convert-to-keyframes": {
+      return convertToKeyframesFromScript(
+        block.scriptText,
+        body.animationId,
+        body.resolvedFromValues,
+        body.duration
+      );
+    }
+    case "remove-all-keyframes": {
+      const preCollapse = requireAnimation(block.scriptText, body.animationId);
+      if (!("err" in preCollapse)) {
+        bakeVisibilityOnDelete(block.document, preCollapse.anim);
+      }
+      return removeAllKeyframesFromScript(block.scriptText, body.animationId);
+    }
+    case "materialize-keyframes": {
+      if (body.allElements && body.allElements.length > 0) {
+        return unrollDynamicAnimations(block.scriptText, body.animationId, body.allElements);
+      }
+      return materializeKeyframesFromScript(
+        block.scriptText,
+        body.animationId,
+        body.keyframes,
+        body.easeEach,
+        body.resolvedSelector
+      );
+    }
+    case "set-arc-path": {
+      return setArcPathInScript(block.scriptText, body.animationId, {
+        enabled: body.enabled,
+        autoRotate: body.autoRotate ?? false,
+        segments: body.segments ?? []
+      });
+    }
+    case "update-arc-segment": {
+      return updateArcSegmentInScript(block.scriptText, body.animationId, body.segmentIndex, {
+        ...body.curviness !== void 0 ? { curviness: body.curviness } : {},
+        ...body.cp1 ? { cp1: body.cp1 } : {},
+        ...body.cp2 ? { cp2: body.cp2 } : {}
+      });
+    }
+    case "remove-arc-path": {
+      return removeArcPathFromScript(block.scriptText, body.animationId);
+    }
+    case "add-with-keyframes": {
+      const result = addAnimationWithKeyframesToScript(
+        block.scriptText,
+        body.targetSelector,
+        body.position,
+        body.duration,
+        body.keyframes,
+        body.ease,
+        body.easeEach
+      );
+      return result.script;
+    }
+    case "replace-with-keyframes": {
+      const script = removeAnimationFromScript(block.scriptText, body.animationId);
+      const added = addAnimationWithKeyframesToScript(
+        script,
+        body.targetSelector,
+        body.position,
+        body.duration,
+        body.keyframes,
+        body.ease
+      );
+      return added.script;
+    }
+    case "split-animations": {
+      if (typeof body.originalId !== "string" || !body.originalId || typeof body.newId !== "string" || !body.newId || typeof body.splitTime !== "number" || !Number.isFinite(body.splitTime) || typeof body.elementStart !== "number" || !Number.isFinite(body.elementStart) || typeof body.elementDuration !== "number" || !Number.isFinite(body.elementDuration) || body.elementDuration <= 0) {
+        return respond(
+          {
+            error: "split-animations requires originalId, newId (non-empty strings), splitTime, elementStart (finite numbers), and elementDuration (positive number)"
+          },
+          400
+        );
+      }
+      return splitAnimationsInScript(block.scriptText, {
+        originalId: body.originalId,
+        newId: body.newId,
+        splitTime: body.splitTime,
+        elementStart: body.elementStart,
+        elementDuration: body.elementDuration
+      });
+    }
+    case "split-into-property-groups": {
+      const result = splitIntoPropertyGroupsFromScript(block.scriptText, body.animationId);
+      return result.script;
+    }
+    case "unroll-timeline": {
+      return unrollComputedTimeline(block.scriptText);
+    }
+    case "shift-positions": {
+      const { targetSelector, delta } = body;
+      if (!targetSelector || !Number.isFinite(delta) || delta === 0) return block.scriptText;
+      return shiftPositionsInScript(block.scriptText, targetSelector, delta);
+    }
+    case "scale-positions": {
+      const { targetSelector, oldStart, oldDuration, newStart, newDuration } = body;
+      if (!targetSelector || !Number.isFinite(oldStart) || !Number.isFinite(oldDuration) || !Number.isFinite(newStart) || !Number.isFinite(newDuration) || oldDuration <= 0 || newDuration <= 0)
+        return block.scriptText;
+      if (oldStart === newStart && oldDuration === newDuration) return block.scriptText;
+      return scalePositionsInScript(
+        block.scriptText,
+        targetSelector,
+        oldStart,
+        oldDuration,
+        newStart,
+        newDuration
+      );
+    }
+    default:
+      return respond({ error: `unknown mutation type: ${body.type}` }, 400);
+  }
+}
+async function executeGsapMutationRecast(body, block, respond) {
+  const parser = await loadGsapParser();
+  const {
+    updateAnimationInScript: updateAnimationInScript2,
+    addAnimationToScript: addAnimationToScript2,
+    removeAnimationFromScript: removeAnimationFromScript2,
+    addKeyframeToScript: addKeyframeToScript2,
+    removeKeyframeFromScript: removeKeyframeFromScript2,
+    updateKeyframeInScript: updateKeyframeInScript2,
+    convertToKeyframesInScript,
+    removeAllKeyframesFromScript: removeAllKeyframesFromScript2,
+    materializeKeyframesInScript,
+    unrollDynamicAnimations: unrollDynamicAnimations2,
+    setArcPathInScript: setArcPathInScript2,
+    updateArcSegmentInScript: updateArcSegmentInScript2,
+    updateMotionPathPointInScript,
+    addMotionPathPointInScript,
+    removeMotionPathPointInScript,
+    addMotionPathToScript,
+    removeArcPathFromScript: removeArcPathFromScript2,
+    addAnimationWithKeyframesToScript: addAnimationWithKeyframesToScript2,
+    splitAnimationsInScript: splitAnimationsInScript2,
+    splitIntoPropertyGroups
+  } = parser;
+  function requireAnimation(scriptText, animationId) {
+    const parsed = parseGsapScriptAcorn(scriptText);
+    const anim = parsed.animations.find((a) => a.id === animationId);
+    if (!anim) return { err: respond({ error: "animation not found" }, 404) };
+    return { anim };
+  }
+  function requireFromToAnimation(scriptText, animationId) {
+    const result = requireAnimation(scriptText, animationId);
+    if ("err" in result) return result;
+    if (result.anim.method !== "fromTo")
+      return { err: respond({ error: "animation is not a fromTo" }, 400) };
+    return result;
+  }
+  switch (body.type) {
+    case "update-property":
+    case "add-property": {
+      const r = requireAnimation(block.scriptText, body.animationId);
+      if ("err" in r) return r.err;
+      const val = body.type === "update-property" ? body.value : body.defaultValue;
+      return updateAnimationInScript2(block.scriptText, body.animationId, {
+        properties: { ...r.anim.properties, [body.property]: val }
+      });
+    }
+    case "update-properties": {
+      const r = requireAnimation(block.scriptText, body.animationId);
+      if ("err" in r) return r.err;
+      return updateAnimationInScript2(block.scriptText, body.animationId, {
+        properties: { ...r.anim.properties, ...body.properties }
+      });
+    }
+    case "update-from-property":
+    case "add-from-property": {
+      const r = requireFromToAnimation(block.scriptText, body.animationId);
+      if ("err" in r) return r.err;
+      const val = body.type === "update-from-property" ? body.value : body.defaultValue;
+      return updateAnimationInScript2(block.scriptText, body.animationId, {
+        fromProperties: { ...r.anim.fromProperties ?? {}, [body.property]: val }
+      });
+    }
+    case "update-meta": {
+      return updateAnimationInScript2(block.scriptText, body.animationId, body.updates);
+    }
+    case "add": {
+      if (body.fromProperties && body.method !== "fromTo") {
+        return respond({ error: "fromProperties is only valid for method=fromTo" }, 400);
+      }
+      if (Object.keys(body.properties).some((k) => {
+        const group = classifyPropertyGroup(k);
+        return group === "position" || group === "rotation";
+      })) {
+        stripStudioEditsFromTarget(block.document, body.targetSelector);
+      }
+      const result = addAnimationToScript2(block.scriptText, {
+        targetSelector: body.targetSelector,
+        method: body.method,
+        position: body.position,
+        duration: body.duration,
+        ease: body.ease,
+        properties: body.properties,
+        fromProperties: body.fromProperties,
+        ...body.global ? { global: true } : {}
+      });
+      return result.script;
+    }
+    case "delete": {
+      const delTarget = requireAnimation(block.scriptText, body.animationId);
+      if (!("err" in delTarget) && body.stripStudioEdits) {
+        stripStudioEditsFromTarget(block.document, delTarget.anim.targetSelector);
+        bakeVisibilityOnDelete(block.document, delTarget.anim);
+      }
+      return removeAnimationFromScript2(block.scriptText, body.animationId);
+    }
+    case "delete-all-for-selector": {
+      const parsed = parseGsapScriptAcorn(block.scriptText);
+      const matching = parsed.animations.filter((a) => a.targetSelector === body.targetSelector);
+      if (matching.length === 0) return block.scriptText;
+      stripStudioEditsFromTarget(block.document, body.targetSelector);
+      let script = block.scriptText;
+      for (const anim of matching.reverse()) {
+        script = removeAnimationFromScript2(script, anim.id);
+      }
+      return script;
+    }
+    case "remove-property": {
+      const r = requireAnimation(block.scriptText, body.animationId);
+      if ("err" in r) return r.err;
+      const filtered = { ...r.anim.properties };
+      delete filtered[body.property];
+      return updateAnimationInScript2(block.scriptText, body.animationId, {
+        properties: filtered
+      });
+    }
+    case "remove-from-property": {
+      const r = requireFromToAnimation(block.scriptText, body.animationId);
+      if ("err" in r) return r.err;
+      const filtered = { ...r.anim.fromProperties ?? {} };
+      delete filtered[body.property];
+      return updateAnimationInScript2(block.scriptText, body.animationId, {
+        fromProperties: filtered
+      });
+    }
+    case "add-keyframe": {
+      return addKeyframeToScript2(
+        block.scriptText,
+        body.animationId,
+        body.percentage,
+        body.properties,
+        body.ease,
+        body.backfillDefaults
+      );
+    }
+    case "remove-keyframe": {
+      return removeKeyframeFromScript2(block.scriptText, body.animationId, body.percentage);
+    }
+    case "update-keyframe": {
+      return updateKeyframeInScript2(
+        block.scriptText,
+        body.animationId,
+        body.percentage,
+        body.properties,
+        body.ease
+      );
+    }
+    case "convert-to-keyframes": {
+      return convertToKeyframesInScript(
+        block.scriptText,
+        body.animationId,
+        body.resolvedFromValues,
+        body.duration
+      );
+    }
+    case "remove-all-keyframes": {
+      const preCollapse = requireAnimation(block.scriptText, body.animationId);
+      if (!("err" in preCollapse)) {
+        bakeVisibilityOnDelete(block.document, preCollapse.anim);
+      }
+      return removeAllKeyframesFromScript2(block.scriptText, body.animationId);
+    }
+    case "materialize-keyframes": {
+      if (body.allElements && body.allElements.length > 0) {
+        return unrollDynamicAnimations2(block.scriptText, body.animationId, body.allElements);
+      }
+      return materializeKeyframesInScript(
+        block.scriptText,
+        body.animationId,
+        body.keyframes,
+        body.easeEach,
+        body.resolvedSelector
+      );
+    }
+    case "set-arc-path": {
+      return setArcPathInScript2(block.scriptText, body.animationId, {
+        enabled: body.enabled,
+        autoRotate: body.autoRotate ?? false,
+        segments: body.segments ?? []
+      });
+    }
+    case "update-arc-segment": {
+      return updateArcSegmentInScript2(block.scriptText, body.animationId, body.segmentIndex, {
+        ...body.curviness !== void 0 ? { curviness: body.curviness } : {},
+        ...body.cp1 ? { cp1: body.cp1 } : {},
+        ...body.cp2 ? { cp2: body.cp2 } : {}
+      });
+    }
+    case "update-motion-path-point": {
+      return updateMotionPathPointInScript(block.scriptText, body.animationId, body.pointIndex, {
+        x: body.x,
+        y: body.y
+      });
+    }
+    case "add-motion-path-point": {
+      return addMotionPathPointInScript(block.scriptText, body.animationId, body.index, {
+        x: body.x,
+        y: body.y
+      });
+    }
+    case "remove-motion-path-point": {
+      return removeMotionPathPointInScript(block.scriptText, body.animationId, body.index);
+    }
+    case "add-motion-path": {
+      const result = addMotionPathToScript(
+        block.scriptText,
+        body.targetSelector,
+        body.position,
+        body.duration,
+        { x: body.x, y: body.y },
+        body.ease
+      );
+      return result.script;
+    }
+    case "remove-arc-path": {
+      return removeArcPathFromScript2(block.scriptText, body.animationId);
+    }
+    case "add-with-keyframes": {
+      if (keyframesWritePosition(body.keyframes) || keyframesWriteRotation(body.keyframes)) {
+        stripStudioEditsFromTarget(block.document, body.targetSelector);
+      }
+      const result = addAnimationWithKeyframesToScript2(
+        block.scriptText,
+        body.targetSelector,
+        body.position,
+        body.duration,
+        body.keyframes,
+        body.ease
+      );
+      return result.script;
+    }
+    case "replace-with-keyframes": {
+      if (keyframesWritePosition(body.keyframes) || keyframesWriteRotation(body.keyframes)) {
+        stripStudioEditsFromTarget(block.document, body.targetSelector);
+      }
+      const script = removeAnimationFromScript2(block.scriptText, body.animationId);
+      const added = addAnimationWithKeyframesToScript2(
+        script,
+        body.targetSelector,
+        body.position,
+        body.duration,
+        body.keyframes,
+        body.ease
+      );
+      return added.script;
+    }
+    case "split-animations": {
+      if (typeof body.originalId !== "string" || !body.originalId || typeof body.newId !== "string" || !body.newId || typeof body.splitTime !== "number" || !Number.isFinite(body.splitTime) || typeof body.elementStart !== "number" || !Number.isFinite(body.elementStart) || typeof body.elementDuration !== "number" || !Number.isFinite(body.elementDuration) || body.elementDuration <= 0) {
+        return respond(
+          {
+            error: "split-animations requires originalId, newId (non-empty strings), splitTime, elementStart (finite numbers), and elementDuration (positive number)"
+          },
+          400
+        );
+      }
+      return splitAnimationsInScript2(block.scriptText, {
+        originalId: body.originalId,
+        newId: body.newId,
+        splitTime: body.splitTime,
+        elementStart: body.elementStart,
+        elementDuration: body.elementDuration
+      });
+    }
+    case "split-into-property-groups": {
+      const result = splitIntoPropertyGroups(block.scriptText, body.animationId);
+      return result.script;
+    }
+    case "unroll-timeline": {
+      return unrollComputedTimeline(block.scriptText);
+    }
+    case "shift-positions": {
+      const { targetSelector, delta } = body;
+      if (!targetSelector || !Number.isFinite(delta) || delta === 0) return block.scriptText;
+      const { shiftPositionsInScript: shiftPositionsInScript2 } = parser;
+      return shiftPositionsInScript2(block.scriptText, targetSelector, delta);
+    }
+    case "scale-positions": {
+      const { targetSelector, oldStart, oldDuration, newStart, newDuration } = body;
+      if (!targetSelector || !Number.isFinite(oldStart) || !Number.isFinite(oldDuration) || !Number.isFinite(newStart) || !Number.isFinite(newDuration) || oldDuration <= 0 || newDuration <= 0)
+        return block.scriptText;
+      if (oldStart === newStart && oldDuration === newDuration) return block.scriptText;
+      const { scalePositionsInScript: scalePositionsInScript2 } = parser;
+      return scalePositionsInScript2(
+        block.scriptText,
+        targetSelector,
+        oldStart,
+        oldDuration,
+        newStart,
+        newDuration
+      );
+    }
+    default:
+      return respond({ error: `unknown mutation type: ${body.type}` }, 400);
+  }
+}
+async function processUploadedFiles(formData, targetDir, projectDir) {
+  const MAX_UPLOAD_BYTES = 500 * 1024 * 1024;
+  const uploaded = [];
+  const skipped = [];
+  const invalid = [];
+  const entries = formData.entries();
+  const subDir = targetDir === projectDir ? "" : targetDir.slice(projectDir.length + 1);
+  for (const [, value] of entries) {
+    if (typeof value === "string") continue;
+    const name = value.name.split("/").pop()?.split("\\").pop() ?? "";
+    if (!name || name.includes("\0") || name.includes("..")) continue;
+    if (value.size > MAX_UPLOAD_BYTES) {
+      skipped.push(name);
+      continue;
+    }
+    const destPath = resolve2(targetDir, name);
+    if (!isSafePath(projectDir, destPath)) continue;
+    let finalPath = destPath;
+    let finalName = name;
+    if (existsSync3(finalPath)) {
+      const dotIdx = name.indexOf(".", name.startsWith(".") ? 1 : 0);
+      const ext = dotIdx > 0 ? name.slice(dotIdx) : "";
+      const base = dotIdx > 0 ? name.slice(0, dotIdx) : name;
+      let n = 2;
+      const MAX_COPY_INDEX = 1e4;
+      while (n < MAX_COPY_INDEX && existsSync3(resolve2(targetDir, `${base} (${n})${ext}`))) n++;
+      if (n >= MAX_COPY_INDEX) {
+        skipped.push(name);
+        continue;
+      }
+      finalName = `${base} (${n})${ext}`;
+      finalPath = resolve2(targetDir, finalName);
+    }
+    const buffer = Buffer.from(await value.arrayBuffer());
+    const validation = validateUploadedMediaBuffer(finalName, buffer);
+    if (!validation.ok) {
+      invalid.push({ name: finalName, reason: validation.reason });
+      continue;
+    }
+    writeFileSync4(finalPath, buffer);
+    const relativePath = subDir ? join6(subDir, finalName) : finalName;
+    uploaded.push(relativePath);
+    if (isAudioFile(finalName)) {
+      generateWaveformCache(projectDir, relativePath).catch(() => {
+      });
+    }
+  }
+  return { uploaded, skipped, invalid };
+}
+function registerFileRoutes(api, adapter) {
+  api.get("/projects/:id/files/*", async (c) => {
+    const res = await resolveProjectFile(c, adapter);
+    if ("error" in res) return res.error;
+    if (!existsSync3(res.absPath)) {
+      if (c.req.query("optional") === "1") {
+        return c.json({ filename: res.filePath, content: "" });
+      }
+      return c.json({ error: "not found" }, 404);
+    }
+    const content = readFileSync3(res.absPath, "utf-8");
+    return c.json({ filename: res.filePath, content });
+  });
+  api.put("/projects/:id/files/*", async (c) => {
+    const res = await resolveProjectFile(c, adapter);
+    if ("error" in res) return res.error;
+    ensureDir(res.absPath);
+    const body = await c.req.text();
+    const backup = snapshotBeforeWrite(res.project.dir, res.absPath);
+    if (backup.error) console.warn(`Failed to create backup for ${res.filePath}: ${backup.error}`);
+    writeFileSync4(res.absPath, body, "utf-8");
+    return c.json({
+      ok: true,
+      path: res.filePath,
+      backupPath: backupPathForResponse(res.project.dir, backup.backupPath)
+    });
+  });
+  api.post("/projects/:id/files/*", async (c) => {
+    const res = await resolveProjectFile(c, adapter);
+    if ("error" in res) return res.error;
+    if (existsSync3(res.absPath)) {
+      return c.json({ error: "already exists" }, 409);
+    }
+    ensureDir(res.absPath);
+    const body = await c.req.text().catch(() => "");
+    writeFileSync4(res.absPath, body, "utf-8");
+    return c.json({ ok: true, path: res.filePath }, 201);
+  });
+  api.delete("/projects/:id/files/*", async (c) => {
+    const res = await resolveProjectFile(c, adapter, { mustExist: true });
+    if ("error" in res) return res.error;
+    const stat = statSync(res.absPath);
+    const backup = snapshotBeforeWrite(res.project.dir, res.absPath);
+    if (backup.error) console.warn(`Failed to create backup for ${res.filePath}: ${backup.error}`);
+    if (stat.isDirectory()) {
+      rmSync2(res.absPath, { recursive: true });
+    } else {
+      unlinkSync2(res.absPath);
+    }
+    return c.json({
+      ok: true,
+      backupPath: backupPathForResponse(res.project.dir, backup.backupPath)
+    });
+  });
+  api.post("/projects/:id/file-mutations/remove-element/*", async (c) => {
+    const ctx = await resolveFileMutationContext(c, adapter, "remove-element");
+    if ("error" in ctx) return ctx.error;
+    if (!existsSync3(ctx.absPath)) {
+      return c.json({ error: "not found" }, 404);
+    }
+    const parsed = await parseMutationBody(c);
+    if ("error" in parsed) return parsed.error;
+    const originalContent = readFileSync3(ctx.absPath, "utf-8");
+    return writeIfChanged(
+      c,
+      ctx.project.dir,
+      ctx.filePath,
+      ctx.absPath,
+      originalContent,
+      removeElementFromHtml(originalContent, parsed.target)
+    );
+  });
+  api.post("/projects/:id/file-mutations/split-element/*", async (c) => {
+    const ctx = await resolveFileMutationContext(c, adapter, "split-element");
+    if ("error" in ctx) return ctx.error;
+    const parsed = await parseMutationBody(c);
+    if ("error" in parsed) return parsed.error;
+    if (typeof parsed.body.splitTime !== "number" || !parsed.body.newId) {
+      return c.json({ error: "target, splitTime, and newId required" }, 400);
+    }
+    const fallbackTiming = typeof parsed.body.elementStart === "number" && typeof parsed.body.elementDuration === "number" ? { start: parsed.body.elementStart, duration: parsed.body.elementDuration } : void 0;
+    let originalContent;
+    try {
+      originalContent = readFileSync3(ctx.absPath, "utf-8");
+    } catch {
+      return c.json({ error: "not found" }, 404);
+    }
+    const result = splitElementInHtml(
+      originalContent,
+      parsed.target,
+      parsed.body.splitTime,
+      parsed.body.newId,
+      fallbackTiming
+    );
+    if (!result.matched) {
+      return c.json({ ok: false, changed: false, content: originalContent, path: ctx.filePath });
+    }
+    const backup = snapshotBeforeWrite(ctx.project.dir, ctx.absPath);
+    if (backup.error) console.warn(`Failed to create backup for ${ctx.filePath}: ${backup.error}`);
+    writeFileSync4(ctx.absPath, result.html, "utf-8");
+    return c.json({
+      ok: true,
+      changed: true,
+      content: result.html,
+      newId: result.newId,
+      path: ctx.filePath,
+      backupPath: backupPathForResponse(ctx.project.dir, backup.backupPath)
+    });
+  });
+  api.post("/projects/:id/file-mutations/patch-element/*", async (c) => {
+    const ctx = await resolveFileMutationContext(c, adapter, "patch-element");
+    if ("error" in ctx) return ctx.error;
+    const parsed = await parseMutationBody(c);
+    if ("error" in parsed) return parsed.error;
+    if (!Array.isArray(parsed.body.operations) || parsed.body.operations.length === 0) {
+      return c.json({ error: "target and operations required" }, 400);
+    }
+    const unsafeFields = findUnsafeDomPatchValues(parsed.body);
+    if (unsafeFields.length > 0) {
+      return rejectUnsafeMutationValues(c, unsafeFields);
+    }
+    let originalContent;
+    try {
+      originalContent = readFileSync3(ctx.absPath, "utf-8");
+    } catch {
+      return c.json({ error: "not found" }, 404);
+    }
+    const { html: patched, matched } = patchElementInHtml(
+      originalContent,
+      parsed.target,
+      parsed.body.operations
+    );
+    if (patched === originalContent) {
+      return c.json({
+        ok: true,
+        changed: false,
+        matched,
+        content: originalContent,
+        path: ctx.filePath
+      });
+    }
+    const backup = snapshotBeforeWrite(ctx.project.dir, ctx.absPath);
+    if (backup.error) console.warn(`Failed to create backup for ${ctx.filePath}: ${backup.error}`);
+    writeFileSync4(ctx.absPath, patched, "utf-8");
+    return c.json({
+      ok: true,
+      changed: true,
+      matched,
+      content: patched,
+      path: ctx.filePath,
+      backupPath: backupPathForResponse(ctx.project.dir, backup.backupPath)
+    });
+  });
+  api.post("/projects/:id/file-mutations/probe-element/*", async (c) => {
+    const ctx = await resolveFileMutationContext(c, adapter, "probe-element");
+    if ("error" in ctx) return ctx.error;
+    const parsed = await parseMutationBody(c);
+    if ("error" in parsed) return parsed.error;
+    let content;
+    try {
+      content = readFileSync3(ctx.absPath, "utf-8");
+    } catch {
+      return c.json({ exists: false });
+    }
+    const exists = probeElementInSource(content, parsed.target);
+    return c.json({ exists });
+  });
+  api.patch("/projects/:id/files/*", async (c) => {
+    const res = await resolveProjectFile(c, adapter, { mustExist: true });
+    if ("error" in res) return res.error;
+    const body = await c.req.json();
+    if (!body.newPath || body.newPath.includes("\0")) {
+      return c.json({ error: "newPath required" }, 400);
+    }
+    const newAbs = resolveWithinProject(res.project.dir, body.newPath);
+    if (!newAbs) {
+      return c.json({ error: "forbidden" }, 403);
+    }
+    if (existsSync3(newAbs)) {
+      return c.json({ error: "already exists" }, 409);
+    }
+    ensureDir(newAbs);
+    renameSync(res.absPath, newAbs);
+    const updatedFiles = updateReferences(res.project.dir, res.filePath, body.newPath);
+    return c.json({ ok: true, path: body.newPath, updatedReferences: updatedFiles });
+  });
+  api.post("/projects/:id/duplicate-file", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    const body = await c.req.json();
+    if (!body.path || body.path.includes("\0")) {
+      return c.json({ error: "path required" }, 400);
+    }
+    const srcAbs = resolveWithinProject(project.dir, body.path);
+    if (!srcAbs || !existsSync3(srcAbs)) {
+      return c.json({ error: "not found" }, 404);
+    }
+    const copyPath = generateCopyPath(project.dir, body.path);
+    const destAbs = resolveWithinProject(project.dir, copyPath);
+    if (!destAbs) {
+      return c.json({ error: "forbidden" }, 403);
+    }
+    ensureDir(destAbs);
+    writeFileSync4(destAbs, readFileSync3(srcAbs));
+    return c.json({ ok: true, path: copyPath }, 201);
+  });
+  const MAX_UPLOAD_BYTES = 500 * 1024 * 1024;
+  api.post(
+    "/projects/:id/upload",
+    bodyLimit({
+      maxSize: MAX_UPLOAD_BYTES,
+      onError: (c) => c.json({ error: "payload too large" }, 413)
+    }),
+    async (c) => {
+      const project = await adapter.resolveProject(c.req.param("id"));
+      if (!project) return c.json({ error: "not found" }, 404);
+      const subDir = c.req.query("dir") ?? "";
+      const targetDir = subDir ? resolveWithinProject(project.dir, subDir) : project.dir;
+      if (!targetDir) return c.json({ error: "forbidden" }, 403);
+      if (subDir && !existsSync3(targetDir)) mkdirSync3(targetDir, { recursive: true });
+      const formData = await c.req.formData();
+      const result = await processUploadedFiles(formData, targetDir, project.dir);
+      return c.json(
+        { ok: true, files: result.uploaded, skipped: result.skipped, invalid: result.invalid },
+        201
+      );
+    }
+  );
+  api.get("/projects/:id/gsap-animations/*", async (c) => {
+    const res = await resolveProjectPath(c, adapter, (id) => `/projects/${id}/gsap-animations/`, {
+      mustExist: true
+    });
+    if ("error" in res) return res.error;
+    const html = readFileSync3(res.absPath, "utf-8");
+    const block = extractGsapScriptBlock(html);
+    if (!block) {
+      return c.json({
+        animations: [],
+        timelineVar: "tl",
+        preamble: "",
+        postamble: ""
+      });
+    }
+    const parsed = parseGsapScriptAcorn(block.scriptText);
+    return c.json(parsed);
+  });
+  api.post("/projects/:id/gsap-mutations/*", async (c) => {
+    const res = await resolveProjectPath(c, adapter, (id) => `/projects/${id}/gsap-mutations/`, {
+      mustExist: true
+    });
+    if ("error" in res) return res.error;
+    const body = await c.req.json().catch(() => null);
+    if (!body || !body.type) {
+      return c.json({ error: "mutation type required" }, 400);
+    }
+    const unsafeFields = findUnsafeMutationValues(body);
+    if (unsafeFields.length > 0) {
+      return rejectUnsafeMutationValues(c, unsafeFields);
+    }
+    let html = readFileSync3(res.absPath, "utf-8");
+    let block = extractGsapScriptBlock(html);
+    if (!block && (body.type === "add" || body.type === "add-with-keyframes")) {
+      const compId = html.match(/data-composition-id="([^"]+)"/)?.[1] ?? "main";
+      const { GSAP_CDN } = await import("@hyperframes/core");
+      const gsapCdn = `<script src="${GSAP_CDN}"></script>`;
+      const bootstrap = [
+        gsapCdn,
+        "<script>",
+        "window.__timelines = window.__timelines || {};",
+        `const tl = gsap.timeline({ paused: true });`,
+        `window.__timelines["${compId}"] = tl;`,
+        "</script>"
+      ].join("\n");
+      if (html.includes("</body>")) {
+        html = html.replace("</body>", `${bootstrap}
+</body>`);
+      } else {
+        html += `
+${bootstrap}`;
+      }
+      block = extractGsapScriptBlock(html);
+    }
+    if (!block) {
+      return c.json({ error: "no GSAP script found in file" }, 400);
+    }
+    const respond = (data, status) => (
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any -- bridge between generic status and Hono's literal union
+      status ? c.json(data, status) : c.json(data)
+    );
+    const result = await executeGsapMutation(body, block, respond);
+    if (result instanceof Response) return result;
+    let newScript = typeof result === "string" ? result : result.script;
+    if (HOLD_SYNC_MUTATION_TYPES.has(body.type)) {
+      const parser = await loadGsapParser();
+      newScript = parser.syncPositionHoldsBeforeKeyframes(newScript);
+    }
+    const changed = newScript !== block.scriptText;
+    const newHtml = changed ? block.replaceScript(newScript) : html;
+    let backupPath = null;
+    if (changed) {
+      const backup = snapshotBeforeWrite(res.project.dir, res.absPath);
+      if (backup.error)
+        console.warn(`Failed to create backup for ${res.filePath}: ${backup.error}`);
+      backupPath = backupPathForResponse(res.project.dir, backup.backupPath);
+      writeFileSync4(res.absPath, newHtml, "utf-8");
+    }
+    const freshParsed = parseGsapScriptAcorn(newScript);
+    const responsePayload = {
+      ok: true,
+      changed,
+      parsed: freshParsed,
+      before: html,
+      after: newHtml,
+      scriptText: newScript,
+      path: res.filePath,
+      backupPath
+    };
+    if (typeof result !== "string" && result.skippedSelectors.length > 0) {
+      responsePayload.skippedSelectors = result.skippedSelectors;
+    }
+    return c.json(responsePayload);
+  });
+}
+
+// src/routes/preview.ts
+import { existsSync as existsSync5, readFileSync as readFileSync7, statSync as statSync2 } from "fs";
+import { join as join8 } from "path";
+import { injectScriptsIntoHtml, stripEmbeddedRuntimeScripts as stripEmbeddedRuntimeScripts2 } from "@hyperframes/core/compiler";
+
+// src/helpers/subComposition.ts
+import { existsSync as existsSync4, readFileSync as readFileSync4 } from "fs";
+import { join as join7 } from "path";
+import { parseHTML as parseHTML3 } from "linkedom";
+import {
+  rewriteAssetPaths,
+  rewriteCssAssetUrls,
+  rewriteInlineStyleAssetUrls
+} from "@hyperframes/core";
+import { stripEmbeddedRuntimeScripts } from "@hyperframes/core/compiler";
+function isFullHtmlDocument(html) {
+  return /^\s*(?:<!doctype\s|<html[\s>])/i.test(html);
+}
+function rewriteRelativePaths(root, compPath) {
+  rewriteAssetPaths(
+    root.querySelectorAll("[src], [href]"),
+    compPath,
+    (el, attr) => el.getAttribute(attr),
+    (el, attr, value) => el.setAttribute(attr, value)
+  );
+  rewriteInlineStyleAssetUrls(
+    root.querySelectorAll("[style]"),
+    compPath,
+    (el) => el.getAttribute("style"),
+    (el, value) => el.setAttribute("style", value)
+  );
+  for (const styleEl of root.querySelectorAll("style")) {
+    styleEl.textContent = rewriteCssAssetUrls(styleEl.textContent || "", compPath);
+  }
+}
+function escapeLeadingDigitIdent(id) {
+  return `\\${id.charCodeAt(0).toString(16)} ${id.slice(1)}`;
+}
+var REGEXP_SPECIALS = /[.*+?^${}()|[\]\\]/g;
+function fixDigitLeadingIdSelectors(root) {
+  const digitIds = /* @__PURE__ */ new Set();
+  for (const el of root.querySelectorAll("[id]")) {
+    const id = el.getAttribute("id");
+    if (id && /^\d/.test(id)) digitIds.add(id);
+  }
+  if (digitIds.size === 0) return;
+  for (const styleEl of root.querySelectorAll("style")) {
+    let css = styleEl.textContent || "";
+    for (const id of digitIds) {
+      const pattern = new RegExp(`#${id.replace(REGEXP_SPECIALS, "\\$&")}(?![\\w-])`, "g");
+      css = css.replace(pattern, `#${escapeLeadingDigitIdent(id)}`);
+    }
+    styleEl.textContent = css;
+  }
+}
+function extractFullDocumentParts(rawHtml, compPath) {
+  const { document: doc } = parseHTML3(rawHtml);
+  const rewriteTargets = [doc.head, doc.body].filter(Boolean);
+  for (const target of rewriteTargets) {
+    rewriteRelativePaths(target, compPath);
+  }
+  fixDigitLeadingIdSelectors(doc);
+  const headContent = doc.head?.innerHTML ?? "";
+  const bodyContent = doc.body?.innerHTML ?? "";
+  const htmlEl = doc.documentElement;
+  const htmlAttrs = extractElementAttrs(htmlEl);
+  const bodyAttrs = doc.body ? extractElementAttrs(doc.body) : "";
+  return { headContent, bodyContent, htmlAttrs, bodyAttrs };
+}
+function extractTemplateInnerHtml(rawComp) {
+  const { document: doc } = parseHTML3(rawComp);
+  const template = doc.querySelector("template");
+  return template ? template.innerHTML : null;
+}
+function extractElementAttrs(el) {
+  const parts = [];
+  for (let i = 0; i < el.attributes.length; i++) {
+    const attr = el.attributes[i];
+    if (attr.value === "") {
+      parts.push(attr.name);
+    } else {
+      parts.push(`${attr.name}="${attr.value}"`);
+    }
+  }
+  return parts.join(" ");
+}
+var NON_RENDERED_TAGS = /* @__PURE__ */ new Set(["SCRIPT", "STYLE", "LINK", "META", "TEMPLATE", "NOSCRIPT"]);
+function promoteTemplateCompositionId(rawComp, body) {
+  const templateCompositionId = rawComp.match(
+    /<template[^>]*\sdata-composition-id\s*=\s*["']([^"']+)["']/i
+  )?.[1];
+  if (!templateCompositionId) return;
+  if (body.querySelector("[data-composition-id]")) return;
+  const root = Array.from(body.children).find((el) => !NON_RENDERED_TAGS.has(el.tagName));
+  root?.setAttribute("data-composition-id", templateCompositionId);
+}
+function tagRootCompositionFile(bodyHtml, compPath) {
+  const match = bodyHtml.match(/<[a-zA-Z][^>]*\bdata-composition-id=/);
+  if (match?.index == null) return bodyHtml;
+  const tagEnd = bodyHtml.indexOf(">", match.index);
+  if (tagEnd === -1) return bodyHtml;
+  if (bodyHtml.slice(match.index, tagEnd).includes("data-composition-file")) return bodyHtml;
+  return bodyHtml.slice(0, tagEnd) + ` data-composition-file="${compPath}"` + bodyHtml.slice(tagEnd);
+}
+function buildSubCompositionHtml(projectDir, compPath, runtimeUrl, baseHref) {
+  const compFile = join7(projectDir, compPath);
+  if (!existsSync4(compFile)) return null;
+  const rawComp = readFileSync4(compFile, "utf-8");
+  let compHeadContent = "";
+  let rewrittenContent;
+  let htmlAttrs = "";
+  let bodyAttrs = "";
+  const templateInner = extractTemplateInnerHtml(rawComp);
+  if (templateInner != null) {
+    const { document: contentDoc } = parseHTML3(
+      `<!DOCTYPE html><html><head></head><body>${templateInner}</body></html>`
+    );
+    rewriteRelativePaths(contentDoc, compPath);
+    fixDigitLeadingIdSelectors(contentDoc);
+    promoteTemplateCompositionId(rawComp, contentDoc.body);
+    rewrittenContent = contentDoc.body.innerHTML || templateInner;
+  } else if (isFullHtmlDocument(rawComp)) {
+    const parts = extractFullDocumentParts(rawComp, compPath);
+    compHeadContent = parts.headContent;
+    rewrittenContent = parts.bodyContent;
+    htmlAttrs = parts.htmlAttrs;
+    bodyAttrs = parts.bodyAttrs;
+  } else {
+    const { document: contentDoc } = parseHTML3(
+      `<!DOCTYPE html><html><head></head><body>${rawComp}</body></html>`
+    );
+    rewriteRelativePaths(contentDoc, compPath);
+    fixDigitLeadingIdSelectors(contentDoc);
+    rewrittenContent = contentDoc.body.innerHTML || rawComp;
+  }
+  rewrittenContent = stripEmbeddedRuntimeScripts(rewrittenContent);
+  rewrittenContent = tagRootCompositionFile(rewrittenContent, compPath);
+  const indexPath = join7(projectDir, "index.html");
+  let headContent = "";
+  if (existsSync4(indexPath)) {
+    const indexHtml = readFileSync4(indexPath, "utf-8");
+    const headMatch = indexHtml.match(/<head[^>]*>([\s\S]*?)<\/head>/i);
+    headContent = headMatch?.[1] ?? "";
+  }
+  if (baseHref && !headContent.includes("<base")) {
+    headContent = `<base href="${baseHref}">
+${headContent}`;
+  }
+  if (compHeadContent) headContent += `
+${compHeadContent}`;
+  headContent = stripEmbeddedRuntimeScripts(headContent);
+  if (!headContent.includes("hyperframe.runtime") && !headContent.includes("hyperframes-preview-runtime")) {
+    headContent += `
+<script data-hyperframes-preview-runtime="1" src="${runtimeUrl}"></script>`;
+  }
+  if (!headContent.includes("gsap")) {
+    headContent += `
+<script src="https://cdn.jsdelivr.net/npm/gsap@3/dist/gsap.min.js"></script>`;
+  }
+  const htmlOpen = htmlAttrs ? `<html ${htmlAttrs}>` : "<html>";
+  const bodyOpen = bodyAttrs ? `<body ${bodyAttrs}>` : "<body>";
+  return `<!DOCTYPE html>
+${htmlOpen}
+<head>
+${headContent}
+</head>
+${bodyOpen}
+<script>window.__timelines=window.__timelines||{};</script>
+${rewrittenContent}
+</body>
+</html>`;
+}
+
+// src/helpers/projectSignature.ts
+import { createHash } from "crypto";
+import { lstatSync, readFileSync as readFileSync5, readdirSync as readdirSync4 } from "fs";
+import { extname, isAbsolute, relative as relative2, resolve as resolve3 } from "path";
+var SIGNATURE_TEXT_EXTENSIONS = /* @__PURE__ */ new Set([
+  ".cjs",
+  ".css",
+  ".html",
+  ".js",
+  ".json",
+  ".jsx",
+  ".mjs",
+  ".svg",
+  ".ts",
+  ".tsx"
+]);
+var SIGNATURE_EXCLUDED_DIRS = /* @__PURE__ */ new Set([
+  ".cache",
+  ".git",
+  ".hyperframes",
+  ".next",
+  ".vite",
+  "build",
+  "coverage",
+  "dist",
+  "node_modules",
+  "outputs",
+  "renders"
+]);
+var MAX_SIGNATURE_TEXT_BYTES = 2e6;
+var STUDIO_SIGNATURE_MANIFEST_PATHS = [
+  ".hyperframes/studio-manual-edits.json",
+  ".hyperframes/studio-motion.json"
+];
+var projectSignatureCache = /* @__PURE__ */ new Map();
+function isPathWithin(parentDir, childPath) {
+  const childRelativePath = relative2(parentDir, childPath);
+  return childRelativePath === "" || !childRelativePath.startsWith("..") && !isAbsolute(childRelativePath);
+}
+function isTextContentEligible(file, size) {
+  return SIGNATURE_TEXT_EXTENSIONS.has(extname(file).toLowerCase()) && size <= MAX_SIGNATURE_TEXT_BYTES;
+}
+function collectProjectSignatureFiles(projectDir, dir, files) {
+  let entries;
+  try {
+    entries = readdirSync4(dir).sort();
+  } catch {
+    return;
+  }
+  for (const entry of entries) {
+    if (SIGNATURE_EXCLUDED_DIRS.has(entry)) continue;
+    const file = resolve3(dir, entry);
+    if (!isPathWithin(projectDir, file)) continue;
+    let stat;
+    try {
+      stat = lstatSync(file);
+    } catch {
+      continue;
+    }
+    if (stat.isSymbolicLink()) continue;
+    if (stat.isDirectory()) {
+      collectProjectSignatureFiles(projectDir, file, files);
+    } else if (stat.isFile()) {
+      files.push({
+        file,
+        mtimeMs: stat.mtimeMs,
+        size: stat.size,
+        textContentEligible: isTextContentEligible(file, stat.size)
+      });
+    }
+  }
+}
+function collectProjectSignatureManifestFiles(projectDir, files) {
+  const seen = new Set(files.map((entry) => entry.file));
+  for (const manifestPath of STUDIO_SIGNATURE_MANIFEST_PATHS) {
+    const file = resolve3(projectDir, manifestPath);
+    if (seen.has(file) || !isPathWithin(projectDir, file)) continue;
+    let stat;
+    try {
+      stat = lstatSync(file);
+    } catch {
+      continue;
+    }
+    if (stat.isSymbolicLink() || !stat.isFile()) continue;
+    files.push({
+      file,
+      mtimeMs: stat.mtimeMs,
+      size: stat.size,
+      textContentEligible: isTextContentEligible(file, stat.size)
+    });
+    seen.add(file);
+  }
+}
+function createProjectFingerprint(projectDir, files) {
+  const hash = createHash("sha256");
+  for (const entry of files) {
+    hash.update(relative2(projectDir, entry.file));
+    hash.update("\0");
+    hash.update(String(entry.size));
+    hash.update("\0");
+    hash.update(String(entry.mtimeMs));
+    hash.update("\0");
+    hash.update(entry.textContentEligible ? "text" : "binary");
+    hash.update("\0");
+  }
+  return hash.digest("hex").slice(0, 24);
+}
+function createProjectSignature(projectDir) {
+  const normalizedProjectDir = resolve3(projectDir);
+  const files = [];
+  collectProjectSignatureFiles(normalizedProjectDir, normalizedProjectDir, files);
+  collectProjectSignatureManifestFiles(normalizedProjectDir, files);
+  files.sort((a, b) => a.file.localeCompare(b.file));
+  const fingerprint = createProjectFingerprint(normalizedProjectDir, files);
+  const cached = projectSignatureCache.get(normalizedProjectDir);
+  if (cached?.fingerprint === fingerprint) return cached.signature;
+  const hash = createHash("sha256");
+  for (const entry of files) {
+    const relativePath = relative2(normalizedProjectDir, entry.file);
+    hash.update(relativePath);
+    hash.update("\0");
+    hash.update(String(entry.size));
+    hash.update("\0");
+    if (entry.textContentEligible) {
+      try {
+        hash.update(readFileSync5(entry.file));
+      } catch {
+        hash.update(String(entry.mtimeMs));
+      }
+    } else {
+      hash.update(String(entry.mtimeMs));
+    }
+    hash.update("\0");
+  }
+  const signature = hash.digest("hex").slice(0, 24);
+  projectSignatureCache.set(normalizedProjectDir, { fingerprint, signature });
+  return signature;
+}
+
+// src/helpers/studioMotionRenderScript.ts
+var STUDIO_MOTION_PATH = ".hyperframes/studio-motion.json";
+function hasStudioMotionEntries(manifestContent) {
+  try {
+    const parsed = JSON.parse(manifestContent);
+    return Array.isArray(parsed.motions) && parsed.motions.length > 0;
+  } catch {
+    return false;
+  }
+}
+function createStudioMotionRenderBodyScript(manifestContent, options = {}) {
+  if (!manifestContent.trim() || !hasStudioMotionEntries(manifestContent)) return null;
+  return `(${studioMotionRenderRuntime.toString()})(${JSON.stringify(manifestContent)}, ${JSON.stringify(options.activeCompositionPath ?? null)});`;
+}
+function studioMotionRenderRuntime(manifestContent, activeCompositionPath) {
+  const STUDIO_MOTION_TIMELINE_ID = "studio-motion";
+  const STUDIO_MOTION_ATTR = "data-hf-studio-motion";
+  const ORIGINAL_TRANSFORM_ATTR = "data-hf-studio-motion-original-transform";
+  const ORIGINAL_OPACITY_ATTR = "data-hf-studio-motion-original-opacity";
+  const ORIGINAL_VISIBILITY_ATTR = "data-hf-studio-motion-original-visibility";
+  const objectRecord = (value) => value && typeof value === "object" ? value : null;
+  const finiteNumber = (value) => typeof value === "number" && Number.isFinite(value) ? value : null;
+  const runtimeWindow = window;
+  const parseMotionValues = (value) => {
+    const record = objectRecord(value);
+    if (!record) return null;
+    const parsed = {};
+    for (const key of ["x", "y", "scale", "rotation", "opacity", "autoAlpha"]) {
+      const next = finiteNumber(record[key]);
+      if (next != null) parsed[key] = next;
+    }
+    return Object.keys(parsed).length > 0 ? parsed : null;
+  };
+  const parseCustomEase = (value) => {
+    const record = objectRecord(value);
+    if (!record) return null;
+    const id = typeof record.id === "string" ? record.id.trim() : "";
+    const data = typeof record.data === "string" ? record.data.trim() : "";
+    if (!id || !data) return null;
+    return { id, data };
+  };
+  const parsedManifest = (() => {
+    try {
+      return objectRecord(JSON.parse(manifestContent));
+    } catch {
+      return null;
+    }
+  })();
+  const manifestMotions = Array.isArray(parsedManifest?.motions) ? parsedManifest.motions : [];
+  const sourceFileForElement = (element) => {
+    let current = element;
+    while (current) {
+      const sourceFile = current.getAttribute("data-composition-file") ?? current.getAttribute("data-composition-src");
+      if (sourceFile) return sourceFile;
+      current = current.parentElement;
+    }
+    return activeCompositionPath ?? "index.html";
+  };
+  const elementMatchesSourceFile = (element, sourceFile) => sourceFileForElement(element) === sourceFile;
+  const isHTMLElement2 = (element) => element instanceof HTMLElement;
+  const querySelectorCandidates = (selector) => {
+    const className = selector.match(/^\.([A-Za-z0-9_-]+)$/)?.[1];
+    if (className) {
+      return Array.from(document.getElementsByTagName("*")).filter(
+        (element) => isHTMLElement2(element) && element.classList.contains(className)
+      );
+    }
+    if (/^[A-Za-z][A-Za-z0-9-]*$/.test(selector)) {
+      return Array.from(document.getElementsByTagName(selector)).filter(isHTMLElement2);
+    }
+    return Array.from(document.querySelectorAll(selector)).filter(isHTMLElement2);
+  };
+  const resolveTarget = (targetRecord) => {
+    const sourceFile = typeof targetRecord.sourceFile === "string" ? targetRecord.sourceFile : "";
+    if (!sourceFile) return null;
+    const id = typeof targetRecord.id === "string" ? targetRecord.id : "";
+    if (id) {
+      const byId = document.getElementById(id);
+      if (isHTMLElement2(byId) && elementMatchesSourceFile(byId, sourceFile)) return byId;
+    }
+    const selector = typeof targetRecord.selector === "string" ? targetRecord.selector : "";
+    if (!selector) return null;
+    try {
+      const selectorIndex = Math.max(0, Math.floor(finiteNumber(targetRecord.selectorIndex) ?? 0));
+      return querySelectorCandidates(selector).filter(
+        (element) => elementMatchesSourceFile(element, sourceFile)
+      )[selectorIndex] ?? null;
+    } catch {
+      return null;
+    }
+  };
+  const restoreElement = (element) => {
+    runtimeWindow.gsap?.set?.(element, { clearProps: "transform,opacity,visibility" });
+    element.style.transform = element.getAttribute(ORIGINAL_TRANSFORM_ATTR) ?? "";
+    element.style.opacity = element.getAttribute(ORIGINAL_OPACITY_ATTR) ?? "";
+    element.style.visibility = element.getAttribute(ORIGINAL_VISIBILITY_ATTR) ?? "";
+    element.removeAttribute(STUDIO_MOTION_ATTR);
+    element.removeAttribute(ORIGINAL_TRANSFORM_ATTR);
+    element.removeAttribute(ORIGINAL_OPACITY_ATTR);
+    element.removeAttribute(ORIGINAL_VISIBILITY_ATTR);
+  };
+  const restoreStudioMotionElements = () => {
+    for (const element of Array.from(document.querySelectorAll(`[${STUDIO_MOTION_ATTR}]`))) {
+      if (isHTMLElement2(element)) restoreElement(element);
+    }
+  };
+  const readCurrentTime = () => {
+    try {
+      const playerTime = runtimeWindow.__player?.getTime?.();
+      if (typeof playerTime === "number" && Number.isFinite(playerTime)) {
+        return Math.max(0, playerTime);
+      }
+    } catch {
+    }
+    try {
+      const timelineTime = runtimeWindow.__timeline?.time?.();
+      if (typeof timelineTime === "number" && Number.isFinite(timelineTime)) {
+        return Math.max(0, timelineTime);
+      }
+    } catch {
+    }
+    return 0;
+  };
+  const resolveEase = (motion) => {
+    const fallback = typeof motion.ease === "string" && motion.ease.trim() ? motion.ease.trim() : "none";
+    const customEase = parseCustomEase(motion.customEase);
+    const customEasePlugin = runtimeWindow.CustomEase;
+    if (!customEase || typeof customEasePlugin?.create !== "function") return fallback;
+    try {
+      runtimeWindow.gsap?.registerPlugin?.(customEasePlugin);
+      customEasePlugin.create(customEase.id, customEase.data);
+      return customEase.id;
+    } catch {
+      return fallback;
+    }
+  };
+  const applyManifest = () => {
+    runtimeWindow.__timelines = runtimeWindow.__timelines ?? {};
+    runtimeWindow.__timelines[STUDIO_MOTION_TIMELINE_ID]?.kill?.();
+    delete runtimeWindow.__timelines[STUDIO_MOTION_TIMELINE_ID];
+    restoreStudioMotionElements();
+    const gsap = runtimeWindow.gsap;
+    if (!gsap?.timeline || manifestMotions.length === 0) return 0;
+    const timeline = gsap.timeline({ paused: true, defaults: { overwrite: "auto" } });
+    let applied = 0;
+    for (const motionValue of manifestMotions) {
+      const motion = objectRecord(motionValue);
+      if (!motion || motion.kind !== "gsap-motion") continue;
+      const targetRecord = objectRecord(motion.target);
+      if (!targetRecord) continue;
+      const target = resolveTarget(targetRecord);
+      if (!target || typeof timeline.fromTo !== "function") continue;
+      const start = finiteNumber(motion.start);
+      const duration = finiteNumber(motion.duration);
+      if (start == null || duration == null || start < 0 || duration <= 0) continue;
+      const from = parseMotionValues(motion.from);
+      const to = parseMotionValues(motion.to);
+      if (!from || !to) continue;
+      if (!target.hasAttribute(STUDIO_MOTION_ATTR)) {
+        target.setAttribute(ORIGINAL_TRANSFORM_ATTR, target.style.transform);
+        target.setAttribute(ORIGINAL_OPACITY_ATTR, target.style.opacity);
+        target.setAttribute(ORIGINAL_VISIBILITY_ATTR, target.style.visibility);
+      }
+      target.setAttribute(STUDIO_MOTION_ATTR, "true");
+      timeline.fromTo(
+        target,
+        from,
+        { ...to, duration, ease: resolveEase(motion), overwrite: "auto", immediateRender: false },
+        start
+      );
+      applied += 1;
+    }
+    if (applied === 0) {
+      timeline.kill?.();
+      return 0;
+    }
+    runtimeWindow.__timelines[STUDIO_MOTION_TIMELINE_ID] = timeline;
+    timeline.pause?.();
+    const currentTime = readCurrentTime();
+    if (typeof timeline.totalTime === "function") timeline.totalTime(currentTime, false);
+    else timeline.time?.(currentTime);
+    return applied;
+  };
+  runtimeWindow.__hfStudioMotionApply = applyManifest;
+  applyManifest();
+}
+
+// src/routes/preview.ts
+import { ensureHfIds as ensureHfIds2 } from "@hyperframes/parsers/hf-ids";
+
+// src/helpers/hfIdPersist.ts
+import { ensureHfIds } from "@hyperframes/parsers/hf-ids";
+import { readFileSync as readFileSync6, writeFileSync as writeFileSync5 } from "fs";
+function persistHfIdsIfNeeded(filePath, html) {
+  const normalized = ensureHfIds(html);
+  const idsBefore = (html.match(/\bdata-hf-id=/g) ?? []).length;
+  const idsAfter = (normalized.match(/\bdata-hf-id=/g) ?? []).length;
+  if (idsAfter > idsBefore) {
+    try {
+      const current = readFileSync6(filePath, "utf-8");
+      if (current === html) {
+        writeFileSync5(filePath, normalized, "utf-8");
+      }
+    } catch (err) {
+      console.warn("[hyperframes] persistHfIdsIfNeeded: failed to write ids to disk:", err);
+    }
+  }
+  return normalized;
+}
+
+// src/routes/preview.ts
+var PROJECT_SIGNATURE_META = "hyperframes-project-signature";
+var GSAP_CDN_VERSION = "3.15.0";
+var GSAP_CDN_SCRIPT = `<script src="https://cdn.jsdelivr.net/npm/gsap@${GSAP_CDN_VERSION}/dist/gsap.min.js"></script>`;
+var GSAP_CUSTOM_EASE_CDN_SCRIPT = `<script src="https://cdn.jsdelivr.net/npm/gsap@${GSAP_CDN_VERSION}/dist/CustomEase.min.js"></script>`;
+var GSAP_MOTION_PATH_CDN_SCRIPT = `<script src="https://cdn.jsdelivr.net/npm/gsap@${GSAP_CDN_VERSION}/dist/MotionPathPlugin.min.js"></script>`;
+function resolveProjectSignature(adapter, projectDir) {
+  return adapter.getProjectSignature?.(projectDir) ?? createProjectSignature(projectDir);
+}
+function injectProjectSignature(html, signature) {
+  const tag = `<meta name="${PROJECT_SIGNATURE_META}" content="${signature}">`;
+  if (html.includes(`name="${PROJECT_SIGNATURE_META}"`)) {
+    return html.replace(
+      new RegExp(`<meta\\s+name=["']${PROJECT_SIGNATURE_META}["'][^>]*>`, "i"),
+      tag
+    );
+  }
+  if (html.includes("</head>")) return html.replace("</head>", `${tag}
+</head>`);
+  return `${tag}
+${html}`;
+}
+function readStudioMotionManifestContent(projectDir) {
+  const manifestPath = join8(projectDir, STUDIO_MOTION_PATH);
+  if (!existsSync5(manifestPath)) return "";
+  try {
+    return readFileSync7(manifestPath, "utf-8");
+  } catch {
+    return "";
+  }
+}
+function parseStudioMotionManifestContent(content) {
+  try {
+    const parsed = JSON.parse(content);
+    const motions = Array.isArray(parsed.motions) ? parsed.motions : [];
+    return {
+      hasMotion: motions.length > 0,
+      hasCustomEase: motions.some((motion) => Boolean(motion?.customEase))
+    };
+  } catch {
+    return { hasMotion: false, hasCustomEase: false };
+  }
+}
+function injectScriptTagIntoHead(html, scriptTag) {
+  if (html.includes("</head>")) return html.replace("</head>", `${scriptTag}
+</head>`);
+  return `${scriptTag}
+${html}`;
+}
+function htmlHasGsap(html) {
+  const outsideTemplates = html.replace(/<template\b[^>]*>[\s\S]*?<\/template>/gi, "");
+  return /<script\b[^>]*src=["'][^"']*gsap/i.test(outsideTemplates) || /\/\*\s*inlined:.*gsap/i.test(outsideTemplates) || /\b(GreenSock|_gsScope)\b/.test(outsideTemplates) || /\bgsap\.(config|defaults|registerPlugin|version)\b/.test(outsideTemplates);
+}
+function htmlHasCustomEase(html) {
+  return /<script\b[^>]*src=["'][^"']*CustomEase/i.test(html) || /\bwindow\.CustomEase\b/.test(html) || /\bCustomEase\s*=\s*/.test(html);
+}
+function htmlUsesMotionPath(html) {
+  return /motionPath\s*[:{]/.test(html);
+}
+function htmlHasMotionPathPlugin(html) {
+  return /<script\b[^>]*src=["'][^"']*MotionPathPlugin/i.test(html) || /\bwindow\.MotionPathPlugin\b/.test(html) || /\bMotionPathPlugin\s*=\s*/.test(html);
+}
+function injectMotionPathPluginIfNeeded(html) {
+  if (!htmlUsesMotionPath(html) || htmlHasMotionPathPlugin(html)) return html;
+  const gsapScript = /<script\b[^>]*\bsrc=["'][^"']*\/gsap(\.min)?\.js["'][^>]*>\s*<\/script>/i;
+  const match = html.match(gsapScript);
+  if (match) {
+    const version = match[0].match(/gsap@([\d.]+)/)?.[1] ?? GSAP_CDN_VERSION;
+    const pluginTag = `<script src="https://cdn.jsdelivr.net/npm/gsap@${version}/dist/MotionPathPlugin.min.js"></script>`;
+    const end = html.indexOf(match[0]) + match[0].length;
+    return html.slice(0, end) + "\n" + pluginTag + html.slice(end);
+  }
+  return injectScriptTagIntoHead(html, GSAP_MOTION_PATH_CDN_SCRIPT);
+}
+function injectStudioMotionDependencies(html, manifestContent) {
+  const manifest = parseStudioMotionManifestContent(manifestContent);
+  if (!manifest.hasMotion) return html;
+  let next = html;
+  if (!htmlHasGsap(next)) next = injectScriptTagIntoHead(next, GSAP_CDN_SCRIPT);
+  if (manifest.hasCustomEase && !htmlHasCustomEase(next)) {
+    next = injectScriptTagIntoHead(next, GSAP_CUSTOM_EASE_CDN_SCRIPT);
+  }
+  return next;
+}
+function injectStudioMotionScript(html, projectDir, activeCompositionPath) {
+  const manifestContent = readStudioMotionManifestContent(projectDir);
+  const script = createStudioMotionRenderBodyScript(manifestContent, {
+    activeCompositionPath
+  });
+  if (!script) return html;
+  return injectScriptsIntoHtml(
+    injectStudioMotionDependencies(html, manifestContent),
+    [],
+    [script],
+    false
+  );
+}
+var GSAP_CDN_FALLBACK_SCRIPT = `<script data-hf-gsap-fallback>
+(function(){
+  var cdnBase="https://cdn.jsdelivr.net/npm/gsap@${GSAP_CDN_VERSION}/dist/";
+  var loaded={};
+  function loadFallback(file){
+    if(loaded[file])return loaded[file];
+    return loaded[file]=new Promise(function(ok,fail){
+      var s=document.createElement("script");
+      s.src=cdnBase+file;s.onload=ok;s.onerror=fail;
+      document.head.appendChild(s);
+    });
+  }
+  document.addEventListener("error",function(e){
+    var t=e.target;
+    if(!t||t.tagName!=="SCRIPT"||!t.src)return;
+    var m=t.src.match(/gsap[^/]*\\/dist\\/(.+\\.js)/);
+    if(m)loadFallback(m[1]);
+  },true);
+})();
+</script>`;
+function injectGsapCdnFallback(html) {
+  if (html.includes("data-hf-gsap-fallback")) return html;
+  if (html.includes("<head>")) return html.replace("<head>", "<head>" + GSAP_CDN_FALLBACK_SCRIPT);
+  return GSAP_CDN_FALLBACK_SCRIPT + html;
+}
+function injectStudioPreviewAugmentations(html, adapter, projectDir, activeCompositionPath) {
+  return injectStudioMotionScript(
+    injectMotionPathPluginIfNeeded(
+      injectGsapCdnFallback(
+        injectProjectSignature(html, resolveProjectSignature(adapter, projectDir))
+      )
+    ),
+    projectDir,
+    activeCompositionPath
+  );
+}
+async function transformPreviewHtml(html, adapter, project, activeCompositionPath) {
+  if (!adapter.transformPreviewHtml) return html;
+  try {
+    return await adapter.transformPreviewHtml({
+      html,
+      project,
+      activeCompositionPath
+    });
+  } catch (err) {
+    console.warn("[Studio] preview transform failed, using original HTML:", err);
+    return html;
+  }
+}
+function resolveProjectMainHtml(projectDir, projectId) {
+  const indexPath = join8(projectDir, "index.html");
+  if (existsSync5(indexPath)) {
+    return { html: readFileSync7(indexPath, "utf-8"), compositionPath: "index.html" };
+  }
+  const blockHtmlPath = join8(projectDir, `${projectId}.html`);
+  if (existsSync5(blockHtmlPath)) {
+    return { html: readFileSync7(blockHtmlPath, "utf-8"), compositionPath: `${projectId}.html` };
+  }
+  return null;
+}
+function registerPreviewRoutes(api, adapter) {
+  const previewCacheHeaders = (etag) => ({
+    "Cache-Control": "private, no-cache",
+    ETag: etag
+  });
+  api.get("/projects/:id/preview", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    const signature = resolveProjectSignature(adapter, project.dir);
+    const etag = `"preview:${signature}"`;
+    const ifNoneMatch = c.req.header("If-None-Match");
+    if (ifNoneMatch === etag) {
+      return new Response(null, { status: 304, headers: previewCacheHeaders(etag) });
+    }
+    const diskMain = resolveProjectMainHtml(project.dir, project.id);
+    const normalizedDisk = diskMain ? persistHfIdsIfNeeded(join8(project.dir, diskMain.compositionPath), diskMain.html) : null;
+    try {
+      let bundled = await adapter.bundle(project.dir);
+      let mainCompositionPath = "index.html";
+      if (!bundled) {
+        if (!diskMain) return c.text("not found", 404);
+        bundled = stripEmbeddedRuntimeScripts2(normalizedDisk ?? diskMain.html);
+        mainCompositionPath = diskMain.compositionPath;
+      }
+      if (!bundled.includes("hyperframe.runtime") && !bundled.includes("hyperframes-preview-runtime")) {
+        const runtimeTag = `<script src="${adapter.runtimeUrl}"></script>`;
+        bundled = bundled.includes("</body>") ? bundled.replace("</body>", `${runtimeTag}
+</body>`) : bundled + `
+${runtimeTag}`;
+      }
+      const baseHref = `/api/projects/${project.id}/preview/`;
+      if (!bundled.includes("<base")) {
+        bundled = bundled.replace(/<head>/i, `<head><base href="${baseHref}">`);
+      }
+      bundled = injectStudioPreviewAugmentations(
+        ensureHfIds2(await transformPreviewHtml(bundled, adapter, project, mainCompositionPath)),
+        adapter,
+        project.dir,
+        mainCompositionPath
+      );
+      return c.html(bundled, 200, previewCacheHeaders(etag));
+    } catch {
+      const fallback = resolveProjectMainHtml(project.dir, project.id);
+      if (fallback) {
+        const fallbackHtml = persistHfIdsIfNeeded(
+          join8(project.dir, fallback.compositionPath),
+          fallback.html
+        );
+        return c.html(
+          injectStudioPreviewAugmentations(
+            await transformPreviewHtml(fallbackHtml, adapter, project, fallback.compositionPath),
+            adapter,
+            project.dir,
+            fallback.compositionPath
+          ),
+          200,
+          previewCacheHeaders(etag)
+        );
+      }
+      return c.text("not found", 404);
+    }
+  });
+  api.get("/projects/:id/preview/comp/*", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    const signature = resolveProjectSignature(adapter, project.dir);
+    const compPath = decodeURIComponent(
+      c.req.path.replace(`/projects/${project.id}/preview/comp/`, "").split("?")[0] ?? ""
+    );
+    const compFile = resolveWithinProject(project.dir, compPath);
+    if (!compFile || !existsSync5(compFile) || !statSync2(compFile).isFile()) {
+      return c.text("not found", 404);
+    }
+    const etag = `"comp:${compPath}:${signature}"`;
+    const ifNoneMatch = c.req.header("If-None-Match");
+    if (ifNoneMatch === etag) {
+      return new Response(null, { status: 304, headers: previewCacheHeaders(etag) });
+    }
+    const baseHref = `/api/projects/${project.id}/preview/`;
+    let html = buildSubCompositionHtml(project.dir, compPath, adapter.runtimeUrl, baseHref);
+    if (!html) return c.text("not found", 404);
+    html = ensureHfIds2(await transformPreviewHtml(html, adapter, project, compPath));
+    return c.html(
+      injectStudioPreviewAugmentations(html, adapter, project.dir, compPath),
+      200,
+      previewCacheHeaders(etag)
+    );
+  });
+  api.get("/projects/:id/preview/*", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    const subPath = decodeURIComponent(
+      c.req.path.replace(`/projects/${project.id}/preview/`, "").split("?")[0] ?? ""
+    );
+    const file = resolveWithinProject(project.dir, subPath);
+    if (!file) {
+      return c.text("not found", 404);
+    }
+    const stat = existsSync5(file) ? statSync2(file) : null;
+    if (!stat?.isFile()) {
+      return c.text("not found", 404);
+    }
+    const contentType = getMimeType(subPath);
+    const isText = /\.(html|css|js|json|svg|txt|md|cube)$/i.test(subPath);
+    const etag = `"${stat.mtimeMs.toString(36)}-${stat.size.toString(36)}"`;
+    const cacheHeaders = isText ? { "Cache-Control": "no-store" } : { "Cache-Control": "private, max-age=3600, must-revalidate", ETag: etag };
+    if (!isText) {
+      const ifNoneMatch = c.req.header("If-None-Match");
+      if (ifNoneMatch === etag) {
+        return new Response(null, { status: 304, headers: cacheHeaders });
+      }
+    }
+    const buffer = isText ? Buffer.from(readFileSync7(file, "utf-8"), "utf-8") : readFileSync7(file);
+    const totalSize = buffer.length;
+    const rangeHeader = c.req.header("Range");
+    if (rangeHeader) {
+      const match = /bytes=(\d+)-(\d*)/.exec(rangeHeader);
+      if (match) {
+        const start = parseInt(match[1], 10);
+        const end = match[2] ? parseInt(match[2], 10) : totalSize - 1;
+        const safeEnd = Math.min(end, totalSize - 1);
+        const chunkSize = safeEnd - start + 1;
+        return new Response(new Uint8Array(buffer.slice(start, safeEnd + 1)), {
+          status: 206,
+          headers: {
+            ...cacheHeaders,
+            "Content-Type": contentType,
+            "Content-Range": `bytes ${start}-${safeEnd}/${totalSize}`,
+            "Accept-Ranges": "bytes",
+            "Content-Length": String(chunkSize)
+          }
+        });
+      }
+    }
+    return new Response(new Uint8Array(buffer), {
+      headers: {
+        ...cacheHeaders,
+        "Content-Type": contentType,
+        "Accept-Ranges": "bytes",
+        "Content-Length": String(totalSize)
+      }
+    });
+  });
+}
+
+// src/routes/lint.ts
+import { readFileSync as readFileSync8 } from "fs";
+import { join as join9 } from "path";
+function registerLintRoutes(api, adapter) {
+  api.get("/projects/:id/lint", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    try {
+      const htmlFiles = walkDir(project.dir).filter(
+        (f) => f.endsWith(".html") && !isInHiddenOrVendorDir(f)
+      );
+      const allFindings = [];
+      for (const file of htmlFiles) {
+        const content = readFileSync8(join9(project.dir, file), "utf-8");
+        const result = await adapter.lint(content, { filePath: file });
+        if (result?.findings) {
+          for (const f of result.findings) {
+            allFindings.push({ ...f, file });
+          }
+        }
+      }
+      return c.json({ findings: allFindings });
+    } catch (err) {
+      const msg = err instanceof Error ? err.message : String(err);
+      return c.json({ error: `Lint failed: ${msg}` }, 500);
+    }
+  });
+}
+
+// src/routes/render.ts
+import { streamSSE } from "hono/streaming";
+import { existsSync as existsSync6, readFileSync as readFileSync9, mkdirSync as mkdirSync4, unlinkSync as unlinkSync3, readdirSync as readdirSync5, statSync as statSync3 } from "fs";
+import { join as join10 } from "path";
+import { VALID_CANVAS_RESOLUTIONS } from "@hyperframes/parsers";
+import { parseFps } from "@hyperframes/core";
+var VALID_RESOLUTIONS = new Set(VALID_CANVAS_RESOLUTIONS);
+function registerRenderRoutes(api, adapter) {
+  const renderJobs = /* @__PURE__ */ new Map();
+  const TTL_MS = 3e5;
+  const CLEANUP_INTERVAL_MS = 6e4;
+  let cleanupTimer = null;
+  const cleanupEnabled = () => typeof process !== "undefined" && process.env.NODE_ENV !== "production" && !process.argv.includes("build");
+  const cleanupFinishedJobs = () => {
+    const now = Date.now();
+    for (const [key, job] of renderJobs) {
+      if ((job.status === "complete" || job.status === "failed") && now - job.createdAt > TTL_MS) {
+        renderJobs.delete(key);
+      }
+    }
+    if (renderJobs.size === 0 && cleanupTimer) {
+      clearInterval(cleanupTimer);
+      cleanupTimer = null;
+    }
+  };
+  const ensureCleanupTimer = () => {
+    if (cleanupTimer || !cleanupEnabled()) return;
+    cleanupTimer = setInterval(cleanupFinishedJobs, CLEANUP_INTERVAL_MS);
+    if (typeof cleanupTimer === "object" && "unref" in cleanupTimer) {
+      cleanupTimer.unref();
+    }
+  };
+  ensureCleanupTimer();
+  api.post("/projects/:id/render", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    const body = await c.req.json().catch(() => ({}));
+    const VALID_FORMATS = /* @__PURE__ */ new Set(["mp4", "webm", "mov"]);
+    const FORMAT_EXT = { mp4: ".mp4", webm: ".webm", mov: ".mov" };
+    const format = VALID_FORMATS.has(body.format ?? "") ? body.format : "mp4";
+    const fpsParse = body.fps === void 0 ? null : parseFps(body.fps);
+    const fps = fpsParse && fpsParse.ok ? fpsParse.value : { num: 30, den: 1 };
+    const quality = ["draft", "standard", "high"].includes(body.quality ?? "") ? body.quality : "standard";
+    const outputResolution = VALID_RESOLUTIONS.has(body.resolution ?? "") ? body.resolution : void 0;
+    let composition;
+    if (typeof body.composition === "string" && body.composition.length > 0) {
+      if (!resolveWithinProject(project.dir, body.composition)) {
+        return c.json({ error: "composition path must be within the project directory" }, 400);
+      }
+      composition = body.composition;
+    }
+    const now = /* @__PURE__ */ new Date();
+    const datePart = now.toISOString().slice(0, 10);
+    const timePart = now.toTimeString().slice(0, 8).replace(/:/g, "-");
+    const jobId = `${project.id}_${datePart}_${timePart}`;
+    const rendersDir = adapter.rendersDir(project);
+    if (!existsSync6(rendersDir)) mkdirSync4(rendersDir, { recursive: true });
+    const ext = FORMAT_EXT[format] ?? ".mp4";
+    const outputPath = join10(rendersDir, `${jobId}${ext}`);
+    const jobState = adapter.startRender({
+      project,
+      outputPath,
+      format,
+      fps,
+      quality,
+      jobId,
+      outputResolution,
+      composition,
+      distinctId: typeof body.telemetryDistinctId === "string" ? body.telemetryDistinctId : void 0
+    });
+    jobState.createdAt = Date.now();
+    renderJobs.set(jobId, jobState);
+    ensureCleanupTimer();
+    return c.json({ jobId, status: "rendering" });
+  });
+  api.get("/render/:jobId/progress", (c) => {
+    const { jobId } = c.req.param();
+    const job = renderJobs.get(jobId);
+    if (!job) return c.json({ error: "not found" }, 404);
+    return streamSSE(c, async (stream) => {
+      while (true) {
+        const current = renderJobs.get(jobId);
+        if (!current) break;
+        await stream.writeSSE({
+          event: "progress",
+          data: JSON.stringify({
+            progress: current.progress,
+            status: current.status,
+            stage: current.stage,
+            error: current.error
+          })
+        });
+        if (current.status === "complete" || current.status === "failed") break;
+        await stream.sleep(500);
+      }
+    });
+  });
+  const RENDER_MIME = {
+    ".mp4": "video/mp4",
+    ".webm": "video/webm",
+    ".mov": "video/quicktime"
+  };
+  const RENDER_EXTENSIONS = Object.keys(RENDER_MIME);
+  function renderContentType(filePath) {
+    const ext = RENDER_EXTENSIONS.find((e) => filePath.endsWith(e));
+    return (ext && RENDER_MIME[ext]) ?? "video/mp4";
+  }
+  api.get("/render/:jobId/view", (c) => {
+    const { jobId } = c.req.param();
+    const job = renderJobs.get(jobId);
+    if (!job?.outputPath || !existsSync6(job.outputPath)) {
+      return c.json({ error: "not found" }, 404);
+    }
+    const contentType = renderContentType(job.outputPath);
+    const filename = job.outputPath.split("/").pop() ?? `render.mp4`;
+    const content = readFileSync9(job.outputPath);
+    return new Response(content, {
+      headers: {
+        "Content-Type": contentType,
+        "Content-Disposition": `inline; filename="${filename}"`,
+        "Accept-Ranges": "bytes",
+        "Content-Length": String(content.length)
+      }
+    });
+  });
+  api.get("/render/:jobId/download", (c) => {
+    const { jobId } = c.req.param();
+    const job = renderJobs.get(jobId);
+    if (!job?.outputPath || !existsSync6(job.outputPath)) {
+      return c.json({ error: "not found" }, 404);
+    }
+    const contentType = renderContentType(job.outputPath);
+    const filename = job.outputPath.split("/").pop() ?? `render.mp4`;
+    const content = readFileSync9(job.outputPath);
+    return new Response(content, {
+      headers: {
+        "Content-Type": contentType,
+        "Content-Disposition": `attachment; filename="${filename}"`
+      }
+    });
+  });
+  api.delete("/render/:jobId", (c) => {
+    const { jobId } = c.req.param();
+    for (const [, state] of renderJobs) {
+      if (state.id === jobId && state.outputPath) {
+        const dir = state.outputPath.replace(/\/[^/]+$/, "");
+        for (const ext of [".mp4", ".webm", ".mov", ".meta.json"]) {
+          const fp = join10(dir, `${jobId}${ext}`);
+          if (existsSync6(fp)) unlinkSync3(fp);
+        }
+        break;
+      }
+    }
+    renderJobs.delete(jobId);
+    return c.json({ deleted: true });
+  });
+  api.get("/projects/:id/renders/file/*", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    const filename = c.req.path.split("/renders/file/")[1];
+    if (!filename) return c.json({ error: "missing filename" }, 400);
+    const rendersDir = adapter.rendersDir(project);
+    const fp = resolveWithinProject(rendersDir, filename);
+    if (!fp) return c.json({ error: "forbidden" }, 403);
+    if (!existsSync6(fp)) return c.json({ error: "not found" }, 404);
+    const contentType = renderContentType(fp);
+    const content = readFileSync9(fp);
+    return new Response(content, {
+      headers: {
+        "Content-Type": contentType,
+        "Content-Disposition": `inline; filename="${filename}"`,
+        "Accept-Ranges": "bytes",
+        "Content-Length": String(content.length)
+      }
+    });
+  });
+  api.get("/projects/:id/renders", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    const rendersDir = adapter.rendersDir(project);
+    if (!existsSync6(rendersDir)) return c.json({ renders: [] });
+    const files = readdirSync5(rendersDir).filter((f) => f.endsWith(".mp4") || f.endsWith(".webm") || f.endsWith(".mov")).map((f) => {
+      const fp = join10(rendersDir, f);
+      const stat = statSync3(fp);
+      const rid = f.replace(/\.(mp4|webm|mov)$/, "");
+      const metaPath = join10(rendersDir, `${rid}.meta.json`);
+      let status = "complete";
+      let durationMs;
+      if (existsSync6(metaPath)) {
+        try {
+          const meta = JSON.parse(readFileSync9(metaPath, "utf-8"));
+          if (meta.status === "failed") status = "failed";
+          if (meta.durationMs) durationMs = meta.durationMs;
+        } catch {
+        }
+      }
+      return {
+        id: rid,
+        filename: f,
+        size: stat.size,
+        createdAt: stat.mtimeMs,
+        status,
+        durationMs
+      };
+    }).sort((a, b) => b.createdAt - a.createdAt);
+    for (const file of files) {
+      if (!renderJobs.has(file.id)) {
+        renderJobs.set(file.id, {
+          id: file.id,
+          status: file.status,
+          progress: 100,
+          outputPath: join10(rendersDir, file.filename),
+          createdAt: file.createdAt
+        });
+      }
+    }
+    return c.json({ renders: files });
+  });
+}
+
+// src/routes/thumbnail.ts
+import { existsSync as existsSync7, readFileSync as readFileSync10, writeFileSync as writeFileSync6, mkdirSync as mkdirSync5, statSync as statSync4 } from "fs";
+import { join as join11 } from "path";
+import { createHash as createHash2 } from "crypto";
+
+// src/helpers/manualEditsRenderScript.ts
+var STUDIO_MANUAL_EDITS_PATH = ".hyperframes/studio-manual-edits.json";
+function createStudioManualEditsRenderBodyScript(manifestContent, options = {}) {
+  if (!manifestContent.trim()) return null;
+  return `(${studioManualEditsRenderRuntime.toString()})(${JSON.stringify(manifestContent)}, ${JSON.stringify(options.activeCompositionPath ?? null)});`;
+}
+function createStudioPositionSeekReapplyScript() {
+  return `(${studioPositionSeekReapplyRuntime.toString()})();`;
+}
+function studioPositionSeekReapplyRuntime() {
+  const OFFSET_X_PROP = "--hf-studio-offset-x";
+  const OFFSET_Y_PROP = "--hf-studio-offset-y";
+  const WIDTH_PROP = "--hf-studio-width";
+  const HEIGHT_PROP = "--hf-studio-height";
+  const ROTATION_PROP = "--hf-studio-rotation";
+  const PATH_OFFSET_ATTR = "data-hf-studio-path-offset";
+  const BOX_SIZE_ATTR = "data-hf-studio-box-size";
+  const ROTATION_ATTR = "data-hf-studio-rotation";
+  const ORIGINAL_TRANSLATE_ATTR = "data-hf-studio-original-translate";
+  const ORIGINAL_ROTATE_ATTR = "data-hf-studio-original-rotate";
+  const MOTION_ATTR = "data-hf-studio-motion";
+  const MOTION_TL_KEY = "studio-motion";
+  const WRAPPED_PROP = "__hfStudioPositionSeekReapplyWrapped";
+  if (!document.querySelector("[" + PATH_OFFSET_ATTR + '="true"]') && !document.querySelector("[" + BOX_SIZE_ATTR + '="true"]') && !document.querySelector("[" + ROTATION_ATTR + '="true"]') && !document.querySelector("[" + MOTION_ATTR + "]"))
+    return;
+  const splitTopLevelWhitespace = (value) => {
+    const parts = [];
+    let depth = 0;
+    let current = "";
+    for (const char of value.trim()) {
+      if (char === "(") depth += 1;
+      if (char === ")") depth = Math.max(0, depth - 1);
+      if (/\s/.test(char) && depth === 0) {
+        if (current) parts.push(current);
+        current = "";
+      } else {
+        current += char;
+      }
+    }
+    if (current) parts.push(current);
+    return parts;
+  };
+  const composeTranslate = (element, x, y) => {
+    const original = element.getAttribute(ORIGINAL_TRANSLATE_ATTR)?.trim();
+    if (!original || original === "none") return x + " " + y;
+    const parts = splitTopLevelWhitespace(original);
+    if (parts.length === 1) return "calc(" + parts[0] + " + " + x + ") " + y;
+    if (parts.length >= 2) {
+      const z = parts.length >= 3 ? " " + parts[2] : "";
+      return "calc(" + parts[0] + " + " + x + ") calc(" + parts[1] + " + " + y + ")" + z;
+    }
+    return x + " " + y;
+  };
+  const isSimpleRotateAngle = (value) => /^-?(?:\d+(?:\.\d+)?|\.\d+)(?:deg|rad|turn|grad)$/.test(value.trim());
+  const composeRotation = (element, rotationValue) => {
+    const original = element.getAttribute(ORIGINAL_ROTATE_ATTR)?.trim();
+    if (!original || original === "none" || !isSimpleRotateAngle(original)) return rotationValue;
+    return "calc(" + original + " + " + rotationValue + ")";
+  };
+  let lastSeekTime = 0;
+  let cachedMotionKey = "";
+  const finiteNum = (v) => typeof v === "number" && Number.isFinite(v) ? v : null;
+  const computeMotionKey = (motionEls) => {
+    let key = "";
+    for (let i = 0; i < motionEls.length; i++) {
+      const json = motionEls[i].getAttribute?.(MOTION_ATTR);
+      if (json) key += (key ? "\n" : "") + json;
+    }
+    return key;
+  };
+  const reapplyMotionTimeline = () => {
+    const motionEls = document.querySelectorAll("[" + MOTION_ATTR + "]");
+    if (motionEls.length === 0) {
+      cachedMotionKey = "";
+      return;
+    }
+    const win = window;
+    const gsap = win.gsap;
+    if (!gsap || typeof gsap.timeline !== "function") return;
+    win.__timelines = win.__timelines || {};
+    const motionKey = computeMotionKey(motionEls);
+    const existing = win.__timelines[MOTION_TL_KEY];
+    if (motionKey && motionKey === cachedMotionKey && existing && typeof existing.totalTime === "function") {
+      existing.totalTime(lastSeekTime, false);
+      return;
+    }
+    if (existing && typeof existing.kill === "function") existing.kill();
+    const tl = gsap.timeline({ paused: true, defaults: { overwrite: "auto" } });
+    const fromTo = tl.fromTo;
+    if (typeof fromTo !== "function") return;
+    let applied = 0;
+    for (let i = 0; i < motionEls.length; i++) {
+      const el = motionEls[i];
+      if (!(el instanceof HTMLElement)) continue;
+      const json = el.getAttribute(MOTION_ATTR);
+      if (!json) continue;
+      try {
+        const m = JSON.parse(json);
+        const start = finiteNum(m.start);
+        const duration = finiteNum(m.duration);
+        if (start == null || duration == null || duration <= 0) continue;
+        const ease = typeof m.ease === "string" ? m.ease : "none";
+        const from = m.from && typeof m.from === "object" ? m.from : {};
+        const to = m.to && typeof m.to === "object" ? m.to : {};
+        const customEase = m.customEase;
+        let resolvedEase = ease;
+        if (customEase?.id && customEase?.data && win.CustomEase?.create) {
+          try {
+            gsap.registerPlugin?.(win.CustomEase);
+            win.CustomEase.create(customEase.id, customEase.data);
+            resolvedEase = customEase.id;
+          } catch {
+          }
+        }
+        fromTo.call(
+          tl,
+          el,
+          { ...from },
+          { ...to, duration, ease: resolvedEase, overwrite: "auto", immediateRender: false },
+          start
+        );
+        applied += 1;
+      } catch {
+      }
+    }
+    if (applied === 0) {
+      cachedMotionKey = "";
+      if (typeof tl.kill === "function")
+        tl.kill();
+      return;
+    }
+    cachedMotionKey = motionKey;
+    win.__timelines[MOTION_TL_KEY] = tl;
+    if (typeof tl.pause === "function") tl.pause();
+    if (typeof tl.totalTime === "function")
+      tl.totalTime(lastSeekTime, false);
+  };
+  const stripGsapTranslateFromTransform = (el) => {
+    const transform = el.style.getPropertyValue("transform");
+    if (!transform || transform === "none") return;
+    const win = el.ownerDocument.defaultView;
+    const MatrixCtor = win?.DOMMatrix;
+    if (!MatrixCtor) return;
+    try {
+      const m = new MatrixCtor(transform);
+      if (m.m41 === 0 && m.m42 === 0) return;
+      m.m41 = 0;
+      m.m42 = 0;
+      if (m.is2D && m.a === 1 && m.b === 0 && m.c === 0 && m.d === 1) {
+        el.style.removeProperty("transform");
+      } else {
+        el.style.setProperty("transform", m.toString());
+      }
+    } catch {
+    }
+  };
+  const reapplyAll = () => {
+    const offsetEls = document.querySelectorAll("[" + PATH_OFFSET_ATTR + '="true"]');
+    for (let i = 0; i < offsetEls.length; i++) {
+      const el = offsetEls[i];
+      if (!(el instanceof HTMLElement)) continue;
+      const x = el.style.getPropertyValue(OFFSET_X_PROP);
+      const y = el.style.getPropertyValue(OFFSET_Y_PROP);
+      if (x || y) {
+        el.style.setProperty(
+          "translate",
+          composeTranslate(
+            el,
+            "var(" + OFFSET_X_PROP + ", 0px)",
+            "var(" + OFFSET_Y_PROP + ", 0px)"
+          )
+        );
+        stripGsapTranslateFromTransform(el);
+      }
+    }
+    const boxSizeEls = document.querySelectorAll("[" + BOX_SIZE_ATTR + '="true"]');
+    for (let i = 0; i < boxSizeEls.length; i++) {
+      const el = boxSizeEls[i];
+      if (!(el instanceof HTMLElement)) continue;
+      const w = el.style.getPropertyValue(WIDTH_PROP);
+      const h = el.style.getPropertyValue(HEIGHT_PROP);
+      if (w) el.style.setProperty("width", w);
+      if (h) el.style.setProperty("height", h);
+    }
+    const rotEls = document.querySelectorAll("[" + ROTATION_ATTR + '="true"]');
+    for (let i = 0; i < rotEls.length; i++) {
+      const el = rotEls[i];
+      if (!(el instanceof HTMLElement)) continue;
+      const rot = el.style.getPropertyValue(ROTATION_PROP);
+      if (rot) {
+        el.style.setProperty("rotate", composeRotation(el, "var(" + ROTATION_PROP + ", 0deg)"));
+        stripGsapTranslateFromTransform(el);
+      }
+    }
+    reapplyMotionTimeline();
+  };
+  const runtimeWindow = window;
+  const isWrapped = (fn) => Boolean(fn[WRAPPED_PROP]);
+  const markWrapped = (fn) => {
+    try {
+      Object.defineProperty(fn, WRAPPED_PROP, {
+        configurable: false,
+        enumerable: false,
+        value: true
+      });
+    } catch {
+      try {
+        fn[WRAPPED_PROP] = true;
+      } catch {
+      }
+    }
+  };
+  const wrapFn = (get, set) => {
+    const fn = get();
+    if (typeof fn !== "function") return false;
+    const seek = fn;
+    if (isWrapped(seek)) {
+      reapplyAll();
+      return true;
+    }
+    const wrapped = function(time) {
+      lastSeekTime = typeof time === "number" && Number.isFinite(time) ? Math.max(0, time) : 0;
+      const result = seek.call(this, time);
+      reapplyAll();
+      return result;
+    };
+    markWrapped(wrapped);
+    set(wrapped);
+    reapplyAll();
+    return true;
+  };
+  const wrapSeekFunctions = () => {
+    const a = wrapFn(
+      () => runtimeWindow.__hf?.["seek"],
+      (fn) => {
+        if (runtimeWindow.__hf) runtimeWindow.__hf["seek"] = fn;
+      }
+    );
+    const b = wrapFn(
+      () => runtimeWindow.__player?.["renderSeek"],
+      (fn) => {
+        if (runtimeWindow.__player) runtimeWindow.__player["renderSeek"] = fn;
+      }
+    );
+    return a || b;
+  };
+  const installSeekTrap = (obj, key, getter, setter) => {
+    if (!obj) return;
+    try {
+      let current = obj[key];
+      Object.defineProperty(obj, key, {
+        configurable: true,
+        enumerable: true,
+        get() {
+          return current;
+        },
+        set(value) {
+          current = value;
+          if (typeof value === "function" && !isWrapped(value)) {
+            wrapFn(getter, setter);
+          }
+        }
+      });
+    } catch {
+    }
+  };
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", () => reapplyAll(), { once: true });
+  } else {
+    reapplyAll();
+  }
+  wrapSeekFunctions();
+  installSeekTrap(
+    runtimeWindow.__hf,
+    "seek",
+    () => runtimeWindow.__hf?.["seek"],
+    (fn) => {
+      if (runtimeWindow.__hf) runtimeWindow.__hf["seek"] = fn;
+    }
+  );
+  installSeekTrap(
+    runtimeWindow.__player,
+    "renderSeek",
+    () => runtimeWindow.__player?.["renderSeek"],
+    (fn) => {
+      if (runtimeWindow.__player) runtimeWindow.__player["renderSeek"] = fn;
+    }
+  );
+  let remaining = 120;
+  const interval = setInterval(() => {
+    wrapSeekFunctions();
+    remaining -= 1;
+    if (remaining <= 0) clearInterval(interval);
+  }, 50);
+}
+function studioManualEditsRenderRuntime(manifestContent, activeCompositionPath) {
+  const OFFSET_X_PROP = "--hf-studio-offset-x";
+  const OFFSET_Y_PROP = "--hf-studio-offset-y";
+  const WIDTH_PROP = "--hf-studio-width";
+  const HEIGHT_PROP = "--hf-studio-height";
+  const ROTATION_PROP = "--hf-studio-rotation";
+  const PATH_OFFSET_ATTR = "data-hf-studio-path-offset";
+  const BOX_SIZE_ATTR = "data-hf-studio-box-size";
+  const ROTATION_ATTR = "data-hf-studio-rotation";
+  const ORIGINAL_TRANSLATE_ATTR = "data-hf-studio-original-translate";
+  const ORIGINAL_ROTATE_ATTR = "data-hf-studio-original-rotate";
+  const WRAPPED_SEEK_PROP = "__hfStudioManualEditsWrapped";
+  const ROTATION_TRANSFORM_ORIGIN = "center center";
+  const finiteNumber = (value) => typeof value === "number" && Number.isFinite(value) ? value : null;
+  const objectRecord = (value) => value && typeof value === "object" ? value : null;
+  const runtimeWindow = window;
+  const parsedManifest = (() => {
+    try {
+      return objectRecord(JSON.parse(manifestContent));
+    } catch {
+      return null;
+    }
+  })();
+  const manifestEdits = Array.isArray(parsedManifest?.edits) ? parsedManifest.edits : [];
+  if (manifestEdits.length === 0) return;
+  const sourceFileForElement = (element) => {
+    let current = element;
+    while (current) {
+      const sourceFile = current.getAttribute("data-composition-file") ?? current.getAttribute("data-composition-src");
+      if (sourceFile) return sourceFile;
+      current = current.parentElement;
+    }
+    return activeCompositionPath ?? "index.html";
+  };
+  const elementMatchesSourceFile = (element, sourceFile) => sourceFileForElement(element) === sourceFile;
+  const styleUsesStudioOffset = (value) => value.includes(OFFSET_X_PROP) || value.includes(OFFSET_Y_PROP);
+  const styleUsesStudioRotation = (value) => value.includes(ROTATION_PROP);
+  const splitTopLevelWhitespace = (value) => {
+    const parts = [];
+    let depth = 0;
+    let current = "";
+    for (const char of value.trim()) {
+      if (char === "(") depth += 1;
+      if (char === ")") depth = Math.max(0, depth - 1);
+      if (/\s/.test(char) && depth === 0) {
+        if (current) parts.push(current);
+        current = "";
+      } else {
+        current += char;
+      }
+    }
+    if (current) parts.push(current);
+    return parts;
+  };
+  const composeTranslate = (element, x, y) => {
+    const original = element.getAttribute(ORIGINAL_TRANSLATE_ATTR)?.trim();
+    if (!original || original === "none") return `${x} ${y}`;
+    const parts = splitTopLevelWhitespace(original);
+    if (parts.length === 1) return `calc(${parts[0]} + ${x}) ${y}`;
+    if (parts.length === 2) return `calc(${parts[0]} + ${x}) calc(${parts[1]} + ${y})`;
+    if (parts.length === 3) {
+      return `calc(${parts[0]} + ${x}) calc(${parts[1]} + ${y}) ${parts[2]}`;
+    }
+    return `${x} ${y}`;
+  };
+  const readStyleOrComputed = (element, property) => {
+    try {
+      return element.style.getPropertyValue(property) || getComputedStyle(element).getPropertyValue(property);
+    } catch {
+      return element.style.getPropertyValue(property);
+    }
+  };
+  const readTransformLonghandBase = (element, property) => {
+    const value = readStyleOrComputed(element, property).trim();
+    return value === "none" ? "" : value;
+  };
+  const preparePathOffsetBase = (element) => {
+    const currentTranslate = readTransformLonghandBase(element, "translate");
+    const hasMarker = element.hasAttribute(PATH_OFFSET_ATTR);
+    const wasResetByAnimation = !styleUsesStudioOffset(currentTranslate);
+    if (!hasMarker) {
+      element.setAttribute(ORIGINAL_TRANSLATE_ATTR, wasResetByAnimation ? currentTranslate : "");
+    } else if (wasResetByAnimation) {
+      element.setAttribute(ORIGINAL_TRANSLATE_ATTR, currentTranslate);
+    }
+  };
+  const prepareRotationBase = (element) => {
+    const currentRotate = readTransformLonghandBase(element, "rotate");
+    const hasMarker = element.hasAttribute(ROTATION_ATTR);
+    const wasResetByAnimation = !styleUsesStudioRotation(currentRotate);
+    if (!hasMarker) {
+      element.setAttribute(ORIGINAL_ROTATE_ATTR, wasResetByAnimation ? currentRotate : "");
+    } else if (wasResetByAnimation) {
+      element.setAttribute(ORIGINAL_ROTATE_ATTR, currentRotate);
+    }
+  };
+  const querySelectorCandidates = (selector) => {
+    const isCandidate = (element) => element instanceof HTMLElement;
+    const className = selector.match(/^\.([A-Za-z0-9_-]+)$/)?.[1];
+    if (className) {
+      return Array.from(document.getElementsByTagName("*")).filter(
+        (element) => isCandidate(element) && element.classList.contains(className)
+      );
+    }
+    if (/^[A-Za-z][A-Za-z0-9-]*$/.test(selector)) {
+      return Array.from(document.getElementsByTagName(selector)).filter(isCandidate);
+    }
+    return Array.from(document.querySelectorAll(selector)).filter(isCandidate);
+  };
+  const resolveTarget = (edit) => {
+    const targetRecord = objectRecord(edit.target);
+    if (!targetRecord) return null;
+    const sourceFile = typeof targetRecord.sourceFile === "string" ? targetRecord.sourceFile : "";
+    if (!sourceFile) return null;
+    const id = typeof targetRecord.id === "string" ? targetRecord.id : "";
+    if (id) {
+      const byId = document.getElementById(id);
+      if (byId instanceof HTMLElement && elementMatchesSourceFile(byId, sourceFile)) return byId;
+      const matchesById = [
+        document.documentElement,
+        ...Array.from(document.getElementsByTagName("*"))
+      ].filter(
+        (element) => element instanceof HTMLElement && element.id === id && elementMatchesSourceFile(element, sourceFile)
+      );
+      if (matchesById[0]) return matchesById[0];
+    }
+    const selector = typeof targetRecord.selector === "string" ? targetRecord.selector : "";
+    if (!selector) return null;
+    try {
+      const matches = querySelectorCandidates(selector).filter(
+        (element) => elementMatchesSourceFile(element, sourceFile)
+      );
+      const selectorIndex = finiteNumber(targetRecord.selectorIndex) ?? 0;
+      return matches[Math.max(0, Math.floor(selectorIndex))] ?? null;
+    } catch {
+      return null;
+    }
+  };
+  const roundRotationAngle = (angle) => Math.round(angle * 10) / 10;
+  const isSimpleRotateAngle = (value) => /^-?(?:\d+(?:\.\d+)?|\.\d+)(?:deg|rad|turn|grad)$/.test(value.trim());
+  const composeRotation = (element, rotationValue) => {
+    const original = element.getAttribute(ORIGINAL_ROTATE_ATTR)?.trim();
+    if (!original || original === "none" || !isSimpleRotateAngle(original)) {
+      return rotationValue;
+    }
+    return `calc(${original} + ${rotationValue})`;
+  };
+  const applyPathOffset = (element, edit) => {
+    const x = finiteNumber(edit.x);
+    const y = finiteNumber(edit.y);
+    if (x == null || y == null) return;
+    preparePathOffsetBase(element);
+    element.setAttribute(PATH_OFFSET_ATTR, "true");
+    element.style.setProperty(OFFSET_X_PROP, `${Math.round(x)}px`);
+    element.style.setProperty(OFFSET_Y_PROP, `${Math.round(y)}px`);
+    element.style.setProperty(
+      "translate",
+      composeTranslate(element, `var(${OFFSET_X_PROP}, 0px)`, `var(${OFFSET_Y_PROP}, 0px)`)
+    );
+  };
+  const readParentFlexBasisPixels = (element, size) => {
+    const parent = element.parentElement;
+    if (!parent) return null;
+    const styles = getComputedStyle(parent);
+    if (styles.display !== "flex" && styles.display !== "inline-flex") return null;
+    return Math.round(
+      Math.max(1, styles.flexDirection.startsWith("column") ? size.height : size.width)
+    );
+  };
+  const applyBoxSize = (element, edit) => {
+    const width = finiteNumber(edit.width);
+    const height = finiteNumber(edit.height);
+    if (width == null || height == null || width <= 0 || height <= 0) return;
+    const rounded = {
+      width: Math.round(Math.max(1, width)),
+      height: Math.round(Math.max(1, height))
+    };
+    element.setAttribute(BOX_SIZE_ATTR, "true");
+    element.style.setProperty(WIDTH_PROP, `${rounded.width}px`);
+    element.style.setProperty(HEIGHT_PROP, `${rounded.height}px`);
+    element.style.setProperty("box-sizing", "border-box");
+    element.style.setProperty("width", `${rounded.width}px`);
+    element.style.setProperty("height", `${rounded.height}px`);
+    element.style.setProperty("min-width", "0px");
+    element.style.setProperty("min-height", "0px");
+    element.style.setProperty("max-width", "none");
+    element.style.setProperty("max-height", "none");
+    const flexBasis = readParentFlexBasisPixels(element, rounded);
+    if (flexBasis != null) {
+      element.style.setProperty("flex-basis", `${flexBasis}px`);
+      element.style.setProperty("flex-grow", "0");
+      element.style.setProperty("flex-shrink", "0");
+    }
+    if (getComputedStyle(element).display === "inline") {
+      element.style.setProperty("display", "inline-block");
+    }
+  };
+  const applyRotation = (element, edit) => {
+    const angle = finiteNumber(edit.angle);
+    if (angle == null) return;
+    prepareRotationBase(element);
+    element.setAttribute(ROTATION_ATTR, "true");
+    element.style.setProperty(ROTATION_PROP, `${roundRotationAngle(angle)}deg`);
+    element.style.setProperty("transform-origin", ROTATION_TRANSFORM_ORIGIN);
+    element.style.setProperty("rotate", composeRotation(element, `var(${ROTATION_PROP}, 0deg)`));
+  };
+  const applyManifest = () => {
+    let applied = 0;
+    for (const edit of manifestEdits) {
+      const editRecord = objectRecord(edit);
+      if (!editRecord) continue;
+      const element = resolveTarget(editRecord);
+      if (!element) continue;
+      if (editRecord.kind === "path-offset") applyPathOffset(element, editRecord);
+      if (editRecord.kind === "box-size") applyBoxSize(element, editRecord);
+      if (editRecord.kind === "rotation") applyRotation(element, editRecord);
+      applied += 1;
+    }
+    return applied;
+  };
+  runtimeWindow.__hfStudioManualEditsApply = applyManifest;
+  const markWrapped = (fn) => {
+    try {
+      Object.defineProperty(fn, WRAPPED_SEEK_PROP, {
+        configurable: false,
+        enumerable: false,
+        value: true
+      });
+    } catch {
+      try {
+        fn[WRAPPED_SEEK_PROP] = true;
+      } catch {
+      }
+    }
+  };
+  const isWrapped = (fn) => Boolean(fn[WRAPPED_SEEK_PROP]);
+  const wrapFunction = (get, set) => {
+    const fn = get();
+    if (!fn) return false;
+    const seek = fn;
+    if (isWrapped(seek)) {
+      applyManifest();
+      return true;
+    }
+    const wrappedSeek = function(time) {
+      const result = seek.call(this, time);
+      applyManifest();
+      return result;
+    };
+    markWrapped(wrappedSeek);
+    set(wrappedSeek);
+    applyManifest();
+    return true;
+  };
+  const wrapSeekFunctions = () => {
+    const wrappedHfSeek = wrapFunction(
+      () => runtimeWindow.__hf?.seek,
+      (fn) => {
+        if (runtimeWindow.__hf) runtimeWindow.__hf.seek = fn;
+      }
+    );
+    const wrappedPlayerRenderSeek = wrapFunction(
+      () => runtimeWindow.__player?.renderSeek,
+      (fn) => {
+        if (runtimeWindow.__player) runtimeWindow.__player.renderSeek = fn;
+      }
+    );
+    return wrappedHfSeek || wrappedPlayerRenderSeek;
+  };
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", () => applyManifest(), { once: true });
+  } else {
+    applyManifest();
+  }
+  wrapSeekFunctions();
+  let remainingSeekWrapAttempts = 120;
+  const seekWrapInterval = setInterval(() => {
+    wrapSeekFunctions();
+    remainingSeekWrapAttempts -= 1;
+    if (remainingSeekWrapAttempts <= 0) clearInterval(seekWrapInterval);
+  }, 50);
+}
+
+// src/routes/thumbnail.ts
+var THUMBNAIL_CACHE_VERSION = "v4";
+function registerThumbnailRoutes(api, adapter) {
+  api.get("/projects/:id/thumbnail/*", async (c) => {
+    if (!adapter.generateThumbnail) {
+      return c.json({ error: "Thumbnails not available" }, 501);
+    }
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    let compPath = decodeURIComponent(
+      c.req.path.replace(`/projects/${project.id}/thumbnail/`, "").split("?")[0] ?? ""
+    );
+    if (compPath && !compPath.includes(".")) compPath += ".html";
+    const url = new URL(c.req.url, `http://${c.req.header("host") || "localhost"}`);
+    const rawSeekTime = url.searchParams.get("t");
+    const parsedSeekTime = rawSeekTime == null ? Number.NaN : parseFloat(rawSeekTime);
+    const seekTime = Number.isFinite(parsedSeekTime) ? parsedSeekTime : 0.5;
+    const vpWidth = parseInt(url.searchParams.get("w") || "0") || 0;
+    const vpHeight = parseInt(url.searchParams.get("h") || "0") || 0;
+    const selector = url.searchParams.get("selector") || void 0;
+    const format = url.searchParams.get("format") === "png" ? "png" : "jpeg";
+    const contentType = format === "png" ? "image/png" : "image/jpeg";
+    const rawSelectorIndex = Number.parseInt(url.searchParams.get("selectorIndex") || "0", 10);
+    const selectorIndex = Number.isFinite(rawSelectorIndex) && rawSelectorIndex > 0 ? rawSelectorIndex : void 0;
+    const urlVersion = url.searchParams.get("v") || "";
+    let compW = vpWidth || 1920;
+    let compH = vpHeight || 1080;
+    let sourceMtime = 0;
+    if (!vpWidth) {
+      const htmlFile = join11(project.dir, compPath);
+      if (existsSync7(htmlFile)) {
+        sourceMtime = Math.round(statSync4(htmlFile).mtimeMs);
+        const html = readFileSync10(htmlFile, "utf-8");
+        const wMatch = html.match(/data-width=["'](\d+)["']/);
+        const hMatch = html.match(/data-height=["'](\d+)["']/);
+        if (wMatch?.[1]) compW = parseInt(wMatch[1]);
+        if (hMatch?.[1]) compH = parseInt(hMatch[1]);
+      }
+    }
+    const manualEditsFile = join11(project.dir, STUDIO_MANUAL_EDITS_PATH);
+    let manualEditsKey = "";
+    if (existsSync7(manualEditsFile)) {
+      const manualEditsContent = readFileSync10(manualEditsFile, "utf-8");
+      manualEditsKey = `_${createHash2("sha1").update(manualEditsContent).digest("hex").slice(0, 16)}`;
+      sourceMtime = Math.max(sourceMtime, Math.round(statSync4(manualEditsFile).mtimeMs));
+    }
+    const motionFile = join11(project.dir, STUDIO_MOTION_PATH);
+    let motionKey = "";
+    if (existsSync7(motionFile)) {
+      const motionContent = readFileSync10(motionFile, "utf-8");
+      motionKey = `_${createHash2("sha1").update(motionContent).digest("hex").slice(0, 16)}`;
+      sourceMtime = Math.max(sourceMtime, Math.round(statSync4(motionFile).mtimeMs));
+    }
+    const previewUrl = compPath === "index.html" ? `http://${c.req.header("host")}/api/projects/${project.id}/preview` : `http://${c.req.header("host")}/api/projects/${project.id}/preview/comp/${compPath}`;
+    const cacheDir = join11(project.dir, ".thumbnails");
+    const selectorKey = selector ? `_${selector.replace(/[^a-zA-Z0-9_-]+/g, "_").slice(0, 80)}_${selectorIndex ?? 0}` : "";
+    const urlVersionKey = urlVersion ? `_${urlVersion.replace(/[^a-zA-Z0-9_-]+/g, "_").slice(0, 32)}` : "";
+    const cacheKey = `${THUMBNAIL_CACHE_VERSION}${urlVersionKey}${manualEditsKey}${motionKey}_${format}_${compPath.replace(/\//g, "_")}_${compW}x${compH}_${sourceMtime}_${seekTime.toFixed(2)}${selectorKey}.${format === "png" ? "png" : "jpg"}`;
+    const cachePath = join11(cacheDir, cacheKey);
+    if (existsSync7(cachePath)) {
+      return new Response(new Uint8Array(readFileSync10(cachePath)), {
+        headers: { "Content-Type": contentType, "Cache-Control": "public, max-age=60" }
+      });
+    }
+    try {
+      const buffer = await adapter.generateThumbnail({
+        project,
+        compPath,
+        seekTime,
+        width: compW,
+        height: compH,
+        previewUrl,
+        selector,
+        format,
+        selectorIndex
+      });
+      if (!buffer) {
+        return c.json(
+          { error: "Thumbnail generation failed \u2014 Chrome browser may not be available" },
+          500
+        );
+      }
+      if (!existsSync7(cacheDir)) mkdirSync5(cacheDir, { recursive: true });
+      writeFileSync6(cachePath, buffer);
+      return new Response(new Uint8Array(buffer), {
+        headers: { "Content-Type": contentType, "Cache-Control": "public, max-age=60" }
+      });
+    } catch (err) {
+      const msg = err instanceof Error ? err.message : String(err);
+      return c.json({ error: `Thumbnail generation failed: ${msg}` }, 500);
+    }
+  });
+}
+
+// src/routes/waveform.ts
+import { existsSync as existsSync8, readFileSync as readFileSync11, writeFileSync as writeFileSync7, mkdirSync as mkdirSync6 } from "fs";
+import { join as join12 } from "path";
+function registerWaveformRoutes(api, adapter) {
+  api.get("/projects/:id/waveform/*", async (c) => {
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "not found" }, 404);
+    const assetPath = decodeURIComponent(
+      c.req.path.replace(`/projects/${project.id}/waveform/`, "").split("?")[0] ?? ""
+    );
+    const audioPath = join12(project.dir, assetPath);
+    if (!existsSync8(audioPath)) return c.json({ error: "file not found" }, 404);
+    const cacheDir = join12(project.dir, ".waveform-cache");
+    const cachePath = join12(cacheDir, buildWaveformCacheKey(assetPath));
+    if (existsSync8(cachePath)) {
+      try {
+        const peaks2 = JSON.parse(readFileSync11(cachePath, "utf-8"));
+        return c.json({ peaks: peaks2 });
+      } catch {
+      }
+    }
+    let peaks;
+    try {
+      peaks = await decodeAudioPeaks(audioPath);
+    } catch {
+      return c.json({ error: "failed to decode audio" }, 500);
+    }
+    try {
+      mkdirSync6(cacheDir, { recursive: true });
+      writeFileSync7(cachePath, JSON.stringify(peaks));
+    } catch {
+    }
+    return c.json({ peaks });
+  });
+}
+
+// src/routes/fonts.ts
+import { closeSync, constants, fstatSync, openSync, readSync } from "fs";
+import {
+  collectFontFileEntries,
+  fontDirectories,
+  getSystemProfilerFamilies,
+  locateSystemFont,
+  SYSTEM_FONT_SIZE_LIMIT
+} from "@hyperframes/core/fonts/system-locator";
+var MAX_FONT_RESULTS = 2e3;
+var GOOGLE_FONTS_METADATA_URL = "https://fonts.google.com/metadata/fonts";
+var GOOGLE_FONTS_FETCH_TIMEOUT_MS = 3e3;
+var cachedFonts = null;
+var cachedGoogleFonts = null;
+var GOOGLE_FONT_FALLBACKS = [
+  "Inter",
+  "Roboto",
+  "Open Sans",
+  "Montserrat",
+  "Poppins",
+  "Lato",
+  "Oswald",
+  "Raleway",
+  "Nunito",
+  "Playfair Display",
+  "Merriweather",
+  "Source Sans 3",
+  "Source Serif 4",
+  "Source Code Pro",
+  "DM Sans",
+  "Space Grotesk",
+  "Space Mono",
+  "Bebas Neue",
+  "Outfit",
+  "JetBrains Mono"
+];
+function isRecord(value) {
+  return typeof value === "object" && value !== null;
+}
+function collectFontsFromDir(dir) {
+  return collectFontFileEntries(dir).map((e) => e.family);
+}
+function listInstalledFontFamilies() {
+  if (cachedFonts) return cachedFonts;
+  const families = /* @__PURE__ */ new Set();
+  for (const family of getSystemProfilerFamilies()) {
+    families.add(family);
+    if (families.size >= MAX_FONT_RESULTS) break;
+  }
+  for (const dir of fontDirectories()) {
+    for (const family of collectFontsFromDir(dir)) {
+      families.add(family);
+      if (families.size >= MAX_FONT_RESULTS) break;
+    }
+    if (families.size >= MAX_FONT_RESULTS) break;
+  }
+  cachedFonts = Array.from(families).sort((a, b) => a.localeCompare(b));
+  return cachedFonts;
+}
+function parseGoogleFontMetadata(value) {
+  if (!isRecord(value) || !Array.isArray(value.familyMetadataList)) return [];
+  const families = [];
+  for (const entry of value.familyMetadataList) {
+    if (!isRecord(entry) || typeof entry.family !== "string") continue;
+    families.push(entry.family);
+  }
+  return families;
+}
+function stripGoogleJsonGuard(raw) {
+  const prefix = ")]}'";
+  if (!raw.startsWith(prefix)) return raw;
+  let index = prefix.length;
+  while (index < raw.length && (raw[index] === " " || raw[index] === "\n" || raw[index] === "\r" || raw[index] === "	" || raw[index] === "\f")) {
+    index += 1;
+  }
+  return raw.slice(index);
+}
+async function listGoogleFontFamilies() {
+  if (cachedGoogleFonts) return cachedGoogleFonts;
+  const controller = new AbortController();
+  const timer = setTimeout(() => controller.abort(), GOOGLE_FONTS_FETCH_TIMEOUT_MS);
+  try {
+    const response = await fetch(GOOGLE_FONTS_METADATA_URL, { signal: controller.signal });
+    if (!response.ok) {
+      cachedGoogleFonts = GOOGLE_FONT_FALLBACKS;
+      return cachedGoogleFonts;
+    }
+    const raw = await response.text();
+    const jsonText = stripGoogleJsonGuard(raw);
+    const families = parseGoogleFontMetadata(JSON.parse(jsonText));
+    cachedGoogleFonts = families.length > 0 ? families : GOOGLE_FONT_FALLBACKS;
+  } catch {
+    cachedGoogleFonts = GOOGLE_FONT_FALLBACKS;
+  } finally {
+    clearTimeout(timer);
+  }
+  return cachedGoogleFonts;
+}
+function registerFontRoutes(api) {
+  api.get("/fonts", (c) => c.json({ fonts: listInstalledFontFamilies() }));
+  api.get("/fonts/google", async (c) => c.json({ fonts: await listGoogleFontFamilies() }));
+  api.get("/fonts/file", (c) => {
+    const family = c.req.query("family");
+    if (!family) return c.json({ error: "family parameter required" }, 400);
+    const located = locateSystemFont(family);
+    if (!located) return c.json({ error: "font not found" }, 404);
+    let fd;
+    try {
+      fd = openSync(located.path, constants.O_RDONLY | constants.O_NOFOLLOW);
+    } catch {
+      return c.json({ error: "font file not accessible" }, 404);
+    }
+    try {
+      const stat = fstatSync(fd);
+      if (stat.size > SYSTEM_FONT_SIZE_LIMIT) {
+        return c.json({ error: "font file too large" }, 413);
+      }
+      const buffer = Buffer.alloc(stat.size);
+      readSync(fd, buffer, 0, stat.size, 0);
+      const mimeType = located.format === "otf" ? "font/otf" : located.format === "woff2" ? "font/woff2" : located.format === "woff" ? "font/woff" : located.format === "ttc" ? "font/collection" : "font/ttf";
+      const fileName = `${family.replace(/[^a-zA-Z0-9 -]/g, "")}.${located.format}`;
+      return new Response(buffer, {
+        headers: {
+          "Content-Type": mimeType,
+          "Content-Disposition": `attachment; filename="${fileName}"`
+        }
+      });
+    } catch {
+      return c.json({ error: "failed to read font file" }, 500);
+    } finally {
+      closeSync(fd);
+    }
+  });
+}
+
+// src/routes/registry.ts
+function registerRegistryRoutes(api, adapter) {
+  api.get("/registry/blocks", async (c) => {
+    if (!adapter.listRegistryCatalog) {
+      return c.json({ error: "Registry not available" }, 501);
+    }
+    const items = await adapter.listRegistryCatalog();
+    return c.json(items);
+  });
+  api.post("/projects/:id/registry/install", async (c) => {
+    if (!adapter.installRegistryBlock) {
+      return c.json({ error: "Registry install not available" }, 501);
+    }
+    const project = await adapter.resolveProject(c.req.param("id"));
+    if (!project) return c.json({ error: "Project not found" }, 404);
+    const body = await c.req.json().catch(() => null);
+    if (!body?.blockName) {
+      return c.json({ error: "blockName is required" }, 400);
+    }
+    try {
+      const result = await adapter.installRegistryBlock({ project, blockName: body.blockName });
+      return c.json(result);
+    } catch (err) {
+      const message = err instanceof Error ? err.message : "Install failed";
+      return c.json({ error: message }, 500);
+    }
+  });
+}
+
+// src/createStudioApi.ts
+function createStudioApi(adapter) {
+  const api = new Hono();
+  registerProjectRoutes(api, adapter);
+  registerStoryboardRoutes(api, adapter);
+  registerFileRoutes(api, adapter);
+  registerPreviewRoutes(api, adapter);
+  registerLintRoutes(api, adapter);
+  registerRenderRoutes(api, adapter);
+  registerThumbnailRoutes(api, adapter);
+  registerWaveformRoutes(api, adapter);
+  registerFontRoutes(api);
+  registerRegistryRoutes(api, adapter);
+  return api;
+}
+
+// src/helpers/screenshotClip.ts
+function getElementScreenshotClip(selector, selectorIndex) {
+  const matches = Array.from(document.querySelectorAll(selector)).filter(
+    (el2) => el2 instanceof HTMLElement
+  );
+  const safeIndex = Math.max(0, Math.min(matches.length - 1, Math.floor(selectorIndex ?? 0)));
+  const el = matches[safeIndex] ?? null;
+  if (!(el instanceof HTMLElement)) return void 0;
+  const rect = el.getBoundingClientRect();
+  if (rect.width < 4 || rect.height < 4) return void 0;
+  const pad = 8;
+  const x = Math.max(0, rect.left - pad);
+  const y = Math.max(0, rect.top - pad);
+  const maxWidth = window.innerWidth - x;
+  const maxHeight = window.innerHeight - y;
+  return {
+    x,
+    y,
+    width: Math.max(1, Math.min(rect.width + pad * 2, maxWidth)),
+    height: Math.max(1, Math.min(rect.height + pad * 2, maxHeight))
+  };
+}
+export {
+  MIME_TYPES,
+  STUDIO_MANUAL_EDITS_PATH,
+  STUDIO_MOTION_PATH,
+  buildSubCompositionHtml,
+  createProjectSignature,
+  createStudioApi,
+  createStudioManualEditsRenderBodyScript,
+  createStudioMotionRenderBodyScript,
+  createStudioPositionSeekReapplyScript,
+  getElementScreenshotClip,
+  getMimeType,
+  isSafePath,
+  walkDir
+};
+//# sourceMappingURL=index.js.map