@bendyline/squisq-editor-react 2.2.0 → 2.3.0

package/dist/chunk-5JMHFAVW.js

@@ -0,0 +1,2408 @@
+import {
+  buildFilename,
+  encodeTimingJson,
+  requestCameraStream,
+  requestMicStream,
+  resolveFormat,
+  timingPathFor,
+  useStreamPreview
+} from "./chunk-5Q4JN4I5.js";
+
+// src/teleprompter/pcmWorklet.ts
+var PCM_WORKLET_NAME = "squisq-pcm-tap";
+var PCM_WORKLET_SOURCE = `
+class SquisqPcmTap extends AudioWorkletProcessor {
+  constructor() {
+    super();
+    this._buf = new Float32Array(1024);
+    this._len = 0;
+  }
+  process(inputs) {
+    const channel = inputs[0] && inputs[0][0];
+    if (channel && channel.length > 0) {
+      let i = 0;
+      while (i < channel.length) {
+        const n = Math.min(channel.length - i, this._buf.length - this._len);
+        this._buf.set(channel.subarray(i, i + n), this._len);
+        this._len += n;
+        i += n;
+        if (this._len === this._buf.length) {
+          const out = this._buf;
+          this._buf = new Float32Array(1024);
+          this._len = 0;
+          // Clone, don't transfer: Chrome recycles buffers transferred out
+          // of the worklet scope once the receiving handler returns, so a
+          // transferred hop reads as zeros if anything retains it. A 4 KB
+          // structured clone at ~47 Hz is negligible.
+          this.port.postMessage({ pcm: out, audioTime: currentTime });
+        }
+      }
+    }
+    return true;
+  }
+}
+registerProcessor('${PCM_WORKLET_NAME}', SquisqPcmTap);
+`;
+async function registerPcmWorklet(ctx) {
+  const url = URL.createObjectURL(new Blob([PCM_WORKLET_SOURCE], { type: "text/javascript" }));
+  try {
+    await ctx.audioWorklet.addModule(url);
+  } finally {
+    URL.revokeObjectURL(url);
+  }
+}
+
+// src/teleprompter/useMicAnalysis.ts
+import { useCallback, useEffect, useRef, useState } from "react";
+function useMicAnalysis() {
+  const [status, setStatus] = useState("idle");
+  const [error, setError] = useState(null);
+  const [devices, setDevices] = useState([]);
+  const [stream, setStream] = useState(null);
+  const [sampleRate, setSampleRate] = useState(null);
+  const graphRef = useRef(null);
+  const listenersRef = useRef(/* @__PURE__ */ new Set());
+  const generationRef = useRef(0);
+  const refreshDevices = useCallback(async () => {
+    try {
+      const all = await navigator.mediaDevices.enumerateDevices();
+      setDevices(all.filter((d) => d.kind === "audioinput"));
+    } catch {
+    }
+  }, []);
+  useEffect(() => {
+    if (typeof navigator === "undefined" || !navigator.mediaDevices?.addEventListener) return;
+    const onChange = () => void refreshDevices();
+    navigator.mediaDevices.addEventListener("devicechange", onChange);
+    return () => navigator.mediaDevices.removeEventListener("devicechange", onChange);
+  }, [refreshDevices]);
+  const teardown = useCallback(() => {
+    const graph = graphRef.current;
+    graphRef.current = null;
+    if (!graph) return;
+    try {
+      if ("port" in graph.node) {
+        graph.node.port.onmessage = null;
+      } else {
+        graph.node.onaudioprocess = null;
+      }
+      graph.node.disconnect();
+      graph.source.disconnect();
+      graph.sink?.disconnect();
+    } catch {
+    }
+    for (const track of graph.stream.getTracks()) track.stop();
+    void graph.context.close().catch(() => void 0);
+  }, []);
+  const stop = useCallback(() => {
+    generationRef.current += 1;
+    teardown();
+    setStream(null);
+    setSampleRate(null);
+    setStatus("idle");
+    setError(null);
+  }, [teardown]);
+  const start = useCallback(
+    async (deviceId) => {
+      const generation = ++generationRef.current;
+      teardown();
+      setStatus("starting");
+      setError(null);
+      try {
+        const micStream = await requestMicStream(
+          deviceId ? { deviceId: { exact: deviceId } } : void 0
+        );
+        if (generation !== generationRef.current) {
+          for (const track of micStream.getTracks()) track.stop();
+          return null;
+        }
+        const context = new AudioContext();
+        if (context.state === "suspended") {
+          await context.resume().catch(() => void 0);
+        }
+        const source = context.createMediaStreamSource(micStream);
+        const emit = (pcm, audioTime) => {
+          for (const listener of listenersRef.current) listener(pcm, audioTime);
+        };
+        let node = null;
+        let sink = null;
+        if (context.audioWorklet && typeof AudioWorkletNode !== "undefined") {
+          try {
+            await registerPcmWorklet(context);
+            const workletNode = new AudioWorkletNode(context, PCM_WORKLET_NAME, {
+              numberOfInputs: 1,
+              numberOfOutputs: 1,
+              channelCount: 1,
+              channelCountMode: "explicit"
+            });
+            workletNode.port.onmessage = (event) => {
+              const data = event.data;
+              if (data && data.pcm instanceof Float32Array) {
+                emit(data.pcm, typeof data.audioTime === "number" ? data.audioTime : 0);
+              }
+            };
+            source.connect(workletNode);
+            sink = context.createGain();
+            sink.gain.value = 0;
+            workletNode.connect(sink);
+            sink.connect(context.destination);
+            node = workletNode;
+          } catch {
+            node = null;
+          }
+        }
+        if (node === null) {
+          const processor = context.createScriptProcessor(1024, 1, 1);
+          processor.onaudioprocess = (event) => {
+            const input = event.inputBuffer.getChannelData(0);
+            emit(new Float32Array(input), event.playbackTime);
+          };
+          sink = context.createGain();
+          sink.gain.value = 0;
+          source.connect(processor);
+          processor.connect(sink);
+          sink.connect(context.destination);
+          node = processor;
+        }
+        if (generation !== generationRef.current) {
+          for (const track of micStream.getTracks()) track.stop();
+          void context.close().catch(() => void 0);
+          return null;
+        }
+        graphRef.current = { stream: micStream, context, source, node, sink };
+        setStream(micStream);
+        setSampleRate(context.sampleRate);
+        setStatus("live");
+        void refreshDevices();
+        return micStream;
+      } catch (err) {
+        if (generation !== generationRef.current) return null;
+        setError(err instanceof Error ? err : new Error(String(err)));
+        setStatus("error");
+        return null;
+      }
+    },
+    [refreshDevices, teardown]
+  );
+  const subscribeHop = useCallback((listener) => {
+    listenersRef.current.add(listener);
+    return () => {
+      listenersRef.current.delete(listener);
+    };
+  }, []);
+  useEffect(() => {
+    return () => {
+      generationRef.current += 1;
+      teardown();
+    };
+  }, [teardown]);
+  return { status, error, stream, sampleRate, devices, start, stop, subscribeHop };
+}
+
+// src/teleprompter/types.ts
+var DEFAULT_TELEPROMPTER_PREFS = Object.freeze({
+  fontSizePx: 48,
+  mirrored: false,
+  baseWpm: 150,
+  voiceTracking: true,
+  vadSensitivity: 0.5,
+  countdownSec: 3,
+  lineGuide: true,
+  micDeviceId: null
+});
+
+// src/teleprompter/useTeleprompter.ts
+import { useCallback as useCallback2, useEffect as useEffect2, useMemo, useRef as useRef2, useState as useState2 } from "react";
+import {
+  buildNarrationScript,
+  createNarrationSession,
+  narrationSessionStep,
+  reanchorSession,
+  DEFAULT_VAD_CONFIG
+} 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 };
+  } catch {
+    return { ...DEFAULT_TELEPROMPTER_PREFS };
+  }
+}
+function savePrefs(prefs) {
+  try {
+    globalThis.localStorage?.setItem(PREFS_STORAGE_KEY, JSON.stringify(prefs));
+  } catch {
+  }
+}
+function vadConfigForSensitivity(sensitivity) {
+  const s = Math.min(1, Math.max(0, sensitivity));
+  const factor = 1.5 - s;
+  const enterRatio = Math.min(5, Math.max(2.6, DEFAULT_VAD_CONFIG.enterRatio * factor));
+  return {
+    enterRatio,
+    exitRatio: Math.max(
+      2,
+      enterRatio * (DEFAULT_VAD_CONFIG.exitRatio / DEFAULT_VAD_CONFIG.enterRatio)
+    )
+  };
+}
+function useTeleprompter(opts) {
+  const { doc } = opts;
+  const script = useMemo(
+    () => doc && doc.blocks.length > 0 ? buildNarrationScript(doc) : null,
+    [doc]
+  );
+  const [prefs, setPrefsState] = useState2(loadPrefs);
+  const [transport, setTransport] = useState2("stopped");
+  const [countdownRemaining, setCountdownRemaining] = useState2(null);
+  const [view, setView] = useState2({ wordPos: 0, micLevel: 0, voiceActive: false });
+  const mic = useMicAnalysis();
+  const scriptRef = useRef2(script);
+  const prefsRef = useRef2(prefs);
+  const transportRef = useRef2(transport);
+  const wordPosRef = useRef2(0);
+  const sessionRef = useRef2(null);
+  const sessionKeyRef = useRef2("");
+  const lastPublishRef = useRef2(0);
+  const tickSubsRef = useRef2(/* @__PURE__ */ new Set());
+  const levelRef = useRef2(0);
+  const voiceRef = useRef2(false);
+  const countdownTimerRef = useRef2(null);
+  scriptRef.current = script;
+  prefsRef.current = prefs;
+  transportRef.current = transport;
+  useEffect2(() => {
+    wordPosRef.current = Math.min(wordPosRef.current, script?.tokens.length ?? 0);
+    sessionRef.current = null;
+    setView((v) => ({ ...v, wordPos: wordPosRef.current }));
+  }, [script]);
+  const publish = useCallback2(
+    (force = false) => {
+      const now = performance.now();
+      if (!force && now - lastPublishRef.current < PUBLISH_INTERVAL_MS) return;
+      lastPublishRef.current = now;
+      setView({
+        wordPos: wordPosRef.current,
+        micLevel: levelRef.current,
+        voiceActive: voiceRef.current
+      });
+    },
+    [setView]
+  );
+  const notifyTick = useCallback2(() => {
+    for (const cb of tickSubsRef.current) cb(wordPosRef.current);
+  }, []);
+  const clearCountdown = useCallback2(() => {
+    if (countdownTimerRef.current !== null) {
+      clearInterval(countdownTimerRef.current);
+      countdownTimerRef.current = null;
+    }
+    setCountdownRemaining(null);
+  }, []);
+  const finish = useCallback2(() => {
+    setTransport("finished");
+    transportRef.current = "finished";
+  }, []);
+  useEffect2(() => {
+    return mic.subscribeHop((pcm) => {
+      const currentScript = scriptRef.current;
+      const sampleRate = mic.sampleRate;
+      if (!currentScript || !sampleRate) return;
+      const currentPrefs = prefsRef.current;
+      const key = `${sampleRate}:${currentScript.tokens.length}:${currentScript.sourceText.length}`;
+      let session = sessionRef.current;
+      if (!session || sessionKeyRef.current !== key) {
+        session = reanchorSession(
+          createNarrationSession(sampleRate, currentScript, {
+            vad: vadConfigForSensitivity(currentPrefs.vadSensitivity),
+            pacing: { baseWpm: currentPrefs.baseWpm }
+          }),
+          wordPosRef.current
+        );
+        sessionKeyRef.current = key;
+      } else {
+        session = {
+          ...session,
+          config: {
+            ...session.config,
+            vad: vadConfigForSensitivity(currentPrefs.vadSensitivity),
+            pacing: { baseWpm: currentPrefs.baseWpm }
+          }
+        };
+      }
+      session = narrationSessionStep(session, pcm);
+      levelRef.current = session.lastFrame ? Math.min(1, session.lastFrame.rms * 6) : 0;
+      voiceRef.current = session.vad.speaking;
+      if (transportRef.current === "rolling" && prefsRef.current.voiceTracking) {
+        wordPosRef.current = session.pacing.wordPos;
+        if (wordPosRef.current >= currentScript.tokens.length) finish();
+      } else {
+        session = reanchorSession(session, wordPosRef.current);
+      }
+      sessionRef.current = session;
+      notifyTick();
+      publish();
+    });
+  }, [mic, finish, notifyTick, publish]);
+  useEffect2(() => {
+    if (transport !== "rolling") return;
+    let raf = 0;
+    let last = performance.now();
+    const loop = (now) => {
+      const dt = Math.min(0.25, (now - last) / 1e3);
+      last = now;
+      const currentScript = scriptRef.current;
+      const manual = !prefsRef.current.voiceTracking || mic.status !== "live";
+      if (currentScript && manual) {
+        wordPosRef.current = Math.min(
+          currentScript.tokens.length,
+          wordPosRef.current + prefsRef.current.baseWpm / 60 * dt
+        );
+        if (wordPosRef.current >= currentScript.tokens.length) {
+          finish();
+          publish(true);
+          return;
+        }
+        notifyTick();
+      }
+      publish();
+      raf = requestAnimationFrame(loop);
+    };
+    raf = requestAnimationFrame(loop);
+    return () => cancelAnimationFrame(raf);
+  }, [transport, mic.status, finish, notifyTick, publish]);
+  const beginRolling = useCallback2(() => {
+    clearCountdown();
+    if (sessionRef.current) {
+      sessionRef.current = reanchorSession(sessionRef.current, wordPosRef.current);
+    }
+    setTransport("rolling");
+    transportRef.current = "rolling";
+  }, [clearCountdown]);
+  const play = useCallback2(() => {
+    if (transportRef.current === "rolling" || transportRef.current === "countdown") return;
+    if (transportRef.current === "finished") {
+      wordPosRef.current = 0;
+      publish(true);
+    }
+    if (prefsRef.current.voiceTracking && mic.status === "idle") {
+      void mic.start(prefsRef.current.micDeviceId);
+    }
+    const countdown = prefsRef.current.countdownSec;
+    if (countdown > 0) {
+      setTransport("countdown");
+      transportRef.current = "countdown";
+      setCountdownRemaining(countdown);
+      let remaining = countdown;
+      countdownTimerRef.current = setInterval(() => {
+        remaining -= 1;
+        if (remaining <= 0) beginRolling();
+        else setCountdownRemaining(remaining);
+      }, 1e3);
+    } else {
+      beginRolling();
+    }
+  }, [beginRolling, mic, publish]);
+  const pause = useCallback2(() => {
+    if (transportRef.current === "countdown") {
+      clearCountdown();
+      setTransport("stopped");
+      transportRef.current = "stopped";
+      return;
+    }
+    if (transportRef.current !== "rolling") return;
+    setTransport("paused");
+    transportRef.current = "paused";
+  }, [clearCountdown]);
+  const restart = useCallback2(() => {
+    clearCountdown();
+    wordPosRef.current = 0;
+    if (sessionRef.current) sessionRef.current = reanchorSession(sessionRef.current, 0);
+    setTransport("stopped");
+    transportRef.current = "stopped";
+    publish(true);
+  }, [clearCountdown, publish]);
+  const seekToToken = useCallback2(
+    (tokenIndex) => {
+      const currentScript = scriptRef.current;
+      if (!currentScript) return;
+      wordPosRef.current = Math.min(Math.max(0, tokenIndex), currentScript.tokens.length);
+      if (sessionRef.current) {
+        sessionRef.current = reanchorSession(sessionRef.current, wordPosRef.current);
+      }
+      if (transportRef.current === "finished") {
+        setTransport("paused");
+        transportRef.current = "paused";
+      }
+      notifyTick();
+      publish(true);
+    },
+    [notifyTick, publish]
+  );
+  const nudge = useCallback2(
+    (deltaTokens) => seekToToken(Math.round(wordPosRef.current + deltaTokens)),
+    [seekToToken]
+  );
+  const setPrefs = useCallback2(
+    (patch) => {
+      setPrefsState((prev) => {
+        const next = { ...prev, ...patch };
+        savePrefs(next);
+        if (patch.micDeviceId !== void 0 && patch.micDeviceId !== prev.micDeviceId && mic.status === "live") {
+          void mic.start(patch.micDeviceId);
+        }
+        return next;
+      });
+    },
+    [mic]
+  );
+  const subscribeTick = useCallback2((cb) => {
+    tickSubsRef.current.add(cb);
+    return () => {
+      tickSubsRef.current.delete(cb);
+    };
+  }, []);
+  const handleKeyDown = useCallback2(
+    (event) => {
+      const target = event.target;
+      if (target?.closest('input, textarea, select, button, a, [contenteditable="true"]')) return;
+      switch (event.key) {
+        case " ":
+          event.preventDefault();
+          if (transportRef.current === "rolling" || transportRef.current === "countdown") pause();
+          else play();
+          break;
+        case "ArrowUp":
+        case "ArrowLeft":
+          event.preventDefault();
+          nudge(-NUDGE_WORDS);
+          break;
+        case "ArrowDown":
+        case "ArrowRight":
+          event.preventDefault();
+          nudge(NUDGE_WORDS);
+          break;
+        case "[":
+          event.preventDefault();
+          setPrefs({ baseWpm: Math.max(80, prefsRef.current.baseWpm - 10) });
+          break;
+        case "]":
+          event.preventDefault();
+          setPrefs({ baseWpm: Math.min(260, prefsRef.current.baseWpm + 10) });
+          break;
+        case "m":
+        case "M":
+          event.preventDefault();
+          setPrefs({ mirrored: !prefsRef.current.mirrored });
+          break;
+        case "Escape":
+          if (transportRef.current === "countdown" || transportRef.current === "rolling") {
+            event.preventDefault();
+            pause();
+          }
+          break;
+        default:
+          break;
+      }
+    },
+    [nudge, pause, play, setPrefs]
+  );
+  useEffect2(() => clearCountdown, [clearCountdown]);
+  return {
+    script,
+    transport,
+    countdownRemaining,
+    wordPos: view.wordPos,
+    micLevel: view.micLevel,
+    voiceActive: view.voiceActive,
+    mic,
+    prefs,
+    setPrefs,
+    play,
+    pause,
+    restart,
+    nudge,
+    seekToToken,
+    subscribeTick,
+    handleKeyDown
+  };
+}
+
+// src/teleprompter/floatingWindow.ts
+function detectFloatTiers() {
+  const tiers = [];
+  if (typeof window !== "undefined" && typeof document !== "undefined") {
+    if (window.documentPictureInPicture) tiers.push("document-pip");
+    const video = document.createElement("video");
+    const stdPip = document.pictureInPictureEnabled === true && typeof video.requestPictureInPicture === "function";
+    const webkitPip = typeof video.webkitSetPresentationMode === "function" && (video.webkitSupportsPresentationMode?.("picture-in-picture") ?? true);
+    const canCapture = typeof HTMLCanvasElement !== "undefined" && typeof HTMLCanvasElement.prototype.captureStream === "function";
+    if ((stdPip || webkitPip) && canCapture) tiers.push("video-pip");
+    if (typeof window.open === "function") tiers.push("popup");
+  }
+  tiers.push("docked");
+  return tiers;
+}
+function createFloatingWindowManager(deps) {
+  let active = null;
+  let generation = 0;
+  let disposed = false;
+  const listeners = {
+    closed: /* @__PURE__ */ new Set(),
+    tierchange: /* @__PURE__ */ new Set()
+  };
+  const emit = (event, tier) => {
+    for (const cb of listeners[event]) cb(tier);
+  };
+  const handleExternalClose = () => {
+    if (!active) return;
+    const closing = active;
+    active = null;
+    closing.dispose();
+    emit("tierchange", "docked");
+    emit("closed", "docked");
+  };
+  const openerPageHide = () => manager.close();
+  if (typeof window !== "undefined") {
+    window.addEventListener("pagehide", openerPageHide);
+  }
+  const writeFloatDocument = (doc, title) => {
+    doc.title = title;
+    const style = doc.createElement("style");
+    style.textContent = `${deps.styleCss}
+html,body{margin:0;height:100%;}#squisq-float-root{height:100%;display:flex;}`;
+    doc.head.appendChild(style);
+    const root = doc.createElement("div");
+    root.id = "squisq-float-root";
+    doc.body.appendChild(root);
+    return root;
+  };
+  const openDocumentPip = async (opts) => {
+    const api = window.documentPictureInPicture;
+    if (!api) throw new Error("Document PiP unavailable");
+    const pip = await api.requestWindow({ width: opts.width, height: opts.height });
+    for (const sheet of Array.from(document.styleSheets)) {
+      try {
+        const rules = Array.from(sheet.cssRules).map((rule) => rule.cssText).join("\n");
+        const style = pip.document.createElement("style");
+        style.textContent = rules;
+        pip.document.head.appendChild(style);
+      } catch {
+        if (sheet.href) {
+          const link = pip.document.createElement("link");
+          link.rel = "stylesheet";
+          link.href = sheet.href;
+          pip.document.head.appendChild(link);
+        }
+      }
+    }
+    const root = writeFloatDocument(pip.document, opts.title);
+    pip.addEventListener("pagehide", handleExternalClose);
+    return {
+      tier: "document-pip",
+      portalTarget: root,
+      canvasSink: null,
+      dispose: () => {
+        pip.removeEventListener("pagehide", handleExternalClose);
+        try {
+          pip.close();
+        } catch {
+        }
+      }
+    };
+  };
+  const openVideoPip = async (opts) => {
+    const canvas = document.createElement("canvas");
+    canvas.width = Math.round(opts.width * (window.devicePixelRatio || 1));
+    canvas.height = Math.round(opts.height * (window.devicePixelRatio || 1));
+    const ctx = canvas.getContext("2d");
+    if (!ctx || typeof canvas.captureStream !== "function") {
+      throw new Error("canvas.captureStream unavailable");
+    }
+    ctx.fillStyle = "#101014";
+    ctx.fillRect(0, 0, canvas.width, canvas.height);
+    let stream;
+    let requestFrame;
+    try {
+      stream = canvas.captureStream(0);
+      const track = stream.getVideoTracks()[0];
+      if (typeof track.requestFrame === "function") {
+        const pushFrame = track.requestFrame.bind(track);
+        requestFrame = () => pushFrame();
+      } else {
+        stream = canvas.captureStream(30);
+        requestFrame = () => void 0;
+      }
+    } catch {
+      stream = canvas.captureStream(30);
+      requestFrame = () => void 0;
+    }
+    const video = document.createElement("video");
+    video.muted = true;
+    video.playsInline = true;
+    video.style.position = "fixed";
+    video.style.left = "-10000px";
+    video.style.width = `${opts.width}px`;
+    video.srcObject = stream;
+    document.body.appendChild(video);
+    const cleanupDom = () => {
+      video.pause();
+      video.srcObject = null;
+      video.remove();
+      for (const track of stream.getTracks()) track.stop();
+    };
+    try {
+      await video.play();
+      requestFrame();
+      if (typeof video.requestPictureInPicture === "function" && document.pictureInPictureEnabled) {
+        await video.requestPictureInPicture();
+        video.addEventListener("leavepictureinpicture", handleExternalClose);
+      } else if (typeof video.webkitSetPresentationMode === "function") {
+        video.webkitSetPresentationMode("picture-in-picture");
+        video.addEventListener("webkitpresentationmodechanged", () => {
+          if (video.webkitPresentationMode === "inline") handleExternalClose();
+        });
+      } else {
+        throw new Error("No video PiP API");
+      }
+    } catch (err) {
+      cleanupDom();
+      throw err instanceof Error ? err : new Error(String(err));
+    }
+    return {
+      tier: "video-pip",
+      portalTarget: null,
+      canvasSink: { canvas, width: canvas.width, height: canvas.height, requestFrame },
+      dispose: () => {
+        video.removeEventListener("leavepictureinpicture", handleExternalClose);
+        if (document.pictureInPictureElement === video) {
+          void document.exitPictureInPicture().catch(() => void 0);
+        } else if (typeof video.webkitSetPresentationMode === "function" && video.webkitPresentationMode === "picture-in-picture") {
+          video.webkitSetPresentationMode("inline");
+        }
+        cleanupDom();
+      }
+    };
+  };
+  const openPopup = (opts) => {
+    const popup = window.open(
+      "",
+      "squisq-teleprompter",
+      `popup=yes,width=${opts.width},height=${opts.height}`
+    );
+    if (!popup) throw new Error("Popup blocked");
+    const root = writeFloatDocument(popup.document, opts.title);
+    popup.addEventListener("pagehide", handleExternalClose);
+    popup.focus();
+    return {
+      tier: "popup",
+      portalTarget: root,
+      canvasSink: null,
+      dispose: () => {
+        popup.removeEventListener("pagehide", handleExternalClose);
+        try {
+          popup.close();
+        } catch {
+        }
+      }
+    };
+  };
+  const manager = {
+    get tier() {
+      return active?.tier ?? "docked";
+    },
+    get isOpen() {
+      return active !== null;
+    },
+    async open(opts) {
+      manager.close();
+      if (disposed) return "docked";
+      const attempt = ++generation;
+      const superseded = () => generation !== attempt || disposed;
+      const supported = detectFloatTiers();
+      const ladder = opts.preferredTier && supported.includes(opts.preferredTier) ? [opts.preferredTier, ...supported.filter((t) => t !== opts.preferredTier)] : supported;
+      for (const tier of ladder) {
+        if (tier === "docked") break;
+        if (superseded()) return "docked";
+        let opened = null;
+        try {
+          if (tier === "document-pip") opened = await openDocumentPip(opts);
+          else if (tier === "video-pip") opened = await openVideoPip(opts);
+          else if (tier === "popup") opened = openPopup(opts);
+        } catch {
+          opened = null;
+        }
+        if (!opened) continue;
+        if (superseded()) {
+          opened.dispose();
+          return "docked";
+        }
+        active = opened;
+        emit("tierchange", active.tier);
+        return active.tier;
+      }
+      if (superseded()) return "docked";
+      emit("tierchange", "docked");
+      return "docked";
+    },
+    close() {
+      generation++;
+      if (!active) return;
+      const closing = active;
+      active = null;
+      closing.dispose();
+      emit("tierchange", "docked");
+      emit("closed", "docked");
+    },
+    getPortalTarget() {
+      return active?.portalTarget ?? null;
+    },
+    getCanvasSink() {
+      return active?.canvasSink ?? null;
+    },
+    on(event, cb) {
+      listeners[event].add(cb);
+      return () => {
+        listeners[event].delete(cb);
+      };
+    },
+    dispose() {
+      manager.close();
+      disposed = true;
+      if (typeof window !== "undefined") {
+        window.removeEventListener("pagehide", openerPageHide);
+      }
+      listeners.closed.clear();
+      listeners.tierchange.clear();
+    }
+  };
+  return manager;
+}
+
+// src/teleprompter/useFloatingWindow.ts
+import { useCallback as useCallback3, useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
+var FLOAT_WIDTH = 380;
+var FLOAT_HEIGHT = 540;
+function useFloatingWindow(styleCss) {
+  const managerRef = useRef3(null);
+  if (managerRef.current === null) {
+    managerRef.current = createFloatingWindowManager({ styleCss });
+  }
+  const manager = managerRef.current;
+  const [tier, setTier] = useState3("docked");
+  const supportedTiers = useMemo2(() => detectFloatTiers().filter((t) => t !== "docked"), []);
+  useEffect3(() => {
+    const offChange = manager.on("tierchange", setTier);
+    const offClosed = manager.on("closed", setTier);
+    return () => {
+      offChange();
+      offClosed();
+      manager.dispose();
+    };
+  }, [manager]);
+  const open = useCallback3(
+    async (preferredTier) => {
+      await manager.open({
+        width: FLOAT_WIDTH,
+        height: FLOAT_HEIGHT,
+        title: "Squisq Teleprompter",
+        ...preferredTier !== void 0 ? { preferredTier } : {}
+      });
+    },
+    [manager]
+  );
+  const close = useCallback3(() => manager.close(), [manager]);
+  return {
+    tier,
+    isOpen: manager.isOpen,
+    supportedTiers,
+    portalTarget: manager.getPortalTarget(),
+    canvasSink: manager.getCanvasSink(),
+    open,
+    close
+  };
+}
+
+// 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) {
+  const colors = theme.colors;
+  return {
+    "--squisq-prompter-bg": colors.background,
+    "--squisq-prompter-text": colors.text,
+    "--squisq-prompter-muted": colors.textMuted ?? colors.text,
+    "--squisq-prompter-accent": colors.primary,
+    "--squisq-prompter-font": resolveFontFamily(
+      theme.typography?.bodyFont,
+      "system-ui, sans-serif"
+    )
+  };
+}
+var TELEPROMPTER_STYLE_ATTR = "data-squisq-teleprompter";
+function ensureTeleprompterStyles(doc) {
+  if (doc.querySelector(`style[${TELEPROMPTER_STYLE_ATTR}]`)) return;
+  const style = doc.createElement("style");
+  style.setAttribute(TELEPROMPTER_STYLE_ATTR, "");
+  style.textContent = TELEPROMPTER_CSS;
+  doc.head.appendChild(style);
+}
+var TELEPROMPTER_CSS = `
+.squisq-teleprompter-root {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  min-height: 0;
+  background: var(--squisq-bg, #f5f5f5);
+  outline: none;
+}
+.squisq-teleprompter-stage {
+  position: relative;
+  flex: 1;
+  min-height: 0;
+  display: flex;
+}
+
+.squisq-teleprompter-surface {
+  position: relative;
+  flex: 1;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--squisq-prompter-bg, #101014);
+  color: var(--squisq-prompter-text, #f5f5f2);
+  font-family: var(--squisq-prompter-font, system-ui, sans-serif);
+  user-select: none;
+}
+.squisq-teleprompter-flip {
+  position: absolute;
+  inset: 0;
+}
+.squisq-teleprompter-surface--mirrored .squisq-teleprompter-flip {
+  transform: scaleX(-1);
+}
+.squisq-teleprompter-scroll {
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  will-change: transform;
+  padding: 40vh 8% 60vh;
+  box-sizing: border-box;
+}
+.squisq-teleprompter-line-guide {
+  position: absolute;
+  left: 0;
+  right: 0;
+  pointer-events: none;
+  z-index: 2;
+}
+.squisq-teleprompter-line-guide::before,
+.squisq-teleprompter-line-guide::after {
+  content: '';
+  position: absolute;
+  top: 50%;
+  border: 9px solid transparent;
+  transform: translateY(-50%);
+}
+.squisq-teleprompter-line-guide::before {
+  left: 6px;
+  border-left-color: var(--squisq-prompter-accent, #e8b64c);
+}
+.squisq-teleprompter-line-guide::after {
+  right: 6px;
+  border-right-color: var(--squisq-prompter-accent, #e8b64c);
+}
+.squisq-teleprompter-guide-band {
+  position: absolute;
+  left: 0;
+  right: 0;
+  background: color-mix(in srgb, var(--squisq-prompter-accent, #e8b64c) 9%, transparent);
+  pointer-events: none;
+  z-index: 1;
+}
+
+.squisq-teleprompter-block-marker {
+  display: block;
+  margin: 1.1em 0 0.35em;
+  font-size: 0.38em;
+  font-weight: 600;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+  color: var(--squisq-prompter-muted, #9a9aa0);
+  border-top: 1px solid color-mix(in srgb, var(--squisq-prompter-muted, #9a9aa0) 35%, transparent);
+  padding-top: 0.6em;
+}
+.squisq-teleprompter-para {
+  margin: 0 0 0.55em;
+  line-height: 1.4;
+  font-weight: 500;
+}
+.squisq-teleprompter-word {
+  opacity: 0.45;
+  transition: color 0.1s linear, opacity 0.1s linear;
+}
+.squisq-teleprompter-word--read {
+  opacity: 0.9;
+}
+.squisq-teleprompter-word--active {
+  opacity: 1;
+  font-weight: 800;
+  color: var(--squisq-prompter-accent, #e8b64c);
+}
+
+.squisq-teleprompter-countdown {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 3;
+  background: color-mix(in srgb, var(--squisq-prompter-bg, #101014) 72%, transparent);
+}
+.squisq-teleprompter-countdown-digit {
+  font-size: 18vmin;
+  font-weight: 800;
+  color: var(--squisq-prompter-accent, #e8b64c);
+  animation: squisq-prompter-pulse 1s ease-in-out infinite;
+}
+.squisq-teleprompter-recdot {
+  position: absolute;
+  top: 14px;
+  right: 16px;
+  z-index: 4;
+  width: 14px;
+  height: 14px;
+  border-radius: 50%;
+  background: #e5484d;
+  box-shadow: 0 0 0 3px color-mix(in srgb, #e5484d 30%, transparent);
+  animation: squisq-prompter-pulse 1.4s ease-in-out infinite;
+}
+/* Counter-flip overlays so they stay readable in mirror mode. */
+.squisq-teleprompter-surface--mirrored .squisq-teleprompter-countdown,
+.squisq-teleprompter-surface--mirrored .squisq-teleprompter-recdot {
+  transform: scaleX(-1);
+}
+
+.squisq-teleprompter-selfview {
+  position: absolute;
+  right: 14px;
+  bottom: 14px;
+  width: 160px;
+  border-radius: 8px;
+  border: 2px solid color-mix(in srgb, #e5484d 60%, transparent);
+  z-index: 5;
+  background: #000;
+}
+
+.squisq-teleprompter-review {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 10px;
+  padding: 8px 12px;
+  border-top: 1px solid var(--squisq-border, #e5e7eb);
+  background: var(--squisq-surface, var(--squisq-bg, #fff));
+  color: var(--squisq-text, #111827);
+  font-size: 12.5px;
+}
+.squisq-teleprompter-review audio {
+  height: 28px;
+  max-width: 260px;
+}
+.squisq-teleprompter-review button {
+  font: inherit;
+  color: inherit;
+  background: var(--squisq-input-bg, #fff);
+  border: 1px solid var(--squisq-border, #d1d5db);
+  border-radius: 6px;
+  padding: 4px 10px;
+  cursor: pointer;
+}
+
+.squisq-teleprompter-float-note {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  color: var(--squisq-text-muted, #6b7280);
+  font-size: 14px;
+}
+
+.squisq-teleprompter-controls {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 10px;
+  padding: 8px 12px;
+  border-top: 1px solid var(--squisq-border, #e5e7eb);
+  background: var(--squisq-surface, var(--squisq-bg, #fff));
+  color: var(--squisq-text, #111827);
+  font-size: 12.5px;
+}
+.squisq-teleprompter-controls .squisq-teleprompter-group {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  white-space: nowrap;
+}
+.squisq-teleprompter-controls button {
+  font: inherit;
+  color: inherit;
+  background: var(--squisq-input-bg, #fff);
+  border: 1px solid var(--squisq-border, #d1d5db);
+  border-radius: 6px;
+  padding: 4px 10px;
+  cursor: pointer;
+}
+.squisq-teleprompter-controls button:hover {
+  background: var(--squisq-surface-hover, #f3f4f6);
+}
+.squisq-teleprompter-controls button[aria-pressed='true'] {
+  background: var(--squisq-text, #111827);
+  color: var(--squisq-bg, #fff);
+  border-color: var(--squisq-text, #111827);
+}
+.squisq-teleprompter-controls select,
+.squisq-teleprompter-controls input[type='range'] {
+  font: inherit;
+  color: inherit;
+  background: var(--squisq-input-bg, #fff);
+  border: 1px solid var(--squisq-border, #d1d5db);
+  border-radius: 6px;
+  max-width: 170px;
+}
+.squisq-teleprompter-controls input[type='range'] {
+  border: none;
+  background: transparent;
+  width: 110px;
+}
+.squisq-teleprompter-meter {
+  position: relative;
+  width: 64px;
+  height: 8px;
+  border-radius: 4px;
+  overflow: hidden;
+  background: var(--squisq-border, #e5e7eb);
+}
+.squisq-teleprompter-meter-fill {
+  position: absolute;
+  inset: 0 auto 0 0;
+  background: #9ca3af;
+  transition: width 0.08s linear;
+}
+.squisq-teleprompter-meter--voice .squisq-teleprompter-meter-fill {
+  background: #30a46c;
+}
+
+@keyframes squisq-prompter-pulse {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.45; }
+}
+@media (prefers-reduced-motion: reduce) {
+  .squisq-teleprompter-countdown-digit,
+  .squisq-teleprompter-recdot {
+    animation: none;
+  }
+  .squisq-teleprompter-word {
+    transition: none;
+  }
+}
+`;
+
+// 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 });
+    }
+    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);
+  }, []);
+  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;
+      }
+    }
+    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 {
+      }
+    }
+    for (const track of capture.cameraStream?.getTracks() ?? []) track.stop();
+    setCameraStream(null);
+  }, [cancelPendingStart]);
+  const start = useCallback4(async () => {
+    if (captureRef.current || startingRef.current) return;
+    const opts = optionsRef.current;
+    const generation = ++generationRef.current;
+    const superseded = () => generationRef.current !== generation;
+    startingRef.current = true;
+    setError(null);
+    applyTake(null);
+    setState("starting");
+    let camera = null;
+    let audioRecorder = null;
+    let cameraRecorder = null;
+    let traceTimer = null;
+    const releaseStartupMedia = () => {
+      if (traceTimer !== null) clearInterval(traceTimer);
+      for (const recorder of [audioRecorder, cameraRecorder]) {
+        if (recorder && recorder.state !== "inactive") {
+          try {
+            recorder.stop();
+          } catch {
+          }
+        }
+      }
+      for (const track of camera?.getTracks() ?? []) track.stop();
+    };
+    try {
+      const micStream = opts.mic.status === "live" && opts.mic.stream ? opts.mic.stream : await opts.mic.start(opts.getMicDeviceId());
+      if (superseded()) throw new StartAborted();
+      if (!micStream) throw opts.mic.error ?? new Error("Microphone unavailable");
+      const audioFormat = resolveFormat("audio");
+      audioRecorder = new MediaRecorder(
+        micStream,
+        audioFormat.mimeType ? { mimeType: audioFormat.mimeType } : void 0
+      );
+      let cameraMime = null;
+      let cameraExt = null;
+      if (withCamera) {
+        camera = await requestCameraStream({ video: true, audio: false });
+        if (superseded()) throw new StartAborted();
+        const videoFormat = resolveFormat("video");
+        cameraRecorder = new MediaRecorder(
+          camera,
+          videoFormat.mimeType ? { mimeType: videoFormat.mimeType } : void 0
+        );
+        cameraMime = videoFormat.mimeType;
+        cameraExt = videoFormat.extension;
+      }
+      const capture = {
+        audioRecorder,
+        audioChunks: [],
+        audioMime: audioFormat.mimeType,
+        audioExt: audioFormat.extension,
+        cameraRecorder,
+        cameraChunks: [],
+        cameraMime,
+        cameraExt,
+        cameraStream: camera,
+        traceSamples: [],
+        traceTimer: null,
+        startedAtMs: performance.now(),
+        audioStartMs: null,
+        cameraStartMs: null
+      };
+      audioRecorder.ondataavailable = (e) => {
+        if (e.data.size > 0) capture.audioChunks.push(e.data);
+      };
+      audioRecorder.onstart = () => {
+        capture.audioStartMs = performance.now();
+      };
+      if (cameraRecorder) {
+        cameraRecorder.ondataavailable = (e) => {
+          if (e.data.size > 0) capture.cameraChunks.push(e.data);
+        };
+        cameraRecorder.onstart = () => {
+          capture.cameraStartMs = performance.now();
+        };
+      }
+      if (superseded()) throw new StartAborted();
+      audioRecorder.start(1e3);
+      cameraRecorder?.start(1e3);
+      traceTimer = setInterval(() => {
+        const base = capture.audioStartMs ?? capture.startedAtMs;
+        capture.traceSamples.push({
+          tMs: performance.now() - base,
+          wordPos: optionsRef.current.getWordPos()
+        });
+      }, TRACE_INTERVAL_MS);
+      capture.traceTimer = traceTimer;
+      captureRef.current = capture;
+      setCameraStream(camera);
+      setState("recording");
+      opts.onRecordingStart?.();
+    } catch (err) {
+      releaseStartupMedia();
+      teardownCapture();
+      setCameraStream(null);
+      if (err instanceof StartAborted) {
+        setState("idle");
+      } else {
+        setError(err instanceof Error ? err : new Error(String(err)));
+        setState("error");
+      }
+    } finally {
+      startingRef.current = false;
+    }
+  }, [applyTake, teardownCapture, withCamera]);
+  const stop = useCallback4(async () => {
+    const capture = captureRef.current;
+    if (!capture) {
+      if (startingRef.current) {
+        cancelPendingStart();
+        setState("idle");
+      }
+      return;
+    }
+    captureRef.current = null;
+    if (capture.traceTimer !== null) clearInterval(capture.traceTimer);
+    optionsRef.current.onRecordingStop?.();
+    processingRef.current = true;
+    setState("processing");
+    await stopRecorder(capture.audioRecorder);
+    if (capture.cameraRecorder) await stopRecorder(capture.cameraRecorder);
+    for (const track of capture.cameraStream?.getTracks() ?? []) track.stop();
+    setCameraStream(null);
+    const audioMime = capture.audioRecorder.mimeType || capture.audioMime;
+    const audioBlob = new Blob(capture.audioChunks, { type: audioMime });
+    const cameraBlob = capture.cameraRecorder && capture.cameraChunks.length > 0 ? new Blob(capture.cameraChunks, {
+      type: capture.cameraRecorder.mimeType || capture.cameraMime || "video/webm"
+    }) : null;
+    const wallClockSec = (performance.now() - (capture.audioStartMs ?? capture.startedAtMs)) / 1e3;
+    const script = optionsRef.current.getScript();
+    const trace = { samples: capture.traceSamples };
+    let alignment = null;
+    let durationSec = wallClockSec;
+    if (script) {
+      try {
+        const decodeCtx = new AudioContext();
+        try {
+          const decoded = await decodeCtx.decodeAudioData(await audioBlob.arrayBuffer());
+          durationSec = decoded.duration;
+          alignment = alignNarration({
+            pcm: mixdownToMono(decoded),
+            sampleRate: decoded.sampleRate,
+            script,
+            trace
+          });
+        } finally {
+          void decodeCtx.close().catch(() => void 0);
+        }
+      } catch {
+        alignment = null;
+      }
+    }
+    processingRef.current = false;
+    if (unmountedRef.current) {
+      console.warn(
+        `[squisq-editor] Narration take discarded: the teleprompter was closed while the ${wallClockSec.toFixed(1)}s recording was still being aligned. The audio was not saved.`
+      );
+      return;
+    }
+    applyTake({
+      audioBlob,
+      audioMime,
+      audioExt: capture.audioExt,
+      cameraBlob,
+      cameraMime: cameraBlob ? capture.cameraMime ?? "video/webm" : null,
+      cameraExt: cameraBlob ? capture.cameraExt : null,
+      durationSec,
+      cameraOffsetSec: capture.cameraStartMs !== null && capture.audioStartMs !== null ? (capture.cameraStartMs - capture.audioStartMs) / 1e3 : void 0,
+      trace,
+      alignment,
+      script: script ?? {
+        sourceText: "",
+        tokens: [],
+        blocks: [],
+        totalSyllables: 0,
+        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]
+  );
+  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)}`,
+    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/TeleprompterView.tsx
+import { useCallback as useCallback5, useEffect as useEffect6, useMemo as useMemo4, useRef as useRef7, useState as useState5 } from "react";
+import { createPortal } from "react-dom";
+import { wordIndexAtTime } from "@bendyline/squisq/narration";
+
+// src/teleprompter/TeleprompterSelfView.tsx
+import { useRef as useRef6 } from "react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+function TeleprompterSelfView({ stream }) {
+  const videoRef = useRef6(null);
+  useStreamPreview(videoRef, stream);
+  if (!stream) return null;
+  return /* @__PURE__ */ jsx3(
+    "video",
+    {
+      ref: videoRef,
+      className: "squisq-teleprompter-selfview",
+      muted: true,
+      playsInline: true,
+      autoPlay: true,
+      "data-testid": "teleprompter-selfview"
+    }
+  );
+}
+
+// src/teleprompter/canvasRenderer.ts
+var layoutCache = null;
+function nearestSpoken(tokens, idx) {
+  for (let i = idx; i >= 0; i--) {
+    if (tokens[i].spoken) return i;
+  }
+  for (let i = idx + 1; i < tokens.length; i++) {
+    if (tokens[i].spoken) return i;
+  }
+  return idx;
+}
+function layoutTokens(ctx, script, fontPx, maxWidth) {
+  const key = `${script.tokens.length}:${script.sourceText.length}:${fontPx}:${maxWidth}`;
+  if (layoutCache && layoutCache.key === key) return layoutCache;
+  const spaceW = ctx.measureText(" ").width;
+  const tokenLine = new Array(script.tokens.length);
+  const lines = [];
+  let current = [];
+  let x = 0;
+  for (let i = 0; i < script.tokens.length; i++) {
+    const token = script.tokens[i];
+    const w = ctx.measureText(token.text).width;
+    const startsBlock = i === 0 || script.tokens[i - 1].blockIndex !== token.blockIndex;
+    const startsPara = i > 0 && script.tokens[i - 1].pauseAfter >= 2;
+    if (current.length > 0 && (x + w > maxWidth || startsBlock || startsPara)) {
+      lines.push(current);
+      current = [];
+      x = 0;
+    }
+    tokenLine[i] = lines.length;
+    current.push(i);
+    x += w + spaceW;
+  }
+  if (current.length > 0) lines.push(current);
+  layoutCache = { key, tokenLine, lines };
+  return layoutCache;
+}
+function drawPrompterFrame(canvas, frame) {
+  const ctx = canvas.getContext("2d");
+  if (!ctx) return;
+  const { width, height } = canvas;
+  const fontPx = Math.round(frame.fontSizePx * 0.72);
+  const lineH = Math.round(fontPx * 1.4);
+  const marginX = Math.round(width * 0.06);
+  ctx.save();
+  ctx.fillStyle = frame.colors.bg;
+  ctx.fillRect(0, 0, width, height);
+  if (frame.mirrored) {
+    ctx.translate(width, 0);
+    ctx.scale(-1, 1);
+  }
+  ctx.font = `500 ${fontPx}px system-ui, sans-serif`;
+  ctx.textBaseline = "top";
+  const layout = layoutTokens(ctx, frame.script, fontPx, width - marginX * 2);
+  const count = frame.script.tokens.length;
+  if (count > 0) {
+    const rawActive = Math.min(Math.max(Math.floor(frame.wordPos), 0), count - 1);
+    const frac = Math.min(Math.max(frame.wordPos - rawActive, 0), 1);
+    const active = nearestSpoken(frame.script.tokens, rawActive);
+    const activeLine = layout.tokenLine[active] ?? 0;
+    const eyeY = height * 0.38;
+    const spaceW = ctx.measureText(" ").width;
+    const scrollY = (activeLine + frac) * lineH - eyeY;
+    const firstLine = Math.max(0, Math.floor(scrollY / lineH) - 1);
+    const lastLine = Math.min(layout.lines.length - 1, Math.ceil((scrollY + height) / lineH) + 1);
+    for (let line = firstLine; line <= lastLine; line++) {
+      const y = line * lineH - scrollY;
+      let x = marginX;
+      for (const tokenIdx of layout.lines[line]) {
+        const token = frame.script.tokens[tokenIdx];
+        if (tokenIdx === active) {
+          ctx.fillStyle = frame.colors.accent;
+          ctx.font = `800 ${fontPx}px system-ui, sans-serif`;
+        } else {
+          ctx.fillStyle = frame.colors.text;
+          ctx.font = `500 ${fontPx}px system-ui, sans-serif`;
+          ctx.globalAlpha = tokenIdx < active ? 0.9 : 0.45;
+        }
+        ctx.fillText(token.text, x, y);
+        ctx.globalAlpha = 1;
+        x += ctx.measureText(token.text).width + spaceW;
+      }
+    }
+    ctx.fillStyle = frame.colors.accent;
+    ctx.beginPath();
+    ctx.moveTo(4, eyeY + lineH * 0.2);
+    ctx.lineTo(14, eyeY + lineH * 0.5);
+    ctx.lineTo(4, eyeY + lineH * 0.8);
+    ctx.closePath();
+    ctx.fill();
+  }
+  ctx.restore();
+  if (frame.countdownRemaining !== null) {
+    ctx.save();
+    ctx.fillStyle = `${frame.colors.bg}cc`;
+    ctx.fillRect(0, 0, width, height);
+    ctx.fillStyle = frame.colors.accent;
+    ctx.font = `800 ${Math.round(height * 0.4)}px system-ui, sans-serif`;
+    ctx.textAlign = "center";
+    ctx.textBaseline = "middle";
+    ctx.fillText(String(frame.countdownRemaining), width / 2, height / 2);
+    ctx.restore();
+  }
+  if (frame.recording) {
+    ctx.save();
+    ctx.fillStyle = "#e5484d";
+    ctx.beginPath();
+    ctx.arc(width - 20, 20, 8, 0, Math.PI * 2);
+    ctx.fill();
+    ctx.restore();
+  }
+}
+
+// src/teleprompter/TeleprompterView.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);
+  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 handleRetake = useCallback5(() => {
+    cleanupAbandonedSave();
+    recorderRef.current.retake();
+  }, [cleanupAbandonedSave]);
+  const handleDiscard = useCallback5(() => {
+    cleanupAbandonedSave();
+    recorderRef.current.discard();
+  }, [cleanupAbandonedSave]);
+  useEffect6(() => {
+    const ownerDoc = rootRef.current?.ownerDocument;
+    if (ownerDoc) ensureTeleprompterStyles(ownerDoc);
+  }, []);
+  useEffect6(() => {
+    if (presentationTarget) ensureTeleprompterStyles(presentationTarget.ownerDocument);
+  }, [presentationTarget]);
+  const canvasFrameRef = useRef7(null);
+  canvasFrameRef.current = controller.script ? {
+    script: controller.script,
+    fontSizePx: controller.prefs.fontSizePx,
+    mirrored: controller.prefs.mirrored,
+    colors: {
+      bg: theme.colors.background,
+      text: theme.colors.text,
+      accent: theme.colors.primary,
+      muted: theme.colors.textMuted ?? theme.colors.text
+    },
+    countdownRemaining: controller.countdownRemaining,
+    recording: recorder.state === "recording"
+  } : null;
+  useEffect6(() => {
+    const sink = float.canvasSink;
+    if (float.tier !== "video-pip" || !sink) return;
+    const draw = (wordPos) => {
+      const config = canvasFrameRef.current;
+      if (!config) return;
+      drawPrompterFrame(sink.canvas, { ...config, wordPos });
+      sink.requestFrame();
+    };
+    draw(controllerRef.current.wordPos);
+    const unsubscribe = controllerRef.current.subscribeTick(draw);
+    const interval = setInterval(() => draw(controllerRef.current.wordPos), 200);
+    return () => {
+      unsubscribe();
+      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(
+    () => ({
+      wordPos: controller.wordPos,
+      fontSizePx: controller.prefs.fontSizePx,
+      mirrored: controller.prefs.mirrored,
+      lineGuide: controller.prefs.lineGuide,
+      countdownRemaining: controller.countdownRemaining,
+      recordingIndicator: recorder.state === "recording",
+      theme,
+      onSeekToken: controller.seekToToken
+    }),
+    [
+      controller.wordPos,
+      controller.prefs.fontSizePx,
+      controller.prefs.mirrored,
+      controller.prefs.lineGuide,
+      controller.countdownRemaining,
+      controller.seekToToken,
+      recorder.state,
+      theme
+    ]
+  );
+  if (!controller.script) {
+    return /* @__PURE__ */ jsxs3(Fragment3, { children: [
+      /* @__PURE__ */ jsx4("div", { ref: rootRef, className: "squisq-teleprompter-root", "data-testid": "teleprompter-view", children: /* @__PURE__ */ jsx4("div", { className: "squisq-teleprompter-float-note", children: /* @__PURE__ */ jsx4("p", { children: "Nothing to narrate yet \u2014 add some content to the document." }) }) }),
+      presentationTarget ? createPortal(
+        /* @__PURE__ */ jsx4("div", { className: "squisq-presentation-teleprompter", "aria-label": "Audience presentation", children: /* @__PURE__ */ jsx4("div", { className: "squisq-teleprompter-float-note", children: /* @__PURE__ */ jsx4("p", { children: "Nothing to narrate yet \u2014 add some content to the document." }) }) }),
+        presentationTarget
+      ) : null
+    ] });
+  }
+  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: [
+    /* @__PURE__ */ jsx4(
+      "button",
+      {
+        type: "button",
+        onClick: () => void recorder.start(),
+        title: "Record narration while you read",
+        children: "\u23FA Record"
+      }
+    ),
+    /* @__PURE__ */ jsxs3("label", { title: "Also capture your camera as a separate video file", children: [
+      /* @__PURE__ */ jsx4(
+        "input",
+        {
+          type: "checkbox",
+          checked: recorder.withCamera,
+          onChange: (e) => recorder.setWithCamera(e.target.checked)
+        }
+      ),
+      "camera"
+    ] }),
+    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 })
+      ]
+    }
+  );
+}
+
+export {
+  PCM_WORKLET_NAME,
+  PCM_WORKLET_SOURCE,
+  registerPcmWorklet,
+  useMicAnalysis,
+  DEFAULT_TELEPROMPTER_PREFS,
+  vadConfigForSensitivity,
+  useTeleprompter,
+  detectFloatTiers,
+  createFloatingWindowManager,
+  useFloatingWindow,
+  EYE_LINE_FRACTION,
+  measureTokenLines,
+  targetOffsetFor,
+  stepScroll,
+  prompterVarsFromTheme,
+  ensureTeleprompterStyles,
+  TELEPROMPTER_CSS,
+  TeleprompterSurface,
+  TeleprompterControls,
+  useNarrationRecorder,
+  narrationAnnotationLine,
+  cameraVideoLine,
+  insertNarrationPreamble,
+  buildNarrationSavePlan,
+  executeNarrationSave,
+  TeleprompterView
+};