@bendyline/squisq-editor-react 2.4.0 → 2.4.1

package/dist/{chunk-5JMHFAVW.js → chunk-PDCKJCOS.js}

@@ -1,12 +1,133 @@
-import {
-  buildFilename,
-  encodeTimingJson,
-  requestCameraStream,
-  requestMicStream,
-  resolveFormat,
-  timingPathFor,
-  useStreamPreview
-} from "./chunk-5Q4JN4I5.js";
+// src/recorder/formats.ts
+var AUDIO_CANDIDATES = [
+  "audio/webm;codecs=opus",
+  "audio/webm",
+  "audio/mp4;codecs=mp4a.40.2",
+  "audio/mp4",
+  "audio/ogg;codecs=opus"
+];
+var VIDEO_CANDIDATES = [
+  "video/webm;codecs=vp9,opus",
+  "video/webm;codecs=vp8,opus",
+  "video/webm",
+  "video/mp4;codecs=avc1.42E01E,mp4a.40.2",
+  "video/mp4"
+];
+function extensionForMime(mimeType) {
+  const m = mimeType.toLowerCase();
+  if (m.startsWith("audio/webm")) return ".webm";
+  if (m.startsWith("audio/ogg")) return ".ogg";
+  if (m.startsWith("audio/mp4")) return ".m4a";
+  if (m.startsWith("audio/mpeg")) return ".mp3";
+  if (m.startsWith("audio/wav")) return ".wav";
+  if (m.startsWith("video/webm")) return ".webm";
+  if (m.startsWith("video/mp4")) return ".mp4";
+  return ".bin";
+}
+function probeMimeType(candidates) {
+  if (typeof MediaRecorder === "undefined") return null;
+  for (const candidate of candidates) {
+    try {
+      if (MediaRecorder.isTypeSupported(candidate)) return candidate;
+    } catch {
+    }
+  }
+  return null;
+}
+function resolveFormat(kind, preferred) {
+  const candidates = kind === "audio" ? AUDIO_CANDIDATES : VIDEO_CANDIDATES;
+  const probed = (preferred && probeMimeType([preferred])) ?? probeMimeType(candidates) ?? "";
+  const directory = kind === "audio" ? "audio" : "video";
+  const extension = probed ? extensionForMime(probed) : ".webm";
+  return { mimeType: probed, extension, directory };
+}
+function supportsMediaRecorder() {
+  return typeof MediaRecorder !== "undefined";
+}
+function supportsUserMedia() {
+  return typeof navigator !== "undefined" && typeof navigator.mediaDevices !== "undefined" && typeof navigator.mediaDevices.getUserMedia === "function";
+}
+function supportsDisplayMedia() {
+  return typeof navigator !== "undefined" && typeof navigator.mediaDevices !== "undefined" && typeof navigator.mediaDevices.getDisplayMedia === "function";
+}
+function supportsSystemAudioCapture() {
+  if (!supportsDisplayMedia()) return false;
+  const nav = navigator;
+  const uaData = nav.userAgentData;
+  if (uaData?.mobile === true) return false;
+  if (uaData?.brands?.length) {
+    return uaData.brands.some(({ brand }) => /chromium/i.test(brand));
+  }
+  const userAgent = nav.userAgent ?? "";
+  if (/Android|Mobile|iPhone|iPad|iPod/i.test(userAgent)) return false;
+  return /(?:Chrome|Chromium|Edg|OPR)\//.test(userAgent);
+}
+function buildFilename(kind, extension, basename, seed) {
+  const safe = basename ? basename.trim().replace(/[\\/:*?"<>|]+/g, "-").replace(/\s+/g, "-") : "";
+  if (safe) return `${safe}${extension}`;
+  const now = /* @__PURE__ */ new Date();
+  const stamp = now.getFullYear().toString().padStart(4, "0") + (now.getMonth() + 1).toString().padStart(2, "0") + now.getDate().toString().padStart(2, "0") + "-" + now.getHours().toString().padStart(2, "0") + now.getMinutes().toString().padStart(2, "0") + now.getSeconds().toString().padStart(2, "0");
+  const prefix = seed ?? (kind === "audio" ? "narration" : "recording");
+  return `${prefix}-${stamp}${extension}`;
+}
+
+// src/recorder/sources/micStream.ts
+async function requestMicStream(constraints) {
+  if (!supportsUserMedia()) {
+    throw new Error("navigator.mediaDevices.getUserMedia is not available in this environment.");
+  }
+  return navigator.mediaDevices.getUserMedia({
+    audio: constraints ?? true,
+    video: false
+  });
+}
+
+// src/recorder/sources/cameraStream.ts
+async function requestCameraStream(options) {
+  if (!supportsUserMedia()) {
+    throw new Error("navigator.mediaDevices.getUserMedia is not available in this environment.");
+  }
+  const video = options?.video ?? true;
+  const audio = options?.audio ?? true;
+  return navigator.mediaDevices.getUserMedia({ video, audio });
+}
+
+// src/recorder/hooks/useStreamPreview.ts
+import { useEffect } from "react";
+function useStreamPreview(ref, stream) {
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    el.muted = true;
+    el.playsInline = true;
+    el.srcObject = stream;
+    if (stream) {
+      void el.play().catch(() => {
+      });
+    }
+    return () => {
+      if (el.srcObject === stream) {
+        el.srcObject = null;
+      }
+    };
+  }, [ref, stream]);
+}
+
+// src/recorder/timingJson.ts
+function buildTimingJson(sourceText, durationSec) {
+  return {
+    sourceText: sourceText ?? "",
+    duration: Number.isFinite(durationSec) && durationSec >= 0 ? durationSec : 0,
+    bookmarks: []
+  };
+}
+function encodeTimingJson(timing) {
+  const text = JSON.stringify(timing, null, 2);
+  return new TextEncoder().encode(text);
+}
+function timingPathFor(audioRelativePath) {
+  return `${audioRelativePath}.timing.json`;
+}
 
 // src/teleprompter/pcmWorklet.ts
 var PCM_WORKLET_NAME = "squisq-pcm-tap";
@@ -53,7 +174,7 @@ async function registerPcmWorklet(ctx) {
 }
 
 // src/teleprompter/useMicAnalysis.ts
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useCallback, useEffect as useEffect2, useRef, useState } from "react";
 function useMicAnalysis() {
   const [status, setStatus] = useState("idle");
   const [error, setError] = useState(null);
@@ -70,7 +191,7 @@ function useMicAnalysis() {
     } catch {
     }
   }, []);
-  useEffect(() => {
+  useEffect2(() => {
     if (typeof navigator === "undefined" || !navigator.mediaDevices?.addEventListener) return;
     const onChange = () => void refreshDevices();
     navigator.mediaDevices.addEventListener("devicechange", onChange);
@@ -190,7 +311,7 @@ function useMicAnalysis() {
       listenersRef.current.delete(listener);
     };
   }, []);
-  useEffect(() => {
+  useEffect2(() => {
     return () => {
       generationRef.current += 1;
       teardown();
@@ -210,9 +331,55 @@ var DEFAULT_TELEPROMPTER_PREFS = Object.freeze({
   lineGuide: true,
   micDeviceId: null
 });
+var TELEPROMPTER_PREF_LIMITS = Object.freeze({
+  fontSizePx: { min: 28, max: 96 },
+  baseWpm: { min: 80, max: 260 },
+  vadSensitivity: { min: 0, max: 1 },
+  micDeviceIdMaxLength: 1024
+});
+var COUNTDOWN_OPTIONS = /* @__PURE__ */ new Set([0, 3, 5, 10]);
+function isCountdownOption(value) {
+  return typeof value === "number" && COUNTDOWN_OPTIONS.has(value);
+}
+function clampNumber(value, min, max, fallback) {
+  return typeof value === "number" && Number.isFinite(value) ? Math.min(max, Math.max(min, value)) : fallback;
+}
+function booleanOr(value, fallback) {
+  return typeof value === "boolean" ? value : fallback;
+}
+function normalizeTeleprompterPrefs(value, fallback = DEFAULT_TELEPROMPTER_PREFS) {
+  const input = value !== null && typeof value === "object" && !Array.isArray(value) ? value : {};
+  const countdown = input.countdownSec;
+  const micDeviceId = input.micDeviceId;
+  return {
+    fontSizePx: clampNumber(
+      input.fontSizePx,
+      TELEPROMPTER_PREF_LIMITS.fontSizePx.min,
+      TELEPROMPTER_PREF_LIMITS.fontSizePx.max,
+      fallback.fontSizePx
+    ),
+    mirrored: booleanOr(input.mirrored, fallback.mirrored),
+    baseWpm: clampNumber(
+      input.baseWpm,
+      TELEPROMPTER_PREF_LIMITS.baseWpm.min,
+      TELEPROMPTER_PREF_LIMITS.baseWpm.max,
+      fallback.baseWpm
+    ),
+    voiceTracking: booleanOr(input.voiceTracking, fallback.voiceTracking),
+    vadSensitivity: clampNumber(
+      input.vadSensitivity,
+      TELEPROMPTER_PREF_LIMITS.vadSensitivity.min,
+      TELEPROMPTER_PREF_LIMITS.vadSensitivity.max,
+      fallback.vadSensitivity
+    ),
+    countdownSec: isCountdownOption(countdown) ? countdown : fallback.countdownSec,
+    lineGuide: booleanOr(input.lineGuide, fallback.lineGuide),
+    micDeviceId: micDeviceId === null || typeof micDeviceId === "string" && micDeviceId.length > 0 && micDeviceId.length <= TELEPROMPTER_PREF_LIMITS.micDeviceIdMaxLength ? micDeviceId : micDeviceId === "" ? null : fallback.micDeviceId
+  };
+}
 
 // src/teleprompter/useTeleprompter.ts
-import { useCallback as useCallback2, useEffect as useEffect2, useMemo, useRef as useRef2, useState as useState2 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect3, useMemo, useRef as useRef2, useState as useState2 } from "react";
 import {
   buildNarrationScript,
   createNarrationSession,
@@ -222,13 +389,11 @@ import {
 } from "@bendyline/squisq/narration";
 var PREFS_STORAGE_KEY = "squisq:teleprompter-prefs";
 var PUBLISH_INTERVAL_MS = 66;
-var NUDGE_WORDS = 6;
 function loadPrefs() {
   try {
     const raw = globalThis.localStorage?.getItem(PREFS_STORAGE_KEY);
     if (!raw) return { ...DEFAULT_TELEPROMPTER_PREFS };
-    const parsed = JSON.parse(raw);
-    return { ...DEFAULT_TELEPROMPTER_PREFS, ...parsed };
+    return normalizeTeleprompterPrefs(JSON.parse(raw));
   } catch {
     return { ...DEFAULT_TELEPROMPTER_PREFS };
   }
@@ -251,6 +416,29 @@ function vadConfigForSensitivity(sensitivity) {
     )
   };
 }
+function spokenWordTarget(script, currentPosition, deltaWords) {
+  const tokens = script.tokens;
+  const direction = Math.sign(deltaWords);
+  if (tokens.length === 0 || direction === 0) return currentPosition;
+  let index = Math.min(Math.max(Math.floor(currentPosition), 0), tokens.length);
+  if (index < tokens.length) {
+    while (index >= 0 && tokens[index]?.spoken === false) index -= 1;
+    if (index < 0) index = tokens.findIndex((token) => token.spoken !== false);
+  }
+  if (index < 0) return currentPosition;
+  let remaining = Math.abs(Math.trunc(deltaWords));
+  while (remaining > 0) {
+    let candidate = index + direction;
+    while (candidate >= 0 && candidate < tokens.length && tokens[candidate]?.spoken === false) {
+      candidate += direction;
+    }
+    if (candidate < 0) return 0;
+    if (candidate >= tokens.length) return tokens.length;
+    index = candidate;
+    remaining -= 1;
+  }
+  return index;
+}
 function useTeleprompter(opts) {
   const { doc } = opts;
   const script = useMemo(
@@ -276,7 +464,7 @@ function useTeleprompter(opts) {
   scriptRef.current = script;
   prefsRef.current = prefs;
   transportRef.current = transport;
-  useEffect2(() => {
+  useEffect3(() => {
     wordPosRef.current = Math.min(wordPosRef.current, script?.tokens.length ?? 0);
     sessionRef.current = null;
     setView((v) => ({ ...v, wordPos: wordPosRef.current }));
@@ -308,7 +496,7 @@ function useTeleprompter(opts) {
     setTransport("finished");
     transportRef.current = "finished";
   }, []);
-  useEffect2(() => {
+  useEffect3(() => {
     return mic.subscribeHop((pcm) => {
       const currentScript = scriptRef.current;
       const sampleRate = mic.sampleRate;
@@ -349,7 +537,7 @@ function useTeleprompter(opts) {
       publish();
     });
   }, [mic, finish, notifyTick, publish]);
-  useEffect2(() => {
+  useEffect3(() => {
     if (transport !== "rolling") return;
     let raf = 0;
     let last = performance.now();
@@ -445,16 +633,20 @@ function useTeleprompter(opts) {
     [notifyTick, publish]
   );
   const nudge = useCallback2(
-    (deltaTokens) => seekToToken(Math.round(wordPosRef.current + deltaTokens)),
+    (deltaWords) => {
+      const currentScript = scriptRef.current;
+      if (!currentScript) return;
+      seekToToken(spokenWordTarget(currentScript, wordPosRef.current, deltaWords));
+    },
     [seekToToken]
   );
   const setPrefs = useCallback2(
     (patch) => {
       setPrefsState((prev) => {
-        const next = { ...prev, ...patch };
+        const next = normalizeTeleprompterPrefs({ ...prev, ...patch }, prev);
         savePrefs(next);
-        if (patch.micDeviceId !== void 0 && patch.micDeviceId !== prev.micDeviceId && mic.status === "live") {
-          void mic.start(patch.micDeviceId);
+        if (next.micDeviceId !== prev.micDeviceId && mic.status === "live") {
+          void mic.start(next.micDeviceId);
         }
         return next;
       });
@@ -469,31 +661,46 @@ function useTeleprompter(opts) {
   }, []);
   const handleKeyDown = useCallback2(
     (event) => {
+      if (event.defaultPrevented) return;
       const target = event.target;
-      if (target?.closest('input, textarea, select, button, a, [contenteditable="true"]')) return;
+      if (target?.closest('input, textarea, select, [contenteditable="true"]')) return;
+      if (event.key.startsWith("Arrow") && target?.closest(
+        '[role="tab"], [role="menuitem"], [role="option"], [role="slider"], [role="spinbutton"], [role="treeitem"]'
+      )) {
+        return;
+      }
       switch (event.key) {
-        case " ":
+        case "ArrowLeft":
+          event.preventDefault();
+          if (event.repeat) break;
+          nudge(-1);
+          break;
+        case "ArrowRight":
           event.preventDefault();
-          if (transportRef.current === "rolling" || transportRef.current === "countdown") pause();
-          else play();
+          if (event.repeat) break;
+          nudge(1);
           break;
         case "ArrowUp":
-        case "ArrowLeft":
           event.preventDefault();
-          nudge(-NUDGE_WORDS);
+          if (event.repeat) break;
+          play();
           break;
         case "ArrowDown":
-        case "ArrowRight":
           event.preventDefault();
-          nudge(NUDGE_WORDS);
+          if (event.repeat) break;
+          pause();
           break;
         case "[":
           event.preventDefault();
-          setPrefs({ baseWpm: Math.max(80, prefsRef.current.baseWpm - 10) });
+          setPrefs({
+            baseWpm: Math.max(TELEPROMPTER_PREF_LIMITS.baseWpm.min, prefsRef.current.baseWpm - 10)
+          });
           break;
         case "]":
           event.preventDefault();
-          setPrefs({ baseWpm: Math.min(260, prefsRef.current.baseWpm + 10) });
+          setPrefs({
+            baseWpm: Math.min(TELEPROMPTER_PREF_LIMITS.baseWpm.max, prefsRef.current.baseWpm + 10)
+          });
           break;
         case "m":
         case "M":
@@ -512,7 +719,7 @@ function useTeleprompter(opts) {
     },
     [nudge, pause, play, setPrefs]
   );
-  useEffect2(() => clearCountdown, [clearCountdown]);
+  useEffect3(() => clearCountdown, [clearCountdown]);
   return {
     script,
     transport,
@@ -785,7 +992,7 @@ html,body{margin:0;height:100%;}#squisq-float-root{height:100%;display:flex;}`;
 }
 
 // src/teleprompter/useFloatingWindow.ts
-import { useCallback as useCallback3, useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect4, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
 var FLOAT_WIDTH = 380;
 var FLOAT_HEIGHT = 540;
 function useFloatingWindow(styleCss) {
@@ -796,7 +1003,7 @@ function useFloatingWindow(styleCss) {
   const manager = managerRef.current;
   const [tier, setTier] = useState3("docked");
   const supportedTiers = useMemo2(() => detectFloatTiers().filter((t) => t !== "docked"), []);
-  useEffect3(() => {
+  useEffect4(() => {
     const offChange = manager.on("tierchange", setTier);
     const offClosed = manager.on("closed", setTier);
     return () => {
@@ -828,46 +1035,6 @@ function useFloatingWindow(styleCss) {
   };
 }
 
-// src/teleprompter/scrollModel.ts
-var EYE_LINE_FRACTION = 0.35;
-var MAX_SCROLL_PX_PER_SEC = 2600;
-function measureTokenLines(scrollColumn) {
-  const spans = scrollColumn.querySelectorAll("[data-token-idx]");
-  const tokenTops = new Array(spans.length);
-  const tokenHeights = new Array(spans.length);
-  const columnRect = scrollColumn.getBoundingClientRect();
-  spans.forEach((span) => {
-    const idx = Number(span.dataset.tokenIdx);
-    if (!Number.isFinite(idx)) return;
-    const rect = span.getBoundingClientRect();
-    tokenTops[idx] = rect.top - columnRect.top;
-    tokenHeights[idx] = rect.height;
-  });
-  return { tokenTops, tokenHeights };
-}
-function targetOffsetFor(wordPos, lines, viewportHeightPx, eyeLine = EYE_LINE_FRACTION) {
-  const count = lines.tokenTops.length;
-  if (count === 0) return 0;
-  const clamped = Math.min(Math.max(wordPos, 0), count - 1);
-  const idx = Math.floor(clamped);
-  const frac = clamped - idx;
-  const top = lines.tokenTops[idx] ?? 0;
-  const nextTop = lines.tokenTops[Math.min(idx + 1, count - 1)] ?? top;
-  const y = top + (nextTop - top) * frac;
-  const lineHeight = lines.tokenHeights[idx] ?? 0;
-  return Math.max(0, y + lineHeight / 2 - viewportHeightPx * eyeLine);
-}
-function stepScroll(currentPx, targetPx, dtMs, maxPxPerSec = MAX_SCROLL_PX_PER_SEC) {
-  const dt = Math.min(Math.max(dtMs, 0), 250) / 1e3;
-  if (dt === 0) return currentPx;
-  const blend = 1 - Math.exp(-dt / 0.18);
-  let next = currentPx + (targetPx - currentPx) * blend;
-  const maxStep = maxPxPerSec * dt;
-  if (next - currentPx > maxStep) next = currentPx + maxStep;
-  else if (currentPx - next > maxStep) next = currentPx - maxStep;
-  return Math.abs(next - targetPx) < 0.25 ? targetPx : next;
-}
-
 // src/teleprompter/teleprompterTheme.ts
 import { resolveFontFamily } from "@bendyline/squisq/schemas";
 function prompterVarsFromTheme(theme) {
@@ -1156,450 +1323,78 @@ var TELEPROMPTER_CSS = `
 }
 `;
 
-// src/teleprompter/TeleprompterSurface.tsx
-import { memo, useEffect as useEffect4, useMemo as useMemo3, useRef as useRef4 } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-function groupScript(script) {
-  return script.blocks.map((range) => {
-    const paragraphs = [];
-    let current = [];
-    for (let i = range.tokenStart; i < range.tokenEnd; i++) {
-      current.push(i);
-      if (script.tokens[i].pauseAfter >= 2 && i < range.tokenEnd - 1) {
-        paragraphs.push({ key: `${range.blockId}-${paragraphs.length}`, tokenIndexes: current });
-        current = [];
-      }
-    }
-    if (current.length > 0) {
-      paragraphs.push({ key: `${range.blockId}-${paragraphs.length}`, tokenIndexes: current });
+// src/teleprompter/recording/useNarrationRecorder.ts
+import { useCallback as useCallback4, useEffect as useEffect5, useRef as useRef4, useState as useState4 } from "react";
+import {
+  alignNarration
+} from "@bendyline/squisq/narration";
+var TRACE_INTERVAL_MS = 250;
+function mixdownToMono(buffer) {
+  const channels = buffer.numberOfChannels;
+  if (channels === 1) return buffer.getChannelData(0).slice();
+  const out = new Float32Array(buffer.length);
+  for (let c = 0; c < channels; c++) {
+    const data = buffer.getChannelData(c);
+    for (let i = 0; i < out.length; i++) out[i] += data[i] / channels;
+  }
+  return out;
+}
+var StartAborted = class extends Error {
+  constructor() {
+    super("Narration start aborted");
+    this.name = "StartAborted";
+  }
+};
+function stopRecorder(recorder) {
+  if (recorder.state === "inactive") return Promise.resolve();
+  return new Promise((resolve) => {
+    const done = () => resolve();
+    recorder.addEventListener("stop", done, { once: true });
+    try {
+      recorder.stop();
+    } catch {
+      recorder.removeEventListener("stop", done);
+      resolve();
     }
-    const group = { blockId: range.blockId, paragraphs };
-    if (range.heading !== void 0) group.heading = range.heading;
-    return group;
   });
 }
-var ScriptColumn = memo(function ScriptColumn2({
-  script,
-  compact
-}) {
-  const groups = useMemo3(() => groupScript(script), [script]);
-  return /* @__PURE__ */ jsx(Fragment, { children: groups.map((group) => /* @__PURE__ */ jsxs("section", { "data-block-id": group.blockId, children: [
-    !compact && group.heading ? /* @__PURE__ */ jsx("span", { className: "squisq-teleprompter-block-marker", children: group.heading }) : null,
-    group.paragraphs.map((paragraph) => /* @__PURE__ */ jsx("p", { className: "squisq-teleprompter-para", children: paragraph.tokenIndexes.map((idx) => /* @__PURE__ */ jsxs("span", { className: "squisq-teleprompter-word", "data-token-idx": idx, children: [
-      script.tokens[idx].text,
-      " "
-    ] }, idx)) }, paragraph.key))
-  ] }, group.blockId)) });
-});
-function TeleprompterSurface({
-  script,
-  wordPos,
-  fontSizePx,
-  mirrored,
-  lineGuide,
-  countdownRemaining,
-  recordingIndicator,
-  theme,
-  compact = false,
-  onSeekToken
-}) {
-  const surfaceRef = useRef4(null);
-  const columnRef = useRef4(null);
-  const wordPosRef = useRef4(wordPos);
-  wordPosRef.current = wordPos;
-  const vars = useMemo3(() => prompterVarsFromTheme(theme), [theme]);
-  useEffect4(() => {
-    const doc = surfaceRef.current?.ownerDocument;
-    if (doc) ensureTeleprompterStyles(doc);
+function useNarrationRecorder(options) {
+  const [state, setState] = useState4("idle");
+  const [error, setError] = useState4(null);
+  const [withCamera, setWithCamera] = useState4(false);
+  const [cameraStream, setCameraStream] = useState4(null);
+  const [take, setTake] = useState4(null);
+  const captureRef = useRef4(null);
+  const processingRef = useRef4(false);
+  const takeRef = useRef4(null);
+  const unmountedRef = useRef4(false);
+  const generationRef = useRef4(0);
+  const startingRef = useRef4(false);
+  const optionsRef = useRef4(options);
+  optionsRef.current = options;
+  const cancelPendingStart = useCallback4(() => {
+    generationRef.current++;
   }, []);
-  useEffect4(() => {
-    const surface = surfaceRef.current;
-    const column = columnRef.current;
-    if (!surface || !column) return;
-    const win = surface.ownerDocument.defaultView ?? window;
-    let lines = null;
-    let spans = [];
-    let activeIdx = -1;
-    let offset = 0;
-    let lastTime = performance.now();
-    let raf = 0;
-    const tokens = script.tokens;
-    const spokenAt = new Int32Array(tokens.length);
-    let lastSpoken = -1;
-    for (let i = 0; i < tokens.length; i++) {
-      if (tokens[i].spoken) lastSpoken = i;
-      spokenAt[i] = lastSpoken;
-    }
-    let firstSpoken = -1;
-    for (let i = 0; i < tokens.length; i++) {
-      if (tokens[i].spoken) {
-        firstSpoken = i;
-        break;
+  const applyTake = useCallback4((next) => {
+    takeRef.current = next;
+    setTake(next);
+  }, []);
+  const teardownCapture = useCallback4(() => {
+    cancelPendingStart();
+    const capture = captureRef.current;
+    captureRef.current = null;
+    if (!capture) return;
+    if (capture.traceTimer !== null) clearInterval(capture.traceTimer);
+    if (capture.audioRecorder.state !== "inactive") {
+      try {
+        capture.audioRecorder.stop();
+      } catch {
       }
     }
-    for (let i = 0; i < tokens.length && spokenAt[i] === -1; i++) spokenAt[i] = firstSpoken;
-    const remeasure = () => {
-      lines = measureTokenLines(column);
-      spans = Array.from(column.querySelectorAll("[data-token-idx]"));
-    };
-    remeasure();
-    const applyHighlight = (nextIdx) => {
-      if (nextIdx === activeIdx) return;
-      const lo = Math.min(activeIdx, nextIdx);
-      const hi = Math.max(activeIdx, nextIdx);
-      for (let i = Math.max(0, lo); i <= hi && i < spans.length; i++) {
-        const span = spans[i];
-        if (!span) continue;
-        span.classList.toggle("squisq-teleprompter-word--active", i === nextIdx);
-        span.classList.toggle("squisq-teleprompter-word--read", i < nextIdx);
-      }
-      activeIdx = nextIdx;
-    };
-    const loop = (now) => {
-      const dtMs = now - lastTime;
-      lastTime = now;
-      const pos = wordPosRef.current;
-      const clampedIdx = Math.min(Math.max(Math.floor(pos), 0), spans.length - 1);
-      const highlightIdx = clampedIdx < spokenAt.length && spokenAt[clampedIdx] >= 0 ? spokenAt[clampedIdx] : clampedIdx;
-      if (spans.length > 0) applyHighlight(highlightIdx);
-      if (lines) {
-        const target = targetOffsetFor(pos, lines, surface.clientHeight);
-        offset = stepScroll(offset, target, dtMs);
-        column.style.transform = `translateY(${-offset}px)`;
-      }
-      raf = win.requestAnimationFrame(loop);
-    };
-    raf = win.requestAnimationFrame(loop);
-    const resizeObserver = typeof ResizeObserver !== "undefined" ? new ResizeObserver(remeasure) : null;
-    resizeObserver?.observe(surface);
-    return () => {
-      win.cancelAnimationFrame(raf);
-      resizeObserver?.disconnect();
-    };
-  }, [script, fontSizePx, compact]);
-  const handleClick = onSeekToken ? (event) => {
-    const target = event.target;
-    const span = target?.closest("[data-token-idx]");
-    if (!span) return;
-    const idx = Number(span.dataset.tokenIdx);
-    if (Number.isFinite(idx)) onSeekToken(idx);
-  } : void 0;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: surfaceRef,
-      className: `squisq-teleprompter-surface${mirrored ? " squisq-teleprompter-surface--mirrored" : ""}`,
-      style: { ...vars, fontSize: `${fontSizePx}px` },
-      "data-testid": "teleprompter-surface",
-      children: [
-        /* @__PURE__ */ jsx("div", { className: "squisq-teleprompter-flip", children: /* @__PURE__ */ jsx(
-          "div",
-          {
-            ref: columnRef,
-            className: "squisq-teleprompter-scroll",
-            style: compact ? { padding: "30vh 5% 60vh" } : void 0,
-            onClick: handleClick,
-            children: /* @__PURE__ */ jsx(ScriptColumn, { script, compact })
-          }
-        ) }),
-        lineGuide ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "squisq-teleprompter-guide-band",
-              style: { top: `calc(${EYE_LINE_FRACTION * 100}% - 0.75em)`, height: "1.5em" }
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "squisq-teleprompter-line-guide",
-              style: { top: `calc(${EYE_LINE_FRACTION * 100}% - 0.75em)`, height: "1.5em" }
-            }
-          )
-        ] }) : null,
-        countdownRemaining !== null ? /* @__PURE__ */ jsx("div", { className: "squisq-teleprompter-countdown", children: /* @__PURE__ */ jsx("span", { className: "squisq-teleprompter-countdown-digit", children: countdownRemaining }) }) : null,
-        recordingIndicator ? /* @__PURE__ */ jsx("div", { className: "squisq-teleprompter-recdot" }) : null
-      ]
-    }
-  );
-}
-
-// src/teleprompter/TeleprompterControls.tsx
-import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var TIER_LABELS = {
-  "document-pip": "Floating window (always on top)",
-  "video-pip": "Picture-in-picture (read-only)",
-  popup: "Popup window",
-  docked: "Docked"
-};
-function TeleprompterControls({ controller, float, recordSlot }) {
-  const { transport, prefs, setPrefs, mic } = controller;
-  const rolling = transport === "rolling" || transport === "countdown";
-  const voiceLive = prefs.voiceTracking && mic.status === "live";
-  return /* @__PURE__ */ jsxs2(
-    "div",
-    {
-      className: "squisq-teleprompter-controls",
-      "data-testid": "teleprompter-controls",
-      "data-mic-status": mic.status,
-      "data-transport": transport,
-      "data-voice-live": voiceLive || void 0,
-      children: [
-        /* @__PURE__ */ jsxs2("span", { className: "squisq-teleprompter-group", children: [
-          /* @__PURE__ */ jsx2(
-            "button",
-            {
-              type: "button",
-              onClick: () => rolling ? controller.pause() : controller.play(),
-              "aria-label": rolling ? "Pause prompter" : "Start prompter",
-              children: rolling ? "\u23F8 Pause" : transport === "paused" ? "\u25B6 Resume" : "\u25B6 Start"
-            }
-          ),
-          /* @__PURE__ */ jsx2("button", { type: "button", onClick: controller.restart, "aria-label": "Restart prompter", children: "\u27F2 Restart" })
-        ] }),
-        /* @__PURE__ */ jsxs2("span", { className: "squisq-teleprompter-group", children: [
-          /* @__PURE__ */ jsx2("label", { htmlFor: "squisq-prompter-countdown", children: "Countdown" }),
-          /* @__PURE__ */ jsxs2(
-            "select",
-            {
-              id: "squisq-prompter-countdown",
-              value: prefs.countdownSec,
-              onChange: (e) => setPrefs({ countdownSec: Number(e.target.value) }),
-              children: [
-                /* @__PURE__ */ jsx2("option", { value: 0, children: "Off" }),
-                /* @__PURE__ */ jsx2("option", { value: 3, children: "3s" }),
-                /* @__PURE__ */ jsx2("option", { value: 5, children: "5s" }),
-                /* @__PURE__ */ jsx2("option", { value: 10, children: "10s" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs2("span", { className: "squisq-teleprompter-group", children: [
-          /* @__PURE__ */ jsx2("label", { htmlFor: "squisq-prompter-wpm", children: "Speed" }),
-          /* @__PURE__ */ jsx2(
-            "input",
-            {
-              id: "squisq-prompter-wpm",
-              type: "range",
-              min: 80,
-              max: 260,
-              step: 5,
-              value: prefs.baseWpm,
-              onChange: (e) => setPrefs({ baseWpm: Number(e.target.value) })
-            }
-          ),
-          /* @__PURE__ */ jsxs2("span", { "aria-live": "off", children: [
-            prefs.baseWpm,
-            " wpm"
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxs2("span", { className: "squisq-teleprompter-group", children: [
-          /* @__PURE__ */ jsx2(
-            "button",
-            {
-              type: "button",
-              "aria-pressed": prefs.voiceTracking,
-              onClick: () => {
-                const next = !prefs.voiceTracking;
-                setPrefs({ voiceTracking: next });
-                if (next && mic.status === "idle") void mic.start(prefs.micDeviceId);
-                if (!next && mic.status !== "idle") mic.stop();
-              },
-              title: "Match the prompter speed to your voice (halts when you stop speaking)",
-              children: "\u{1F399} Voice pace"
-            }
-          ),
-          prefs.voiceTracking ? /* @__PURE__ */ jsxs2(Fragment2, { children: [
-            /* @__PURE__ */ jsx2("label", { htmlFor: "squisq-prompter-sensitivity", title: "Voice detection sensitivity", children: "Sens." }),
-            /* @__PURE__ */ jsx2(
-              "input",
-              {
-                id: "squisq-prompter-sensitivity",
-                type: "range",
-                min: 0,
-                max: 1,
-                step: 0.05,
-                value: prefs.vadSensitivity,
-                onChange: (e) => setPrefs({ vadSensitivity: Number(e.target.value) }),
-                style: { width: 70 }
-              }
-            ),
-            /* @__PURE__ */ jsxs2(
-              "select",
-              {
-                "aria-label": "Microphone",
-                value: prefs.micDeviceId ?? "",
-                onChange: (e) => setPrefs({ micDeviceId: e.target.value || null }),
-                children: [
-                  /* @__PURE__ */ jsx2("option", { value: "", children: "Default mic" }),
-                  mic.devices.map((device) => /* @__PURE__ */ jsx2("option", { value: device.deviceId, children: device.label || `Mic ${device.deviceId.slice(0, 6)}` }, device.deviceId))
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsx2(
-              "span",
-              {
-                className: `squisq-teleprompter-meter${controller.voiceActive ? " squisq-teleprompter-meter--voice" : ""}`,
-                role: "meter",
-                "aria-label": "Mic level",
-                "aria-valuemin": 0,
-                "aria-valuemax": 1,
-                "aria-valuenow": Math.round(controller.micLevel * 100) / 100,
-                children: /* @__PURE__ */ jsx2(
-                  "span",
-                  {
-                    className: "squisq-teleprompter-meter-fill",
-                    style: { width: `${Math.round(controller.micLevel * 100)}%` }
-                  }
-                )
-              }
-            ),
-            mic.status === "error" ? /* @__PURE__ */ jsx2("span", { title: mic.error?.message ?? "Microphone unavailable", children: "\u26A0 mic unavailable \u2014 constant speed" }) : null
-          ] }) : null
-        ] }),
-        /* @__PURE__ */ jsxs2("span", { className: "squisq-teleprompter-group", children: [
-          /* @__PURE__ */ jsx2("label", { htmlFor: "squisq-prompter-fontsize", children: "Aa" }),
-          /* @__PURE__ */ jsx2(
-            "input",
-            {
-              id: "squisq-prompter-fontsize",
-              type: "range",
-              min: 28,
-              max: 96,
-              step: 2,
-              value: prefs.fontSizePx,
-              onChange: (e) => setPrefs({ fontSizePx: Number(e.target.value) }),
-              style: { width: 80 },
-              "aria-label": "Prompter font size"
-            }
-          ),
-          /* @__PURE__ */ jsx2(
-            "button",
-            {
-              type: "button",
-              "aria-pressed": prefs.mirrored,
-              onClick: () => setPrefs({ mirrored: !prefs.mirrored }),
-              title: "Mirror for beam-splitter teleprompter rigs (M)",
-              children: "\u21CB Mirror"
-            }
-          ),
-          /* @__PURE__ */ jsx2(
-            "button",
-            {
-              type: "button",
-              "aria-pressed": prefs.lineGuide,
-              onClick: () => setPrefs({ lineGuide: !prefs.lineGuide }),
-              title: "Eye-line guide",
-              children: "\u25B8 Guide"
-            }
-          )
-        ] }),
-        recordSlot,
-        float.supportedTiers.length > 0 ? /* @__PURE__ */ jsx2("span", { className: "squisq-teleprompter-group", style: { marginLeft: "auto" }, children: float.isOpen ? /* @__PURE__ */ jsx2("button", { type: "button", onClick: float.close, children: "\u21E4 Bring back" }) : /* @__PURE__ */ jsxs2(Fragment2, { children: [
-          float.supportedTiers.length > 1 ? /* @__PURE__ */ jsx2(
-            "select",
-            {
-              "aria-label": "Float mode",
-              "data-testid": "teleprompter-float-tier",
-              defaultValue: float.supportedTiers[0],
-              id: "squisq-prompter-float-tier",
-              children: float.supportedTiers.map((tier) => /* @__PURE__ */ jsx2("option", { value: tier, children: TIER_LABELS[tier] }, tier))
-            }
-          ) : null,
-          /* @__PURE__ */ jsx2(
-            "button",
-            {
-              type: "button",
-              onClick: () => {
-                const select = document.getElementById(
-                  "squisq-prompter-float-tier"
-                );
-                const preferred = select?.value ?? void 0;
-                void float.open(preferred);
-              },
-              title: "Pop the prompter out so it can sit next to your camera",
-              children: "\u21F1 Pop out"
-            }
-          )
-        ] }) }) : null
-      ]
-    }
-  );
-}
-
-// src/teleprompter/recording/useNarrationRecorder.ts
-import { useCallback as useCallback4, useEffect as useEffect5, useRef as useRef5, useState as useState4 } from "react";
-import {
-  alignNarration
-} from "@bendyline/squisq/narration";
-var TRACE_INTERVAL_MS = 250;
-function mixdownToMono(buffer) {
-  const channels = buffer.numberOfChannels;
-  if (channels === 1) return buffer.getChannelData(0).slice();
-  const out = new Float32Array(buffer.length);
-  for (let c = 0; c < channels; c++) {
-    const data = buffer.getChannelData(c);
-    for (let i = 0; i < out.length; i++) out[i] += data[i] / channels;
-  }
-  return out;
-}
-var StartAborted = class extends Error {
-  constructor() {
-    super("Narration start aborted");
-    this.name = "StartAborted";
-  }
-};
-function stopRecorder(recorder) {
-  if (recorder.state === "inactive") return Promise.resolve();
-  return new Promise((resolve) => {
-    const done = () => resolve();
-    recorder.addEventListener("stop", done, { once: true });
-    try {
-      recorder.stop();
-    } catch {
-      recorder.removeEventListener("stop", done);
-      resolve();
-    }
-  });
-}
-function useNarrationRecorder(options) {
-  const [state, setState] = useState4("idle");
-  const [error, setError] = useState4(null);
-  const [withCamera, setWithCamera] = useState4(false);
-  const [cameraStream, setCameraStream] = useState4(null);
-  const [take, setTake] = useState4(null);
-  const captureRef = useRef5(null);
-  const processingRef = useRef5(false);
-  const takeRef = useRef5(null);
-  const unmountedRef = useRef5(false);
-  const generationRef = useRef5(0);
-  const startingRef = useRef5(false);
-  const optionsRef = useRef5(options);
-  optionsRef.current = options;
-  const cancelPendingStart = useCallback4(() => {
-    generationRef.current++;
-  }, []);
-  const applyTake = useCallback4((next) => {
-    takeRef.current = next;
-    setTake(next);
-  }, []);
-  const teardownCapture = useCallback4(() => {
-    cancelPendingStart();
-    const capture = captureRef.current;
-    captureRef.current = null;
-    if (!capture) return;
-    if (capture.traceTimer !== null) clearInterval(capture.traceTimer);
-    if (capture.audioRecorder.state !== "inactive") {
-      try {
-        capture.audioRecorder.stop();
-      } catch {
-      }
-    }
-    if (capture.cameraRecorder && capture.cameraRecorder.state !== "inactive") {
-      try {
-        capture.cameraRecorder.stop();
-      } catch {
+    if (capture.cameraRecorder && capture.cameraRecorder.state !== "inactive") {
+      try {
+        capture.cameraRecorder.stop();
+      } catch {
       }
     }
     for (const track of capture.cameraStream?.getTracks() ?? []) track.stop();
@@ -1784,207 +1579,779 @@ function useNarrationRecorder(options) {
         cumulativeSyllables: [0]
       }
     });
-    setState("review");
-  }, [applyTake, cancelPendingStart]);
-  const retake = useCallback4(() => {
-    teardownCapture();
-    applyTake(null);
-    setError(null);
-    setState("idle");
-  }, [applyTake, teardownCapture]);
-  const discard = useCallback4(() => {
-    teardownCapture();
-    applyTake(null);
-    setError(null);
-    setState("idle");
-  }, [applyTake, teardownCapture]);
-  const beginSave = useCallback4(() => setState("saving"), []);
-  const finishSave = useCallback4(
-    (ok, saveError) => {
-      if (ok) {
-        applyTake(null);
-        setError(null);
-        setState("idle");
-      } else {
-        setError(saveError ?? new Error("Save failed"));
-        setState("review");
-      }
-    },
-    [applyTake]
+    setState("review");
+  }, [applyTake, cancelPendingStart]);
+  const retake = useCallback4(() => {
+    teardownCapture();
+    applyTake(null);
+    setError(null);
+    setState("idle");
+  }, [applyTake, teardownCapture]);
+  const discard = useCallback4(() => {
+    teardownCapture();
+    applyTake(null);
+    setError(null);
+    setState("idle");
+  }, [applyTake, teardownCapture]);
+  const beginSave = useCallback4(() => setState("saving"), []);
+  const finishSave = useCallback4(
+    (ok, saveError) => {
+      if (ok) {
+        applyTake(null);
+        setError(null);
+        setState("idle");
+      } else {
+        setError(saveError ?? new Error("Save failed"));
+        setState("review");
+      }
+    },
+    [applyTake]
+  );
+  useEffect5(() => {
+    unmountedRef.current = false;
+    return () => {
+      unmountedRef.current = true;
+      if (processingRef.current) {
+        console.warn(
+          "[squisq-editor] Narration take discarded: the teleprompter was closed while a recording was still being aligned. The audio was not saved."
+        );
+      } else if (takeRef.current) {
+        console.warn(
+          "[squisq-editor] Unsaved narration take discarded: the teleprompter was closed before the take was saved."
+        );
+      }
+      teardownCapture();
+    };
+  }, [teardownCapture]);
+  return {
+    state,
+    error,
+    withCamera,
+    setWithCamera,
+    cameraStream,
+    take,
+    start,
+    stop,
+    retake,
+    discard,
+    beginSave,
+    finishSave
+  };
+}
+
+// src/teleprompter/recording/insertPreamble.ts
+var AUDIO_ANNOTATION_LINE = /^\{\[audio\s[^\]]*\]\}\s*$/;
+var DOCUMENT_ANCHOR = /\banchor=(?:"document"|'document'|document)(?:\s|\]|$)/;
+var CAMERA_LINE = /^<video\s[^>]*src="[^"]*"[^>]*><\/video>\s*$/;
+function isNarrationLine(line) {
+  return AUDIO_ANNOTATION_LINE.test(line) && DOCUMENT_ANCHOR.test(line);
+}
+function quoteSrc(path) {
+  return /[\s"']/.test(path) ? `"${path.replace(/"/g, '\\"')}"` : path;
+}
+function narrationAnnotationLine(audioPath) {
+  return `{[audio src=${quoteSrc(audioPath)} anchor=document]}`;
+}
+function cameraVideoLine(cameraPath) {
+  return `<video src="${cameraPath}" controls width="240"></video>`;
+}
+function insertNarrationPreamble(source, audioPath, cameraPath) {
+  const lines = source.split("\n");
+  let insertAt = 0;
+  if (lines[0]?.trim() === "---") {
+    for (let i = 1; i < lines.length; i++) {
+      if (lines[i].trim() === "---") {
+        insertAt = i + 1;
+        break;
+      }
+    }
+  }
+  let scan = insertAt;
+  while (scan < lines.length && lines[scan].trim() === "") scan++;
+  if (scan < lines.length && isNarrationLine(lines[scan])) {
+    let removeEnd = scan + 1;
+    while (removeEnd < lines.length && lines[removeEnd].trim() === "") removeEnd++;
+    if (removeEnd < lines.length && CAMERA_LINE.test(lines[removeEnd])) removeEnd++;
+    if (removeEnd < lines.length && lines[removeEnd].trim() === "") removeEnd++;
+    lines.splice(insertAt, removeEnd - insertAt);
+  }
+  const inserted = [narrationAnnotationLine(audioPath)];
+  if (cameraPath) {
+    inserted.push("", cameraVideoLine(cameraPath));
+  }
+  const before = lines.slice(0, insertAt);
+  const after = lines.slice(insertAt);
+  if (before.length > 0 && before[before.length - 1].trim() !== "") before.push("");
+  if (after.length > 0 && after[0].trim() !== "") inserted.push("");
+  return [...before, ...inserted, ...after].join("\n");
+}
+
+// src/teleprompter/recording/narrationSave.ts
+import {
+  buildNarrationTimingJson
+} from "@bendyline/squisq/narration";
+function buildNarrationSavePlan(args) {
+  const sidecarPayload = args.alignment ? buildNarrationTimingJson(args.script, args.alignment, args.durationSec, {
+    baseWpm: args.baseWpm,
+    ...args.cameraOffsetSec !== void 0 ? { cameraOffsetSec: args.cameraOffsetSec } : {}
+  }) : {
+    version: 3,
+    sourceText: args.script.sourceText,
+    duration: args.durationSec,
+    bookmarks: [],
+    blocks: [],
+    generator: { name: "squisq-teleprompter", method: "dsp-align", baseWpm: args.baseWpm }
+  };
+  return {
+    audioRelativeName: `audio/${buildFilename("audio", args.audioExt, args.audioBasename)}`,
+    cameraRelativeName: args.cameraExt ? `video/${buildFilename("video", args.cameraExt, "narration-cam")}` : null,
+    sidecarPayload,
+    sidecarPathFor: (savedAudioPath) => timingPathFor(savedAudioPath),
+    nextMarkdown: (currentSource, savedAudioPath, savedCameraPath) => insertNarrationPreamble(currentSource, savedAudioPath, savedCameraPath)
+  };
+}
+async function executeNarrationSave(plan, take, deps, progress = {}) {
+  const audioPath = progress.audioPath ?? await deps.mediaProvider.addMedia(plan.audioRelativeName, take.audioBlob, take.audioMime);
+  progress.audioPath = audioPath;
+  const sidecarPath = progress.sidecarPath ?? plan.sidecarPathFor(audioPath);
+  if (progress.sidecarPath === void 0) {
+    const encoded = encodeTimingJson(plan.sidecarPayload);
+    if (deps.container) {
+      await deps.container.writeFile(sidecarPath, encoded, "application/json");
+    } else {
+      const storedAt = await deps.mediaProvider.addMedia(sidecarPath, encoded, "application/json");
+      if (storedAt !== sidecarPath) {
+        console.warn(
+          `Narration timing sidecar stored at "${storedAt}" instead of "${sidecarPath}"; narration timing will not be discovered until it sits next to the audio file.`
+        );
+      }
+    }
+    progress.sidecarPath = sidecarPath;
+  }
+  let cameraPath = progress.cameraPath ?? null;
+  if (progress.cameraPath === void 0) {
+    if (plan.cameraRelativeName && take.cameraBlob && take.cameraMime) {
+      cameraPath = await deps.mediaProvider.addMedia(
+        plan.cameraRelativeName,
+        take.cameraBlob,
+        take.cameraMime
+      );
+    }
+    progress.cameraPath = cameraPath;
+  }
+  deps.setMarkdownSource(plan.nextMarkdown(deps.getMarkdownSource(), audioPath, cameraPath));
+  deps.bumpMediaRevision();
+  return { audioPath, cameraPath, sidecarPath };
+}
+async function discardNarrationSaveProgress(progress, deps) {
+  const paths = [progress.audioPath, progress.cameraPath ?? void 0].filter(
+    (p) => typeof p === "string"
+  );
+  for (const path of paths) {
+    try {
+      await deps.mediaProvider.removeMedia(path);
+    } catch (err) {
+      console.warn(
+        `Could not remove orphaned narration media "${path}": ` + (err instanceof Error ? err.message : String(err))
+      );
+    }
+  }
+  if (progress.sidecarPath !== void 0 && deps.container) {
+    try {
+      await deps.container.removeFile(progress.sidecarPath);
+    } catch (err) {
+      console.warn(
+        `Could not remove orphaned narration sidecar "${progress.sidecarPath}": ` + (err instanceof Error ? err.message : String(err))
+      );
+    }
+  }
+  delete progress.audioPath;
+  delete progress.cameraPath;
+  delete progress.sidecarPath;
+}
+
+// src/teleprompter/useNarrationStage.ts
+import { useCallback as useCallback5, useEffect as useEffect6, useMemo as useMemo3, useRef as useRef5, useState as useState5 } from "react";
+import { wordIndexAtTime } from "@bendyline/squisq/narration";
+function useNarrationStage(opts) {
+  const { doc, recording = null, getAudioBasename } = opts;
+  const controller = useTeleprompter({ doc });
+  const float = useFloatingWindow(TELEPROMPTER_CSS);
+  const controllerRef = useRef5(controller);
+  controllerRef.current = controller;
+  const [saveNotice, setSaveNotice] = useState5(null);
+  const recorder = useNarrationRecorder({
+    mic: controller.mic,
+    getScript: () => controllerRef.current.script,
+    getWordPos: () => controllerRef.current.wordPos,
+    getMicDeviceId: () => controllerRef.current.prefs.micDeviceId,
+    onRecordingStart: () => controllerRef.current.play(),
+    onRecordingStop: () => controllerRef.current.pause()
+  });
+  const recorderRef = useRef5(recorder);
+  recorderRef.current = recorder;
+  const recordingRef = useRef5(recording);
+  recordingRef.current = recording;
+  const getAudioBasenameRef = useRef5(getAudioBasename);
+  getAudioBasenameRef.current = getAudioBasename;
+  const saveProgressRef = useRef5(null);
+  const progressForTake = useCallback5((take) => {
+    const existing = saveProgressRef.current;
+    if (existing && existing.take === take) return existing.progress;
+    const fresh = { take, progress: {} };
+    saveProgressRef.current = fresh;
+    return fresh.progress;
+  }, []);
+  const cleanupAbandonedSave = useCallback5(() => {
+    const pending = saveProgressRef.current;
+    saveProgressRef.current = null;
+    const deps = recordingRef.current;
+    if (!pending || !deps) return;
+    if (pending.progress.audioPath === void 0 && pending.progress.sidecarPath === void 0) {
+      return;
+    }
+    void discardNarrationSaveProgress(pending.progress, {
+      mediaProvider: deps.mediaProvider,
+      container: deps.container
+    });
+  }, []);
+  const handleRetake = useCallback5(() => {
+    cleanupAbandonedSave();
+    recorderRef.current.retake();
+  }, [cleanupAbandonedSave]);
+  const handleDiscard = useCallback5(() => {
+    cleanupAbandonedSave();
+    recorderRef.current.discard();
+  }, [cleanupAbandonedSave]);
+  const reviewAudioUrl = useMemo3(
+    () => recorder.take ? URL.createObjectURL(recorder.take.audioBlob) : null,
+    [recorder.take]
   );
-  useEffect5(() => {
-    unmountedRef.current = false;
+  useEffect6(() => {
     return () => {
-      unmountedRef.current = true;
-      if (processingRef.current) {
-        console.warn(
-          "[squisq-editor] Narration take discarded: the teleprompter was closed while a recording was still being aligned. The audio was not saved."
-        );
-      } else if (takeRef.current) {
-        console.warn(
-          "[squisq-editor] Unsaved narration take discarded: the teleprompter was closed before the take was saved."
-        );
-      }
-      teardownCapture();
+      if (reviewAudioUrl) URL.revokeObjectURL(reviewAudioUrl);
     };
-  }, [teardownCapture]);
+  }, [reviewAudioUrl]);
+  const handleReviewTimeUpdate = useCallback5((event) => {
+    const alignment = recorderRef.current.take?.alignment;
+    if (!alignment || alignment.words.length === 0) return;
+    controllerRef.current.seekToToken(
+      wordIndexAtTime(alignment.words, event.currentTarget.currentTime)
+    );
+  }, []);
+  const handleSave = useCallback5(async () => {
+    const take = recorderRef.current.take;
+    if (!take || !recording) return;
+    recorderRef.current.beginSave();
+    try {
+      const basename = getAudioBasenameRef.current?.();
+      const plan = buildNarrationSavePlan({
+        script: take.script,
+        alignment: take.alignment,
+        durationSec: take.durationSec,
+        audioExt: take.audioExt,
+        cameraExt: take.cameraExt,
+        baseWpm: controllerRef.current.prefs.baseWpm,
+        ...take.cameraOffsetSec !== void 0 ? { cameraOffsetSec: take.cameraOffsetSec } : {},
+        ...basename ? { audioBasename: basename } : {}
+      });
+      const result = await executeNarrationSave(
+        plan,
+        take,
+        {
+          mediaProvider: recording.mediaProvider,
+          container: recording.container,
+          getMarkdownSource: () => recordingRef.current?.markdownSource ?? "",
+          setMarkdownSource: recording.setMarkdownSource,
+          bumpMediaRevision: recording.bumpMediaRevision
+        },
+        progressForTake(take)
+      );
+      saveProgressRef.current = null;
+      recorderRef.current.finishSave(true);
+      setSaveNotice(
+        `Saved ${result.audioPath}${take.alignment ? " \u2014 blocks re-timed to your voice" : ""}`
+      );
+    } catch (err) {
+      recorderRef.current.finishSave(false, err instanceof Error ? err : new Error(String(err)));
+    }
+  }, [recording, progressForTake]);
+  const dismissSaveNotice = useCallback5(() => setSaveNotice(null), []);
   return {
-    state,
-    error,
-    withCamera,
-    setWithCamera,
-    cameraStream,
-    take,
-    start,
-    stop,
-    retake,
-    discard,
-    beginSave,
-    finishSave
+    controller,
+    float,
+    recorder,
+    recording,
+    saveNotice,
+    dismissSaveNotice,
+    handleSave,
+    handleRetake,
+    handleDiscard,
+    reviewAudioUrl,
+    handleReviewTimeUpdate
   };
 }
 
-// src/teleprompter/recording/insertPreamble.ts
-var AUDIO_ANNOTATION_LINE = /^\{\[audio\s[^\]]*\]\}\s*$/;
-var DOCUMENT_ANCHOR = /\banchor=(?:"document"|'document'|document)(?:\s|\]|$)/;
-var CAMERA_LINE = /^<video\s[^>]*src="[^"]*"[^>]*><\/video>\s*$/;
-function isNarrationLine(line) {
-  return AUDIO_ANNOTATION_LINE.test(line) && DOCUMENT_ANCHOR.test(line);
+// src/teleprompter/scrollModel.ts
+var EYE_LINE_FRACTION = 0.35;
+var MAX_SCROLL_PX_PER_SEC = 2600;
+function measureTokenLines(scrollColumn) {
+  const spans = scrollColumn.querySelectorAll("[data-token-idx]");
+  const tokenTops = new Array(spans.length);
+  const tokenHeights = new Array(spans.length);
+  const columnRect = scrollColumn.getBoundingClientRect();
+  spans.forEach((span) => {
+    const idx = Number(span.dataset.tokenIdx);
+    if (!Number.isFinite(idx)) return;
+    const rect = span.getBoundingClientRect();
+    tokenTops[idx] = rect.top - columnRect.top;
+    tokenHeights[idx] = rect.height;
+  });
+  return { tokenTops, tokenHeights };
 }
-function quoteSrc(path) {
-  return /[\s"']/.test(path) ? `"${path.replace(/"/g, '\\"')}"` : path;
+function targetOffsetFor(wordPos, lines, viewportHeightPx, eyeLine = EYE_LINE_FRACTION) {
+  const count = lines.tokenTops.length;
+  if (count === 0) return 0;
+  const clamped = Math.min(Math.max(wordPos, 0), count - 1);
+  const idx = Math.floor(clamped);
+  const frac = clamped - idx;
+  const top = lines.tokenTops[idx] ?? 0;
+  const nextTop = lines.tokenTops[Math.min(idx + 1, count - 1)] ?? top;
+  const y = top + (nextTop - top) * frac;
+  const lineHeight = lines.tokenHeights[idx] ?? 0;
+  return Math.max(0, y + lineHeight / 2 - viewportHeightPx * eyeLine);
 }
-function narrationAnnotationLine(audioPath) {
-  return `{[audio src=${quoteSrc(audioPath)} anchor=document]}`;
+function stepScroll(currentPx, targetPx, dtMs, maxPxPerSec = MAX_SCROLL_PX_PER_SEC) {
+  const dt = Math.min(Math.max(dtMs, 0), 250) / 1e3;
+  if (dt === 0) return currentPx;
+  const blend = 1 - Math.exp(-dt / 0.18);
+  let next = currentPx + (targetPx - currentPx) * blend;
+  const maxStep = maxPxPerSec * dt;
+  if (next - currentPx > maxStep) next = currentPx + maxStep;
+  else if (currentPx - next > maxStep) next = currentPx - maxStep;
+  return Math.abs(next - targetPx) < 0.25 ? targetPx : next;
 }
-function cameraVideoLine(cameraPath) {
-  return `<video src="${cameraPath}" controls width="240"></video>`;
+
+// src/teleprompter/TeleprompterSurface.tsx
+import { memo, useEffect as useEffect7, useMemo as useMemo4, useRef as useRef6 } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var WHEEL_NUDGE_INTERVAL_MS = 60;
+function groupScript(script) {
+  return script.blocks.map((range) => {
+    const paragraphs = [];
+    let current = [];
+    for (let i = range.tokenStart; i < range.tokenEnd; i++) {
+      current.push(i);
+      if (script.tokens[i].pauseAfter >= 2 && i < range.tokenEnd - 1) {
+        paragraphs.push({ key: `${range.blockId}-${paragraphs.length}`, tokenIndexes: current });
+        current = [];
+      }
+    }
+    if (current.length > 0) {
+      paragraphs.push({ key: `${range.blockId}-${paragraphs.length}`, tokenIndexes: current });
+    }
+    const group = { blockId: range.blockId, paragraphs };
+    if (range.heading !== void 0) group.heading = range.heading;
+    return group;
+  });
 }
-function insertNarrationPreamble(source, audioPath, cameraPath) {
-  const lines = source.split("\n");
-  let insertAt = 0;
-  if (lines[0]?.trim() === "---") {
-    for (let i = 1; i < lines.length; i++) {
-      if (lines[i].trim() === "---") {
-        insertAt = i + 1;
+var ScriptColumn = memo(function ScriptColumn2({
+  script,
+  compact
+}) {
+  const groups = useMemo4(() => groupScript(script), [script]);
+  return /* @__PURE__ */ jsx(Fragment, { children: groups.map((group) => /* @__PURE__ */ jsxs("section", { "data-block-id": group.blockId, children: [
+    !compact && group.heading ? /* @__PURE__ */ jsx("span", { className: "squisq-teleprompter-block-marker", children: group.heading }) : null,
+    group.paragraphs.map((paragraph) => /* @__PURE__ */ jsx("p", { className: "squisq-teleprompter-para", children: paragraph.tokenIndexes.map((idx) => /* @__PURE__ */ jsxs("span", { className: "squisq-teleprompter-word", "data-token-idx": idx, children: [
+      script.tokens[idx].text,
+      " "
+    ] }, idx)) }, paragraph.key))
+  ] }, group.blockId)) });
+});
+function TeleprompterSurface({
+  script,
+  wordPos,
+  fontSizePx,
+  mirrored,
+  lineGuide,
+  countdownRemaining,
+  recordingIndicator,
+  theme,
+  compact = false,
+  onSeekToken,
+  onNudge,
+  onToggleAutoAdvance
+}) {
+  const surfaceRef = useRef6(null);
+  const columnRef = useRef6(null);
+  const wordPosRef = useRef6(wordPos);
+  wordPosRef.current = wordPos;
+  const vars = useMemo4(() => prompterVarsFromTheme(theme), [theme]);
+  useEffect7(() => {
+    const doc = surfaceRef.current?.ownerDocument;
+    if (doc) ensureTeleprompterStyles(doc);
+  }, []);
+  useEffect7(() => {
+    const surface = surfaceRef.current;
+    if (!surface || !onNudge) return;
+    let lastNudgeAt = Number.NEGATIVE_INFINITY;
+    let lastDirection = 0;
+    const handleWheel = (event) => {
+      if (event.ctrlKey || event.metaKey || event.altKey || event.deltaY === 0) return;
+      const direction = Math.sign(event.deltaY);
+      event.preventDefault();
+      if (direction === lastDirection && event.timeStamp - lastNudgeAt < WHEEL_NUDGE_INTERVAL_MS) {
+        return;
+      }
+      onNudge(direction);
+      lastNudgeAt = event.timeStamp;
+      lastDirection = direction;
+    };
+    surface.addEventListener("wheel", handleWheel, { passive: false });
+    return () => surface.removeEventListener("wheel", handleWheel);
+  }, [onNudge]);
+  useEffect7(() => {
+    const surface = surfaceRef.current;
+    const column = columnRef.current;
+    if (!surface || !column) return;
+    const win = surface.ownerDocument.defaultView ?? window;
+    let lines = null;
+    let spans = [];
+    let activeIdx = -1;
+    let offset = 0;
+    let lastTime = performance.now();
+    let raf = 0;
+    const tokens = script.tokens;
+    const spokenAt = new Int32Array(tokens.length);
+    let lastSpoken = -1;
+    for (let i = 0; i < tokens.length; i++) {
+      if (tokens[i].spoken) lastSpoken = i;
+      spokenAt[i] = lastSpoken;
+    }
+    let firstSpoken = -1;
+    for (let i = 0; i < tokens.length; i++) {
+      if (tokens[i].spoken) {
+        firstSpoken = i;
         break;
       }
     }
-  }
-  let scan = insertAt;
-  while (scan < lines.length && lines[scan].trim() === "") scan++;
-  if (scan < lines.length && isNarrationLine(lines[scan])) {
-    let removeEnd = scan + 1;
-    while (removeEnd < lines.length && lines[removeEnd].trim() === "") removeEnd++;
-    if (removeEnd < lines.length && CAMERA_LINE.test(lines[removeEnd])) removeEnd++;
-    if (removeEnd < lines.length && lines[removeEnd].trim() === "") removeEnd++;
-    lines.splice(insertAt, removeEnd - insertAt);
-  }
-  const inserted = [narrationAnnotationLine(audioPath)];
-  if (cameraPath) {
-    inserted.push("", cameraVideoLine(cameraPath));
-  }
-  const before = lines.slice(0, insertAt);
-  const after = lines.slice(insertAt);
-  if (before.length > 0 && before[before.length - 1].trim() !== "") before.push("");
-  if (after.length > 0 && after[0].trim() !== "") inserted.push("");
-  return [...before, ...inserted, ...after].join("\n");
+    for (let i = 0; i < tokens.length && spokenAt[i] === -1; i++) spokenAt[i] = firstSpoken;
+    const remeasure = () => {
+      lines = measureTokenLines(column);
+      spans = Array.from(column.querySelectorAll("[data-token-idx]"));
+    };
+    remeasure();
+    const applyHighlight = (nextIdx) => {
+      if (nextIdx === activeIdx) return;
+      const lo = Math.min(activeIdx, nextIdx);
+      const hi = Math.max(activeIdx, nextIdx);
+      for (let i = Math.max(0, lo); i <= hi && i < spans.length; i++) {
+        const span = spans[i];
+        if (!span) continue;
+        span.classList.toggle("squisq-teleprompter-word--active", i === nextIdx);
+        span.classList.toggle("squisq-teleprompter-word--read", i < nextIdx);
+      }
+      activeIdx = nextIdx;
+    };
+    const loop = (now) => {
+      const dtMs = now - lastTime;
+      lastTime = now;
+      const pos = wordPosRef.current;
+      const clampedIdx = Math.min(Math.max(Math.floor(pos), 0), spans.length - 1);
+      const highlightIdx = clampedIdx < spokenAt.length && spokenAt[clampedIdx] >= 0 ? spokenAt[clampedIdx] : clampedIdx;
+      if (spans.length > 0) applyHighlight(highlightIdx);
+      if (lines) {
+        const target = targetOffsetFor(pos, lines, surface.clientHeight);
+        offset = stepScroll(offset, target, dtMs);
+        column.style.transform = `translateY(${-offset}px)`;
+      }
+      raf = win.requestAnimationFrame(loop);
+    };
+    raf = win.requestAnimationFrame(loop);
+    const resizeObserver = typeof ResizeObserver !== "undefined" ? new ResizeObserver(remeasure) : null;
+    resizeObserver?.observe(surface);
+    return () => {
+      win.cancelAnimationFrame(raf);
+      resizeObserver?.disconnect();
+    };
+  }, [script, fontSizePx, compact]);
+  const handleDoubleClick = onSeekToken ? (event) => {
+    const target = event.target;
+    const span = target?.closest("[data-token-idx]");
+    if (!span) return;
+    const idx = Number(span.dataset.tokenIdx);
+    if (Number.isFinite(idx)) onSeekToken(idx);
+  } : void 0;
+  const handleMouseDown = onToggleAutoAdvance ? (event) => {
+    if (event.button !== 1) return;
+    event.preventDefault();
+    onToggleAutoAdvance();
+  } : void 0;
+  const handleAuxClick = onToggleAutoAdvance ? (event) => {
+    if (event.button === 1) event.preventDefault();
+  } : void 0;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: surfaceRef,
+      className: `squisq-teleprompter-surface${mirrored ? " squisq-teleprompter-surface--mirrored" : ""}`,
+      style: { ...vars, fontSize: `${fontSizePx}px` },
+      "data-testid": "teleprompter-surface",
+      tabIndex: 0,
+      "aria-label": "Teleprompter script; left and right arrows or the mouse wheel adjust the word position; up starts automatic advancement; down stops it; press the mouse wheel to toggle it; double-click a word to jump",
+      onMouseDown: handleMouseDown,
+      onAuxClick: handleAuxClick,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "squisq-teleprompter-flip", children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            ref: columnRef,
+            className: "squisq-teleprompter-scroll",
+            style: compact ? { padding: "30vh 5% 60vh" } : void 0,
+            onDoubleClick: handleDoubleClick,
+            children: /* @__PURE__ */ jsx(ScriptColumn, { script, compact })
+          }
+        ) }),
+        lineGuide ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "squisq-teleprompter-guide-band",
+              style: { top: `calc(${EYE_LINE_FRACTION * 100}% - 0.75em)`, height: "1.5em" }
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "squisq-teleprompter-line-guide",
+              style: { top: `calc(${EYE_LINE_FRACTION * 100}% - 0.75em)`, height: "1.5em" }
+            }
+          )
+        ] }) : null,
+        countdownRemaining !== null ? /* @__PURE__ */ jsx("div", { className: "squisq-teleprompter-countdown", children: /* @__PURE__ */ jsx("span", { className: "squisq-teleprompter-countdown-digit", children: countdownRemaining }) }) : null,
+        recordingIndicator ? /* @__PURE__ */ jsx("div", { className: "squisq-teleprompter-recdot" }) : null
+      ]
+    }
+  );
 }
 
-// src/teleprompter/recording/narrationSave.ts
-import {
-  buildNarrationTimingJson
-} from "@bendyline/squisq/narration";
-function buildNarrationSavePlan(args) {
-  const sidecarPayload = args.alignment ? buildNarrationTimingJson(args.script, args.alignment, args.durationSec, {
-    baseWpm: args.baseWpm,
-    ...args.cameraOffsetSec !== void 0 ? { cameraOffsetSec: args.cameraOffsetSec } : {}
-  }) : {
-    version: 3,
-    sourceText: args.script.sourceText,
-    duration: args.durationSec,
-    bookmarks: [],
-    blocks: [],
-    generator: { name: "squisq-teleprompter", method: "dsp-align", baseWpm: args.baseWpm }
-  };
-  return {
-    audioRelativeName: `audio/${buildFilename("audio", args.audioExt)}`,
-    cameraRelativeName: args.cameraExt ? `video/${buildFilename("video", args.cameraExt, "narration-cam")}` : null,
-    sidecarPayload,
-    sidecarPathFor: (savedAudioPath) => timingPathFor(savedAudioPath),
-    nextMarkdown: (currentSource, savedAudioPath, savedCameraPath) => insertNarrationPreamble(currentSource, savedAudioPath, savedCameraPath)
-  };
-}
-async function executeNarrationSave(plan, take, deps, progress = {}) {
-  const audioPath = progress.audioPath ?? await deps.mediaProvider.addMedia(plan.audioRelativeName, take.audioBlob, take.audioMime);
-  progress.audioPath = audioPath;
-  const sidecarPath = progress.sidecarPath ?? plan.sidecarPathFor(audioPath);
-  if (progress.sidecarPath === void 0) {
-    const encoded = encodeTimingJson(plan.sidecarPayload);
-    if (deps.container) {
-      await deps.container.writeFile(sidecarPath, encoded, "application/json");
-    } else {
-      const storedAt = await deps.mediaProvider.addMedia(sidecarPath, encoded, "application/json");
-      if (storedAt !== sidecarPath) {
-        console.warn(
-          `Narration timing sidecar stored at "${storedAt}" instead of "${sidecarPath}"; narration timing will not be discovered until it sits next to the audio file.`
-        );
-      }
-    }
-    progress.sidecarPath = sidecarPath;
-  }
-  let cameraPath = progress.cameraPath ?? null;
-  if (progress.cameraPath === void 0) {
-    if (plan.cameraRelativeName && take.cameraBlob && take.cameraMime) {
-      cameraPath = await deps.mediaProvider.addMedia(
-        plan.cameraRelativeName,
-        take.cameraBlob,
-        take.cameraMime
-      );
+// src/teleprompter/TeleprompterControls.tsx
+import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var TIER_LABELS = {
+  "document-pip": "Floating window (always on top)",
+  "video-pip": "Picture-in-picture (read-only)",
+  popup: "Popup window",
+  docked: "Docked"
+};
+function TeleprompterControls({
+  controller,
+  float,
+  recordSlot,
+  showPlayPause = true
+}) {
+  const { transport, prefs, setPrefs, mic } = controller;
+  const rolling = transport === "rolling" || transport === "countdown";
+  const voiceLive = prefs.voiceTracking && mic.status === "live";
+  return /* @__PURE__ */ jsxs2(
+    "div",
+    {
+      className: "squisq-teleprompter-controls",
+      "data-testid": "teleprompter-controls",
+      "data-mic-status": mic.status,
+      "data-transport": transport,
+      "data-voice-live": voiceLive || void 0,
+      children: [
+        /* @__PURE__ */ jsxs2("span", { className: "squisq-teleprompter-group", children: [
+          showPlayPause ? /* @__PURE__ */ jsx2(
+            "button",
+            {
+              type: "button",
+              onClick: () => rolling ? controller.pause() : controller.play(),
+              "aria-label": rolling ? "Pause prompter" : "Start prompter",
+              children: rolling ? "\u23F8 Pause" : transport === "paused" ? "\u25B6 Resume" : "\u25B6 Start"
+            }
+          ) : null,
+          /* @__PURE__ */ jsx2("button", { type: "button", onClick: controller.restart, "aria-label": "Restart prompter", children: "\u27F2 Restart" })
+        ] }),
+        /* @__PURE__ */ jsxs2("span", { className: "squisq-teleprompter-group", children: [
+          /* @__PURE__ */ jsx2("label", { htmlFor: "squisq-prompter-countdown", children: "Countdown" }),
+          /* @__PURE__ */ jsxs2(
+            "select",
+            {
+              id: "squisq-prompter-countdown",
+              value: prefs.countdownSec,
+              onChange: (e) => setPrefs({ countdownSec: Number(e.target.value) }),
+              children: [
+                /* @__PURE__ */ jsx2("option", { value: 0, children: "Off" }),
+                /* @__PURE__ */ jsx2("option", { value: 3, children: "3s" }),
+                /* @__PURE__ */ jsx2("option", { value: 5, children: "5s" }),
+                /* @__PURE__ */ jsx2("option", { value: 10, children: "10s" })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs2("span", { className: "squisq-teleprompter-group", children: [
+          /* @__PURE__ */ jsx2("label", { htmlFor: "squisq-prompter-wpm", children: "Speed" }),
+          /* @__PURE__ */ jsx2(
+            "input",
+            {
+              id: "squisq-prompter-wpm",
+              type: "range",
+              min: TELEPROMPTER_PREF_LIMITS.baseWpm.min,
+              max: TELEPROMPTER_PREF_LIMITS.baseWpm.max,
+              step: 5,
+              value: prefs.baseWpm,
+              onChange: (e) => setPrefs({ baseWpm: Number(e.target.value) })
+            }
+          ),
+          /* @__PURE__ */ jsxs2("span", { "aria-live": "off", children: [
+            prefs.baseWpm,
+            " wpm"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs2("span", { className: "squisq-teleprompter-group", children: [
+          /* @__PURE__ */ jsx2(
+            "button",
+            {
+              type: "button",
+              "aria-pressed": prefs.voiceTracking,
+              onClick: () => {
+                const next = !prefs.voiceTracking;
+                setPrefs({ voiceTracking: next });
+                if (next && mic.status === "idle") void mic.start(prefs.micDeviceId);
+                if (!next && mic.status !== "idle") mic.stop();
+              },
+              title: "Match the prompter speed to your voice (halts when you stop speaking)",
+              children: "\u{1F399} Voice pace"
+            }
+          ),
+          prefs.voiceTracking ? /* @__PURE__ */ jsxs2(Fragment2, { children: [
+            /* @__PURE__ */ jsx2("label", { htmlFor: "squisq-prompter-sensitivity", title: "Voice detection sensitivity", children: "Sens." }),
+            /* @__PURE__ */ jsx2(
+              "input",
+              {
+                id: "squisq-prompter-sensitivity",
+                type: "range",
+                min: TELEPROMPTER_PREF_LIMITS.vadSensitivity.min,
+                max: TELEPROMPTER_PREF_LIMITS.vadSensitivity.max,
+                step: 0.05,
+                value: prefs.vadSensitivity,
+                onChange: (e) => setPrefs({ vadSensitivity: Number(e.target.value) }),
+                style: { width: 70 }
+              }
+            ),
+            /* @__PURE__ */ jsxs2(
+              "select",
+              {
+                "aria-label": "Microphone",
+                value: prefs.micDeviceId ?? "",
+                onChange: (e) => setPrefs({ micDeviceId: e.target.value || null }),
+                children: [
+                  /* @__PURE__ */ jsx2("option", { value: "", children: "Default mic" }),
+                  mic.devices.map((device) => /* @__PURE__ */ jsx2("option", { value: device.deviceId, children: device.label || `Mic ${device.deviceId.slice(0, 6)}` }, device.deviceId))
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx2(
+              "span",
+              {
+                className: `squisq-teleprompter-meter${controller.voiceActive ? " squisq-teleprompter-meter--voice" : ""}`,
+                role: "meter",
+                "aria-label": "Mic level",
+                "aria-valuemin": 0,
+                "aria-valuemax": 1,
+                "aria-valuenow": Math.round(controller.micLevel * 100) / 100,
+                children: /* @__PURE__ */ jsx2(
+                  "span",
+                  {
+                    className: "squisq-teleprompter-meter-fill",
+                    style: { width: `${Math.round(controller.micLevel * 100)}%` }
+                  }
+                )
+              }
+            ),
+            mic.status === "error" ? /* @__PURE__ */ jsx2("span", { title: mic.error?.message ?? "Microphone unavailable", children: "\u26A0 mic unavailable \u2014 constant speed" }) : null
+          ] }) : null
+        ] }),
+        /* @__PURE__ */ jsxs2("span", { className: "squisq-teleprompter-group", children: [
+          /* @__PURE__ */ jsx2("label", { htmlFor: "squisq-prompter-fontsize", children: "Aa" }),
+          /* @__PURE__ */ jsx2(
+            "input",
+            {
+              id: "squisq-prompter-fontsize",
+              type: "range",
+              min: TELEPROMPTER_PREF_LIMITS.fontSizePx.min,
+              max: TELEPROMPTER_PREF_LIMITS.fontSizePx.max,
+              step: 2,
+              value: prefs.fontSizePx,
+              onChange: (e) => setPrefs({ fontSizePx: Number(e.target.value) }),
+              style: { width: 80 },
+              "aria-label": "Prompter font size"
+            }
+          ),
+          /* @__PURE__ */ jsx2(
+            "button",
+            {
+              type: "button",
+              "aria-pressed": prefs.mirrored,
+              onClick: () => setPrefs({ mirrored: !prefs.mirrored }),
+              title: "Mirror for beam-splitter teleprompter rigs (M)",
+              children: "\u21CB Mirror"
+            }
+          ),
+          /* @__PURE__ */ jsx2(
+            "button",
+            {
+              type: "button",
+              "aria-pressed": prefs.lineGuide,
+              onClick: () => setPrefs({ lineGuide: !prefs.lineGuide }),
+              title: "Eye-line guide",
+              children: "\u25B8 Guide"
+            }
+          )
+        ] }),
+        recordSlot,
+        float.supportedTiers.length > 0 ? /* @__PURE__ */ jsx2("span", { className: "squisq-teleprompter-group", style: { marginLeft: "auto" }, children: float.isOpen ? /* @__PURE__ */ jsx2("button", { type: "button", onClick: float.close, children: "\u21E4 Bring back" }) : /* @__PURE__ */ jsxs2(Fragment2, { children: [
+          float.supportedTiers.length > 1 ? /* @__PURE__ */ jsx2(
+            "select",
+            {
+              "aria-label": "Float mode",
+              "data-testid": "teleprompter-float-tier",
+              defaultValue: float.supportedTiers[0],
+              id: "squisq-prompter-float-tier",
+              children: float.supportedTiers.map((tier) => /* @__PURE__ */ jsx2("option", { value: tier, children: TIER_LABELS[tier] }, tier))
+            }
+          ) : null,
+          /* @__PURE__ */ jsx2(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                const select = document.getElementById(
+                  "squisq-prompter-float-tier"
+                );
+                const preferred = select?.value ?? void 0;
+                void float.open(preferred);
+              },
+              title: "Pop the prompter out so it can sit next to your camera",
+              children: "\u21F1 Pop out"
+            }
+          )
+        ] }) }) : null
+      ]
     }
-    progress.cameraPath = cameraPath;
-  }
-  deps.setMarkdownSource(plan.nextMarkdown(deps.getMarkdownSource(), audioPath, cameraPath));
-  deps.bumpMediaRevision();
-  return { audioPath, cameraPath, sidecarPath };
-}
-async function discardNarrationSaveProgress(progress, deps) {
-  const paths = [progress.audioPath, progress.cameraPath ?? void 0].filter(
-    (p) => typeof p === "string"
   );
-  for (const path of paths) {
-    try {
-      await deps.mediaProvider.removeMedia(path);
-    } catch (err) {
-      console.warn(
-        `Could not remove orphaned narration media "${path}": ` + (err instanceof Error ? err.message : String(err))
-      );
-    }
-  }
-  if (progress.sidecarPath !== void 0 && deps.container) {
-    try {
-      await deps.container.removeFile(progress.sidecarPath);
-    } catch (err) {
-      console.warn(
-        `Could not remove orphaned narration sidecar "${progress.sidecarPath}": ` + (err instanceof Error ? err.message : String(err))
-      );
-    }
-  }
-  delete progress.audioPath;
-  delete progress.cameraPath;
-  delete progress.sidecarPath;
 }
 
-// src/teleprompter/TeleprompterView.tsx
-import { useCallback as useCallback5, useEffect as useEffect6, useMemo as useMemo4, useRef as useRef7, useState as useState5 } from "react";
+// src/teleprompter/NarrationStage.tsx
+import { useCallback as useCallback6, useEffect as useEffect8, useMemo as useMemo5, useRef as useRef8 } from "react";
 import { createPortal } from "react-dom";
-import { wordIndexAtTime } from "@bendyline/squisq/narration";
 
 // src/teleprompter/TeleprompterSelfView.tsx
-import { useRef as useRef6 } from "react";
+import { useRef as useRef7 } from "react";
 import { jsx as jsx3 } from "react/jsx-runtime";
 function TeleprompterSelfView({ stream }) {
-  const videoRef = useRef6(null);
+  const videoRef = useRef7(null);
   useStreamPreview(videoRef, stream);
   if (!stream) return null;
   return /* @__PURE__ */ jsx3(
@@ -2113,65 +2480,55 @@ function drawPrompterFrame(canvas, frame) {
   }
 }
 
-// src/teleprompter/TeleprompterView.tsx
+// src/teleprompter/NarrationStage.tsx
 import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-function TeleprompterView(props) {
-  const { doc, theme, presentationTarget = null, recording = null } = props;
-  const controller = useTeleprompter({ doc });
-  const float = useFloatingWindow(TELEPROMPTER_CSS);
-  const rootRef = useRef7(null);
-  const controllerRef = useRef7(controller);
+function NarrationStage(props) {
+  const {
+    stage,
+    theme,
+    presentationTarget = null,
+    showSelfView = true,
+    showCameraToggleInRecordSlot = true,
+    showRecordSlot = true,
+    showTransportPlay = true,
+    showReviewActions = true
+  } = props;
+  const { controller, float, recorder, recording } = stage;
+  const rootRef = useRef8(null);
+  const controllerRef = useRef8(controller);
   controllerRef.current = controller;
-  const [saveNotice, setSaveNotice] = useState5(null);
-  const recorder = useNarrationRecorder({
-    mic: controller.mic,
-    getScript: () => controllerRef.current.script,
-    getWordPos: () => controllerRef.current.wordPos,
-    getMicDeviceId: () => controllerRef.current.prefs.micDeviceId,
-    onRecordingStart: () => controllerRef.current.play(),
-    onRecordingStop: () => controllerRef.current.pause()
-  });
-  const recorderRef = useRef7(recorder);
-  recorderRef.current = recorder;
-  const recordingRef = useRef7(recording);
-  recordingRef.current = recording;
-  const saveProgressRef = useRef7(null);
-  const progressForTake = useCallback5((take) => {
-    const existing = saveProgressRef.current;
-    if (existing && existing.take === take) return existing.progress;
-    const fresh = { take, progress: {} };
-    saveProgressRef.current = fresh;
-    return fresh.progress;
-  }, []);
-  const cleanupAbandonedSave = useCallback5(() => {
-    const pending = saveProgressRef.current;
-    saveProgressRef.current = null;
-    const deps = recordingRef.current;
-    if (!pending || !deps) return;
-    if (pending.progress.audioPath === void 0 && pending.progress.sidecarPath === void 0) {
-      return;
-    }
-    void discardNarrationSaveProgress(pending.progress, {
-      mediaProvider: deps.mediaProvider,
-      container: deps.container
-    });
+  const toggleAutoAdvance = useCallback6(() => {
+    const current = controllerRef.current;
+    if (current.transport === "rolling" || current.transport === "countdown") current.pause();
+    else current.play();
   }, []);
-  const handleRetake = useCallback5(() => {
-    cleanupAbandonedSave();
-    recorderRef.current.retake();
-  }, [cleanupAbandonedSave]);
-  const handleDiscard = useCallback5(() => {
-    cleanupAbandonedSave();
-    recorderRef.current.discard();
-  }, [cleanupAbandonedSave]);
-  useEffect6(() => {
+  useEffect8(() => {
     const ownerDoc = rootRef.current?.ownerDocument;
     if (ownerDoc) ensureTeleprompterStyles(ownerDoc);
   }, []);
-  useEffect6(() => {
+  useEffect8(() => {
     if (presentationTarget) ensureTeleprompterStyles(presentationTarget.ownerDocument);
   }, [presentationTarget]);
-  const canvasFrameRef = useRef7(null);
+  useEffect8(() => {
+    if (!controller.script) return;
+    const documents = /* @__PURE__ */ new Set();
+    const ownerDocument = rootRef.current?.ownerDocument;
+    if (ownerDocument) documents.add(ownerDocument);
+    if (float.portalTarget) documents.add(float.portalTarget.ownerDocument);
+    if (presentationTarget) documents.add(presentationTarget.ownerDocument);
+    const handleKeyDown = (event) => {
+      controllerRef.current.handleKeyDown(event);
+    };
+    for (const targetDocument of documents) {
+      targetDocument.addEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      for (const targetDocument of documents) {
+        targetDocument.removeEventListener("keydown", handleKeyDown);
+      }
+    };
+  }, [controller.script, float.portalTarget, presentationTarget]);
+  const canvasFrameRef = useRef8(null);
   canvasFrameRef.current = controller.script ? {
     script: controller.script,
     fontSizePx: controller.prefs.fontSizePx,
@@ -2185,7 +2542,7 @@ function TeleprompterView(props) {
     countdownRemaining: controller.countdownRemaining,
     recording: recorder.state === "recording"
   } : null;
-  useEffect6(() => {
+  useEffect8(() => {
     const sink = float.canvasSink;
     if (float.tier !== "video-pip" || !sink) return;
     const draw = (wordPos) => {
@@ -2202,58 +2559,7 @@ function TeleprompterView(props) {
       clearInterval(interval);
     };
   }, [float.tier, float.canvasSink]);
-  const reviewAudioUrl = useMemo4(
-    () => recorder.take ? URL.createObjectURL(recorder.take.audioBlob) : null,
-    [recorder.take]
-  );
-  useEffect6(() => {
-    return () => {
-      if (reviewAudioUrl) URL.revokeObjectURL(reviewAudioUrl);
-    };
-  }, [reviewAudioUrl]);
-  const handleReviewTimeUpdate = useCallback5((event) => {
-    const alignment = recorderRef.current.take?.alignment;
-    if (!alignment || alignment.words.length === 0) return;
-    controllerRef.current.seekToToken(
-      wordIndexAtTime(alignment.words, event.currentTarget.currentTime)
-    );
-  }, []);
-  const handleSave = useCallback5(async () => {
-    const take = recorderRef.current.take;
-    if (!take || !recording) return;
-    recorderRef.current.beginSave();
-    try {
-      const plan = buildNarrationSavePlan({
-        script: take.script,
-        alignment: take.alignment,
-        durationSec: take.durationSec,
-        audioExt: take.audioExt,
-        cameraExt: take.cameraExt,
-        baseWpm: controllerRef.current.prefs.baseWpm,
-        ...take.cameraOffsetSec !== void 0 ? { cameraOffsetSec: take.cameraOffsetSec } : {}
-      });
-      const result = await executeNarrationSave(
-        plan,
-        take,
-        {
-          mediaProvider: recording.mediaProvider,
-          container: recording.container,
-          getMarkdownSource: () => recordingRef.current?.markdownSource ?? "",
-          setMarkdownSource: recording.setMarkdownSource,
-          bumpMediaRevision: recording.bumpMediaRevision
-        },
-        progressForTake(take)
-      );
-      saveProgressRef.current = null;
-      recorderRef.current.finishSave(true);
-      setSaveNotice(
-        `Saved ${result.audioPath}${take.alignment ? " \u2014 blocks re-timed to your voice" : ""}`
-      );
-    } catch (err) {
-      recorderRef.current.finishSave(false, err instanceof Error ? err : new Error(String(err)));
-    }
-  }, [recording, progressForTake]);
-  const surfaceProps = useMemo4(
+  const surfaceProps = useMemo5(
     () => ({
       wordPos: controller.wordPos,
       fontSizePx: controller.prefs.fontSizePx,
@@ -2262,7 +2568,9 @@ function TeleprompterView(props) {
       countdownRemaining: controller.countdownRemaining,
       recordingIndicator: recorder.state === "recording",
       theme,
-      onSeekToken: controller.seekToToken
+      onSeekToken: controller.seekToToken,
+      onNudge: controller.nudge,
+      onToggleAutoAdvance: toggleAutoAdvance
     }),
     [
       controller.wordPos,
@@ -2271,6 +2579,8 @@ function TeleprompterView(props) {
       controller.prefs.lineGuide,
       controller.countdownRemaining,
       controller.seekToToken,
+      controller.nudge,
+      toggleAutoAdvance,
       recorder.state,
       theme
     ]
@@ -2287,7 +2597,7 @@ function TeleprompterView(props) {
   const script = controller.script;
   const portalOpen = float.portalTarget !== null;
   const busyRecording = recorder.state === "recording" || recorder.state === "starting";
-  const recordSlot = recording ? /* @__PURE__ */ jsx4("span", { className: "squisq-teleprompter-group", "data-testid": "teleprompter-record", children: recorder.state === "idle" || recorder.state === "error" ? /* @__PURE__ */ jsxs3(Fragment3, { children: [
+  const recordSlot = recording && showRecordSlot ? /* @__PURE__ */ jsx4("span", { className: "squisq-teleprompter-group", "data-testid": "teleprompter-record", children: recorder.state === "idle" || recorder.state === "error" ? /* @__PURE__ */ jsxs3(Fragment3, { children: [
     /* @__PURE__ */ jsx4(
       "button",
       {
@@ -2297,7 +2607,7 @@ function TeleprompterView(props) {
         children: "\u23FA Record"
       }
     ),
-    /* @__PURE__ */ jsxs3("label", { title: "Also capture your camera as a separate video file", children: [
+    showCameraToggleInRecordSlot ? /* @__PURE__ */ jsxs3("label", { title: "Also capture your camera as a separate video file", children: [
       /* @__PURE__ */ jsx4(
         "input",
         {
@@ -2307,102 +2617,124 @@ function TeleprompterView(props) {
         }
       ),
       "camera"
-    ] }),
+    ] }) : null,
     recorder.state === "error" ? /* @__PURE__ */ jsxs3("span", { title: recorder.error?.message, children: [
       "\u26A0 ",
       recorder.error?.message
     ] }) : null
   ] }) : busyRecording ? /* @__PURE__ */ jsx4("button", { type: "button", onClick: () => void recorder.stop(), children: "\u23F9 Stop" }) : recorder.state === "processing" ? /* @__PURE__ */ jsx4("span", { children: "Aligning take\u2026" }) : recorder.state === "saving" ? /* @__PURE__ */ jsx4("span", { children: "Saving\u2026" }) : null }) : null;
-  return /* @__PURE__ */ jsxs3(
-    "div",
-    {
-      ref: rootRef,
-      className: "squisq-teleprompter-root",
-      "data-testid": "teleprompter-view",
-      tabIndex: 0,
-      onKeyDown: controller.handleKeyDown,
-      children: [
-        /* @__PURE__ */ jsxs3("div", { className: "squisq-teleprompter-stage", children: [
-          portalOpen ? /* @__PURE__ */ jsxs3("div", { className: "squisq-teleprompter-float-note", children: [
-            /* @__PURE__ */ jsx4("p", { children: "The prompter is floating in its own window." }),
-            /* @__PURE__ */ jsx4("button", { type: "button", onClick: float.close, children: "\u21E4 Bring it back" })
-          ] }) : /* @__PURE__ */ jsx4(TeleprompterSurface, { script, ...surfaceProps }, "docked"),
-          portalOpen && float.portalTarget ? createPortal(
-            /* @__PURE__ */ jsx4(
-              TeleprompterSurface,
-              {
-                script,
-                ...surfaceProps,
-                compact: true
-              },
-              `float-${float.tier}`
-            ),
-            float.portalTarget
-          ) : null,
-          presentationTarget ? createPortal(
-            /* @__PURE__ */ jsx4("div", { className: "squisq-presentation-teleprompter", "aria-label": "Audience presentation", children: /* @__PURE__ */ jsx4(
-              TeleprompterSurface,
-              {
-                script,
-                ...surfaceProps
-              },
-              "presentation-audience"
-            ) }),
-            presentationTarget
-          ) : null,
-          /* @__PURE__ */ jsx4(TeleprompterSelfView, { stream: recorder.cameraStream })
-        ] }),
-        recorder.state === "review" && recorder.take ? /* @__PURE__ */ jsxs3("div", { className: "squisq-teleprompter-review", "data-testid": "teleprompter-review", children: [
-          /* @__PURE__ */ jsxs3("span", { children: [
-            "Take: ",
-            recorder.take.durationSec.toFixed(1),
-            "s",
-            recorder.take.alignment ? ` \xB7 ${recorder.take.alignment.detectedSyllables} syllables aligned` : " \xB7 timing unavailable (saved without re-timing)"
-          ] }),
-          reviewAudioUrl ? /* @__PURE__ */ jsx4("audio", { controls: true, src: reviewAudioUrl, onTimeUpdate: handleReviewTimeUpdate }) : null,
-          /* @__PURE__ */ jsx4("button", { type: "button", onClick: () => void handleSave(), children: "\u2713 Save narration" }),
-          /* @__PURE__ */ jsx4("button", { type: "button", onClick: handleRetake, children: "\u21BA Retake" }),
-          /* @__PURE__ */ jsx4("button", { type: "button", onClick: handleDiscard, children: "\u2715 Discard" }),
-          recorder.error ? /* @__PURE__ */ jsxs3("span", { children: [
-            "\u26A0 ",
-            recorder.error.message
-          ] }) : null
-        ] }) : null,
-        saveNotice ? /* @__PURE__ */ jsxs3("div", { className: "squisq-teleprompter-review", "data-testid": "teleprompter-save-notice", children: [
-          /* @__PURE__ */ jsx4("span", { children: saveNotice }),
-          /* @__PURE__ */ jsx4("button", { type: "button", onClick: () => setSaveNotice(null), children: "Dismiss" })
-        ] }) : null,
-        /* @__PURE__ */ jsx4(TeleprompterControls, { controller, float, recordSlot })
-      ]
-    }
-  );
+  return /* @__PURE__ */ jsxs3("div", { ref: rootRef, className: "squisq-teleprompter-root", "data-testid": "teleprompter-view", children: [
+    /* @__PURE__ */ jsxs3("div", { className: "squisq-teleprompter-stage", children: [
+      portalOpen ? /* @__PURE__ */ jsxs3("div", { className: "squisq-teleprompter-float-note", children: [
+        /* @__PURE__ */ jsx4("p", { children: "The prompter is floating in its own window." }),
+        /* @__PURE__ */ jsx4("button", { type: "button", onClick: float.close, children: "\u21E4 Bring it back" })
+      ] }) : /* @__PURE__ */ jsx4(TeleprompterSurface, { script, ...surfaceProps }, "docked"),
+      portalOpen && float.portalTarget ? createPortal(
+        /* @__PURE__ */ jsx4(
+          TeleprompterSurface,
+          {
+            script,
+            ...surfaceProps,
+            compact: true
+          },
+          `float-${float.tier}`
+        ),
+        float.portalTarget
+      ) : null,
+      presentationTarget ? createPortal(
+        /* @__PURE__ */ jsx4("div", { className: "squisq-presentation-teleprompter", "aria-label": "Audience presentation", children: /* @__PURE__ */ jsx4(
+          TeleprompterSurface,
+          {
+            script,
+            ...surfaceProps
+          },
+          "presentation-audience"
+        ) }),
+        presentationTarget
+      ) : null,
+      showSelfView ? /* @__PURE__ */ jsx4(TeleprompterSelfView, { stream: recorder.cameraStream }) : null
+    ] }),
+    recorder.state === "review" && recorder.take ? /* @__PURE__ */ jsxs3("div", { className: "squisq-teleprompter-review", "data-testid": "teleprompter-review", children: [
+      /* @__PURE__ */ jsxs3("span", { children: [
+        "Take: ",
+        recorder.take.durationSec.toFixed(1),
+        "s",
+        recorder.take.alignment ? ` \xB7 ${recorder.take.alignment.detectedSyllables} syllables aligned` : " \xB7 timing unavailable (saved without re-timing)"
+      ] }),
+      stage.reviewAudioUrl ? /* @__PURE__ */ jsx4(
+        "audio",
+        {
+          controls: true,
+          src: stage.reviewAudioUrl,
+          onTimeUpdate: stage.handleReviewTimeUpdate
+        }
+      ) : null,
+      showReviewActions ? /* @__PURE__ */ jsxs3(Fragment3, { children: [
+        /* @__PURE__ */ jsx4("button", { type: "button", onClick: () => void stage.handleSave(), children: "\u2713 Save narration" }),
+        /* @__PURE__ */ jsx4("button", { type: "button", onClick: stage.handleRetake, children: "\u21BA Retake" }),
+        /* @__PURE__ */ jsx4("button", { type: "button", onClick: stage.handleDiscard, children: "\u2715 Discard" })
+      ] }) : null,
+      recorder.error ? /* @__PURE__ */ jsxs3("span", { children: [
+        "\u26A0 ",
+        recorder.error.message
+      ] }) : null
+    ] }) : null,
+    stage.saveNotice ? /* @__PURE__ */ jsxs3("div", { className: "squisq-teleprompter-review", "data-testid": "teleprompter-save-notice", children: [
+      /* @__PURE__ */ jsx4("span", { children: stage.saveNotice }),
+      /* @__PURE__ */ jsx4("button", { type: "button", onClick: stage.dismissSaveNotice, children: "Dismiss" })
+    ] }) : null,
+    /* @__PURE__ */ jsx4(
+      TeleprompterControls,
+      {
+        controller,
+        float,
+        recordSlot,
+        showPlayPause: showTransportPlay
+      }
+    )
+  ] });
 }
 
 export {
+  resolveFormat,
+  supportsMediaRecorder,
+  supportsUserMedia,
+  supportsDisplayMedia,
+  supportsSystemAudioCapture,
+  buildFilename,
+  requestMicStream,
+  requestCameraStream,
+  useStreamPreview,
+  buildTimingJson,
+  encodeTimingJson,
+  timingPathFor,
   PCM_WORKLET_NAME,
   PCM_WORKLET_SOURCE,
   registerPcmWorklet,
   useMicAnalysis,
   DEFAULT_TELEPROMPTER_PREFS,
+  TELEPROMPTER_PREF_LIMITS,
+  normalizeTeleprompterPrefs,
   vadConfigForSensitivity,
   useTeleprompter,
   detectFloatTiers,
   createFloatingWindowManager,
   useFloatingWindow,
-  EYE_LINE_FRACTION,
-  measureTokenLines,
-  targetOffsetFor,
-  stepScroll,
   prompterVarsFromTheme,
   ensureTeleprompterStyles,
   TELEPROMPTER_CSS,
-  TeleprompterSurface,
-  TeleprompterControls,
   useNarrationRecorder,
   narrationAnnotationLine,
   cameraVideoLine,
   insertNarrationPreamble,
   buildNarrationSavePlan,
   executeNarrationSave,
-  TeleprompterView
+  useNarrationStage,
+  EYE_LINE_FRACTION,
+  measureTokenLines,
+  targetOffsetFor,
+  stepScroll,
+  TeleprompterSurface,
+  TeleprompterControls,
+  NarrationStage
 };