@signalsandsorcery/plugin-sdk 2.36.1 → 2.38.2

package/dist/index.mjs

@@ -69,7 +69,7 @@ import React9 from "react";
 import { AlertCircle, ChevronDown, GripVertical } from "lucide-react";
 
 // src/components/TrackDrawer.tsx
-import { useState as useState4, useMemo as useMemo3 } from "react";
+import { useState as useState5, useMemo as useMemo3 } from "react";
 
 // src/constants/fx-presets.ts
 var EQ_PRESETS = {
@@ -1051,14 +1051,132 @@ function TrackExternalFxSection({
   );
 }
 
-// src/components/TrackDrawer.tsx
+// src/components/TrackFreezeSection.tsx
 import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var STALE_LABELS = {
+  midi: "MIDI changed",
+  preset: "preset changed",
+  instrument: "instrument changed",
+  "external-fx": "FX changed",
+  role: "role changed"
+};
+function TrackFreezeSection({
+  state,
+  busy,
+  error,
+  onFreeze,
+  onUnfreeze
+}) {
+  const frozen = state?.frozen === true;
+  const stale = frozen && state?.stale === true;
+  const missing = state?.missingDeps ?? [];
+  const unfreezeBlocked = frozen && missing.length > 0;
+  const statusLine = !state ? "Reading freeze state\u2026" : !frozen ? state.latentFreshFreeze ? "Live \u2014 a fresh stem is cached, freezing is instant." : "Live \u2014 playing through the instrument and FX chain." : stale ? `\u26A0\uFE0F\u2744 Frozen (stale) \u2014 ${state.staleReasons.map((r) => STALE_LABELS[r] ?? r).join(", ")} since the stem rendered. Playback keeps the old stem until you re-freeze.` : "\u2744 Frozen \u2014 playing the rendered stem. Mixer (volume \xB7 pan \xB7 mute \xB7 solo) stays live.";
+  const primaryLabel = busy === "freeze" ? "Rendering stem\u2026" : busy === "unfreeze" ? "Restoring chain\u2026" : !frozen ? "\u2744 Freeze track" : stale ? "\u2744 Re-freeze (render new stem)" : "Unfreeze track";
+  const primaryAction = !frozen || stale ? onFreeze : onUnfreeze;
+  const primaryDisabled = busy !== null || !state || frozen && !stale && unfreezeBlocked;
+  return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-2", "data-testid": "sdk-freeze-section", children: [
+    /* @__PURE__ */ jsx4("p", { className: "text-[11px] text-sas-muted/80 leading-snug", "data-testid": "sdk-freeze-status", children: statusLine }),
+    frozen && missing.length > 0 && /* @__PURE__ */ jsxs4(
+      "div",
+      {
+        className: "text-[11px] leading-snug rounded-sm border border-sas-border bg-sas-panel-alt px-2 py-1.5 text-sas-muted",
+        "data-testid": "sdk-freeze-missing-deps",
+        children: [
+          "Missing on this machine:",
+          " ",
+          /* @__PURE__ */ jsx4("span", { className: "text-sas-accent", children: missing.map((d) => d.name).join(", ") }),
+          ". ",
+          "Install (or rescan plugins if blacklisted) to unfreeze \u2014 the frozen sound keeps playing meanwhile."
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx4(
+      "button",
+      {
+        type: "button",
+        "data-testid": "sdk-freeze-primary",
+        disabled: primaryDisabled,
+        onClick: primaryAction,
+        className: `w-full py-2 text-xs font-medium rounded-sm border transition-colors ${primaryDisabled ? "border-sas-border text-sas-muted/40 cursor-not-allowed" : "border-sas-accent bg-sas-accent/20 text-sas-accent hover:bg-sas-accent/40"}`,
+        title: !frozen ? "Render this track to audio and disable its plugins (mix controls stay live)" : stale ? "Sound inputs changed \u2014 render a fresh stem" : unfreezeBlocked ? "Unfreeze needs the missing plugins installed" : "Remove the stem and re-enable the instrument + FX chain",
+        children: primaryLabel
+      }
+    ),
+    frozen && stale && !unfreezeBlocked && /* @__PURE__ */ jsx4(
+      "button",
+      {
+        type: "button",
+        "data-testid": "sdk-freeze-unfreeze-secondary",
+        disabled: busy !== null,
+        onClick: onUnfreeze,
+        className: "w-full py-1.5 text-[11px] rounded-sm border border-sas-border text-sas-muted hover:border-sas-accent hover:text-sas-accent transition-colors",
+        children: "Unfreeze instead (back to live editing)"
+      }
+    ),
+    error && /* @__PURE__ */ jsx4("p", { className: "text-[11px] text-red-400 leading-snug", "data-testid": "sdk-freeze-error", children: error }),
+    /* @__PURE__ */ jsx4("p", { className: "text-[10px] text-sas-muted/50 leading-snug", children: "Frozen tracks survive missing plugins and travel inside project backups. The stem is kept after unfreezing, so re-freezing an unchanged track is instant." })
+  ] });
+}
+
+// src/hooks/useTrackFreeze.ts
+import { useState as useState4, useEffect as useEffect2, useCallback as useCallback3 } from "react";
+function useTrackFreeze(host, trackId) {
+  const enabled = !!host && typeof host.getTrackFreezeState === "function";
+  const [state, setState] = useState4(null);
+  const [busy, setBusy] = useState4(null);
+  const [error, setError] = useState4(null);
+  const refresh = useCallback3(async () => {
+    if (!enabled || !host?.getTrackFreezeState) return;
+    try {
+      setState(await host.getTrackFreezeState(trackId));
+    } catch {
+      setState(null);
+    }
+  }, [enabled, host, trackId]);
+  useEffect2(() => {
+    void refresh();
+  }, [refresh]);
+  useEffect2(() => {
+    if (!enabled) return void 0;
+    const onFreezeChanged = () => {
+      void refresh();
+    };
+    window.addEventListener("sas:freeze-changed", onFreezeChanged);
+    return () => window.removeEventListener("sas:freeze-changed", onFreezeChanged);
+  }, [enabled, refresh]);
+  const run = useCallback3(
+    async (action) => {
+      if (!host) return;
+      const method = action === "freeze" ? host.freezeTrack : host.unfreezeTrack;
+      if (typeof method !== "function") return;
+      setBusy(action);
+      setError(null);
+      try {
+        setState(await method.call(host, trackId));
+      } catch (e) {
+        setError(e instanceof Error ? e.message : String(e));
+        void refresh();
+      } finally {
+        setBusy(null);
+      }
+    },
+    [host, trackId, refresh]
+  );
+  const freeze = useCallback3(() => run("freeze"), [run]);
+  const unfreeze = useCallback3(() => run("unfreeze"), [run]);
+  return { enabled, state, busy, error, refresh, freeze, unfreeze };
+}
+
+// src/components/TrackDrawer.tsx
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 var TAB_LABELS = {
   fx: "FX",
   pick: "Pick",
   history: "History",
   import: "Import",
-  edit: "Edit"
+  edit: "Edit",
+  freeze: "\u2744 Freeze"
 };
 function TrackDrawer({
   activeTab,
@@ -1070,6 +1188,7 @@ function TrackDrawer({
   onFxDryWetChange,
   fxDisabled = false,
   externalFxHost,
+  freeze,
   instruments = [],
   currentPluginId = null,
   isLoading = false,
@@ -1092,12 +1211,15 @@ function TrackDrawer({
   editSnap,
   onAuditionNote
 }) {
-  const [search, setSearch] = useState4("");
+  const [search, setSearch] = useState5("");
   const fxEnabled = !!onFxToggle;
   const pickEnabled = !!onSelect;
   const historyEnabled = !!onRestoreSound;
   const importEnabled = !!onImportSound;
   const editEnabled = !!onNotesChange;
+  const internalFreeze = useTrackFreeze(freeze ? void 0 : externalFxHost, trackId);
+  const fz = freeze ?? internalFreeze;
+  const freezeEnabled = fz.enabled;
   const enabledTabs = useMemo3(() => {
     const tabs = [];
     if (fxEnabled) tabs.push("fx");
@@ -1105,8 +1227,9 @@ function TrackDrawer({
     if (historyEnabled) tabs.push("history");
     if (importEnabled) tabs.push("import");
     if (editEnabled) tabs.push("edit");
+    if (freezeEnabled) tabs.push("freeze");
     return tabs;
-  }, [fxEnabled, pickEnabled, historyEnabled, importEnabled, editEnabled]);
+  }, [fxEnabled, pickEnabled, historyEnabled, importEnabled, editEnabled, freezeEnabled]);
   const SURGE_XT_DEFAULT_ID = "Surge XT";
   const filtered = useMemo3(() => {
     let all = instruments.filter((i) => i.name !== "Surge XT");
@@ -1128,12 +1251,12 @@ function TrackDrawer({
   const history = soundHistory ?? [];
   const effectiveTab = enabledTabs.includes(activeTab) ? activeTab : enabledTabs[0] ?? "fx";
   const tabClass = (active) => `px-2 py-0.5 text-xs rounded-sm transition-colors ${active ? "bg-sas-accent/20 text-sas-accent font-medium" : "text-sas-muted hover:text-sas-accent"}`;
-  const strip = enabledTabs.length > 1 ? /* @__PURE__ */ jsx4(
+  const strip = enabledTabs.length > 1 ? /* @__PURE__ */ jsx5(
     "div",
     {
       className: "flex items-center gap-1 border-b border-sas-border pb-1",
       "data-testid": "sdk-drawer-tabs",
-      children: enabledTabs.map((tab) => /* @__PURE__ */ jsx4(
+      children: enabledTabs.map((tab) => /* @__PURE__ */ jsx5(
         "button",
         {
           type: "button",
@@ -1147,9 +1270,9 @@ function TrackDrawer({
     }
   ) : null;
   const currentSound = soundHistoryCursor >= 0 && soundHistoryCursor < history.length ? history[soundHistoryCursor].label : null;
-  const header = strip || currentSound ? /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-1", "data-testid": "sdk-drawer-header", children: [
+  const header = strip || currentSound ? /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-1", "data-testid": "sdk-drawer-header", children: [
     strip,
-    currentSound && /* @__PURE__ */ jsx4(
+    currentSound && /* @__PURE__ */ jsx5(
       "span",
       {
         className: "text-[10px] text-sas-muted/60 truncate px-0.5",
@@ -1158,10 +1281,41 @@ function TrackDrawer({
       }
     )
   ] }) : null;
+  if (effectiveTab === "freeze") {
+    return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", "data-testid": "sdk-drawer-freeze", children: [
+      header,
+      /* @__PURE__ */ jsx5(
+        TrackFreezeSection,
+        {
+          state: fz.state,
+          busy: fz.busy,
+          error: fz.error,
+          onFreeze: () => void fz.freeze(),
+          onUnfreeze: () => void fz.unfreeze()
+        }
+      )
+    ] });
+  }
+  if (fz.state?.frozen === true) {
+    return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", "data-testid": "sdk-drawer-frozen-lock", children: [
+      header,
+      /* @__PURE__ */ jsx5("div", { className: "text-[11px] text-sas-muted/80 leading-snug rounded-sm border border-sas-border bg-sas-panel-alt px-2 py-2", children: "\u2744 This track is frozen \u2014 it plays its rendered stem, so sound editing here would be inaudible. Volume, pan, mute and solo stay live." }),
+      /* @__PURE__ */ jsx5(
+        "button",
+        {
+          type: "button",
+          "data-testid": "sdk-drawer-frozen-goto",
+          onClick: () => onTabChange?.("freeze"),
+          className: "w-full py-2 text-xs font-medium rounded-sm border border-sas-accent bg-sas-accent/20 text-sas-accent hover:bg-sas-accent/40 transition-colors",
+          children: "Open the Freeze tab to unfreeze"
+        }
+      )
+    ] });
+  }
   if (effectiveTab === "edit") {
-    return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-2", "data-testid": "sdk-drawer-edit", children: [
+    return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", "data-testid": "sdk-drawer-edit", children: [
       header,
-      /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsx5(
         PianoRollEditor,
         {
           notes: editNotes ?? [],
@@ -1176,9 +1330,9 @@ function TrackDrawer({
     ] });
   }
   if (effectiveTab === "fx") {
-    return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-2", "data-testid": "sdk-drawer-fx", children: [
+    return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", "data-testid": "sdk-drawer-fx", children: [
       header,
-      /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsx5(
         FxToggleBar,
         {
           trackId,
@@ -1189,20 +1343,20 @@ function TrackDrawer({
           disabled: fxDisabled
         }
       ),
-      externalFxHost && /* @__PURE__ */ jsx4(TrackExternalFxSection, { host: externalFxHost, trackId, disabled: fxDisabled })
+      externalFxHost && /* @__PURE__ */ jsx5(TrackExternalFxSection, { host: externalFxHost, trackId, disabled: fxDisabled })
     ] });
   }
   if (effectiveTab === "import") {
     const soundNoun = /preset/i.test(importSoundLabel ?? "") ? "preset" : /sample/i.test(importSoundLabel ?? "") ? "sample" : "sound";
-    return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-2", "data-testid": "sdk-drawer-import", children: [
+    return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", "data-testid": "sdk-drawer-import", children: [
       header,
-      /* @__PURE__ */ jsxs4("p", { className: "text-[11px] text-sas-muted/70 leading-snug", children: [
+      /* @__PURE__ */ jsxs5("p", { className: "text-[11px] text-sas-muted/70 leading-snug", children: [
         "Copy the sound from a matching track in another scene \u2014 your MIDI stays, only the",
         " ",
         soundNoun,
         " changes."
       ] }),
-      /* @__PURE__ */ jsxs4(
+      /* @__PURE__ */ jsxs5(
         "button",
         {
           type: "button",
@@ -1220,16 +1374,16 @@ function TrackDrawer({
   }
   if (effectiveTab === "history") {
     const order = history.map((_, i) => i).reverse();
-    return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-2", children: [
+    return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
       header,
-      history.length === 0 ? /* @__PURE__ */ jsx4(
+      history.length === 0 ? /* @__PURE__ */ jsx5(
         "div",
         {
           className: "text-xs text-sas-muted/60 text-center py-3",
           "data-testid": "sdk-history-empty",
           children: "No sounds yet \u2014 shuffle to build history."
         }
-      ) : /* @__PURE__ */ jsx4(
+      ) : /* @__PURE__ */ jsx5(
         "ul",
         {
           className: "flex flex-col gap-1 max-h-[160px] overflow-y-auto",
@@ -1237,8 +1391,8 @@ function TrackDrawer({
           children: order.map((i) => {
             const entry = history[i];
             const isCurrent = i === soundHistoryCursor;
-            return /* @__PURE__ */ jsxs4("li", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ jsxs4(
+            return /* @__PURE__ */ jsxs5("li", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsxs5(
                 "button",
                 {
                   type: "button",
@@ -1248,12 +1402,12 @@ function TrackDrawer({
                   className: `flex-1 min-w-0 flex items-center justify-between px-2 py-1.5 rounded-sm border text-left text-xs transition-colors ${isCurrent ? "border-sas-accent bg-sas-accent/20 text-sas-accent cursor-default" : "border-sas-border bg-sas-panel-alt text-sas-muted hover:border-sas-accent hover:text-sas-accent"}`,
                   title: isCurrent ? "Current sound" : `Restore: ${entry.label}`,
                   children: [
-                    /* @__PURE__ */ jsx4("span", { className: "truncate", children: entry.label }),
-                    /* @__PURE__ */ jsx4("span", { className: "text-[10px] text-sas-muted/60 flex-shrink-0 ml-2", children: isCurrent ? "\u25CF current" : "restore" })
+                    /* @__PURE__ */ jsx5("span", { className: "truncate", children: entry.label }),
+                    /* @__PURE__ */ jsx5("span", { className: "text-[10px] text-sas-muted/60 flex-shrink-0 ml-2", children: isCurrent ? "\u25CF current" : "restore" })
                   ]
                 }
               ),
-              onToggleFavorite && /* @__PURE__ */ jsx4(
+              onToggleFavorite && /* @__PURE__ */ jsx5(
                 "button",
                 {
                   type: "button",
@@ -1271,10 +1425,10 @@ function TrackDrawer({
     ] });
   }
   if (effectiveTab === "pick" && editorStage) {
-    return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-2", children: [
+    return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
       header,
-      /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx5(
           "button",
           {
             onClick: () => onBackToInstruments?.(),
@@ -1282,9 +1436,9 @@ function TrackDrawer({
             children: "\u2190 Back"
           }
         ),
-        /* @__PURE__ */ jsx4("span", { className: "text-xs text-sas-muted font-medium truncate flex-1", children: selectedInstrumentName ?? "Plugin" })
+        /* @__PURE__ */ jsx5("span", { className: "text-xs text-sas-muted font-medium truncate flex-1", children: selectedInstrumentName ?? "Plugin" })
       ] }),
-      /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsx5(
         "button",
         {
           onClick: () => onShowEditor?.(),
@@ -1296,10 +1450,10 @@ function TrackDrawer({
   }
   const isDefaultSelected = currentPluginId === null;
   const isSelected = (pluginId) => pluginId === currentPluginId;
-  return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-2", children: [
+  return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
     header,
-    /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx4(
+    /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx5(
         "input",
         {
           type: "text",
@@ -1309,7 +1463,7 @@ function TrackDrawer({
           className: "sas-input flex-1 px-2 py-1 text-xs"
         }
       ),
-      /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsx5(
         "button",
         {
           onClick: () => onRefresh?.(),
@@ -1320,43 +1474,43 @@ function TrackDrawer({
         }
       )
     ] }),
-    isLoading && instruments.length === 0 ? /* @__PURE__ */ jsx4("div", { className: "text-xs text-sas-muted/60 text-center py-3", children: "Scanning plugins..." }) : /* @__PURE__ */ jsxs4("div", { className: "grid grid-cols-3 gap-1 max-h-[140px] overflow-y-auto", children: [
-      /* @__PURE__ */ jsxs4(
+    isLoading && instruments.length === 0 ? /* @__PURE__ */ jsx5("div", { className: "text-xs text-sas-muted/60 text-center py-3", children: "Scanning plugins..." }) : /* @__PURE__ */ jsxs5("div", { className: "grid grid-cols-3 gap-1 max-h-[140px] overflow-y-auto", children: [
+      /* @__PURE__ */ jsxs5(
         "button",
         {
           onClick: () => onSelect?.(SURGE_XT_DEFAULT_ID),
           className: `flex flex-col items-start px-2 py-1.5 rounded-sm border text-left transition-colors ${isDefaultSelected ? "border-sas-accent bg-sas-accent/20 text-sas-accent" : "border-sas-border bg-sas-panel-alt text-sas-muted hover:border-sas-accent hover:text-sas-accent"}`,
           title: "Surge XT \u2014 Default instrument",
           children: [
-            /* @__PURE__ */ jsxs4("span", { className: "text-xs font-medium truncate w-full", children: [
+            /* @__PURE__ */ jsxs5("span", { className: "text-xs font-medium truncate w-full", children: [
               isDefaultSelected && "\u2713 ",
               "Surge XT"
             ] }),
-            /* @__PURE__ */ jsx4("span", { className: "text-[9px] text-sas-muted/50 truncate w-full", children: "Default" })
+            /* @__PURE__ */ jsx5("span", { className: "text-[9px] text-sas-muted/50 truncate w-full", children: "Default" })
           ]
         },
         "__surge-xt-default__"
       ),
       filtered.map((inst) => {
         const selected = isSelected(inst.pluginId);
-        return /* @__PURE__ */ jsxs4(
+        return /* @__PURE__ */ jsxs5(
           "button",
           {
             onClick: () => onSelect?.(inst.pluginId),
             className: `flex flex-col items-start px-2 py-1.5 rounded-sm border text-left transition-colors ${selected ? "border-sas-accent bg-sas-accent/20 text-sas-accent" : inst.missing ? "border-amber-500/50 bg-amber-500/10 text-amber-400 hover:border-amber-500" : "border-sas-border bg-sas-panel-alt text-sas-muted hover:border-sas-accent hover:text-sas-accent"}`,
             title: `${inst.name} by ${inst.manufacturer} (${inst.type.toUpperCase()})${inst.missing ? " \u2014 MISSING" : ""}`,
             children: [
-              /* @__PURE__ */ jsxs4("span", { className: "text-xs font-medium truncate w-full", children: [
+              /* @__PURE__ */ jsxs5("span", { className: "text-xs font-medium truncate w-full", children: [
                 selected && "\u2713 ",
                 inst.name
               ] }),
-              /* @__PURE__ */ jsx4("span", { className: "text-[9px] text-sas-muted/50 truncate w-full", children: inst.manufacturer || inst.type.toUpperCase() })
+              /* @__PURE__ */ jsx5("span", { className: "text-[9px] text-sas-muted/50 truncate w-full", children: inst.manufacturer || inst.type.toUpperCase() })
             ]
           },
           inst.pluginId
         );
       }),
-      filtered.length === 0 && /* @__PURE__ */ jsx4("div", { className: "col-span-2 text-xs text-sas-muted/60 text-center py-2", children: search.trim() ? "No matches" : "No other plugins found" })
+      filtered.length === 0 && /* @__PURE__ */ jsx5("div", { className: "col-span-2 text-xs text-sas-muted/60 text-center py-2", children: search.trim() ? "No matches" : "No other plugins found" })
     ] })
   ] });
 }
@@ -1365,9 +1519,9 @@ function TrackDrawer({
 import { useRef as useRef3 } from "react";
 
 // src/components/Modal.tsx
-import { useEffect as useEffect2 } from "react";
+import { useEffect as useEffect3 } from "react";
 import { createPortal } from "react-dom";
-import { jsx as jsx5 } from "react/jsx-runtime";
+import { jsx as jsx6 } from "react/jsx-runtime";
 function Modal({
   open,
   onClose,
@@ -1377,7 +1531,7 @@ function Modal({
   closeOnEscape = true,
   initialFocusRef
 }) {
-  useEffect2(() => {
+  useEffect3(() => {
     if (!open) return void 0;
     const onKey = (e) => {
       if (closeOnEscape && e.key === "Escape") {
@@ -1391,7 +1545,7 @@ function Modal({
   }, [open, onClose, closeOnEscape, initialFocusRef]);
   if (!open) return null;
   return createPortal(
-    /* @__PURE__ */ jsx5(
+    /* @__PURE__ */ jsx6(
       "div",
       {
         className: "fixed inset-0 z-[1000] flex items-center justify-center bg-black/60",
@@ -1405,7 +1559,7 @@ function Modal({
 }
 
 // src/components/ConfirmDialog.tsx
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 function ConfirmDialog({
   open,
   title,
@@ -1418,7 +1572,7 @@ function ConfirmDialog({
   testIdPrefix = "confirm-dialog"
 }) {
   const cancelRef = useRef3(null);
-  return /* @__PURE__ */ jsx6(Modal, { open, onClose: onCancel, testIdPrefix, initialFocusRef: cancelRef, children: /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsx7(Modal, { open, onClose: onCancel, testIdPrefix, initialFocusRef: cancelRef, children: /* @__PURE__ */ jsxs6(
     "div",
     {
       className: "w-[360px] max-w-[90vw] flex flex-col rounded-md border border-sas-border bg-sas-panel shadow-xl",
@@ -1428,8 +1582,8 @@ function ConfirmDialog({
       "aria-label": title,
       "data-testid": `${testIdPrefix}-modal`,
       children: [
-        /* @__PURE__ */ jsx6("div", { className: "px-4 py-3 border-b border-sas-border", children: /* @__PURE__ */ jsx6("span", { className: "text-sm font-medium text-sas-text", "data-testid": `${testIdPrefix}-title`, children: title }) }),
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7("div", { className: "px-4 py-3 border-b border-sas-border", children: /* @__PURE__ */ jsx7("span", { className: "text-sm font-medium text-sas-text", "data-testid": `${testIdPrefix}-title`, children: title }) }),
+        /* @__PURE__ */ jsx7(
           "div",
           {
             className: "px-4 py-3 text-xs text-sas-muted leading-relaxed break-words",
@@ -1437,8 +1591,8 @@ function ConfirmDialog({
             children: message
           }
         ),
-        /* @__PURE__ */ jsxs5("div", { className: "flex justify-end gap-2 px-4 py-3 border-t border-sas-border", children: [
-          /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsxs6("div", { className: "flex justify-end gap-2 px-4 py-3 border-t border-sas-border", children: [
+          /* @__PURE__ */ jsx7(
             "button",
             {
               ref: cancelRef,
@@ -1449,7 +1603,7 @@ function ConfirmDialog({
               children: cancelLabel
             }
           ),
-          /* @__PURE__ */ jsx6(
+          /* @__PURE__ */ jsx7(
             "button",
             {
               type: "button",
@@ -1466,7 +1620,7 @@ function ConfirmDialog({
 }
 
 // src/components/LevelMeter.tsx
-import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 var COLOR_GREEN = "#2BD576";
 var COLOR_ORANGE = "#F5A623";
 var COLOR_RED = "#FF4D5E";
@@ -1494,7 +1648,7 @@ var LevelMeter = ({
   const widthPct = active ? dbToPct(peakDb) : 0;
   const showPeak = peakHoldDb != null && active && peakHoldDb > -60;
   const peakHoldPct = showPeak ? dbToPct(peakHoldDb) : 0;
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     "div",
     {
       className: `sas-level-meter ${className ?? ""}`,
@@ -1505,7 +1659,7 @@ var LevelMeter = ({
         gap: compact ? 0 : 6
       },
       children: [
-        /* @__PURE__ */ jsxs6(
+        /* @__PURE__ */ jsxs7(
           "div",
           {
             style: {
@@ -1519,8 +1673,8 @@ var LevelMeter = ({
               minWidth: compact ? 0 : 60
             },
             children: [
-              /* @__PURE__ */ jsx7("div", { style: { position: "absolute", inset: 0, background: METER_GRADIENT } }),
-              /* @__PURE__ */ jsx7(
+              /* @__PURE__ */ jsx8("div", { style: { position: "absolute", inset: 0, background: METER_GRADIENT } }),
+              /* @__PURE__ */ jsx8(
                 "div",
                 {
                   style: {
@@ -1534,7 +1688,7 @@ var LevelMeter = ({
                   }
                 }
               ),
-              /* @__PURE__ */ jsx7(
+              /* @__PURE__ */ jsx8(
                 "div",
                 {
                   "data-testid": `${id}-segments`,
@@ -1547,7 +1701,7 @@ var LevelMeter = ({
                   }
                 }
               ),
-              showPeak && /* @__PURE__ */ jsx7(
+              showPeak && /* @__PURE__ */ jsx8(
                 "div",
                 {
                   "data-testid": `${id}-peak`,
@@ -1568,7 +1722,7 @@ var LevelMeter = ({
             ]
           }
         ),
-        !compact && /* @__PURE__ */ jsx7(
+        !compact && /* @__PURE__ */ jsx8(
           "span",
           {
             style: {
@@ -1581,7 +1735,7 @@ var LevelMeter = ({
             children: active && peakDb > -120 ? `${peakDb.toFixed(0)} dB` : "\u2014"
           }
         ),
-        clipped && /* @__PURE__ */ jsx7(
+        clipped && /* @__PURE__ */ jsx8(
           "span",
           {
             "data-testid": `${id}-clip`,
@@ -1606,7 +1760,7 @@ var LevelMeter = ({
 };
 
 // src/hooks/useTrackLevels.ts
-import { useEffect as useEffect3, useRef as useRef4, useState as useState5 } from "react";
+import { useEffect as useEffect4, useRef as useRef4, useState as useState6 } from "react";
 var meterDiagRLast = /* @__PURE__ */ new Map();
 var POLL_INTERVAL_MS = 33;
 var HIDDEN_RECHECK_MS = 250;
@@ -1631,7 +1785,7 @@ function useTrackLevels(host, enabled = true) {
       }
     };
   }
-  useEffect3(() => {
+  useEffect4(() => {
     const notify = () => {
       listenersRef.current.forEach((l) => l());
     };
@@ -1701,8 +1855,8 @@ function sameLevel(a, b) {
   return a.peakDb === b.peakDb && a.clipped === b.clipped;
 }
 function useTrackLevel(handle, trackId) {
-  const [level, setLevel] = useState5(null);
-  useEffect3(() => {
+  const [level, setLevel] = useState6(null);
+  useEffect4(() => {
     if (!handle) {
       setLevel(null);
       return;
@@ -1726,11 +1880,11 @@ function sameMeter(a, b) {
   return a.active === b.active && a.clipped === b.clipped && a.peakDb === b.peakDb && Math.round(a.peakHoldDb * 2) === Math.round(b.peakHoldDb * 2);
 }
 function useTrackMeter(handle, trackId) {
-  const [view, setView] = useState5(IDLE_METER_VIEW);
+  const [view, setView] = useState6(IDLE_METER_VIEW);
   const heldDbRef = useRef4(METER_FLOOR_DB);
   const heldAtRef = useRef4(0);
   const lastTickRef = useRef4(0);
-  useEffect3(() => {
+  useEffect4(() => {
     if (!handle) {
       heldDbRef.current = METER_FLOOR_DB;
       lastTickRef.current = 0;
@@ -1773,8 +1927,8 @@ function useTrackMeter(handle, trackId) {
   return view;
 }
 function useTransportPlaying(host) {
-  const [playing, setPlaying] = useState5(false);
-  useEffect3(() => {
+  const [playing, setPlaying] = useState6(false);
+  useEffect4(() => {
     if (!host) {
       setPlaying(false);
       return;
@@ -1802,7 +1956,7 @@ function useTransportPlaying(host) {
 }
 
 // src/components/TrackMeterStrip.tsx
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { jsx as jsx9 } from "react/jsx-runtime";
 var TrackMeterStrip = ({
   levels,
   trackId,
@@ -1810,12 +1964,12 @@ var TrackMeterStrip = ({
   className
 }) => {
   const meter = useTrackMeter(levels, trackId);
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     "div",
     {
       "data-testid": "sdk-track-meter",
       className: `w-full px-2 py-1 bg-sas-panel-alt border border-t-0 border-sas-border ${roundBottom ? "rounded-b-sm" : ""} ${className ?? ""}`,
-      children: /* @__PURE__ */ jsx8(
+      children: /* @__PURE__ */ jsx9(
         LevelMeter,
         {
           compact: true,
@@ -1831,7 +1985,7 @@ var TrackMeterStrip = ({
 };
 
 // src/components/VolumeSlider.tsx
-import { useCallback as useCallback3, useState as useState6, useRef as useRef5, useEffect as useEffect4 } from "react";
+import { useCallback as useCallback4, useState as useState7, useRef as useRef5, useEffect as useEffect5 } from "react";
 
 // src/utils/volume-conversion.ts
 var SLIDER_UNITY = 0.75;
@@ -1853,7 +2007,7 @@ function dbToSlider(db) {
 }
 
 // src/components/VolumeSlider.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { jsx as jsx10 } from "react/jsx-runtime";
 function formatDb(value) {
   const db = sliderToDb(value);
   if (db <= -60) return "-\u221E dB";
@@ -1863,10 +2017,10 @@ function formatDb(value) {
 function useDebouncedCallback(callback, delay) {
   const timeoutRef = useRef5(null);
   const callbackRef = useRef5(callback);
-  useEffect4(() => {
+  useEffect5(() => {
     callbackRef.current = callback;
   }, [callback]);
-  const debouncedCallback = useCallback3(
+  const debouncedCallback = useCallback4(
     (...args) => {
       if (timeoutRef.current) {
         clearTimeout(timeoutRef.current);
@@ -1877,7 +2031,7 @@ function useDebouncedCallback(callback, delay) {
     },
     [delay]
   );
-  useEffect4(() => {
+  useEffect5(() => {
     return () => {
       if (timeoutRef.current) {
         clearTimeout(timeoutRef.current);
@@ -1892,15 +2046,15 @@ var VolumeSlider = ({
   disabled = false,
   className = ""
 }) => {
-  const [localValue, setLocalValue] = useState6(value);
-  const [isDragging, setIsDragging] = useState6(false);
-  useEffect4(() => {
+  const [localValue, setLocalValue] = useState7(value);
+  const [isDragging, setIsDragging] = useState7(false);
+  useEffect5(() => {
     if (!isDragging) {
       setLocalValue(value);
     }
   }, [value, isDragging]);
   const debouncedOnChange = useDebouncedCallback(onChange, 50);
-  const handleChange = useCallback3(
+  const handleChange = useCallback4(
     (e) => {
       const newValue = parseFloat(e.target.value);
       setLocalValue(newValue);
@@ -1908,19 +2062,19 @@ var VolumeSlider = ({
     },
     [debouncedOnChange]
   );
-  const handleMouseDown = useCallback3(() => {
+  const handleMouseDown = useCallback4(() => {
     setIsDragging(true);
   }, []);
-  const handleMouseUp = useCallback3(() => {
+  const handleMouseUp = useCallback4(() => {
     setIsDragging(false);
     onChange(localValue);
   }, [localValue, onChange]);
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     "div",
     {
       className: `flex items-center ${className}`,
       title: `Volume: ${formatDb(localValue)}`,
-      children: /* @__PURE__ */ jsx9(
+      children: /* @__PURE__ */ jsx10(
         "input",
         {
           type: "range",
@@ -1960,8 +2114,8 @@ var VolumeSlider = ({
 };
 
 // src/components/PanSlider.tsx
-import { useCallback as useCallback4, useState as useState7, useRef as useRef6, useEffect as useEffect5 } from "react";
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { useCallback as useCallback5, useState as useState8, useRef as useRef6, useEffect as useEffect6 } from "react";
+import { jsx as jsx11 } from "react/jsx-runtime";
 function toPanDisplay(value) {
   if (Math.abs(value) < 0.02) {
     return "Center";
@@ -1972,10 +2126,10 @@ function toPanDisplay(value) {
 function useDebouncedCallback2(callback, delay) {
   const timeoutRef = useRef6(null);
   const callbackRef = useRef6(callback);
-  useEffect5(() => {
+  useEffect6(() => {
     callbackRef.current = callback;
   }, [callback]);
-  const debouncedCallback = useCallback4(
+  const debouncedCallback = useCallback5(
     (...args) => {
       if (timeoutRef.current) {
         clearTimeout(timeoutRef.current);
@@ -1986,7 +2140,7 @@ function useDebouncedCallback2(callback, delay) {
     },
     [delay]
   );
-  useEffect5(() => {
+  useEffect6(() => {
     return () => {
       if (timeoutRef.current) {
         clearTimeout(timeoutRef.current);
@@ -2001,15 +2155,15 @@ var PanSlider = ({
   disabled = false,
   className = ""
 }) => {
-  const [localValue, setLocalValue] = useState7(value);
-  const [isDragging, setIsDragging] = useState7(false);
-  useEffect5(() => {
+  const [localValue, setLocalValue] = useState8(value);
+  const [isDragging, setIsDragging] = useState8(false);
+  useEffect6(() => {
     if (!isDragging) {
       setLocalValue(value);
     }
   }, [value, isDragging]);
   const debouncedOnChange = useDebouncedCallback2(onChange, 50);
-  const handleChange = useCallback4(
+  const handleChange = useCallback5(
     (e) => {
       const newValue = parseFloat(e.target.value);
       setLocalValue(newValue);
@@ -2017,23 +2171,23 @@ var PanSlider = ({
     },
     [debouncedOnChange]
   );
-  const handleMouseDown = useCallback4(() => {
+  const handleMouseDown = useCallback5(() => {
     setIsDragging(true);
   }, []);
-  const handleMouseUp = useCallback4(() => {
+  const handleMouseUp = useCallback5(() => {
     setIsDragging(false);
     onChange(localValue);
   }, [localValue, onChange]);
-  const handleDoubleClick = useCallback4(() => {
+  const handleDoubleClick = useCallback5(() => {
     setLocalValue(0);
     onChange(0);
   }, [onChange]);
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx11(
     "div",
     {
       className: `flex items-center ${className}`,
       title: `Pan: ${toPanDisplay(localValue)}`,
-      children: /* @__PURE__ */ jsx10(
+      children: /* @__PURE__ */ jsx11(
         "input",
         {
           type: "range",
@@ -2074,8 +2228,8 @@ var PanSlider = ({
 };
 
 // src/components/SorceryProgressBar.tsx
-import { useState as useState8, useEffect as useEffect6, useRef as useRef7 } from "react";
-import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
+import { useState as useState9, useEffect as useEffect7, useRef as useRef7 } from "react";
+import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
 function calculateTimeBasedTarget(elapsedMs, estimatedDurationMs) {
   const t = elapsedMs / estimatedDurationMs;
   if (t <= 0) return 0;
@@ -2120,7 +2274,7 @@ function SorceryProgressBar({
   onProgressChange,
   estimatedDurationMs
 }) {
-  const [progress, setProgress] = useState8(initialProgress);
+  const [progress, setProgress] = useState9(initialProgress);
   const timerRef = useRef7(null);
   const isLoadingRef = useRef7(false);
   const hasStartedRef = useRef7(false);
@@ -2133,7 +2287,7 @@ function SorceryProgressBar({
   initialProgressRef.current = initialProgress;
   const estimatedDurationMsRef = useRef7(estimatedDurationMs);
   estimatedDurationMsRef.current = estimatedDurationMs;
-  useEffect6(() => {
+  useEffect7(() => {
     const wasLoading = isLoadingRef.current;
     isLoadingRef.current = isLoading;
     if (isLoading && !wasLoading) {
@@ -2195,12 +2349,12 @@ function SorceryProgressBar({
   const displayProgress = Math.floor(progress);
   const isComplete = !isLoading && progress === 100;
   const transitionDuration = progress < 50 ? "300ms" : progress < 80 ? "500ms" : "700ms";
-  return /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(
     "div",
     {
       className: `relative w-full ${heightClass} bg-sas-panel-alt border border-sas-border rounded-sm overflow-hidden shadow-inner`,
       children: [
-        /* @__PURE__ */ jsx11(
+        /* @__PURE__ */ jsx12(
           "div",
           {
             className: `
@@ -2218,13 +2372,13 @@ function SorceryProgressBar({
             }
           }
         ),
-        /* @__PURE__ */ jsx11("div", { className: "absolute inset-0 flex items-center justify-center", children: isLoading && progress < 100 ? /* @__PURE__ */ jsxs7("span", { className: "font-mono text-xs text-sas-accent font-bold drop-shadow-md tracking-wider", children: [
+        /* @__PURE__ */ jsx12("div", { className: "absolute inset-0 flex items-center justify-center", children: isLoading && progress < 100 ? /* @__PURE__ */ jsxs8("span", { className: "font-mono text-xs text-sas-accent font-bold drop-shadow-md tracking-wider", children: [
           statusText,
           " ",
           displayProgress,
           "%"
-        ] }) : isComplete ? /* @__PURE__ */ jsx11("span", { className: "font-mono text-xs text-sas-text font-bold drop-shadow-md tracking-wider", children: completeText }) : null }),
-        /* @__PURE__ */ jsx11(
+        ] }) : isComplete ? /* @__PURE__ */ jsx12("span", { className: "font-mono text-xs text-sas-text font-bold drop-shadow-md tracking-wider", children: completeText }) : null }),
+        /* @__PURE__ */ jsx12(
           "div",
           {
             className: "absolute inset-0 pointer-events-none opacity-10",
@@ -2310,7 +2464,7 @@ function parseLLMNoteResponse(content) {
 }
 
 // src/components/TrackRow.tsx
-import { Fragment, jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
 function TrackRow({
   track,
   prompt,
@@ -2371,6 +2525,8 @@ function TrackRow({
 }) {
   const { muted: isMuted, solo: isSoloed, volume: currentVolume, pan: currentPan } = runtimeState;
   const [confirmDelete, setConfirmDelete] = React9.useState(false);
+  const freeze = useTrackFreeze(externalFxHost, track.id);
+  const freezeBadge = freeze.state?.frozen === true ? freeze.state.missingDeps.length > 0 ? "missing" : freeze.state.stale ? "stale" : "frozen" : null;
   const needsGeneration = !!(prompt?.trim() && !hasMidi && !isGenerating);
   const hasFxActive = Object.values(fxDetailState).some(
     (d) => d.enabled
@@ -2380,8 +2536,8 @@ function TrackRow({
   const handleKeyDown = promptEnterToGenerate(() => onGenerate?.(), !onGenerate);
   const borderColorStyle = needsGeneration ? void 0 : accentColor;
   const borderClass = needsGeneration ? "border-amber-400 animate-pulse" : "border-sas-border";
-  return /* @__PURE__ */ jsxs8("div", { "data-testid": "sdk-track-row-wrapper", className: "w-full", ...drag?.rowProps ?? {}, children: [
-    /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9("div", { "data-testid": "sdk-track-row-wrapper", className: "w-full", ...drag?.rowProps ?? {}, children: [
+    /* @__PURE__ */ jsxs9(
       "div",
       {
         "data-testid": "sdk-track-row",
@@ -2391,7 +2547,7 @@ function TrackRow({
           borderLeftWidth: "3px"
         },
         children: [
-          drag && /* @__PURE__ */ jsx12(
+          drag && /* @__PURE__ */ jsx13(
             "div",
             {
               "data-testid": "sdk-drag-handle",
@@ -2399,10 +2555,10 @@ function TrackRow({
               className: "flex-shrink-0 self-stretch flex items-center -ml-0.5 pr-0.5 text-sas-muted/40 hover:text-sas-muted cursor-grab active:cursor-grabbing relative z-30",
               title: "Drag to reorder",
               "aria-label": "Drag to reorder track",
-              children: /* @__PURE__ */ jsx12(GripVertical, { className: "w-3.5 h-3.5", strokeWidth: 2 })
+              children: /* @__PURE__ */ jsx13(GripVertical, { className: "w-3.5 h-3.5", strokeWidth: 2 })
             }
           ),
-          isGenerating && /* @__PURE__ */ jsx12("div", { className: "absolute left-0 top-0 bottom-0 right-44 z-20", children: /* @__PURE__ */ jsx12(
+          isGenerating && /* @__PURE__ */ jsx13("div", { className: "absolute left-0 top-0 bottom-0 right-44 z-20", children: /* @__PURE__ */ jsx13(
             SorceryProgressBar,
             {
               isLoading: true,
@@ -2413,14 +2569,14 @@ function TrackRow({
               estimatedDurationMs: estimatedGenerationMs
             }
           ) }),
-          /* @__PURE__ */ jsxs8(
+          /* @__PURE__ */ jsxs9(
             "div",
             {
               "data-testid": "sdk-track-content",
               className: `flex flex-col flex-1 min-w-0 relative z-10 transition-opacity ${soloedOut ? "opacity-40" : ""}`,
               title: soloedOut ? "Silenced \u2014 another track is soloed" : void 0,
               children: [
-                contentSlot ? contentSlot : onPromptChange ? /* @__PURE__ */ jsx12(
+                contentSlot ? contentSlot : onPromptChange ? /* @__PURE__ */ jsx13(
                   "input",
                   {
                     type: "text",
@@ -2433,10 +2589,10 @@ function TrackRow({
                     className: "sas-input w-full px-2 py-1 text-xs disabled:opacity-50 disabled:cursor-not-allowed"
                   }
                 ) : null,
-                /* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-2 mt-1", children: [
-                  track.name && /* @__PURE__ */ jsx12("span", { className: "text-[10px] text-sas-muted/60 truncate pl-2 flex-shrink-0 max-w-[80px]", title: track.name, children: track.name }),
-                  /* @__PURE__ */ jsx12("span", { className: "text-[9px] text-sas-muted/50 flex-shrink-0", children: "vol:" }),
-                  /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2 mt-1", children: [
+                  track.name && /* @__PURE__ */ jsx13("span", { className: "text-[10px] text-sas-muted/60 truncate pl-2 flex-shrink-0 max-w-[80px]", title: track.name, children: track.name }),
+                  /* @__PURE__ */ jsx13("span", { className: "text-[9px] text-sas-muted/50 flex-shrink-0", children: "vol:" }),
+                  /* @__PURE__ */ jsx13(
                     VolumeSlider,
                     {
                       value: currentVolume,
@@ -2445,8 +2601,8 @@ function TrackRow({
                       className: "flex-1 min-w-[40px]"
                     }
                   ),
-                  /* @__PURE__ */ jsx12("span", { className: "text-[9px] text-sas-muted/50 flex-shrink-0", children: "pan:" }),
-                  /* @__PURE__ */ jsx12(
+                  /* @__PURE__ */ jsx13("span", { className: "text-[9px] text-sas-muted/50 flex-shrink-0", children: "pan:" }),
+                  /* @__PURE__ */ jsx13(
                     PanSlider,
                     {
                       value: currentPan,
@@ -2459,27 +2615,27 @@ function TrackRow({
               ]
             }
           ),
-          error && /* @__PURE__ */ jsx12(
+          error && /* @__PURE__ */ jsx13(
             "div",
             {
               "data-testid": "sdk-error-indicator",
               className: "flex-shrink-0 relative z-10 self-stretch flex items-center px-1 group cursor-help",
               title: error,
-              children: /* @__PURE__ */ jsxs8("div", { className: "relative", children: [
-                /* @__PURE__ */ jsx12(
+              children: /* @__PURE__ */ jsxs9("div", { className: "relative", children: [
+                /* @__PURE__ */ jsx13(
                   AlertCircle,
                   {
                     className: "w-5 h-5 text-red-500 animate-pulse",
                     strokeWidth: 2.5
                   }
                 ),
-                /* @__PURE__ */ jsx12("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-red-900/95 text-red-100 text-xs rounded shadow-lg whitespace-nowrap opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none z-50 max-w-[200px] truncate", children: error })
+                /* @__PURE__ */ jsx13("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-red-900/95 text-red-100 text-xs rounded shadow-lg whitespace-nowrap opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none z-50 max-w-[200px] truncate", children: error })
               ] })
             }
           ),
-          /* @__PURE__ */ jsxs8("div", { className: "flex flex-col gap-0.5 flex-shrink-0 relative z-30 justify-center", children: [
-            /* @__PURE__ */ jsxs8("div", { className: "flex gap-1 items-center", children: [
-              onGenerate && /* @__PURE__ */ jsx12(
+          /* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-0.5 flex-shrink-0 relative z-30 justify-center", children: [
+            /* @__PURE__ */ jsxs9("div", { className: "flex gap-1 items-center", children: [
+              onGenerate && /* @__PURE__ */ jsx13(
                 "button",
                 {
                   "data-testid": "sdk-generate-button",
@@ -2490,7 +2646,7 @@ function TrackRow({
                   children: "Create"
                 }
               ),
-              onCopy && /* @__PURE__ */ jsx12(
+              onCopy && /* @__PURE__ */ jsx13(
                 "button",
                 {
                   "data-testid": "sdk-copy-button",
@@ -2501,7 +2657,7 @@ function TrackRow({
                   children: "Copy"
                 }
               ),
-              /* @__PURE__ */ jsx12(
+              /* @__PURE__ */ jsx13(
                 "button",
                 {
                   "data-testid": "sdk-mute-button",
@@ -2511,7 +2667,7 @@ function TrackRow({
                   children: "M"
                 }
               ),
-              onDelete && /* @__PURE__ */ jsx12(
+              onDelete && /* @__PURE__ */ jsx13(
                 "button",
                 {
                   "data-testid": "sdk-delete-button",
@@ -2522,8 +2678,8 @@ function TrackRow({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs8("div", { className: "flex gap-1 items-center", children: [
-              onShuffle && /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs9("div", { className: "flex gap-1 items-center", children: [
+              onShuffle && /* @__PURE__ */ jsx13(
                 "button",
                 {
                   "data-testid": "sdk-shuffle-button",
@@ -2534,7 +2690,16 @@ function TrackRow({
                   children: "Shuffle"
                 }
               ),
-              onToggleFxDrawer && /* @__PURE__ */ jsx12(
+              freezeBadge && /* @__PURE__ */ jsx13(
+                "span",
+                {
+                  "data-testid": "sdk-track-freeze-badge",
+                  className: `px-1 py-0.5 text-xs leading-none rounded-sm self-center ${freezeBadge === "frozen" ? "text-sas-accent" : "text-amber-400"}`,
+                  title: freezeBadge === "frozen" ? "Frozen \u2014 playing the rendered stem (mixer stays live)" : freezeBadge === "stale" ? "Frozen (stale) \u2014 sound edited since the stem rendered; re-freeze in the drawer" : `Frozen \u2014 plugin(s) missing on this machine: ${freeze.state?.missingDeps.map((d) => d.name).join(", ")}`,
+                  children: freezeBadge === "frozen" ? "\u2744" : freezeBadge === "stale" ? "\u26A0\u2744" : "\u2744!"
+                }
+              ),
+              onToggleFxDrawer && /* @__PURE__ */ jsx13(
                 "button",
                 {
                   "data-testid": "sdk-fx-button",
@@ -2545,7 +2710,7 @@ function TrackRow({
                   children: "FX"
                 }
               ),
-              /* @__PURE__ */ jsx12(
+              /* @__PURE__ */ jsx13(
                 "button",
                 {
                   "data-testid": "sdk-solo-button",
@@ -2556,7 +2721,7 @@ function TrackRow({
                   children: "S"
                 }
               ),
-              onToggleDrawer && /* @__PURE__ */ jsx12(
+              onToggleDrawer && /* @__PURE__ */ jsx13(
                 "button",
                 {
                   "data-testid": "sdk-plugin-button",
@@ -2564,7 +2729,7 @@ function TrackRow({
                   disabled: isGenerating,
                   className: `px-1.5 py-0.5 text-xs font-bold rounded transition-colors ${isGenerating ? "bg-sas-panel text-sas-muted/50 cursor-not-allowed" : soundTabOpen ? "bg-sas-accent border-sas-accent text-sas-bg" : instrumentMissing ? "bg-amber-500/20 text-amber-400 hover:bg-amber-500/40" : "bg-sas-panel-alt text-sas-muted hover:bg-sas-border"}`,
                   title: `Sound \u2014 presets & history${instrumentMissing ? " (instrument missing)" : ""}`,
-                  children: /* @__PURE__ */ jsx12(ChevronDown, { className: "w-3 h-3", strokeWidth: 2.5 })
+                  children: /* @__PURE__ */ jsx13(ChevronDown, { className: "w-3 h-3", strokeWidth: 2.5 })
                 }
               )
             ] })
@@ -2572,13 +2737,13 @@ function TrackRow({
         ]
       }
     ),
-    levels && /* @__PURE__ */ jsx12(TrackMeterStrip, { levels, trackId: track.id, roundBottom: !drawerOpen }),
-    drawerOpen && /* @__PURE__ */ jsx12(
+    levels && /* @__PURE__ */ jsx13(TrackMeterStrip, { levels, trackId: track.id, roundBottom: !drawerOpen }),
+    drawerOpen && /* @__PURE__ */ jsx13(
       "div",
       {
         "data-testid": "sdk-track-drawer",
         className: "border border-t-0 border-sas-border bg-sas-bg rounded-b-sm px-3 py-2 max-h-[260px] overflow-y-auto",
-        children: /* @__PURE__ */ jsx12(
+        children: /* @__PURE__ */ jsx13(
           TrackDrawer,
           {
             activeTab: drawerTab,
@@ -2589,6 +2754,7 @@ function TrackRow({
             onFxPresetChange,
             onFxDryWetChange,
             externalFxHost,
+            freeze,
             fxDisabled: isGenerating,
             instruments: availableInstruments,
             currentPluginId: currentInstrumentPluginId ?? null,
@@ -2615,13 +2781,13 @@ function TrackRow({
         )
       }
     ),
-    /* @__PURE__ */ jsx12(
+    /* @__PURE__ */ jsx13(
       ConfirmDialog,
       {
         open: confirmDelete,
         title: "Delete track?",
-        message: /* @__PURE__ */ jsxs8(Fragment, { children: [
-          /* @__PURE__ */ jsx12("span", { className: "text-sas-text", children: track.name?.trim() || "This track" }),
+        message: /* @__PURE__ */ jsxs9(Fragment, { children: [
+          /* @__PURE__ */ jsx13("span", { className: "text-sas-text", children: track.name?.trim() || "This track" }),
           " will be permanently removed from this scene. This cannot be undone."
         ] }),
         confirmLabel: "Delete",
@@ -2638,12 +2804,12 @@ function TrackRow({
 
 // src/components/CrossfadeTrackRow.tsx
 import React10 from "react";
-import { Fragment as Fragment2, jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
 function LayerCaption({ tag, layer }) {
-  return /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-1.5 min-w-0 px-2 py-0.5", children: [
-    /* @__PURE__ */ jsx13("span", { className: "text-[9px] font-bold uppercase tracking-wide text-sas-accent flex-shrink-0", children: tag }),
-    /* @__PURE__ */ jsx13("span", { className: "text-[11px] text-sas-text truncate", title: layer.sourceName ?? layer.name, children: layer.sourceName ?? layer.name }),
-    layer.soundLabel && /* @__PURE__ */ jsxs9("span", { className: "text-[9px] text-sas-muted/60 truncate flex-shrink-0", title: layer.soundLabel, children: [
+  return /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-1.5 min-w-0 px-2 py-0.5", children: [
+    /* @__PURE__ */ jsx14("span", { className: "text-[9px] font-bold uppercase tracking-wide text-sas-accent flex-shrink-0", children: tag }),
+    /* @__PURE__ */ jsx14("span", { className: "text-[11px] text-sas-text truncate", title: layer.sourceName ?? layer.name, children: layer.sourceName ?? layer.name }),
+    layer.soundLabel && /* @__PURE__ */ jsxs10("span", { className: "text-[9px] text-sas-muted/60 truncate flex-shrink-0", title: layer.soundLabel, children: [
       "\xB7 ",
       layer.soundLabel
     ] })
@@ -2663,7 +2829,7 @@ function CrossfadeTrackRow({
   accentColor = "#9333EA"
 }) {
   const [confirmDelete, setConfirmDelete] = React10.useState(false);
-  const renderLayer = (layer, slot, tag) => /* @__PURE__ */ jsx13(
+  const renderLayer = (layer, slot, tag) => /* @__PURE__ */ jsx14(
     TrackRow,
     {
       track: { id: layer.trackId, name: "", role: layer.role },
@@ -2673,23 +2839,23 @@ function CrossfadeTrackRow({
       drawerTab: "fx",
       levels,
       accentColor,
-      contentSlot: /* @__PURE__ */ jsx13(LayerCaption, { tag, layer }),
+      contentSlot: /* @__PURE__ */ jsx14(LayerCaption, { tag, layer }),
       onMuteToggle,
       onSoloToggle,
       onVolumeChange: (v) => onVolumeChange(slot, v),
       onPanChange: (p) => onPanChange(slot, p)
     }
   );
-  return /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs10(
     "div",
     {
       "data-testid": "crossfade-track-row",
       className: "w-full rounded-sm border border-sas-border bg-sas-panel/40 overflow-hidden",
       style: { borderLeftColor: accentColor, borderLeftWidth: "3px" },
       children: [
-        /* @__PURE__ */ jsxs9("div", { className: "flex items-center justify-between px-2 py-1 bg-sas-panel-alt/60", children: [
-          /* @__PURE__ */ jsx13("span", { className: "text-[10px] font-bold uppercase tracking-wide", style: { color: accentColor }, children: "\u21C4 Crossfade" }),
-          /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between px-2 py-1 bg-sas-panel-alt/60", children: [
+          /* @__PURE__ */ jsx14("span", { className: "text-[10px] font-bold uppercase tracking-wide", style: { color: accentColor }, children: "\u21C4 Crossfade" }),
+          /* @__PURE__ */ jsx14(
             "button",
             {
               "data-testid": "crossfade-delete-button",
@@ -2702,8 +2868,8 @@ function CrossfadeTrackRow({
           )
         ] }),
         renderLayer(origin, "origin", "Origin"),
-        /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2 px-3 py-1.5", "data-testid": "crossfade-slider-row", children: [
-          /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2 px-3 py-1.5", "data-testid": "crossfade-slider-row", children: [
+          /* @__PURE__ */ jsx14(
             "span",
             {
               className: "text-[9px] text-sas-muted/60 truncate max-w-[70px] text-right flex-shrink-0",
@@ -2711,7 +2877,7 @@ function CrossfadeTrackRow({
               children: origin.sourceName ?? origin.name
             }
           ),
-          /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsx14(
             "input",
             {
               type: "range",
@@ -2727,7 +2893,7 @@ function CrossfadeTrackRow({
               "aria-label": "Crossfade position"
             }
           ),
-          /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsx14(
             "span",
             {
               className: "text-[9px] text-sas-muted/60 truncate max-w-[70px] flex-shrink-0",
@@ -2737,12 +2903,12 @@ function CrossfadeTrackRow({
           )
         ] }),
         renderLayer(target, "target", "Target"),
-        /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsx14(
           ConfirmDialog,
           {
             open: confirmDelete,
             title: "Delete crossfade?",
-            message: /* @__PURE__ */ jsx13(Fragment2, { children: "This crossfade pair (both layers) will be permanently removed from this scene. This cannot be undone." }),
+            message: /* @__PURE__ */ jsx14(Fragment2, { children: "This crossfade pair (both layers) will be permanently removed from this scene. This cannot be undone." }),
             confirmLabel: "Delete",
             onConfirm: () => {
               setConfirmDelete(false);
@@ -3016,21 +3182,21 @@ function defaultFadeGesture(role) {
 
 // src/components/FadeTrackRow.tsx
 import React11 from "react";
-import { Fragment as Fragment3, jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
 function FadeCaption({
   layer,
   direction,
   gesture
 }) {
   const tag = direction === "in" ? "Fade in" : "Fade out";
-  return /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-1.5 min-w-0 px-2 py-0.5", children: [
-    /* @__PURE__ */ jsx14("span", { className: "text-[9px] font-bold uppercase tracking-wide text-sas-accent flex-shrink-0", children: tag }),
-    /* @__PURE__ */ jsx14("span", { className: "text-[11px] text-sas-text truncate", title: layer.sourceName ?? layer.name, children: layer.sourceName ?? layer.name }),
-    layer.soundLabel && /* @__PURE__ */ jsxs10("span", { className: "text-[9px] text-sas-muted/60 truncate flex-shrink-0", title: layer.soundLabel, children: [
+  return /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-1.5 min-w-0 px-2 py-0.5", children: [
+    /* @__PURE__ */ jsx15("span", { className: "text-[9px] font-bold uppercase tracking-wide text-sas-accent flex-shrink-0", children: tag }),
+    /* @__PURE__ */ jsx15("span", { className: "text-[11px] text-sas-text truncate", title: layer.sourceName ?? layer.name, children: layer.sourceName ?? layer.name }),
+    layer.soundLabel && /* @__PURE__ */ jsxs11("span", { className: "text-[9px] text-sas-muted/60 truncate flex-shrink-0", title: layer.soundLabel, children: [
       "\xB7 ",
       layer.soundLabel
     ] }),
-    /* @__PURE__ */ jsxs10("span", { className: "text-[9px] text-sas-muted/50 flex-shrink-0", title: `Fade gesture: ${gesture}`, children: [
+    /* @__PURE__ */ jsxs11("span", { className: "text-[9px] text-sas-muted/50 flex-shrink-0", title: `Fade gesture: ${gesture}`, children: [
       "\xB7 ",
       gesture
     ] })
@@ -3056,15 +3222,15 @@ function FadeTrackRow({
   const rightLabel = direction === "in" ? layer.sourceName ?? layer.name : "(silent)";
   const verb = effect && effect !== "fade" ? effect.charAt(0).toUpperCase() + effect.slice(1) : "Fade";
   const badge = direction === "in" ? `\u2197 ${verb} in` : `\u2198 ${verb} out`;
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11(
     "div",
     {
       "data-testid": "fade-track-row",
       className: "w-full rounded-sm border border-sas-border bg-sas-panel/40 overflow-hidden",
       style: { borderLeftColor: accentColor, borderLeftWidth: "3px" },
       children: [
-        /* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between px-2 py-1 bg-sas-panel-alt/60", children: [
-          /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsxs11("div", { className: "flex items-center justify-between px-2 py-1 bg-sas-panel-alt/60", children: [
+          /* @__PURE__ */ jsx15(
             "span",
             {
               "data-testid": "fade-direction-badge",
@@ -3073,7 +3239,7 @@ function FadeTrackRow({
               children: badge
             }
           ),
-          /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsx15(
             "button",
             {
               "data-testid": "fade-delete-button",
@@ -3085,7 +3251,7 @@ function FadeTrackRow({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx15(
           TrackRow,
           {
             track: { id: layer.trackId, name: "", role: layer.role },
@@ -3095,15 +3261,15 @@ function FadeTrackRow({
             drawerTab: "fx",
             levels,
             accentColor,
-            contentSlot: /* @__PURE__ */ jsx14(FadeCaption, { layer, direction, gesture }),
+            contentSlot: /* @__PURE__ */ jsx15(FadeCaption, { layer, direction, gesture }),
             onMuteToggle,
             onSoloToggle,
             onVolumeChange,
             onPanChange
           }
         ),
-        /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2 px-3 py-1.5", "data-testid": "fade-slider-row", children: [
-          /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 px-3 py-1.5", "data-testid": "fade-slider-row", children: [
+          /* @__PURE__ */ jsx15(
             "span",
             {
               className: "text-[9px] text-sas-muted/60 truncate max-w-[70px] text-right flex-shrink-0",
@@ -3111,7 +3277,7 @@ function FadeTrackRow({
               children: leftLabel
             }
           ),
-          /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsx15(
             "input",
             {
               type: "range",
@@ -3127,7 +3293,7 @@ function FadeTrackRow({
               "aria-label": "Fade position"
             }
           ),
-          /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsx15(
             "span",
             {
               className: "text-[9px] text-sas-muted/60 truncate max-w-[70px] flex-shrink-0",
@@ -3136,12 +3302,12 @@ function FadeTrackRow({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx15(
           ConfirmDialog,
           {
             open: confirmDelete,
             title: "Delete fade?",
-            message: /* @__PURE__ */ jsx14(Fragment3, { children: "This fade track will be permanently removed from this scene. This cannot be undone." }),
+            message: /* @__PURE__ */ jsx15(Fragment3, { children: "This fade track will be permanently removed from this scene. This cannot be undone." }),
             confirmLabel: "Delete",
             onConfirm: () => {
               setConfirmDelete(false);
@@ -3158,20 +3324,20 @@ function FadeTrackRow({
 
 // src/components/GroupFadeTrackRow.tsx
 import React12 from "react";
-import { Fragment as Fragment4, jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
 function MemberCaption({
   member,
   direction
 }) {
   const tag = direction === "in" ? "Fade in" : "Fade out";
-  return /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-1.5 min-w-0 px-2 py-0.5", children: [
-    member.memberLabel && /* @__PURE__ */ jsx15("span", { className: "text-[9px] font-bold uppercase tracking-wide text-sas-accent flex-shrink-0", children: member.memberLabel }),
-    /* @__PURE__ */ jsx15("span", { className: "text-[11px] text-sas-text truncate", title: member.sourceName ?? member.name, children: member.sourceName ?? member.name }),
-    member.soundLabel && /* @__PURE__ */ jsxs11("span", { className: "text-[9px] text-sas-muted/60 truncate flex-shrink-0", title: member.soundLabel, children: [
+  return /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-1.5 min-w-0 px-2 py-0.5", children: [
+    member.memberLabel && /* @__PURE__ */ jsx16("span", { className: "text-[9px] font-bold uppercase tracking-wide text-sas-accent flex-shrink-0", children: member.memberLabel }),
+    /* @__PURE__ */ jsx16("span", { className: "text-[11px] text-sas-text truncate", title: member.sourceName ?? member.name, children: member.sourceName ?? member.name }),
+    member.soundLabel && /* @__PURE__ */ jsxs12("span", { className: "text-[9px] text-sas-muted/60 truncate flex-shrink-0", title: member.soundLabel, children: [
       "\xB7 ",
       member.soundLabel
     ] }),
-    !member.memberLabel && /* @__PURE__ */ jsxs11("span", { className: "text-[9px] text-sas-muted/50 flex-shrink-0", children: [
+    !member.memberLabel && /* @__PURE__ */ jsxs12("span", { className: "text-[9px] text-sas-muted/50 flex-shrink-0", children: [
       "\xB7 ",
       tag
     ] })
@@ -3200,16 +3366,16 @@ function GroupFadeTrackRow({
   const badge = direction === "in" ? "\u2197 Fade in" : "\u2198 Fade out";
   const leftLabel = direction === "in" ? "(silent)" : groupLabel;
   const rightLabel = direction === "in" ? groupLabel : "(silent)";
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     "div",
     {
       "data-testid": "group-fade-track-row",
       className: "w-full rounded-sm border border-sas-border bg-sas-panel/40 overflow-hidden",
       style: { borderLeftColor: accentColor, borderLeftWidth: "3px" },
       children: [
-        /* @__PURE__ */ jsxs11("div", { className: "flex items-center justify-between px-2 py-1 bg-sas-panel-alt/60 gap-2", children: [
-          /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 min-w-0", children: [
-            /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsxs12("div", { className: "flex items-center justify-between px-2 py-1 bg-sas-panel-alt/60 gap-2", children: [
+          /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2 min-w-0", children: [
+            /* @__PURE__ */ jsx16(
               "span",
               {
                 "data-testid": "group-fade-direction-badge",
@@ -3218,7 +3384,7 @@ function GroupFadeTrackRow({
                 children: badge
               }
             ),
-            /* @__PURE__ */ jsx15(
+            /* @__PURE__ */ jsx16(
               "span",
               {
                 "data-testid": "group-fade-label",
@@ -3228,8 +3394,8 @@ function GroupFadeTrackRow({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-1 flex-shrink-0", children: [
-            /* @__PURE__ */ jsx15(
+          /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-1 flex-shrink-0", children: [
+            /* @__PURE__ */ jsx16(
               "button",
               {
                 "data-testid": "group-fade-mute-button",
@@ -3239,7 +3405,7 @@ function GroupFadeTrackRow({
                 children: "M"
               }
             ),
-            /* @__PURE__ */ jsx15(
+            /* @__PURE__ */ jsx16(
               "button",
               {
                 "data-testid": "group-fade-solo-button",
@@ -3249,7 +3415,7 @@ function GroupFadeTrackRow({
                 children: "S"
               }
             ),
-            /* @__PURE__ */ jsx15(
+            /* @__PURE__ */ jsx16(
               "button",
               {
                 "data-testid": "group-fade-delete-button",
@@ -3262,7 +3428,7 @@ function GroupFadeTrackRow({
             )
           ] })
         ] }),
-        members.map((member) => /* @__PURE__ */ jsx15(
+        members.map((member) => /* @__PURE__ */ jsx16(
           TrackRow,
           {
             track: { id: member.trackId, name: "", role: member.role },
@@ -3272,7 +3438,7 @@ function GroupFadeTrackRow({
             drawerTab: "fx",
             levels,
             accentColor,
-            contentSlot: /* @__PURE__ */ jsx15(MemberCaption, { member, direction }),
+            contentSlot: /* @__PURE__ */ jsx16(MemberCaption, { member, direction }),
             onMuteToggle: () => onMemberMuteToggle(member.trackId),
             onSoloToggle: () => onMemberSoloToggle(member.trackId),
             onVolumeChange: (vol) => onMemberVolumeChange(member.trackId, vol),
@@ -3280,8 +3446,8 @@ function GroupFadeTrackRow({
           },
           member.trackId
         )),
-        /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 px-3 py-1.5", "data-testid": "group-fade-slider-row", children: [
-          /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2 px-3 py-1.5", "data-testid": "group-fade-slider-row", children: [
+          /* @__PURE__ */ jsx16(
             "span",
             {
               className: "text-[9px] text-sas-muted/60 truncate max-w-[70px] text-right flex-shrink-0",
@@ -3289,7 +3455,7 @@ function GroupFadeTrackRow({
               children: leftLabel
             }
           ),
-          /* @__PURE__ */ jsx15(
+          /* @__PURE__ */ jsx16(
             "input",
             {
               type: "range",
@@ -3305,7 +3471,7 @@ function GroupFadeTrackRow({
               "aria-label": "Group fade position"
             }
           ),
-          /* @__PURE__ */ jsx15(
+          /* @__PURE__ */ jsx16(
             "span",
             {
               className: "text-[9px] text-sas-muted/60 truncate max-w-[70px] flex-shrink-0",
@@ -3314,12 +3480,12 @@ function GroupFadeTrackRow({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsx16(
           ConfirmDialog,
           {
             open: confirmDelete,
             title: "Delete group fade?",
-            message: /* @__PURE__ */ jsxs11(Fragment4, { children: [
+            message: /* @__PURE__ */ jsxs12(Fragment4, { children: [
               "All ",
               members.length,
               " member tracks of this fade will be permanently removed from this scene. This cannot be undone."
@@ -3339,8 +3505,8 @@ function GroupFadeTrackRow({
 }
 
 // src/components/FadeModal.tsx
-import { useCallback as useCallback5, useEffect as useEffect7, useMemo as useMemo4, useRef as useRef8, useState as useState9 } from "react";
-import { Fragment as Fragment5, jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
+import { useCallback as useCallback6, useEffect as useEffect8, useMemo as useMemo4, useRef as useRef8, useState as useState10 } from "react";
+import { Fragment as Fragment5, jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
 function shortId(dbId) {
   return dbId.length > 8 ? dbId.slice(0, 8) : dbId;
 }
@@ -3383,7 +3549,7 @@ function OrphanRow({
 }) {
   const primary = track.prompt?.trim() || track.name;
   const meta = [track.role, shortId(track.dbId), gesture].filter(Boolean).join(" \xB7 ");
-  return /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs13(
     "button",
     {
       type: "button",
@@ -3395,8 +3561,8 @@ function OrphanRow({
       disabled,
       className: `w-full text-left px-2 py-1.5 rounded-sm border transition-colors disabled:opacity-50 ${selected ? "bg-sas-accent/15 border-sas-accent" : "bg-sas-panel border-sas-border hover:border-sas-accent/50"}`,
       children: [
-        /* @__PURE__ */ jsx16("div", { className: "text-xs text-sas-text truncate", title: primary, children: primary }),
-        meta && /* @__PURE__ */ jsx16("div", { className: "text-[10px] text-sas-muted truncate mt-0.5", title: track.dbId, children: meta })
+        /* @__PURE__ */ jsx17("div", { className: "text-xs text-sas-text truncate", title: primary, children: primary }),
+        meta && /* @__PURE__ */ jsx17("div", { className: "text-[10px] text-sas-muted truncate mt-0.5", title: track.dbId, children: meta })
       ]
     }
   );
@@ -3413,14 +3579,14 @@ function FadeModal({
   onCreate,
   testIdPrefix = "fade-modal"
 }) {
-  const [load, setLoad] = useState9({ status: "loading" });
-  const [selectedDbId, setSelectedDbId] = useState9("");
-  const [isCreating, setIsCreating] = useState9(false);
-  const [error, setError] = useState9(null);
-  const [fromName, setFromName] = useState9(null);
-  const [toName, setToName] = useState9(null);
+  const [load, setLoad] = useState10({ status: "loading" });
+  const [selectedDbId, setSelectedDbId] = useState10("");
+  const [isCreating, setIsCreating] = useState10(false);
+  const [error, setError] = useState10(null);
+  const [fromName, setFromName] = useState10(null);
+  const [toName, setToName] = useState10(null);
   const cancelRef = useRef8(null);
-  const refresh = useCallback5(async () => {
+  const refresh = useCallback6(async () => {
     if (!host.listSceneFamilyTracks) {
       setLoad({ status: "error", message: "This host does not support fades." });
       return;
@@ -3440,7 +3606,7 @@ function FadeModal({
       setLoad({ status: "error", message: err instanceof Error ? err.message : "Failed to load tracks." });
     }
   }, [host, fromSceneId, toSceneId]);
-  useEffect7(() => {
+  useEffect8(() => {
     if (open) {
       setError(null);
       setIsCreating(false);
@@ -3460,17 +3626,17 @@ function FadeModal({
     ],
     [fadeOut, fadeIn]
   );
-  useEffect7(() => {
+  useEffect8(() => {
     if (!allOrphans.some((o) => o.track.dbId === selectedDbId)) {
       setSelectedDbId(allOrphans[0]?.track.dbId ?? "");
     }
   }, [allOrphans, selectedDbId]);
   const selected = allOrphans.find((o) => o.track.dbId === selectedDbId) ?? null;
   const canCreate = !isCreating && !!selected;
-  const handleClose = useCallback5(() => {
+  const handleClose = useCallback6(() => {
     if (!isCreating) onClose();
   }, [isCreating, onClose]);
-  const handleCreate = useCallback5(async () => {
+  const handleCreate = useCallback6(async () => {
     if (!selected) return;
     setIsCreating(true);
     setError(null);
@@ -3491,16 +3657,16 @@ function FadeModal({
   if (!open) return null;
   const renderSection = (heading, list, section) => {
     if (list.length === 0) return null;
-    return /* @__PURE__ */ jsxs12("div", { className: "block", children: [
-      /* @__PURE__ */ jsx16("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: heading }),
-      /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsxs13("div", { className: "block", children: [
+      /* @__PURE__ */ jsx17("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: heading }),
+      /* @__PURE__ */ jsx17(
         "div",
         {
           role: "radiogroup",
           "aria-label": heading,
           "data-testid": `${testIdPrefix}-${section === "out" ? "fade-out" : "fade-in"}-list`,
           className: "mt-1 space-y-1 max-h-40 overflow-y-auto pr-0.5",
-          children: list.map((t) => /* @__PURE__ */ jsx16(
+          children: list.map((t) => /* @__PURE__ */ jsx17(
             OrphanRow,
             {
               track: t,
@@ -3516,32 +3682,32 @@ function FadeModal({
       )
     ] });
   };
-  return /* @__PURE__ */ jsx16(Modal, { open, onClose: handleClose, testIdPrefix, initialFocusRef: cancelRef, children: /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsx17(Modal, { open, onClose: handleClose, testIdPrefix, initialFocusRef: cancelRef, children: /* @__PURE__ */ jsxs13(
     "div",
     {
       className: "bg-sas-panel border border-sas-border rounded-md shadow-xl w-[420px] max-w-[92vw] p-4 space-y-3",
       onClick: (e) => e.stopPropagation(),
       "data-testid": `${testIdPrefix}-box`,
       children: [
-        /* @__PURE__ */ jsx16("h3", { className: "text-sm font-bold text-sas-text", children: "Add fade" }),
-        /* @__PURE__ */ jsxs12("p", { className: "text-[11px] text-sas-muted leading-relaxed", children: [
+        /* @__PURE__ */ jsx17("h3", { className: "text-sm font-bold text-sas-text", children: "Add fade" }),
+        /* @__PURE__ */ jsxs13("p", { className: "text-[11px] text-sas-muted leading-relaxed", children: [
           "Tracks with no counterpart between",
           " ",
-          /* @__PURE__ */ jsx16("span", { className: "text-sas-text", children: fromLabel ?? "the origin scene" }),
+          /* @__PURE__ */ jsx17("span", { className: "text-sas-text", children: fromLabel ?? "the origin scene" }),
           " and",
           " ",
-          /* @__PURE__ */ jsx16("span", { className: "text-sas-text", children: toLabel ?? "the target scene" }),
+          /* @__PURE__ */ jsx17("span", { className: "text-sas-text", children: toLabel ?? "the target scene" }),
           " can gracefully fade out (leaving) or fade in (entering) across this transition."
         ] }),
-        load.status === "loading" && /* @__PURE__ */ jsx16("div", { className: "text-xs text-sas-muted py-4 text-center", children: "Loading tracks\u2026" }),
-        load.status === "error" && /* @__PURE__ */ jsx16("div", { className: "text-xs text-sas-danger py-4 text-center", children: load.message }),
-        load.status === "ready" && (allOrphans.length === 0 ? /* @__PURE__ */ jsx16("div", { className: "text-xs text-sas-muted py-4 text-center", "data-testid": `${testIdPrefix}-empty`, children: "Every track has a counterpart in the other scene \u2014 nothing to fade. Use \u201C+ Crossfade\u201D to bridge matching tracks." }) : /* @__PURE__ */ jsxs12(Fragment5, { children: [
+        load.status === "loading" && /* @__PURE__ */ jsx17("div", { className: "text-xs text-sas-muted py-4 text-center", children: "Loading tracks\u2026" }),
+        load.status === "error" && /* @__PURE__ */ jsx17("div", { className: "text-xs text-sas-danger py-4 text-center", children: load.message }),
+        load.status === "ready" && (allOrphans.length === 0 ? /* @__PURE__ */ jsx17("div", { className: "text-xs text-sas-muted py-4 text-center", "data-testid": `${testIdPrefix}-empty`, children: "Every track has a counterpart in the other scene \u2014 nothing to fade. Use \u201C+ Crossfade\u201D to bridge matching tracks." }) : /* @__PURE__ */ jsxs13(Fragment5, { children: [
           renderSection(`Fade out${fromLabel ? ` (from ${fromLabel})` : ""}`, fadeOut, "out"),
           renderSection(`Fade in${toLabel ? ` (to ${toLabel})` : ""}`, fadeIn, "in")
         ] })),
-        error && /* @__PURE__ */ jsx16("div", { className: "text-xs text-sas-danger", "data-testid": `${testIdPrefix}-error`, children: error }),
-        /* @__PURE__ */ jsxs12("div", { className: "flex justify-end gap-2 pt-1", children: [
-          /* @__PURE__ */ jsx16(
+        error && /* @__PURE__ */ jsx17("div", { className: "text-xs text-sas-danger", "data-testid": `${testIdPrefix}-error`, children: error }),
+        /* @__PURE__ */ jsxs13("div", { className: "flex justify-end gap-2 pt-1", children: [
+          /* @__PURE__ */ jsx17(
             "button",
             {
               ref: cancelRef,
@@ -3552,7 +3718,7 @@ function FadeModal({
               children: "Cancel"
             }
           ),
-          /* @__PURE__ */ jsx16(
+          /* @__PURE__ */ jsx17(
             "button",
             {
               "data-testid": `${testIdPrefix}-confirm`,
@@ -3569,8 +3735,8 @@ function FadeModal({
 }
 
 // src/components/ImportTrackModal.tsx
-import { useCallback as useCallback6, useEffect as useEffect8, useState as useState10 } from "react";
-import { jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
+import { useCallback as useCallback7, useEffect as useEffect9, useState as useState11 } from "react";
+import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
 function ImportTrackModal({
   host,
   open,
@@ -3582,10 +3748,10 @@ function ImportTrackModal({
   onPick,
   onPortTrack
 }) {
-  const [load, setLoad] = useState10({ status: "loading" });
-  const [selectedSceneId, setSelectedSceneId] = useState10(null);
-  const [importingTrackId, setImportingTrackId] = useState10(null);
-  const refresh = useCallback6(async () => {
+  const [load, setLoad] = useState11({ status: "loading" });
+  const [selectedSceneId, setSelectedSceneId] = useState11(null);
+  const [importingTrackId, setImportingTrackId] = useState11(null);
+  const refresh = useCallback7(async () => {
     if (!host.listImportableTracks) {
       setLoad({ status: "error", message: "This host does not support importing tracks." });
       return;
@@ -3601,14 +3767,14 @@ function ImportTrackModal({
       setLoad({ status: "error", message: err instanceof Error ? err.message : "Failed to load scenes." });
     }
   }, [host, mode, onPortTrack]);
-  useEffect8(() => {
+  useEffect9(() => {
     if (open) {
       setSelectedSceneId(null);
       setImportingTrackId(null);
       void refresh();
     }
   }, [open, refresh]);
-  const handleImport = useCallback6(
+  const handleImport = useCallback7(
     async (track, sourceSceneId, sceneName, isSameScene) => {
       if (isSameScene && onPortTrack) {
         if (!track.importable) return;
@@ -3649,16 +3815,16 @@ function ImportTrackModal({
   if (!open) return null;
   const scenes = load.status === "ready" ? load.scenes : [];
   const selectedScene = scenes.find((s) => s.sceneId === selectedSceneId) ?? null;
-  return /* @__PURE__ */ jsx17(Modal, { open, onClose, testIdPrefix, children: /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsx18(Modal, { open, onClose, testIdPrefix, children: /* @__PURE__ */ jsxs14(
     "div",
     {
       className: "w-[420px] max-h-[70vh] overflow-hidden flex flex-col rounded-md border border-sas-border bg-sas-panel shadow-xl",
       onClick: (e) => e.stopPropagation(),
       "data-testid": `${testIdPrefix}-modal`,
       children: [
-        /* @__PURE__ */ jsxs13("div", { className: "flex items-center justify-between px-3 py-2 border-b border-sas-border", children: [
-          /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2", children: [
-            selectedScene && /* @__PURE__ */ jsx17(
+        /* @__PURE__ */ jsxs14("div", { className: "flex items-center justify-between px-3 py-2 border-b border-sas-border", children: [
+          /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-2", children: [
+            selectedScene && /* @__PURE__ */ jsx18(
               "button",
               {
                 className: "text-sas-muted hover:text-sas-accent text-xs",
@@ -3667,9 +3833,9 @@ function ImportTrackModal({
                 children: "\u2190"
               }
             ),
-            /* @__PURE__ */ jsx17("span", { className: "text-sm font-medium text-sas-text", children: selectedScene ? selectedScene.sceneName : title })
+            /* @__PURE__ */ jsx18("span", { className: "text-sm font-medium text-sas-text", children: selectedScene ? selectedScene.sceneName : title })
           ] }),
-          /* @__PURE__ */ jsx17(
+          /* @__PURE__ */ jsx18(
             "button",
             {
               className: "text-sas-muted hover:text-sas-accent text-sm",
@@ -3679,30 +3845,30 @@ function ImportTrackModal({
             }
           )
         ] }),
-        /* @__PURE__ */ jsxs13("div", { className: "overflow-y-auto p-2 flex-1", children: [
-          load.status === "loading" && /* @__PURE__ */ jsx17("div", { className: "py-8 text-center text-xs text-sas-muted", "data-testid": `${testIdPrefix}-loading`, children: "Loading scenes\u2026" }),
-          load.status === "error" && /* @__PURE__ */ jsx17("div", { className: "py-8 text-center text-xs text-red-400", "data-testid": `${testIdPrefix}-error`, children: load.message }),
-          load.status === "ready" && scenes.length === 0 && /* @__PURE__ */ jsx17("div", { className: "py-8 text-center text-xs text-sas-muted", "data-testid": `${testIdPrefix}-empty`, children: mode === "sound" ? "No other scenes have a sound to import." : "No other scenes have a compatible track to import." }),
-          load.status === "ready" && scenes.length > 0 && !selectedScene && /* @__PURE__ */ jsx17("ul", { className: "flex flex-col gap-1", "data-testid": `${testIdPrefix}-scene-list`, children: scenes.map((scene) => /* @__PURE__ */ jsx17("li", { children: /* @__PURE__ */ jsxs13(
+        /* @__PURE__ */ jsxs14("div", { className: "overflow-y-auto p-2 flex-1", children: [
+          load.status === "loading" && /* @__PURE__ */ jsx18("div", { className: "py-8 text-center text-xs text-sas-muted", "data-testid": `${testIdPrefix}-loading`, children: "Loading scenes\u2026" }),
+          load.status === "error" && /* @__PURE__ */ jsx18("div", { className: "py-8 text-center text-xs text-red-400", "data-testid": `${testIdPrefix}-error`, children: load.message }),
+          load.status === "ready" && scenes.length === 0 && /* @__PURE__ */ jsx18("div", { className: "py-8 text-center text-xs text-sas-muted", "data-testid": `${testIdPrefix}-empty`, children: mode === "sound" ? "No other scenes have a sound to import." : "No other scenes have a compatible track to import." }),
+          load.status === "ready" && scenes.length > 0 && !selectedScene && /* @__PURE__ */ jsx18("ul", { className: "flex flex-col gap-1", "data-testid": `${testIdPrefix}-scene-list`, children: scenes.map((scene) => /* @__PURE__ */ jsx18("li", { children: /* @__PURE__ */ jsxs14(
             "button",
             {
               className: "w-full flex items-center justify-between px-2 py-1.5 rounded-sm border border-sas-border bg-sas-panel-alt text-left text-xs text-sas-text hover:border-sas-accent hover:text-sas-accent transition-colors",
               onClick: () => setSelectedSceneId(scene.sceneId),
               "data-testid": `${testIdPrefix}-scene`,
               children: [
-                /* @__PURE__ */ jsx17("span", { className: "truncate", children: scene.sceneName }),
-                /* @__PURE__ */ jsxs13("span", { className: "text-sas-muted", children: [
+                /* @__PURE__ */ jsx18("span", { className: "truncate", children: scene.sceneName }),
+                /* @__PURE__ */ jsxs14("span", { className: "text-sas-muted", children: [
                   scene.tracks.length,
                   " \u2192"
                 ] })
               ]
             }
           ) }, scene.sceneId)) }),
-          selectedScene && /* @__PURE__ */ jsx17("ul", { className: "flex flex-col gap-1", "data-testid": `${testIdPrefix}-track-list`, children: selectedScene.tracks.map((track) => {
+          selectedScene && /* @__PURE__ */ jsx18("ul", { className: "flex flex-col gap-1", "data-testid": `${testIdPrefix}-track-list`, children: selectedScene.tracks.map((track) => {
             const busy = importingTrackId === track.trackId;
             const gated = mode === "track" && !track.importable;
             const disabled = gated || busy;
-            return /* @__PURE__ */ jsx17("li", { children: /* @__PURE__ */ jsxs13(
+            return /* @__PURE__ */ jsx18("li", { children: /* @__PURE__ */ jsxs14(
               "button",
               {
                 className: `w-full flex items-center justify-between px-2 py-1.5 rounded-sm border text-left text-xs transition-colors ${disabled ? "bg-sas-panel border-sas-border text-sas-muted/50 cursor-not-allowed" : "bg-sas-panel-alt border-sas-border text-sas-text hover:border-sas-accent hover:text-sas-accent"}`,
@@ -3712,14 +3878,14 @@ function ImportTrackModal({
                 "data-testid": `${testIdPrefix}-track`,
                 "data-importable": mode === "sound" || track.importable ? "true" : "false",
                 children: [
-                  /* @__PURE__ */ jsxs13("span", { className: "truncate", children: [
+                  /* @__PURE__ */ jsxs14("span", { className: "truncate", children: [
                     track.name,
-                    track.role ? /* @__PURE__ */ jsxs13("span", { className: "text-sas-muted", children: [
+                    track.role ? /* @__PURE__ */ jsxs14("span", { className: "text-sas-muted", children: [
                       " \xB7 ",
                       track.role
                     ] }) : null
                   ] }),
-                  busy ? /* @__PURE__ */ jsx17("span", { className: "text-sas-muted", children: "\u2026" }) : gated ? /* @__PURE__ */ jsx17("span", { className: "text-sas-muted", children: "\u2298" }) : null
+                  busy ? /* @__PURE__ */ jsx18("span", { className: "text-sas-muted", children: "\u2026" }) : gated ? /* @__PURE__ */ jsx18("span", { className: "text-sas-muted", children: "\u2298" }) : null
                 ]
               }
             ) }, track.dbId);
@@ -3731,8 +3897,8 @@ function ImportTrackModal({
 }
 
 // src/components/CrossfadeModal.tsx
-import { useCallback as useCallback7, useEffect as useEffect9, useMemo as useMemo5, useRef as useRef9, useState as useState11 } from "react";
-import { Fragment as Fragment6, jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
+import { useCallback as useCallback8, useEffect as useEffect10, useMemo as useMemo5, useRef as useRef9, useState as useState12 } from "react";
+import { Fragment as Fragment6, jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
 function shortId2(dbId) {
   return dbId.length > 8 ? dbId.slice(0, 8) : dbId;
 }
@@ -3745,7 +3911,7 @@ function CandidateRow({
 }) {
   const primary = track.prompt?.trim() || track.name;
   const meta = [track.role, shortId2(track.dbId)].filter(Boolean).join(" \xB7 ");
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     "button",
     {
       type: "button",
@@ -3757,8 +3923,8 @@ function CandidateRow({
       disabled,
       className: `w-full text-left px-2 py-1.5 rounded-sm border transition-colors disabled:opacity-50 ${selected ? "bg-sas-accent/15 border-sas-accent" : "bg-sas-panel border-sas-border hover:border-sas-accent/50"}`,
       children: [
-        /* @__PURE__ */ jsx18("div", { className: "text-xs text-sas-text truncate", title: primary, children: primary }),
-        meta && /* @__PURE__ */ jsx18("div", { className: "text-[10px] text-sas-muted truncate mt-0.5", title: track.dbId, children: meta })
+        /* @__PURE__ */ jsx19("div", { className: "text-xs text-sas-text truncate", title: primary, children: primary }),
+        meta && /* @__PURE__ */ jsx19("div", { className: "text-[10px] text-sas-muted truncate mt-0.5", title: track.dbId, children: meta })
       ]
     }
   );
@@ -3775,15 +3941,15 @@ function CrossfadeModal({
   onCreate,
   testIdPrefix = "crossfade-modal"
 }) {
-  const [load, setLoad] = useState11({ status: "loading" });
-  const [originDbId, setOriginDbId] = useState11("");
-  const [targetDbId, setTargetDbId] = useState11("");
-  const [isCreating, setIsCreating] = useState11(false);
-  const [error, setError] = useState11(null);
-  const [fromName, setFromName] = useState11(null);
-  const [toName, setToName] = useState11(null);
+  const [load, setLoad] = useState12({ status: "loading" });
+  const [originDbId, setOriginDbId] = useState12("");
+  const [targetDbId, setTargetDbId] = useState12("");
+  const [isCreating, setIsCreating] = useState12(false);
+  const [error, setError] = useState12(null);
+  const [fromName, setFromName] = useState12(null);
+  const [toName, setToName] = useState12(null);
   const cancelRef = useRef9(null);
-  const refresh = useCallback7(async () => {
+  const refresh = useCallback8(async () => {
     if (!host.listSceneFamilyTracks) {
       setLoad({ status: "error", message: "This host does not support crossfade tracks." });
       return;
@@ -3803,7 +3969,7 @@ function CrossfadeModal({
       setLoad({ status: "error", message: err instanceof Error ? err.message : "Failed to load tracks." });
     }
   }, [host, fromSceneId, toSceneId]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (open) {
       setError(null);
       setIsCreating(false);
@@ -3821,12 +3987,12 @@ function CrossfadeModal({
     () => load.status === "ready" ? load.target.filter((t) => !excludeSet.has(t.dbId)) : [],
     [load, excludeSet]
   );
-  useEffect9(() => {
+  useEffect10(() => {
     if (!originCandidates.some((t) => t.dbId === originDbId)) {
       setOriginDbId(originCandidates[0]?.dbId ?? "");
     }
   }, [originCandidates, originDbId]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!targetCandidates.some((t) => t.dbId === targetDbId)) {
       setTargetDbId(targetCandidates[0]?.dbId ?? "");
     }
@@ -3834,10 +4000,10 @@ function CrossfadeModal({
   const originTrack = originCandidates.find((t) => t.dbId === originDbId) ?? null;
   const targetTrack = targetCandidates.find((t) => t.dbId === targetDbId) ?? null;
   const canCreate = !isCreating && !!originTrack && !!targetTrack;
-  const handleClose = useCallback7(() => {
+  const handleClose = useCallback8(() => {
     if (!isCreating) onClose();
   }, [isCreating, onClose]);
-  const handleCreate = useCallback7(async () => {
+  const handleCreate = useCallback8(async () => {
     if (!originTrack || !targetTrack) return;
     setIsCreating(true);
     setError(null);
@@ -3855,26 +4021,26 @@ function CrossfadeModal({
   const fromLabel = fromName ?? fromSceneName ?? null;
   const toLabel = toName ?? toSceneName ?? null;
   if (!open) return null;
-  return /* @__PURE__ */ jsx18(Modal, { open, onClose: handleClose, testIdPrefix, initialFocusRef: cancelRef, children: /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsx19(Modal, { open, onClose: handleClose, testIdPrefix, initialFocusRef: cancelRef, children: /* @__PURE__ */ jsxs15(
     "div",
     {
       className: "bg-sas-panel border border-sas-border rounded-md shadow-xl w-[420px] max-w-[92vw] p-4 space-y-3",
       onClick: (e) => e.stopPropagation(),
       "data-testid": `${testIdPrefix}-box`,
       children: [
-        /* @__PURE__ */ jsx18("h3", { className: "text-sm font-bold text-sas-text", children: "Add crossfade" }),
-        /* @__PURE__ */ jsxs14("p", { className: "text-[11px] text-sas-muted leading-relaxed", children: [
+        /* @__PURE__ */ jsx19("h3", { className: "text-sm font-bold text-sas-text", children: "Add crossfade" }),
+        /* @__PURE__ */ jsxs15("p", { className: "text-[11px] text-sas-muted leading-relaxed", children: [
           "Bridge a track from",
           " ",
-          /* @__PURE__ */ jsx18("span", { className: "text-sas-text", children: fromLabel ?? "the origin scene" }),
+          /* @__PURE__ */ jsx19("span", { className: "text-sas-text", children: fromLabel ?? "the origin scene" }),
           " into one from",
           " ",
-          /* @__PURE__ */ jsx18("span", { className: "text-sas-text", children: toLabel ?? "the target scene" }),
+          /* @__PURE__ */ jsx19("span", { className: "text-sas-text", children: toLabel ?? "the target scene" }),
           ". Both layers share one generated part; each keeps its own preset."
         ] }),
-        load.status === "loading" && /* @__PURE__ */ jsx18("div", { className: "text-xs text-sas-muted py-4 text-center", children: "Loading tracks\u2026" }),
-        load.status === "error" && /* @__PURE__ */ jsx18("div", { className: "text-xs text-sas-danger py-4 text-center", children: load.message }),
-        load.status === "ready" && (originCandidates.length === 0 ? /* @__PURE__ */ jsxs14(
+        load.status === "loading" && /* @__PURE__ */ jsx19("div", { className: "text-xs text-sas-muted py-4 text-center", children: "Loading tracks\u2026" }),
+        load.status === "error" && /* @__PURE__ */ jsx19("div", { className: "text-xs text-sas-danger py-4 text-center", children: load.message }),
+        load.status === "ready" && (originCandidates.length === 0 ? /* @__PURE__ */ jsxs15(
           "div",
           {
             className: "text-xs text-sas-muted py-4 text-center",
@@ -3885,20 +4051,20 @@ function CrossfadeModal({
               ". Add one (or free one from another crossfade) first."
             ]
           }
-        ) : /* @__PURE__ */ jsxs14(Fragment6, { children: [
-          /* @__PURE__ */ jsxs14("div", { className: "block", children: [
-            /* @__PURE__ */ jsxs14("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: [
+        ) : /* @__PURE__ */ jsxs15(Fragment6, { children: [
+          /* @__PURE__ */ jsxs15("div", { className: "block", children: [
+            /* @__PURE__ */ jsxs15("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: [
               "Origin ",
               fromLabel ? `(${fromLabel})` : "(top)"
             ] }),
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx19(
               "div",
               {
                 role: "radiogroup",
                 "aria-label": "Origin track",
                 "data-testid": `${testIdPrefix}-origin-list`,
                 className: "mt-1 space-y-1 max-h-40 overflow-y-auto pr-0.5",
-                children: originCandidates.map((t) => /* @__PURE__ */ jsx18(
+                children: originCandidates.map((t) => /* @__PURE__ */ jsx19(
                   CandidateRow,
                   {
                     track: t,
@@ -3912,23 +4078,23 @@ function CrossfadeModal({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs14("div", { className: "block", children: [
-            /* @__PURE__ */ jsxs14("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: [
+          /* @__PURE__ */ jsxs15("div", { className: "block", children: [
+            /* @__PURE__ */ jsxs15("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: [
               "Target ",
               toLabel ? `(${toLabel})` : "(bottom)"
             ] }),
-            targetCandidates.length === 0 ? /* @__PURE__ */ jsxs14("div", { className: "text-xs text-sas-danger mt-0.5", "data-testid": `${testIdPrefix}-empty-target`, children: [
+            targetCandidates.length === 0 ? /* @__PURE__ */ jsxs15("div", { className: "text-xs text-sas-danger mt-0.5", "data-testid": `${testIdPrefix}-empty-target`, children: [
               "No available tracks in ",
               toLabel ?? "the target scene",
               " to crossfade into."
-            ] }) : /* @__PURE__ */ jsx18(
+            ] }) : /* @__PURE__ */ jsx19(
               "div",
               {
                 role: "radiogroup",
                 "aria-label": "Target track",
                 "data-testid": `${testIdPrefix}-target-list`,
                 className: "mt-1 space-y-1 max-h-40 overflow-y-auto pr-0.5",
-                children: targetCandidates.map((t) => /* @__PURE__ */ jsx18(
+                children: targetCandidates.map((t) => /* @__PURE__ */ jsx19(
                   CandidateRow,
                   {
                     track: t,
@@ -3943,9 +4109,9 @@ function CrossfadeModal({
             )
           ] })
         ] })),
-        error && /* @__PURE__ */ jsx18("div", { className: "text-xs text-sas-danger", "data-testid": `${testIdPrefix}-error`, children: error }),
-        /* @__PURE__ */ jsxs14("div", { className: "flex justify-end gap-2 pt-1", children: [
-          /* @__PURE__ */ jsx18(
+        error && /* @__PURE__ */ jsx19("div", { className: "text-xs text-sas-danger", "data-testid": `${testIdPrefix}-error`, children: error }),
+        /* @__PURE__ */ jsxs15("div", { className: "flex justify-end gap-2 pt-1", children: [
+          /* @__PURE__ */ jsx19(
             "button",
             {
               ref: cancelRef,
@@ -3956,7 +4122,7 @@ function CrossfadeModal({
               children: "Cancel"
             }
           ),
-          /* @__PURE__ */ jsx18(
+          /* @__PURE__ */ jsx19(
             "button",
             {
               "data-testid": `${testIdPrefix}-confirm`,
@@ -3973,10 +4139,10 @@ function CrossfadeModal({
 }
 
 // src/components/TransitionDesigner.tsx
-import { useCallback as useCallback9, useEffect as useEffect10, useMemo as useMemo6, useRef as useRef11, useState as useState13 } from "react";
+import { useCallback as useCallback10, useEffect as useEffect11, useMemo as useMemo6, useRef as useRef11, useState as useState14 } from "react";
 
 // src/hooks/useTrackReorder.ts
-import { useCallback as useCallback8, useRef as useRef10, useState as useState12 } from "react";
+import { useCallback as useCallback9, useRef as useRef10, useState as useState13 } from "react";
 function moveItem(arr, from, to) {
   const next = arr.slice();
   if (from === to || from < 0 || to < 0 || from >= next.length || to >= next.length) {
@@ -3993,12 +4159,12 @@ function useTrackReorder({
   getId,
   onError
 }) {
-  const [draggingIndex, setDraggingIndex] = useState12(null);
-  const [dragOverIndex, setDragOverIndex] = useState12(null);
+  const [draggingIndex, setDraggingIndex] = useState13(null);
+  const [dragOverIndex, setDragOverIndex] = useState13(null);
   const fromRef = useRef10(null);
   const itemsRef = useRef10(items);
   itemsRef.current = items;
-  const dragPropsFor = useCallback8(
+  const dragPropsFor = useCallback9(
     (index) => ({
       handleProps: {
         draggable: true,
@@ -4180,7 +4346,7 @@ function dbIdsFromKeys(keys) {
 }
 
 // src/components/TransitionDesigner.tsx
-import { jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
 var CROSSFADE_ESTIMATE_MS = 15e3;
 var FADE_ESTIMATE_MS = 11e3;
 var CREATE_ALL_CONCURRENCY = 5;
@@ -4207,14 +4373,14 @@ function TransitionDesigner({
   testIdPrefix = "transition-designer"
 }) {
   const fadeOnly = !onCreateCrossfade;
-  const [load, setLoad] = useState13({ status: "loading" });
-  const [fromName, setFromName] = useState13(null);
-  const [toName, setToName] = useState13(null);
-  const [originSlots, setOriginSlots] = useState13([]);
-  const [targetSlots, setTargetSlots] = useState13([]);
-  const [creatingKeys, setCreatingKeys] = useState13(() => /* @__PURE__ */ new Set());
-  const [rowErrors, setRowErrors] = useState13({});
-  const [rowEffects, setRowEffects] = useState13({});
+  const [load, setLoad] = useState14({ status: "loading" });
+  const [fromName, setFromName] = useState14(null);
+  const [toName, setToName] = useState14(null);
+  const [originSlots, setOriginSlots] = useState14([]);
+  const [targetSlots, setTargetSlots] = useState14([]);
+  const [creatingKeys, setCreatingKeys] = useState14(() => /* @__PURE__ */ new Set());
+  const [rowErrors, setRowErrors] = useState14({});
+  const [rowEffects, setRowEffects] = useState14({});
   const rowEffectsRef = useRef11(rowEffects);
   rowEffectsRef.current = rowEffects;
   const audioEffectsEnabled = !!onCreateAudioTransition;
@@ -4227,8 +4393,8 @@ function TransitionDesigner({
   const creatingKeysRef = useRef11(creatingKeys);
   creatingKeysRef.current = creatingKeys;
   const dragRef = useRef11(null);
-  const [dragging, setDragging] = useState13(null);
-  const [dragOver, setDragOver] = useState13(null);
+  const [dragging, setDragging] = useState14(null);
+  const [dragOver, setDragOver] = useState14(null);
   const excludeSet = useMemo6(() => new Set(excludeSourceDbIds ?? []), [excludeSourceDbIds]);
   const originPool = useMemo6(
     () => load.status === "ready" ? load.origin.filter((t) => !excludeSet.has(t.dbId)) : [],
@@ -4244,7 +4410,7 @@ function TransitionDesigner({
   originByIdRef.current = originById;
   const targetByIdRef = useRef11(targetById);
   targetByIdRef.current = targetById;
-  const refresh = useCallback9(async () => {
+  const refresh = useCallback10(async () => {
     if (!host.listSceneFamilyTracks) {
       setLoad({ status: "error", message: "This host does not support transition tracks." });
       return;
@@ -4287,10 +4453,10 @@ function TransitionDesigner({
       });
     }
   }, [host, fromSceneId, toSceneId, transitionSceneId, mapColumnSubjects]);
-  useEffect10(() => {
+  useEffect11(() => {
     void refresh();
   }, [refresh]);
-  useEffect10(() => {
+  useEffect11(() => {
     if (load.status !== "ready") return;
     const [po, pt] = padPair(
       reconcileSlots(originSlotsRef.current, originPool.map((t) => t.dbId)),
@@ -4299,7 +4465,7 @@ function TransitionDesigner({
     if (!slotsEqual(po, originSlotsRef.current)) setOriginSlots(po);
     if (!slotsEqual(pt, targetSlotsRef.current)) setTargetSlots(pt);
   }, [originPool, targetPool, load.status]);
-  const mutate = useCallback9(
+  const mutate = useCallback10(
     (nextOrigin, nextTarget) => {
       const norm = normalizeSlots(nextOrigin, nextTarget);
       const [po, pt] = padPair(norm.originOrder, norm.targetOrder);
@@ -4312,7 +4478,7 @@ function TransitionDesigner({
     },
     [host, transitionSceneId]
   );
-  const setRowEffect = useCallback9(
+  const setRowEffect = useCallback10(
     (sourceDbId, effect) => {
       setRowEffects((prev) => {
         const next = { ...prev, [sourceDbId]: effect };
@@ -4326,7 +4492,7 @@ function TransitionDesigner({
     },
     [host, transitionSceneId]
   );
-  const insertGapAbove = useCallback9(
+  const insertGapAbove = useCallback10(
     (col, index) => {
       const slots = col === "origin" ? originSlots : targetSlots;
       const next = [...slots.slice(0, index), null, ...slots.slice(index)];
@@ -4335,7 +4501,7 @@ function TransitionDesigner({
     },
     [originSlots, targetSlots, mutate]
   );
-  const removeGap = useCallback9(
+  const removeGap = useCallback10(
     (col, index) => {
       const slots = col === "origin" ? originSlots : targetSlots;
       const next = slots.filter((_, i) => i !== index);
@@ -4344,7 +4510,7 @@ function TransitionDesigner({
     },
     [originSlots, targetSlots, mutate]
   );
-  const handleDrop = useCallback9(
+  const handleDrop = useCallback10(
     (col, to) => {
       const from = dragRef.current;
       dragRef.current = null;
@@ -4383,7 +4549,7 @@ function TransitionDesigner({
     }).length,
     [effectiveRows, creatingKeys]
   );
-  const createRow = useCallback9(
+  const createRow = useCallback10(
     async (row) => {
       const key = rowKey(row);
       if (!key || !row.type || creatingKeysRef.current.has(key)) return;
@@ -4438,7 +4604,7 @@ function TransitionDesigner({
     },
     [onCreateCrossfade, onCreateFade, onCreateAudioTransition]
   );
-  const createAll = useCallback9(async () => {
+  const createAll = useCallback10(async () => {
     const source = fadeOnly ? fadeOnlyRowsRef.current : buildRowSlots(originSlotsRef.current, targetSlotsRef.current);
     const eligible = source.filter((r) => {
       const k = rowKey(r);
@@ -4507,15 +4673,15 @@ function TransitionDesigner({
     const base = "group relative rounded-sm border px-2 py-1.5 text-left transition-colors select-none";
     const tone = isDragTarget ? "border-sas-accent bg-sas-accent/10" : "border-sas-border bg-sas-panel";
     if (slotId === null) {
-      return /* @__PURE__ */ jsxs15(
+      return /* @__PURE__ */ jsxs16(
         "div",
         {
           ...cellDragProps(col, index, false),
           "data-testid": `${testIdPrefix}-${col}-gap-${index}`,
           className: `${base} ${tone} border-dashed flex items-center justify-between ${isDragging ? "opacity-40" : "opacity-70"}`,
           children: [
-            /* @__PURE__ */ jsx19("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: "\u2014 gap \u2014" }),
-            /* @__PURE__ */ jsx19(
+            /* @__PURE__ */ jsx20("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: "\u2014 gap \u2014" }),
+            /* @__PURE__ */ jsx20(
               "button",
               {
                 type: "button",
@@ -4532,7 +4698,7 @@ function TransitionDesigner({
     }
     const primary = track ? track.prompt?.trim() || track.name : slotId;
     const meta = track ? [track.role, shortId3(track.dbId)].filter(Boolean).join(" \xB7 ") : "missing";
-    return /* @__PURE__ */ jsx19(
+    return /* @__PURE__ */ jsx20(
       "div",
       {
         ...cellDragProps(col, index, locked),
@@ -4540,13 +4706,13 @@ function TransitionDesigner({
         "data-value": slotId,
         className: `${base} ${tone} ${isDragging ? "opacity-40" : ""} ${locked ? "opacity-60" : "cursor-grab active:cursor-grabbing"}`,
         title: track ? track.dbId : "Track no longer available",
-        children: /* @__PURE__ */ jsxs15("div", { className: "flex items-start gap-1", children: [
-          /* @__PURE__ */ jsx19("span", { className: "text-sas-muted/60 text-xs leading-tight pt-0.5", "aria-hidden": true, children: "\u283F" }),
-          /* @__PURE__ */ jsxs15("div", { className: "min-w-0 flex-1", children: [
-            /* @__PURE__ */ jsx19("div", { className: "text-xs text-sas-text truncate", children: primary }),
-            meta && /* @__PURE__ */ jsx19("div", { className: "text-[10px] text-sas-muted truncate mt-0.5", children: meta })
+        children: /* @__PURE__ */ jsxs16("div", { className: "flex items-start gap-1", children: [
+          /* @__PURE__ */ jsx20("span", { className: "text-sas-muted/60 text-xs leading-tight pt-0.5", "aria-hidden": true, children: "\u283F" }),
+          /* @__PURE__ */ jsxs16("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsx20("div", { className: "text-xs text-sas-text truncate", children: primary }),
+            meta && /* @__PURE__ */ jsx20("div", { className: "text-[10px] text-sas-muted truncate mt-0.5", children: meta })
           ] }),
-          /* @__PURE__ */ jsx19(
+          /* @__PURE__ */ jsx20(
             "button",
             {
               type: "button",
@@ -4569,26 +4735,26 @@ function TransitionDesigner({
     const key = rowKey(row);
     const isCreatingThis = key !== null && creatingKeys.has(key);
     const errMsg = key !== null ? rowErrors[key] : void 0;
-    return /* @__PURE__ */ jsxs15(
+    return /* @__PURE__ */ jsxs16(
       "div",
       {
         "data-testid": `${testIdPrefix}-row-${i}`,
         className: "grid grid-cols-[1fr_auto] gap-2 items-center",
         children: [
-          /* @__PURE__ */ jsxs15(
+          /* @__PURE__ */ jsxs16(
             "div",
             {
               "data-testid": `${testIdPrefix}-subject-${slotId}`,
               className: `rounded-sm border border-sas-border bg-sas-panel px-2 py-1.5 ${isCreatingThis ? "opacity-60" : ""}`,
               title: track ? track.dbId : "Track no longer available",
               children: [
-                /* @__PURE__ */ jsx19("div", { className: "text-xs text-sas-text truncate", children: track ? track.prompt?.trim() || track.name : slotId }),
-                /* @__PURE__ */ jsx19("div", { className: "text-[10px] text-sas-muted truncate mt-0.5", children: track ? [track.role, shortId3(track.dbId)].filter(Boolean).join(" \xB7 ") : "missing" })
+                /* @__PURE__ */ jsx20("div", { className: "text-xs text-sas-text truncate", children: track ? track.prompt?.trim() || track.name : slotId }),
+                /* @__PURE__ */ jsx20("div", { className: "text-[10px] text-sas-muted truncate mt-0.5", children: track ? [track.role, shortId3(track.dbId)].filter(Boolean).join(" \xB7 ") : "missing" })
               ]
             }
           ),
-          /* @__PURE__ */ jsxs15("div", { className: "w-[160px] flex flex-col items-center gap-1", children: [
-            /* @__PURE__ */ jsx19(
+          /* @__PURE__ */ jsxs16("div", { className: "w-[160px] flex flex-col items-center gap-1", children: [
+            /* @__PURE__ */ jsx20(
               "span",
               {
                 "data-testid": `${testIdPrefix}-type-${i}`,
@@ -4596,7 +4762,7 @@ function TransitionDesigner({
                 children: row.type ? TYPE_LABEL[row.type] : "\u2014"
               }
             ),
-            isCreatingThis ? /* @__PURE__ */ jsx19("div", { className: "w-full", children: /* @__PURE__ */ jsx19(
+            isCreatingThis ? /* @__PURE__ */ jsx20("div", { className: "w-full", children: /* @__PURE__ */ jsx20(
               SorceryProgressBar,
               {
                 isLoading: true,
@@ -4604,7 +4770,7 @@ function TransitionDesigner({
                 statusText: "CREATING",
                 estimatedDurationMs: fadeEstimateMs ?? FADE_ESTIMATE_MS
               }
-            ) }) : /* @__PURE__ */ jsx19(
+            ) }) : /* @__PURE__ */ jsx20(
               "button",
               {
                 type: "button",
@@ -4614,7 +4780,7 @@ function TransitionDesigner({
                 children: "Create"
               }
             ),
-            errMsg && /* @__PURE__ */ jsx19(
+            errMsg && /* @__PURE__ */ jsx20(
               "span",
               {
                 "data-testid": `${testIdPrefix}-row-error-${i}`,
@@ -4631,18 +4797,18 @@ function TransitionDesigner({
   if (fadeOnly) {
     const outRows = fadeOnlyRows.filter((r) => r.type === "fade-out");
     const inRows = fadeOnlyRows.filter((r) => r.type === "fade-in");
-    return /* @__PURE__ */ jsxs15("div", { className: "space-y-2", "data-testid": `${testIdPrefix}-box`, children: [
-      /* @__PURE__ */ jsxs15("div", { className: "flex items-center justify-between gap-3 pb-1 border-b border-sas-border", children: [
-        /* @__PURE__ */ jsxs15("p", { className: "text-[11px] text-sas-muted leading-snug min-w-0", children: [
-          /* @__PURE__ */ jsx19("span", { className: "text-sas-text", children: fromLabel }),
+    return /* @__PURE__ */ jsxs16("div", { className: "space-y-2", "data-testid": `${testIdPrefix}-box`, children: [
+      /* @__PURE__ */ jsxs16("div", { className: "flex items-center justify-between gap-3 pb-1 border-b border-sas-border", children: [
+        /* @__PURE__ */ jsxs16("p", { className: "text-[11px] text-sas-muted leading-snug min-w-0", children: [
+          /* @__PURE__ */ jsx20("span", { className: "text-sas-text", children: fromLabel }),
           " \u2192",
           " ",
-          /* @__PURE__ */ jsx19("span", { className: "text-sas-text", children: toLabel }),
+          /* @__PURE__ */ jsx20("span", { className: "text-sas-text", children: toLabel }),
           familyLabel ? ` \xB7 ${familyLabel}` : "",
           " \xB7 each entry fades on its own \u2014 origin fades out, target fades in."
         ] }),
-        /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2 shrink-0", children: [
-          creatingKeys.size > 0 && /* @__PURE__ */ jsxs15(
+        /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-2 shrink-0", children: [
+          creatingKeys.size > 0 && /* @__PURE__ */ jsxs16(
             "span",
             {
               className: "text-[10px] text-sas-accent whitespace-nowrap",
@@ -4653,7 +4819,7 @@ function TransitionDesigner({
               ]
             }
           ),
-          /* @__PURE__ */ jsxs15(
+          /* @__PURE__ */ jsxs16(
             "button",
             {
               type: "button",
@@ -4670,26 +4836,26 @@ function TransitionDesigner({
           )
         ] })
       ] }),
-      load.status === "loading" && /* @__PURE__ */ jsx19("div", { className: "text-xs text-sas-muted py-6 text-center", children: "Loading tracks\u2026" }),
-      load.status === "error" && /* @__PURE__ */ jsx19("div", { className: "text-xs text-sas-danger py-6 text-center", "data-testid": `${testIdPrefix}-error`, children: load.message }),
-      load.status === "ready" && (fadeOnlyRows.length === 0 ? /* @__PURE__ */ jsxs15("div", { className: "text-xs text-sas-muted py-6 text-center", "data-testid": `${testIdPrefix}-empty`, children: [
+      load.status === "loading" && /* @__PURE__ */ jsx20("div", { className: "text-xs text-sas-muted py-6 text-center", children: "Loading tracks\u2026" }),
+      load.status === "error" && /* @__PURE__ */ jsx20("div", { className: "text-xs text-sas-danger py-6 text-center", "data-testid": `${testIdPrefix}-error`, children: load.message }),
+      load.status === "ready" && (fadeOnlyRows.length === 0 ? /* @__PURE__ */ jsxs16("div", { className: "text-xs text-sas-muted py-6 text-center", "data-testid": `${testIdPrefix}-empty`, children: [
         "Nothing to fade in this panel for either scene. Add tracks to ",
         fromLabel,
         " or ",
         toLabel,
         " ",
         "first (or free one by deleting an existing fade)."
-      ] }) : /* @__PURE__ */ jsxs15("div", { className: "space-y-3", children: [
-        outRows.length > 0 && /* @__PURE__ */ jsxs15("div", { className: "space-y-2", "data-testid": `${testIdPrefix}-fade-out-section`, children: [
-          /* @__PURE__ */ jsxs15("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: [
+      ] }) : /* @__PURE__ */ jsxs16("div", { className: "space-y-3", children: [
+        outRows.length > 0 && /* @__PURE__ */ jsxs16("div", { className: "space-y-2", "data-testid": `${testIdPrefix}-fade-out-section`, children: [
+          /* @__PURE__ */ jsxs16("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: [
             "Origin (",
             fromLabel,
             ") \u2014 fades out"
           ] }),
           outRows.map((row, i) => renderFadeOnlyRow(row, i))
         ] }),
-        inRows.length > 0 && /* @__PURE__ */ jsxs15("div", { className: "space-y-2", "data-testid": `${testIdPrefix}-fade-in-section`, children: [
-          /* @__PURE__ */ jsxs15("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: [
+        inRows.length > 0 && /* @__PURE__ */ jsxs16("div", { className: "space-y-2", "data-testid": `${testIdPrefix}-fade-in-section`, children: [
+          /* @__PURE__ */ jsxs16("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted", children: [
             "Target (",
             toLabel,
             ") \u2014 fades in"
@@ -4699,22 +4865,22 @@ function TransitionDesigner({
       ] }))
     ] });
   }
-  return /* @__PURE__ */ jsxs15("div", { className: "space-y-2", "data-testid": `${testIdPrefix}-box`, children: [
-    /* @__PURE__ */ jsxs15("div", { className: "flex items-center justify-between gap-3 pb-1 border-b border-sas-border", children: [
-      /* @__PURE__ */ jsxs15("p", { className: "text-[11px] text-sas-muted leading-snug min-w-0", children: [
-        /* @__PURE__ */ jsx19("span", { className: "text-sas-text", children: fromLabel }),
+  return /* @__PURE__ */ jsxs16("div", { className: "space-y-2", "data-testid": `${testIdPrefix}-box`, children: [
+    /* @__PURE__ */ jsxs16("div", { className: "flex items-center justify-between gap-3 pb-1 border-b border-sas-border", children: [
+      /* @__PURE__ */ jsxs16("p", { className: "text-[11px] text-sas-muted leading-snug min-w-0", children: [
+        /* @__PURE__ */ jsx20("span", { className: "text-sas-text", children: fromLabel }),
         " \u2192",
         " ",
-        /* @__PURE__ */ jsx19("span", { className: "text-sas-text", children: toLabel }),
+        /* @__PURE__ */ jsx20("span", { className: "text-sas-text", children: toLabel }),
         familyLabel ? ` \xB7 ${familyLabel}` : "",
         " \xB7 line up a track on each side to crossfade; leave one blank (or insert a gap) to fade."
       ] }),
-      /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2 shrink-0", children: [
-        creatingKeys.size > 0 && /* @__PURE__ */ jsxs15("span", { className: "text-[10px] text-sas-accent whitespace-nowrap", "data-testid": `${testIdPrefix}-creating-count`, children: [
+      /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-2 shrink-0", children: [
+        creatingKeys.size > 0 && /* @__PURE__ */ jsxs16("span", { className: "text-[10px] text-sas-accent whitespace-nowrap", "data-testid": `${testIdPrefix}-creating-count`, children: [
           creatingKeys.size,
           " creating\u2026"
         ] }),
-        /* @__PURE__ */ jsxs15(
+        /* @__PURE__ */ jsxs16(
           "button",
           {
             type: "button",
@@ -4731,49 +4897,49 @@ function TransitionDesigner({
         )
       ] })
     ] }),
-    /* @__PURE__ */ jsxs15("div", { className: "grid grid-cols-[1fr_auto_1fr] gap-2", children: [
-      /* @__PURE__ */ jsxs15("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted truncate", children: [
+    /* @__PURE__ */ jsxs16("div", { className: "grid grid-cols-[1fr_auto_1fr] gap-2", children: [
+      /* @__PURE__ */ jsxs16("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted truncate", children: [
         "Origin (",
         fromLabel,
         ")"
       ] }),
-      /* @__PURE__ */ jsx19("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted text-center px-2", children: "Transition" }),
-      /* @__PURE__ */ jsxs15("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted truncate text-right", children: [
+      /* @__PURE__ */ jsx20("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted text-center px-2", children: "Transition" }),
+      /* @__PURE__ */ jsxs16("span", { className: "text-[10px] uppercase tracking-wide text-sas-muted truncate text-right", children: [
         "Target (",
         toLabel,
         ")"
       ] })
     ] }),
-    load.status === "loading" && /* @__PURE__ */ jsx19("div", { className: "text-xs text-sas-muted py-6 text-center", children: "Loading tracks\u2026" }),
-    load.status === "error" && /* @__PURE__ */ jsx19("div", { className: "text-xs text-sas-danger py-6 text-center", "data-testid": `${testIdPrefix}-error`, children: load.message }),
-    load.status === "ready" && (rows.length === 0 ? /* @__PURE__ */ jsxs15("div", { className: "text-xs text-sas-muted py-6 text-center", "data-testid": `${testIdPrefix}-empty`, children: [
+    load.status === "loading" && /* @__PURE__ */ jsx20("div", { className: "text-xs text-sas-muted py-6 text-center", children: "Loading tracks\u2026" }),
+    load.status === "error" && /* @__PURE__ */ jsx20("div", { className: "text-xs text-sas-danger py-6 text-center", "data-testid": `${testIdPrefix}-error`, children: load.message }),
+    load.status === "ready" && (rows.length === 0 ? /* @__PURE__ */ jsxs16("div", { className: "text-xs text-sas-muted py-6 text-center", "data-testid": `${testIdPrefix}-empty`, children: [
       "No tracks to arrange in this panel for either scene. Add tracks to ",
       fromLabel,
       " or ",
       toLabel,
       " ",
       "first (or free one by deleting an existing crossfade/fade)."
-    ] }) : /* @__PURE__ */ jsx19("div", { className: "space-y-2", children: rows.map((row, i) => {
+    ] }) : /* @__PURE__ */ jsx20("div", { className: "space-y-2", children: rows.map((row, i) => {
       const key = rowKey(row);
       const isCreatingThis = key !== null && creatingKeys.has(key);
       const errMsg = key !== null ? rowErrors[key] : void 0;
-      return /* @__PURE__ */ jsxs15(
+      return /* @__PURE__ */ jsxs16(
         "div",
         {
           "data-testid": `${testIdPrefix}-row-${i}`,
           className: "grid grid-cols-[1fr_auto_1fr] gap-2 items-center",
           children: [
             renderCell("origin", i, row.originId),
-            /* @__PURE__ */ jsxs15("div", { className: "w-[160px] flex flex-col items-center gap-1", children: [
-              !row.type ? /* @__PURE__ */ jsx19("span", { className: "text-[10px] text-sas-muted/50", children: "\u2014" }) : row.type === "crossfade" ? /* @__PURE__ */ jsx19(
+            /* @__PURE__ */ jsxs16("div", { className: "w-[160px] flex flex-col items-center gap-1", children: [
+              !row.type ? /* @__PURE__ */ jsx20("span", { className: "text-[10px] text-sas-muted/50", children: "\u2014" }) : row.type === "crossfade" ? /* @__PURE__ */ jsx20(
                 "span",
                 {
                   "data-testid": `${testIdPrefix}-type-${i}`,
                   className: "text-[10px] font-medium px-1.5 py-0.5 rounded-sm border border-sas-accent/50 text-sas-accent",
                   children: TYPE_LABEL[row.type]
                 }
-              ) : audioEffectsEnabled ? /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-1", "data-testid": `${testIdPrefix}-type-${i}`, children: [
-                /* @__PURE__ */ jsx19(
+              ) : audioEffectsEnabled ? /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-1", "data-testid": `${testIdPrefix}-type-${i}`, children: [
+                /* @__PURE__ */ jsx20(
                   "select",
                   {
                     "data-testid": `${testIdPrefix}-effect-${i}`,
@@ -4783,11 +4949,11 @@ function TransitionDesigner({
                       if (id) setRowEffect(id, e.target.value);
                     },
                     className: "text-[10px] bg-sas-panel border border-sas-border rounded-sm px-1 py-0.5 text-sas-text",
-                    children: AUDIO_EFFECTS.map((eff) => /* @__PURE__ */ jsx19("option", { value: eff, children: AUDIO_EFFECT_LABEL[eff] }, eff))
+                    children: AUDIO_EFFECTS.map((eff) => /* @__PURE__ */ jsx20("option", { value: eff, children: AUDIO_EFFECT_LABEL[eff] }, eff))
                   }
                 ),
-                /* @__PURE__ */ jsx19("span", { className: "text-[9px] text-sas-muted", children: row.type === "fade-out" ? "out" : "in" })
-              ] }) : /* @__PURE__ */ jsx19(
+                /* @__PURE__ */ jsx20("span", { className: "text-[9px] text-sas-muted", children: row.type === "fade-out" ? "out" : "in" })
+              ] }) : /* @__PURE__ */ jsx20(
                 "span",
                 {
                   "data-testid": `${testIdPrefix}-type-${i}`,
@@ -4795,7 +4961,7 @@ function TransitionDesigner({
                   children: TYPE_LABEL[row.type]
                 }
               ),
-              isCreatingThis ? /* @__PURE__ */ jsx19("div", { className: "w-full", children: /* @__PURE__ */ jsx19(
+              isCreatingThis ? /* @__PURE__ */ jsx20("div", { className: "w-full", children: /* @__PURE__ */ jsx20(
                 SorceryProgressBar,
                 {
                   isLoading: true,
@@ -4803,7 +4969,7 @@ function TransitionDesigner({
                   statusText: "CREATING",
                   estimatedDurationMs: row.type === "crossfade" ? CROSSFADE_ESTIMATE_MS : FADE_ESTIMATE_MS
                 }
-              ) }) : /* @__PURE__ */ jsx19(
+              ) }) : /* @__PURE__ */ jsx20(
                 "button",
                 {
                   type: "button",
@@ -4814,7 +4980,7 @@ function TransitionDesigner({
                   children: "Create"
                 }
               ),
-              errMsg && /* @__PURE__ */ jsx19(
+              errMsg && /* @__PURE__ */ jsx20(
                 "span",
                 {
                   "data-testid": `${testIdPrefix}-row-error-${i}`,
@@ -4833,8 +4999,8 @@ function TransitionDesigner({
 }
 
 // src/components/PanelMasterStrip.tsx
-import { useMemo as useMemo7, useState as useState14 } from "react";
-import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
+import { useMemo as useMemo7, useState as useState15 } from "react";
+import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
 function PanelMasterStrip({
   bus,
   levels = null,
@@ -4853,7 +5019,7 @@ function PanelMasterStrip({
   onToggleFxEnabled,
   onShowFxEditor
 }) {
-  const [search, setSearch] = useState14("");
+  const [search, setSearch] = useState15("");
   const filtered = useMemo7(() => {
     const q = search.trim().toLowerCase();
     if (!q) return availableFx;
@@ -4861,14 +5027,14 @@ function PanelMasterStrip({
       (fx) => fx.name.toLowerCase().includes(q) || fx.manufacturer.toLowerCase().includes(q)
     );
   }, [availableFx, search]);
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17(
     "div",
     {
       "data-testid": "panel-master-strip",
       className: `flex flex-col gap-1 px-2 py-1.5 rounded-sm border border-sas-border border-l-2 border-l-sas-accent/50 bg-sas-accent/5 transition-opacity ${soloedOut ? "opacity-40" : ""}`,
       children: [
-        /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx20(
+        /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx21(
             "span",
             {
               className: "text-[9px] font-bold tracking-widest text-sas-muted/70 select-none",
@@ -4876,8 +5042,8 @@ function PanelMasterStrip({
               children: "BUS"
             }
           ),
-          /* @__PURE__ */ jsxs16("div", { className: "flex-1 min-w-[8rem] flex flex-col gap-0.5", children: [
-            /* @__PURE__ */ jsx20(
+          /* @__PURE__ */ jsxs17("div", { className: "flex-1 min-w-[8rem] flex flex-col gap-0.5", children: [
+            /* @__PURE__ */ jsx21(
               VolumeSlider,
               {
                 value: dbToSlider(bus.volume),
@@ -4885,8 +5051,8 @@ function PanelMasterStrip({
                 disabled
               }
             ),
-            /* @__PURE__ */ jsxs16("div", { className: "flex flex-col gap-px", "data-testid": "bus-meter", children: [
-              /* @__PURE__ */ jsx20(
+            /* @__PURE__ */ jsxs17("div", { className: "flex flex-col gap-px", "data-testid": "bus-meter", children: [
+              /* @__PURE__ */ jsx21(
                 LevelMeter,
                 {
                   peakDb: levels?.leftDb ?? -120,
@@ -4896,7 +5062,7 @@ function PanelMasterStrip({
                   "data-testid": "bus-meter-left"
                 }
               ),
-              /* @__PURE__ */ jsx20(
+              /* @__PURE__ */ jsx21(
                 LevelMeter,
                 {
                   peakDb: levels?.rightDb ?? -120,
@@ -4907,7 +5073,7 @@ function PanelMasterStrip({
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsx20(
+          /* @__PURE__ */ jsx21(
             "button",
             {
               "data-testid": "bus-mute-button",
@@ -4918,7 +5084,7 @@ function PanelMasterStrip({
               children: "M"
             }
           ),
-          /* @__PURE__ */ jsx20(
+          /* @__PURE__ */ jsx21(
             "button",
             {
               "data-testid": "bus-solo-button",
@@ -4929,14 +5095,14 @@ function PanelMasterStrip({
               children: "S"
             }
           ),
-          /* @__PURE__ */ jsx20("div", { className: "flex items-center gap-1 max-w-[45%] min-w-0 overflow-x-auto", children: bus.fx.map((fx) => /* @__PURE__ */ jsxs16(
+          /* @__PURE__ */ jsx21("div", { className: "flex items-center gap-1 max-w-[45%] min-w-0 overflow-x-auto", children: bus.fx.map((fx) => /* @__PURE__ */ jsxs17(
             "span",
             {
               "data-testid": `bus-fx-chip-${fx.index}`,
               className: `flex items-center gap-1 px-1.5 py-0.5 rounded-sm border text-[10px] whitespace-nowrap ${fx.enabled ? "border-sas-accent/60 text-sas-accent bg-sas-accent/10" : "border-sas-border text-sas-muted/50 bg-sas-panel"}`,
               title: `${fx.name}${fx.enabled ? "" : " (bypassed)"}`,
               children: [
-                /* @__PURE__ */ jsx20(
+                /* @__PURE__ */ jsx21(
                   "button",
                   {
                     "data-testid": `bus-fx-toggle-${fx.index}`,
@@ -4947,7 +5113,7 @@ function PanelMasterStrip({
                     children: fx.enabled ? "\u25CF" : "\u25CB"
                   }
                 ),
-                onShowFxEditor ? /* @__PURE__ */ jsx20(
+                onShowFxEditor ? /* @__PURE__ */ jsx21(
                   "button",
                   {
                     "data-testid": `bus-fx-edit-${fx.index}`,
@@ -4957,8 +5123,8 @@ function PanelMasterStrip({
                     title: `Open ${fx.name} editor`,
                     children: fx.name
                   }
-                ) : /* @__PURE__ */ jsx20("span", { className: "max-w-[80px] truncate", children: fx.name }),
-                /* @__PURE__ */ jsx20(
+                ) : /* @__PURE__ */ jsx21("span", { className: "max-w-[80px] truncate", children: fx.name }),
+                /* @__PURE__ */ jsx21(
                   "button",
                   {
                     "data-testid": `bus-fx-remove-${fx.index}`,
@@ -4973,7 +5139,7 @@ function PanelMasterStrip({
             },
             `${fx.index}:${fx.pluginId}`
           )) }),
-          /* @__PURE__ */ jsx20(
+          /* @__PURE__ */ jsx21(
             "button",
             {
               "data-testid": "bus-fx-add-button",
@@ -4985,9 +5151,9 @@ function PanelMasterStrip({
             }
           )
         ] }),
-        fxPickerOpen && /* @__PURE__ */ jsxs16("div", { "data-testid": "bus-fx-picker", className: "flex flex-col gap-2 pt-1", children: [
-          /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx20(
+        fxPickerOpen && /* @__PURE__ */ jsxs17("div", { "data-testid": "bus-fx-picker", className: "flex flex-col gap-2 pt-1", children: [
+          /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx21(
               "input",
               {
                 type: "text",
@@ -4997,7 +5163,7 @@ function PanelMasterStrip({
                 className: "sas-input flex-1 px-2 py-1 text-xs"
               }
             ),
-            onRefreshFx && /* @__PURE__ */ jsx20(
+            onRefreshFx && /* @__PURE__ */ jsx21(
               "button",
               {
                 onClick: () => onRefreshFx(),
@@ -5008,8 +5174,8 @@ function PanelMasterStrip({
               }
             )
           ] }),
-          fxLoading && availableFx.length === 0 ? /* @__PURE__ */ jsx20("div", { className: "text-xs text-sas-muted/60 text-center py-3", children: "Scanning plugins..." }) : /* @__PURE__ */ jsxs16("div", { className: "grid grid-cols-3 gap-1 max-h-[140px] overflow-y-auto", children: [
-            filtered.map((fx) => /* @__PURE__ */ jsxs16(
+          fxLoading && availableFx.length === 0 ? /* @__PURE__ */ jsx21("div", { className: "text-xs text-sas-muted/60 text-center py-3", children: "Scanning plugins..." }) : /* @__PURE__ */ jsxs17("div", { className: "grid grid-cols-3 gap-1 max-h-[140px] overflow-y-auto", children: [
+            filtered.map((fx) => /* @__PURE__ */ jsxs17(
               "button",
               {
                 "data-testid": `bus-fx-pick-${fx.pluginId}`,
@@ -5017,13 +5183,13 @@ function PanelMasterStrip({
                 className: "flex flex-col items-start px-2 py-1.5 rounded-sm border text-left transition-colors border-sas-border bg-sas-panel-alt text-sas-muted hover:border-sas-accent hover:text-sas-accent",
                 title: `${fx.name} by ${fx.manufacturer} (${fx.type.toUpperCase()})`,
                 children: [
-                  /* @__PURE__ */ jsx20("span", { className: "text-xs font-medium truncate w-full", children: fx.name }),
-                  /* @__PURE__ */ jsx20("span", { className: "text-[9px] text-sas-muted/50 truncate w-full", children: fx.manufacturer || fx.type.toUpperCase() })
+                  /* @__PURE__ */ jsx21("span", { className: "text-xs font-medium truncate w-full", children: fx.name }),
+                  /* @__PURE__ */ jsx21("span", { className: "text-[9px] text-sas-muted/50 truncate w-full", children: fx.manufacturer || fx.type.toUpperCase() })
                 ]
               },
               fx.pluginId
             )),
-            filtered.length === 0 && /* @__PURE__ */ jsx20("div", { className: "col-span-3 text-xs text-sas-muted/60 text-center py-2", children: search.trim() ? "No matches" : "No FX plugins found" })
+            filtered.length === 0 && /* @__PURE__ */ jsx21("div", { className: "col-span-3 text-xs text-sas-muted/60 text-center py-2", children: search.trim() ? "No matches" : "No FX plugins found" })
           ] })
         ] })
       ]
@@ -5032,18 +5198,18 @@ function PanelMasterStrip({
 }
 
 // src/hooks/usePanelBus.ts
-import { useCallback as useCallback10, useEffect as useEffect11, useRef as useRef12, useState as useState15 } from "react";
+import { useCallback as useCallback11, useEffect as useEffect12, useRef as useRef12, useState as useState16 } from "react";
 var LEVELS_POLL_MS = 66;
 function usePanelBus(host, activeSceneId) {
   const supported = typeof host.getPanelBusState === "function";
-  const [bus, setBus] = useState15(null);
-  const [levels, setLevels] = useState15(null);
-  const [availableFx, setAvailableFx] = useState15([]);
-  const [fxLoading, setFxLoading] = useState15(false);
-  const [fxPickerOpen, setFxPickerOpen] = useState15(false);
+  const [bus, setBus] = useState16(null);
+  const [levels, setLevels] = useState16(null);
+  const [availableFx, setAvailableFx] = useState16([]);
+  const [fxLoading, setFxLoading] = useState16(false);
+  const [fxPickerOpen, setFxPickerOpen] = useState16(false);
   const fxLoadedRef = useRef12(false);
   const loadSeqRef = useRef12(0);
-  const reload = useCallback10(async () => {
+  const reload = useCallback11(async () => {
     if (!supported || !activeSceneId || !host.getPanelBusState) {
       setBus(null);
       return;
@@ -5055,12 +5221,12 @@ function usePanelBus(host, activeSceneId) {
     } catch {
     }
   }, [host, activeSceneId, supported]);
-  useEffect11(() => {
+  useEffect12(() => {
     setBus(null);
     setFxPickerOpen(false);
     void reload();
   }, [reload]);
-  useEffect11(() => {
+  useEffect12(() => {
     if (!supported || !activeSceneId || !bus?.engaged || !host.getPanelBusLevels) {
       setLevels(null);
       return;
@@ -5082,7 +5248,7 @@ function usePanelBus(host, activeSceneId) {
       clearInterval(id);
     };
   }, [supported, activeSceneId, bus?.engaged, host]);
-  const loadFxList = useCallback10(
+  const loadFxList = useCallback11(
     async (opts) => {
       if (!supported || !host.getAvailableFx) return;
       if (fxLoadedRef.current && !opts.force && !opts.rescan) return;
@@ -5098,14 +5264,14 @@ function usePanelBus(host, activeSceneId) {
     },
     [host, supported]
   );
-  const openPicker = useCallback10(
+  const openPicker = useCallback11(
     (open) => {
       setFxPickerOpen(open);
       if (open) void loadFxList({});
     },
     [loadFxList]
   );
-  const mutate = useCallback10(
+  const mutate = useCallback11(
     (fn) => {
       if (!fn || !activeSceneId) return;
       void (async () => {
@@ -5149,8 +5315,8 @@ function usePanelBus(host, activeSceneId) {
 }
 
 // src/components/DownloadPackButton.tsx
-import { useCallback as useCallback11, useEffect as useEffect12, useState as useState16 } from "react";
-import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
+import { useCallback as useCallback12, useEffect as useEffect13, useState as useState17 } from "react";
+import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
 function formatSize(bytes) {
   if (!bytes || bytes <= 0) return "";
   const gb = bytes / 1024 ** 3;
@@ -5166,10 +5332,10 @@ var DownloadPackButton = ({
   variant = "compact",
   onDownloadComplete
 }) => {
-  const [status, setStatus] = useState16("idle");
-  const [progress, setProgress] = useState16(0);
-  const [errorMessage, setErrorMessage] = useState16(null);
-  useEffect12(() => {
+  const [status, setStatus] = useState17("idle");
+  const [progress, setProgress] = useState17(0);
+  const [errorMessage, setErrorMessage] = useState17(null);
+  useEffect13(() => {
     const unsub = host.onSamplePackProgress(packId, (p) => {
       setStatus(p.status);
       setProgress(p.progress);
@@ -5184,7 +5350,7 @@ var DownloadPackButton = ({
     });
     return unsub;
   }, [host, packId, onDownloadComplete]);
-  const handleClick = useCallback11(async () => {
+  const handleClick = useCallback12(async () => {
     if (status !== "idle" && status !== "error") return;
     try {
       setStatus("downloading");
@@ -5238,8 +5404,8 @@ var DownloadPackButton = ({
   } else {
     className = `${baseClasses} text-sas-muted hover:text-sas-accent border-sas-border hover:border-sas-accent`;
   }
-  return /* @__PURE__ */ jsxs17("div", { children: [
-    /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsxs18("div", { children: [
+    /* @__PURE__ */ jsx22(
       "button",
       {
         "data-testid": `download-pack-button-${packId}`,
@@ -5250,12 +5416,12 @@ var DownloadPackButton = ({
         children: buttonLabel
       }
     ),
-    variant === "large" && status === "error" && errorMessage && /* @__PURE__ */ jsx21("div", { className: "text-xs text-sas-danger mt-2", "data-testid": `download-pack-error-${packId}`, children: errorMessage })
+    variant === "large" && status === "error" && errorMessage && /* @__PURE__ */ jsx22("div", { className: "text-xs text-sas-danger mt-2", "data-testid": `download-pack-error-${packId}`, children: errorMessage })
   ] });
 };
 
 // src/components/SamplePackCTACard.tsx
-import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs19 } from "react/jsx-runtime";
 var SamplePackCTACard = ({
   host,
   pack,
@@ -5263,7 +5429,7 @@ var SamplePackCTACard = ({
   onDownloadComplete
 }) => {
   if (status === "checking") {
-    return /* @__PURE__ */ jsx22(
+    return /* @__PURE__ */ jsx23(
       "div",
       {
         "data-testid": `sample-pack-cta-checking-${pack.packId}`,
@@ -5274,16 +5440,16 @@ var SamplePackCTACard = ({
   }
   const headline = status === "stale" ? `${pack.displayName} update available` : `${pack.displayName} not installed`;
   const sublabel = status === "stale" ? `A newer version is available for download.` : pack.description;
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     "div",
     {
       "data-testid": `sample-pack-cta-${pack.packId}`,
       className: "flex flex-col items-center justify-center py-12 px-6 text-center",
       children: [
-        /* @__PURE__ */ jsx22("div", { className: "text-sm uppercase tracking-wide text-sas-muted mb-2", children: status === "stale" ? "Update available" : "Sample library not installed" }),
-        /* @__PURE__ */ jsx22("div", { className: "text-base text-sas-text mb-1", children: headline }),
-        /* @__PURE__ */ jsx22("div", { className: "text-xs text-sas-muted mb-6 max-w-md", children: sublabel }),
-        /* @__PURE__ */ jsx22(
+        /* @__PURE__ */ jsx23("div", { className: "text-sm uppercase tracking-wide text-sas-muted mb-2", children: status === "stale" ? "Update available" : "Sample library not installed" }),
+        /* @__PURE__ */ jsx23("div", { className: "text-base text-sas-text mb-1", children: headline }),
+        /* @__PURE__ */ jsx23("div", { className: "text-xs text-sas-muted mb-6 max-w-md", children: sublabel }),
+        /* @__PURE__ */ jsx23(
           DownloadPackButton,
           {
             host,
@@ -5300,7 +5466,7 @@ var SamplePackCTACard = ({
 };
 
 // src/components/WaveformView.tsx
-import { useEffect as useEffect13, useRef as useRef13, useState as useState17 } from "react";
+import { useEffect as useEffect14, useRef as useRef13, useState as useState18 } from "react";
 
 // src/components/waveform.ts
 function computePeaks(audioBuffer, bins, targetSamples) {
@@ -5363,7 +5529,7 @@ function drawWaveform(canvas, peaks, options = {}) {
 }
 
 // src/components/WaveformView.tsx
-import { jsx as jsx23 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 var WaveformView = ({
   host,
   filePath,
@@ -5373,8 +5539,8 @@ var WaveformView = ({
   targetSamples
 }) => {
   const canvasRef = useRef13(null);
-  const [peaks, setPeaks] = useState17(null);
-  useEffect13(() => {
+  const [peaks, setPeaks] = useState18(null);
+  useEffect14(() => {
     let cancelled = false;
     let audioContext = null;
     (async () => {
@@ -5400,7 +5566,7 @@ var WaveformView = ({
       cancelled = true;
     };
   }, [host, filePath, bins, targetSamples]);
-  useEffect13(() => {
+  useEffect14(() => {
     if (!peaks) return;
     const canvas = canvasRef.current;
     if (!canvas) return;
@@ -5411,7 +5577,7 @@ var WaveformView = ({
     observer.observe(canvas);
     return () => observer.disconnect();
   }, [peaks, fillStyle]);
-  return /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx24(
     "canvas",
     {
       ref: canvasRef,
@@ -5422,8 +5588,8 @@ var WaveformView = ({
 };
 
 // src/components/ScrollingWaveform.tsx
-import { useEffect as useEffect14, useRef as useRef14 } from "react";
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { useEffect as useEffect15, useRef as useRef14 } from "react";
+import { jsx as jsx25 } from "react/jsx-runtime";
 var ScrollingWaveform = ({
   getPeakDb,
   active,
@@ -5435,7 +5601,7 @@ var ScrollingWaveform = ({
   const ringRef = useRef14(new Float32Array(columns));
   const writeIdxRef = useRef14(0);
   const rafRef = useRef14(null);
-  useEffect14(() => {
+  useEffect15(() => {
     if (ringRef.current.length !== columns) {
       const next = new Float32Array(columns);
       const prev = ringRef.current;
@@ -5447,7 +5613,7 @@ var ScrollingWaveform = ({
       writeIdxRef.current = writeIdxRef.current % columns;
     }
   }, [columns]);
-  useEffect14(() => {
+  useEffect15(() => {
     if (!active) {
       if (rafRef.current !== null) {
         cancelAnimationFrame(rafRef.current);
@@ -5499,7 +5665,7 @@ var ScrollingWaveform = ({
       }
     };
   }, [active, getPeakDb, fillStyle]);
-  return /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx25(
     "canvas",
     {
       ref: canvasRef,
@@ -5510,8 +5676,8 @@ var ScrollingWaveform = ({
 };
 
 // src/components/OffsetScrubber.tsx
-import { useCallback as useCallback12, useEffect as useEffect15, useMemo as useMemo8, useRef as useRef15, useState as useState18 } from "react";
-import { jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
+import { useCallback as useCallback13, useEffect as useEffect16, useMemo as useMemo8, useRef as useRef15, useState as useState19 } from "react";
+import { jsx as jsx26, jsxs as jsxs20 } from "react/jsx-runtime";
 var SLIDER_HEIGHT_PX = 28;
 var TICK_HEIGHT_PX = 14;
 var DOWNBEAT_TICK_HEIGHT_PX = 22;
@@ -5525,9 +5691,9 @@ function OffsetScrubber({
   disabled = false
 }) {
   const trackRef = useRef15(null);
-  const [draftOffset, setDraftOffset] = useState18(offsetSamples);
-  const [isDragging, setIsDragging] = useState18(false);
-  useEffect15(() => {
+  const [draftOffset, setDraftOffset] = useState19(offsetSamples);
+  const [isDragging, setIsDragging] = useState19(false);
+  useEffect16(() => {
     if (!isDragging) setDraftOffset(offsetSamples);
   }, [offsetSamples, isDragging]);
   const sampleRate = cuePoints?.sample_rate ?? 44100;
@@ -5536,14 +5702,14 @@ function OffsetScrubber({
     return Math.round(60 / projectBpm * sampleRate);
   }, [projectBpm, sampleRate]);
   const rangeSamples = beatsForRange * meter;
-  const sampleToFraction = useCallback12(
+  const sampleToFraction = useCallback13(
     (sample) => {
       const clamped = Math.max(-rangeSamples, Math.min(rangeSamples, sample));
       return (clamped + rangeSamples) / (2 * rangeSamples);
     },
     [rangeSamples]
   );
-  const fractionToSample = useCallback12(
+  const fractionToSample = useCallback13(
     (fraction) => {
       const clamped = Math.max(0, Math.min(1, fraction));
       return Math.round(clamped * 2 * rangeSamples - rangeSamples);
@@ -5557,7 +5723,7 @@ function OffsetScrubber({
     const negatives = positives.slice(1).map((p) => -p);
     return [...negatives, ...positives].sort((a, b) => a - b);
   }, [cuePoints]);
-  const snapToBeat = useCallback12(
+  const snapToBeat = useCallback13(
     (sample) => {
       if (snapTargets.length === 0) return sample;
       let best = snapTargets[0];
@@ -5573,7 +5739,7 @@ function OffsetScrubber({
     },
     [snapTargets]
   );
-  const handlePointerDown = useCallback12(
+  const handlePointerDown = useCallback13(
     (e) => {
       if (disabled || !cuePoints) return;
       e.preventDefault();
@@ -5607,7 +5773,7 @@ function OffsetScrubber({
     },
     [disabled, cuePoints, fractionToSample, onChange, snapToBeat]
   );
-  const handleResetToZero = useCallback12(() => {
+  const handleResetToZero = useCallback13(() => {
     if (disabled) return;
     setDraftOffset(0);
     onChange(0);
@@ -5626,9 +5792,9 @@ function OffsetScrubber({
     });
   }, [cuePoints, sampleToFraction]);
   const isDisabled = disabled || !cuePoints || cuePoints.beats.length === 0;
-  return /* @__PURE__ */ jsxs19("div", { "data-testid": "offset-scrubber", className: "flex items-center gap-2 w-full", children: [
-    /* @__PURE__ */ jsx25("span", { className: "text-[9px] text-sas-muted/60 uppercase tracking-wide flex-shrink-0", children: "Align" }),
-    /* @__PURE__ */ jsxs19(
+  return /* @__PURE__ */ jsxs20("div", { "data-testid": "offset-scrubber", className: "flex items-center gap-2 w-full", children: [
+    /* @__PURE__ */ jsx26("span", { className: "text-[9px] text-sas-muted/60 uppercase tracking-wide flex-shrink-0", children: "Align" }),
+    /* @__PURE__ */ jsxs20(
       "div",
       {
         ref: trackRef,
@@ -5644,7 +5810,7 @@ function OffsetScrubber({
         "aria-valuenow": draftOffset,
         "aria-disabled": isDisabled,
         children: [
-          /* @__PURE__ */ jsx25(
+          /* @__PURE__ */ jsx26(
             "div",
             {
               "aria-hidden": "true",
@@ -5652,7 +5818,7 @@ function OffsetScrubber({
               style: { left: "50%" }
             }
           ),
-          ticks.map((t) => /* @__PURE__ */ jsx25(
+          ticks.map((t) => /* @__PURE__ */ jsx26(
             "div",
             {
               "data-testid": t.isDownbeat ? "offset-tick-downbeat" : "offset-tick",
@@ -5667,7 +5833,7 @@ function OffsetScrubber({
             },
             t.i
           )),
-          /* @__PURE__ */ jsx25(
+          /* @__PURE__ */ jsx26(
             "div",
             {
               "data-testid": "offset-scrubber-thumb",
@@ -5684,7 +5850,7 @@ function OffsetScrubber({
         ]
       }
     ),
-    /* @__PURE__ */ jsx25(
+    /* @__PURE__ */ jsx26(
       "span",
       {
         "data-testid": "offset-scrubber-readout",
@@ -5692,7 +5858,7 @@ function OffsetScrubber({
         children: formatOffset(draftOffset, sampleRate)
       }
     ),
-    /* @__PURE__ */ jsx25(
+    /* @__PURE__ */ jsx26(
       "button",
       {
         type: "button",
@@ -5704,7 +5870,7 @@ function OffsetScrubber({
         children: "\u2316"
       }
     ),
-    bpmMismatch && /* @__PURE__ */ jsx25(
+    bpmMismatch && /* @__PURE__ */ jsx26(
       "span",
       {
         "data-testid": "offset-bpm-mismatch",
@@ -5776,16 +5942,16 @@ function synthesizeCuePoints({
 }
 
 // src/panel-core/useGeneratorPanelCore.tsx
-import { useState as useState23, useEffect as useEffect18, useCallback as useCallback16, useRef as useRef19, useMemo as useMemo10 } from "react";
+import { useState as useState24, useEffect as useEffect19, useCallback as useCallback17, useRef as useRef19, useMemo as useMemo10 } from "react";
 
 // src/hooks/useSceneState.ts
-import { useState as useState19, useCallback as useCallback13, useRef as useRef16 } from "react";
+import { useState as useState20, useCallback as useCallback14, useRef as useRef16 } from "react";
 function useSceneState(activeSceneId, initialValue) {
-  const [stateMap, setStateMap] = useState19(() => /* @__PURE__ */ new Map());
+  const [stateMap, setStateMap] = useState20(() => /* @__PURE__ */ new Map());
   const activeSceneIdRef = useRef16(activeSceneId);
   activeSceneIdRef.current = activeSceneId;
   const currentValue = activeSceneId !== null && stateMap.has(activeSceneId) ? stateMap.get(activeSceneId) : initialValue;
-  const setForCurrentScene = useCallback13((value) => {
+  const setForCurrentScene = useCallback14((value) => {
     const sid = activeSceneIdRef.current;
     if (sid === null) return;
     setStateMap((prev) => {
@@ -5796,7 +5962,7 @@ function useSceneState(activeSceneId, initialValue) {
       return newMap;
     });
   }, [initialValue]);
-  const setForScene = useCallback13((sceneId, value) => {
+  const setForScene = useCallback14((sceneId, value) => {
     setStateMap((prev) => {
       const current = prev.has(sceneId) ? prev.get(sceneId) : initialValue;
       const next = typeof value === "function" ? value(current) : value;
@@ -5809,10 +5975,10 @@ function useSceneState(activeSceneId, initialValue) {
 }
 
 // src/hooks/useAnySolo.ts
-import { useEffect as useEffect16, useState as useState20 } from "react";
+import { useEffect as useEffect17, useState as useState21 } from "react";
 function useAnySolo(host) {
-  const [anySolo, setAnySolo] = useState20(false);
-  useEffect16(() => {
+  const [anySolo, setAnySolo] = useState21(false);
+  useEffect17(() => {
     let active = true;
     const refresh = () => {
       host.isAnySoloActive().then((v) => {
@@ -5831,7 +5997,7 @@ function useAnySolo(host) {
 }
 
 // src/hooks/useSoundHistory.ts
-import { useCallback as useCallback14, useMemo as useMemo9, useRef as useRef17, useState as useState21 } from "react";
+import { useCallback as useCallback15, useMemo as useMemo9, useRef as useRef17, useState as useState22 } from "react";
 var EMPTY = { entries: [], cursor: -1 };
 function sameDescriptor(a, b) {
   if (a === b) return true;
@@ -5848,9 +6014,9 @@ function useSoundHistory(applySound, opts = {}) {
   const onChangeRef = useRef17(opts.onChange);
   onChangeRef.current = opts.onChange;
   const dataRef = useRef17({});
-  const [, setVersion] = useState21(0);
-  const bump = useCallback14(() => setVersion((v) => v + 1), []);
-  const commit = useCallback14(
+  const [, setVersion] = useState22(0);
+  const bump = useCallback15(() => setVersion((v) => v + 1), []);
+  const commit = useCallback15(
     (trackId, next, notify) => {
       dataRef.current = { ...dataRef.current, [trackId]: next };
       bump();
@@ -5858,7 +6024,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [bump]
   );
-  const record = useCallback14(
+  const record = useCallback15(
     (trackId, descriptor, label) => {
       const h = dataRef.current[trackId];
       const current = h && h.cursor >= 0 ? h.entries[h.cursor] : void 0;
@@ -5873,7 +6039,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [max, commit]
   );
-  const restoreTo = useCallback14(
+  const restoreTo = useCallback15(
     async (trackId, index) => {
       const h = dataRef.current[trackId];
       if (!h || index < 0 || index >= h.entries.length || index === h.cursor) return false;
@@ -5883,7 +6049,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [commit]
   );
-  const undo = useCallback14(
+  const undo = useCallback15(
     (trackId) => {
       const h = dataRef.current[trackId];
       if (!h || h.cursor <= 0) return Promise.resolve(false);
@@ -5891,7 +6057,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [restoreTo]
   );
-  const toggleFavorite = useCallback14(
+  const toggleFavorite = useCallback15(
     (trackId, index) => {
       const h = dataRef.current[trackId];
       if (!h || index < 0 || index >= h.entries.length) return;
@@ -5900,7 +6066,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [commit]
   );
-  const restore = useCallback14(
+  const restore = useCallback15(
     (trackId, state) => {
       const entries = Array.isArray(state?.entries) ? [...state.entries] : [];
       const raw = typeof state?.cursor === "number" ? state.cursor : entries.length - 1;
@@ -5909,15 +6075,15 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [commit]
   );
-  const list = useCallback14(
+  const list = useCallback15(
     (trackId) => dataRef.current[trackId] ?? EMPTY,
     []
   );
-  const canUndo = useCallback14((trackId) => {
+  const canUndo = useCallback15((trackId) => {
     const h = dataRef.current[trackId];
     return !!h && h.cursor > 0;
   }, []);
-  const clear = useCallback14(
+  const clear = useCallback15(
     (trackId) => {
       if (dataRef.current[trackId]) {
         const next = { ...dataRef.current };
@@ -5929,7 +6095,7 @@ function useSoundHistory(applySound, opts = {}) {
     },
     [bump]
   );
-  const reset = useCallback14(() => {
+  const reset = useCallback15(() => {
     dataRef.current = {};
     bump();
   }, [bump]);
@@ -6009,7 +6175,7 @@ function resolveTrackGroups(parsedGroups, tracks, getDbId, opts = {}) {
 }
 
 // src/panel-core/useTransitionOps.ts
-import { useCallback as useCallback15, useEffect as useEffect17, useRef as useRef18, useState as useState22 } from "react";
+import { useCallback as useCallback16, useEffect as useEffect18, useRef as useRef18, useState as useState23 } from "react";
 function useTransitionOps({
   host,
   adapter,
@@ -6027,7 +6193,7 @@ function useTransitionOps({
 }) {
   const { identity } = adapter;
   const appliedFadeAutomationRef = useRef18(/* @__PURE__ */ new Set());
-  const applyCrossfadeAutomation = useCallback15(
+  const applyCrossfadeAutomation = useCallback16(
     async (originTrackId, targetTrackId, bars, bpm, sliderPos) => {
       if (host.setTrackVolumeAutomation) {
         const curves = buildCrossfadeVolumeCurves(bars, bpm, sliderPos);
@@ -6044,7 +6210,7 @@ function useTransitionOps({
     },
     [host]
   );
-  const applyFadeAutomation = useCallback15(
+  const applyFadeAutomation = useCallback16(
     async (trackId, direction, bars, bpm, sliderPos, gesture) => {
       if (!host.setTrackVolumeAutomation) return;
       const points = buildFadeVolumeCurve(bars, bpm, direction, sliderPos, gesture);
@@ -6053,7 +6219,7 @@ function useTransitionOps({
     },
     [host]
   );
-  const copyTrackFx = useCallback15(
+  const copyTrackFx = useCallback16(
     async (newTrackId, sourceDbId) => {
       if (typeof host.copyTrackFxFrom !== "function") return;
       try {
@@ -6070,8 +6236,8 @@ function useTransitionOps({
     },
     [host]
   );
-  const [isCreatingCrossfade, setIsCreatingCrossfade] = useState22(false);
-  const handleCreateCrossfade = useCallback15(
+  const [isCreatingCrossfade, setIsCreatingCrossfade] = useState23(false);
+  const handleCreateCrossfade = useCallback16(
     async (origin, target) => {
       const scene = activeSceneId;
       const fromSceneId = sceneContext?.transitionFromSceneId ?? "";
@@ -6201,9 +6367,9 @@ function useTransitionOps({
       loadTracks
     ]
   );
-  const [isCreatingGroupFade, setIsCreatingGroupFade] = useState22(false);
-  const [isCreatingFade, setIsCreatingFade] = useState22(false);
-  const handleCreateFade = useCallback15(
+  const [isCreatingGroupFade, setIsCreatingGroupFade] = useState23(false);
+  const [isCreatingFade, setIsCreatingFade] = useState23(false);
+  const handleCreateFade = useCallback16(
     async (selection, direction, gesture) => {
       const scene = activeSceneId;
       const fromSceneId = sceneContext?.transitionFromSceneId ?? "";
@@ -6314,7 +6480,7 @@ function useTransitionOps({
       loadTracks
     ]
   );
-  const handleCrossfadeMute = useCallback15(
+  const handleCrossfadeMute = useCallback16(
     (pair) => {
       const newMuted = !pair.origin.runtimeState.muted;
       for (const id of [pair.origin.handle.id, pair.target.handle.id]) {
@@ -6329,7 +6495,7 @@ function useTransitionOps({
     },
     [host, setTracks]
   );
-  const handleCrossfadeSolo = useCallback15(
+  const handleCrossfadeSolo = useCallback16(
     (pair) => {
       const newSolo = !pair.origin.runtimeState.solo;
       for (const id of [pair.origin.handle.id, pair.target.handle.id]) {
@@ -6344,7 +6510,7 @@ function useTransitionOps({
     },
     [host, setTracks]
   );
-  const handleCrossfadeDelete = useCallback15(
+  const handleCrossfadeDelete = useCallback16(
     async (pair) => {
       try {
         for (const member of [pair.origin, pair.target]) {
@@ -6371,7 +6537,7 @@ function useTransitionOps({
     [host, activeSceneId, setCrossfadePairsMeta, setTracks]
   );
   const crossfadeSliderTimers = useRef18({});
-  const handleCrossfadeSlider = useCallback15(
+  const handleCrossfadeSlider = useCallback16(
     (pair, pos) => {
       setCrossfadePairsMeta(
         (prev) => prev.map((p) => p.groupId === pair.groupId ? { ...p, sliderPos: pos } : p)
@@ -6404,7 +6570,7 @@ function useTransitionOps({
     },
     [host, activeSceneId, applyCrossfadeAutomation, setCrossfadePairsMeta]
   );
-  const handleFadeDelete = useCallback15(
+  const handleFadeDelete = useCallback16(
     async (fade) => {
       try {
         await host.deleteTrack(fade.track.handle.id);
@@ -6425,7 +6591,7 @@ function useTransitionOps({
     [host, activeSceneId, setFadesMeta, setTracks]
   );
   const fadeSliderTimers = useRef18({});
-  const handleFadeSlider = useCallback15(
+  const handleFadeSlider = useCallback16(
     (fade, pos) => {
       setFadesMeta(
         (prev) => prev.map((f) => f.dbId === fade.dbId ? { ...f, meta: { ...f.meta, sliderPos: pos } } : f)
@@ -6455,7 +6621,7 @@ function useTransitionOps({
     },
     [host, activeSceneId, applyFadeAutomation, setFadesMeta]
   );
-  const handleCreateVerbatimGroupFade = useCallback15(
+  const handleCreateVerbatimGroupFade = useCallback16(
     async (subject, direction) => {
       const groupAdapter = adapter.transitionGroup;
       if (!groupAdapter) throw new Error("This panel does not support group fades.");
@@ -6571,7 +6737,7 @@ function useTransitionOps({
     ]
   );
   const groupFadeSliderTimers = useRef18({});
-  const handleGroupFadeSlider = useCallback15(
+  const handleGroupFadeSlider = useCallback16(
     (group, pos) => {
       setFadesMeta(
         (prev) => prev.map(
@@ -6610,7 +6776,7 @@ function useTransitionOps({
     },
     [host, activeSceneId, applyFadeAutomation, setFadesMeta]
   );
-  const handleGroupFadeDelete = useCallback15(
+  const handleGroupFadeDelete = useCallback16(
     async (group) => {
       const suffixes = ["fade", ...adapter.transitionGroup?.cleanupKeySuffixes ?? []];
       try {
@@ -6638,7 +6804,7 @@ function useTransitionOps({
     [host, adapter, activeSceneId, setFadesMeta, setTracks]
   );
   const lastResyncKeyRef = useRef18("");
-  useEffect17(() => {
+  useEffect18(() => {
     if (!host.getTrackSound || resolvedCrossfadePairs.length === 0 && resolvedFades.length === 0) {
       return;
     }
@@ -6679,7 +6845,7 @@ function useTransitionOps({
       cancelled = true;
     };
   }, [resolvedCrossfadePairs, resolvedFades, host, adapter]);
-  useEffect17(() => {
+  useEffect18(() => {
     if (!host.setTrackVolumeAutomation || resolvedFades.length === 0) return;
     void (async () => {
       const mc = await host.getMusicalContext();
@@ -6717,7 +6883,7 @@ function useTransitionOps({
 }
 
 // src/panel-core/useGeneratorPanelCore.tsx
-import { jsx as jsx26, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs21 } from "react/jsx-runtime";
 var EMPTY_PLACEHOLDERS = [];
 function useGeneratorPanelCore({
   ui,
@@ -6738,7 +6904,7 @@ function useGeneratorPanelCore({
   const { identity, features } = adapter;
   const logTag = identity.logTag;
   const adapterRef = useRef19(adapter);
-  useEffect18(() => {
+  useEffect19(() => {
     if (adapterRef.current !== adapter) {
       adapterRef.current = adapter;
       console.warn(
@@ -6748,15 +6914,15 @@ function useGeneratorPanelCore({
   }, [adapter, logTag]);
   const supportsMeters = typeof host.getTrackLevels === "function";
   const trackLevels = useTrackLevels(host, isExpanded);
-  const [tracks, setTracks] = useState23([]);
-  const [isLoadingTracks, setIsLoadingTracks] = useState23(false);
-  const [importOpen, setImportOpen] = useState23(false);
-  const [soundImportTarget, setSoundImportTarget] = useState23(null);
-  const [designerView, setDesignerView] = useState23(false);
-  const [transitionSourceTotal, setTransitionSourceTotal] = useState23(0);
-  const [crossfadePairsMeta, setCrossfadePairsMeta] = useState23([]);
-  const [fadesMeta, setFadesMeta] = useState23([]);
-  const [genericGroupMetas, setGenericGroupMetas] = useState23({});
+  const [tracks, setTracks] = useState24([]);
+  const [isLoadingTracks, setIsLoadingTracks] = useState24(false);
+  const [importOpen, setImportOpen] = useState24(false);
+  const [soundImportTarget, setSoundImportTarget] = useState24(null);
+  const [designerView, setDesignerView] = useState24(false);
+  const [transitionSourceTotal, setTransitionSourceTotal] = useState24(0);
+  const [crossfadePairsMeta, setCrossfadePairsMeta] = useState24([]);
+  const [fadesMeta, setFadesMeta] = useState24([]);
+  const [genericGroupMetas, setGenericGroupMetas] = useState24({});
   const [isComposing, , setIsComposingForScene] = useSceneState(activeSceneId, false);
   const [placeholders, , setPlaceholdersForScene] = useSceneState(
     activeSceneId,
@@ -6764,11 +6930,11 @@ function useGeneratorPanelCore({
   );
   const saveTimeoutRefs = useRef19({});
   const editLoadStartedRef = useRef19(/* @__PURE__ */ new Set());
-  const [availableInstruments, setAvailableInstruments] = useState23([]);
-  const [instrumentsLoading, setInstrumentsLoading] = useState23(false);
+  const [availableInstruments, setAvailableInstruments] = useState24([]);
+  const [instrumentsLoading, setInstrumentsLoading] = useState24(false);
   const engineToDbIdRef = useRef19(/* @__PURE__ */ new Map());
   const tracksLoadedForSceneRef = useRef19(null);
-  const persistSoundHistory = useCallback16(
+  const persistSoundHistory = useCallback17(
     (trackId, state) => {
       if (!activeSceneId) return;
       const dbId = engineToDbIdRef.current.get(trackId) ?? trackId;
@@ -6788,7 +6954,7 @@ function useGeneratorPanelCore({
     setItems: setTracks,
     getId: (t) => t.handle.dbId
   });
-  const loadTracks = useCallback16(
+  const loadTracks = useCallback17(
     async (incremental = false) => {
       const sceneAtStart = activeSceneId;
       if (!sceneAtStart) {
@@ -6913,10 +7079,10 @@ function useGeneratorPanelCore({
     },
     [host, activeSceneId, soundHistory, adapter, logTag]
   );
-  useEffect18(() => {
+  useEffect19(() => {
     loadTracks();
   }, [loadTracks]);
-  useEffect18(() => {
+  useEffect19(() => {
     const map = /* @__PURE__ */ new Map();
     for (const t of tracks) {
       map.set(t.handle.id, t.handle.dbId);
@@ -6924,7 +7090,7 @@ function useGeneratorPanelCore({
     engineToDbIdRef.current = map;
   }, [tracks]);
   const loadedCompletedIdsRef = useRef19(/* @__PURE__ */ new Set());
-  useEffect18(() => {
+  useEffect19(() => {
     if (placeholders.length === 0) {
       loadedCompletedIdsRef.current.clear();
       return;
@@ -6943,16 +7109,16 @@ function useGeneratorPanelCore({
       loadTracks(true);
     }
   }, [placeholders, loadTracks, logTag]);
-  const adoptAndLoad = useCallback16(() => {
+  const adoptAndLoad = useCallback17(() => {
     loadTracks(true);
   }, [loadTracks]);
-  useEffect18(() => {
+  useEffect19(() => {
     const unsub = host.onEngineReady(() => {
       adoptAndLoad();
     });
     return unsub;
   }, [host, adoptAndLoad]);
-  useEffect18(() => {
+  useEffect19(() => {
     if (typeof host.onAfterAgentMutation !== "function") return;
     let timer = null;
     const unsub = host.onAfterAgentMutation(() => {
@@ -6967,13 +7133,13 @@ function useGeneratorPanelCore({
       if (timer) clearTimeout(timer);
     };
   }, [host, loadTracks]);
-  useEffect18(() => {
+  useEffect19(() => {
     const unsub = host.onTrackStateChange((trackId, state) => {
       setTracks((prev) => prev.map((t) => t.handle.id === trackId ? { ...t, runtimeState: state } : t));
     });
     return unsub;
   }, [host]);
-  useEffect18(() => {
+  useEffect19(() => {
     if (!features.bulkComposePlaceholders) return;
     console.log(`[${logTag}] Subscribing to composeProgress`);
     const unsub = host.onComposeProgress((event) => {
@@ -7007,7 +7173,7 @@ function useGeneratorPanelCore({
     });
     return unsub;
   }, [host, setIsComposingForScene, setPlaceholdersForScene, features.bulkComposePlaceholders, logTag]);
-  useEffect18(() => {
+  useEffect19(() => {
     const refs = saveTimeoutRefs;
     return () => {
       for (const timeout of Object.values(refs.current)) {
@@ -7016,8 +7182,8 @@ function useGeneratorPanelCore({
     };
   }, []);
   const isAddingTrackRef = useRef19(false);
-  const [isAddingTrack, setIsAddingTrack] = useState23(false);
-  const handleAddTrack = useCallback16(async () => {
+  const [isAddingTrack, setIsAddingTrack] = useState24(false);
+  const handleAddTrack = useCallback17(async () => {
     if (isAddingTrackRef.current) return;
     if (!activeSceneId) {
       host.showToast("warning", "Select SCENE");
@@ -7065,7 +7231,7 @@ function useGeneratorPanelCore({
       setIsAddingTrack(false);
     }
   }, [host, adapter, identity, activeSceneId, isConnected, isAuthenticated, tracks.length, onExpandSelf, loadTracks, logTag]);
-  const handlePortTrack = useCallback16(
+  const handlePortTrack = useCallback17(
     async (sel) => {
       if (!activeSceneId) {
         host.showToast("warning", "Select SCENE");
@@ -7128,7 +7294,7 @@ function useGeneratorPanelCore({
     },
     [host, adapter, identity, activeSceneId, isConnected, tracks.length, loadTracks]
   );
-  const handleSoundImportPick = useCallback16(
+  const handleSoundImportPick = useCallback17(
     async (sel) => {
       const target = soundImportTarget;
       if (!target || !host.getTrackSound) {
@@ -7159,8 +7325,8 @@ function useGeneratorPanelCore({
     },
     [soundImportTarget, host, adapter, identity.familyKey, soundHistory]
   );
-  const [isExportingMidi, setIsExportingMidi] = useState23(false);
-  const handleExportMidi = useCallback16(async () => {
+  const [isExportingMidi, setIsExportingMidi] = useState24(false);
+  const handleExportMidi = useCallback17(async () => {
     if (isExportingMidi) return;
     setIsExportingMidi(true);
     try {
@@ -7191,10 +7357,10 @@ function useGeneratorPanelCore({
   const xfFromId = sceneContext?.transitionFromSceneId ?? null;
   const xfToId = sceneContext?.transitionToSceneId ?? null;
   const canCrossfade = features.transitionDesigner && sceneContext?.sceneType === "transition" && !!xfFromId && !!xfToId && !!host.listSceneFamilyTracks;
-  useEffect18(() => {
+  useEffect19(() => {
     if (!canCrossfade) setDesignerView(false);
   }, [canCrossfade]);
-  useEffect18(() => {
+  useEffect19(() => {
     if (!canCrossfade || !xfFromId || !xfToId || !host.listSceneFamilyTracks) {
       setTransitionSourceTotal(0);
       return;
@@ -7210,12 +7376,12 @@ function useGeneratorPanelCore({
     };
   }, [canCrossfade, xfFromId, xfToId, host]);
   const transitionDone = crossfadePairsMeta.length * 2 + fadesMeta.length;
-  useEffect18(() => {
+  useEffect19(() => {
     if (!onHeaderContent) return;
     const addDisabled = needsContract || !isConnected || !activeSceneId || tracks.length >= identity.maxTracks || isAddingTrack;
     onHeaderContent(
-      /* @__PURE__ */ jsxs20("div", { className: "flex gap-1 items-center", children: [
-        features.importTracks && (!canCrossfade || !designerView) && host.listImportableTracks && /* @__PURE__ */ jsx26(
+      /* @__PURE__ */ jsxs21("div", { className: "flex gap-1 items-center", children: [
+        features.importTracks && (!canCrossfade || !designerView) && host.listImportableTracks && /* @__PURE__ */ jsx27(
           "button",
           {
             "data-testid": `import-from-scene-${identity.familyKey}-button`,
@@ -7229,7 +7395,7 @@ function useGeneratorPanelCore({
             children: identity.importTrackLabel ?? "Import Track"
           }
         ),
-        (!canCrossfade || !designerView) && /* @__PURE__ */ jsx26(
+        (!canCrossfade || !designerView) && /* @__PURE__ */ jsx27(
           "button",
           {
             "data-testid": `add-${identity.familyKey}-track-button`,
@@ -7245,7 +7411,7 @@ function useGeneratorPanelCore({
             children: identity.addTrackLabel ?? "Add Track"
           }
         ),
-        canCrossfade && /* @__PURE__ */ jsxs20(
+        canCrossfade && /* @__PURE__ */ jsxs21(
           "button",
           {
             "data-testid": `${identity.familyKey}-view-toggle`,
@@ -7264,7 +7430,7 @@ function useGeneratorPanelCore({
             title: designerView ? "Back to the track list" : "Open the transition designer",
             className: "relative overflow-hidden px-2 py-0.5 text-[10px] font-medium rounded-sm border border-sas-accent/40 text-sas-accent transition-colors hover:border-sas-accent disabled:opacity-50",
             children: [
-              transitionSourceTotal > 0 && /* @__PURE__ */ jsx26(
+              transitionSourceTotal > 0 && /* @__PURE__ */ jsx27(
                 "span",
                 {
                   className: "absolute inset-y-0 left-0 bg-sas-accent/25",
@@ -7272,7 +7438,7 @@ function useGeneratorPanelCore({
                   "aria-hidden": true
                 }
               ),
-              /* @__PURE__ */ jsxs20("span", { className: "relative", children: [
+              /* @__PURE__ */ jsxs21("span", { className: "relative", children: [
                 "\u21C4 ",
                 designerView ? "Transition" : "Tracks",
                 transitionSourceTotal > 0 ? ` ${transitionDone}/${transitionSourceTotal}` : ""
@@ -7303,7 +7469,7 @@ function useGeneratorPanelCore({
     identity,
     features.importTracks
   ]);
-  useEffect18(() => {
+  useEffect19(() => {
     if (!onLoading) return;
     const anyGenerating = tracks.some((t) => t.isGenerating);
     onLoading(isLoadingTracks || anyGenerating || isBulkActive);
@@ -7311,7 +7477,7 @@ function useGeneratorPanelCore({
       onLoading(false);
     };
   }, [onLoading, isLoadingTracks, tracks, isBulkActive]);
-  const handleDeleteTrack = useCallback16(
+  const handleDeleteTrack = useCallback17(
     async (trackId) => {
       try {
         await host.deleteTrack(trackId);
@@ -7327,7 +7493,7 @@ function useGeneratorPanelCore({
     },
     [host, activeSceneId]
   );
-  const handlePromptChange = useCallback16(
+  const handlePromptChange = useCallback17(
     (trackId, prompt) => {
       setTracks((prev) => prev.map((t) => t.handle.id === trackId ? { ...t, prompt } : t));
       const dbId = engineToDbIdRef.current.get(trackId) ?? trackId;
@@ -7364,11 +7530,11 @@ function useGeneratorPanelCore({
     }
     return s;
   }, [resolvedGenericGroups]);
-  const engineToDbId = useCallback16(
+  const engineToDbId = useCallback17(
     (trackId) => engineToDbIdRef.current.get(trackId) ?? trackId,
     []
   );
-  const updateTrack = useCallback16(
+  const updateTrack = useCallback17(
     (trackId, patch) => {
       setTracks(
         (prev) => prev.map(
@@ -7378,18 +7544,18 @@ function useGeneratorPanelCore({
     },
     []
   );
-  const markEditLoaded = useCallback16((trackId) => {
+  const markEditLoaded = useCallback17((trackId) => {
     editLoadStartedRef.current.add(trackId);
   }, []);
   const tracksRef = useRef19(tracks);
-  useEffect18(() => {
+  useEffect19(() => {
     tracksRef.current = tracks;
   }, [tracks]);
   const resolvedGenericGroupsRef = useRef19(resolvedGenericGroups);
-  useEffect18(() => {
+  useEffect19(() => {
     resolvedGenericGroupsRef.current = resolvedGenericGroups;
   }, [resolvedGenericGroups]);
-  const makeServices = useCallback16(() => {
+  const makeServices = useCallback17(() => {
     return {
       host,
       activeSceneId,
@@ -7408,7 +7574,7 @@ function useGeneratorPanelCore({
       resolvedGroups: (metaKey) => resolvedGenericGroupsRef.current[metaKey]?.resolved ?? []
     };
   }, [host, activeSceneId, updateTrack, loadTracks, soundHistory, engineToDbId, markEditLoaded, identity, adapter]);
-  const handleGenerate = useCallback16(
+  const handleGenerate = useCallback17(
     async (trackId) => {
       const track = tracks.find((t) => t.handle.id === trackId);
       if (!track || !track.prompt.trim()) return;
@@ -7435,7 +7601,7 @@ function useGeneratorPanelCore({
     },
     [host, adapter, tracks, isAuthenticated, makeServices]
   );
-  const handleMuteToggle = useCallback16(
+  const handleMuteToggle = useCallback17(
     (trackId) => {
       const track = tracks.find((t) => t.handle.id === trackId);
       if (!track) return;
@@ -7455,7 +7621,7 @@ function useGeneratorPanelCore({
     },
     [host, tracks]
   );
-  const handleSoloToggle = useCallback16(
+  const handleSoloToggle = useCallback17(
     (trackId) => {
       const track = tracks.find((t) => t.handle.id === trackId);
       if (!track) return;
@@ -7475,7 +7641,7 @@ function useGeneratorPanelCore({
     },
     [host, tracks]
   );
-  const handleVolumeChange = useCallback16(
+  const handleVolumeChange = useCallback17(
     (trackId, volume) => {
       setTracks(
         (prev) => prev.map((t) => t.handle.id === trackId ? { ...t, runtimeState: { ...t.runtimeState, volume } } : t)
@@ -7485,7 +7651,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handlePanChange = useCallback16(
+  const handlePanChange = useCallback17(
     (trackId, pan) => {
       setTracks(
         (prev) => prev.map((t) => t.handle.id === trackId ? { ...t, runtimeState: { ...t.runtimeState, pan } } : t)
@@ -7495,7 +7661,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handleShuffle = useCallback16(
+  const handleShuffle = useCallback17(
     async (trackId) => {
       const track = tracks.find((t) => t.handle.id === trackId);
       if (!track) return;
@@ -7537,7 +7703,7 @@ function useGeneratorPanelCore({
     },
     [host, adapter, tracks, soundHistory, logTag]
   );
-  const handleCopy = useCallback16(
+  const handleCopy = useCallback17(
     async (trackId) => {
       try {
         const newHandle = await host.duplicateTrack(trackId);
@@ -7550,7 +7716,7 @@ function useGeneratorPanelCore({
     },
     [host, loadTracks]
   );
-  const handleFxToggle = useCallback16(
+  const handleFxToggle = useCallback17(
     (trackId, category, enabled) => {
       setTracks(
         (prev) => prev.map(
@@ -7573,7 +7739,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handleFxPresetChange = useCallback16(
+  const handleFxPresetChange = useCallback17(
     (trackId, category, presetIndex) => {
       setTracks(
         (prev) => prev.map(
@@ -7599,7 +7765,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handleFxDryWetChange = useCallback16(
+  const handleFxDryWetChange = useCallback17(
     (trackId, category, value) => {
       setTracks(
         (prev) => prev.map(
@@ -7611,7 +7777,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const toggleFxDrawer = useCallback16(
+  const toggleFxDrawer = useCallback17(
     (trackId) => {
       setTracks(
         (prev) => prev.map((t) => {
@@ -7633,7 +7799,7 @@ function useGeneratorPanelCore({
     },
     [host, tracks]
   );
-  const loadEditNotes = useCallback16(
+  const loadEditNotes = useCallback17(
     async (trackId) => {
       try {
         const mc = await host.getMusicalContext();
@@ -7651,7 +7817,7 @@ function useGeneratorPanelCore({
     },
     [host, logTag]
   );
-  const handleNotesChange = useCallback16(
+  const handleNotesChange = useCallback17(
     (trackId, notes) => {
       setTracks((prev) => prev.map((t) => t.handle.id === trackId ? { ...t, editNotes: notes } : t));
       const key = `edit:${trackId}`;
@@ -7681,7 +7847,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handleTabChange = useCallback16(
+  const handleTabChange = useCallback17(
     (trackId, tab) => {
       setTracks((prev) => prev.map((t) => t.handle.id === trackId ? { ...t, drawerOpen: true, drawerTab: tab } : t));
       if (tab === "fx") {
@@ -7706,10 +7872,10 @@ function useGeneratorPanelCore({
     },
     [host, availableInstruments.length, instrumentsLoading, loadEditNotes]
   );
-  const handleProgressChange = useCallback16((trackId, pct) => {
+  const handleProgressChange = useCallback17((trackId, pct) => {
     setTracks((prev) => prev.map((t) => t.handle.id === trackId ? { ...t, generationProgress: pct } : t));
   }, []);
-  const handleToggleDrawer = useCallback16((trackId) => {
+  const handleToggleDrawer = useCallback17((trackId) => {
     setTracks(
       (prev) => prev.map((t) => {
         if (t.handle.id !== trackId) return t;
@@ -7718,7 +7884,7 @@ function useGeneratorPanelCore({
       })
     );
   }, []);
-  const handleInstrumentSelect = useCallback16(
+  const handleInstrumentSelect = useCallback17(
     async (trackId, pluginId) => {
       const isDefaultInstrument = pluginId === (identity.defaultInstrumentPluginId ?? "Surge XT");
       if (isDefaultInstrument) {
@@ -7771,7 +7937,7 @@ function useGeneratorPanelCore({
     },
     [host, identity.defaultInstrumentPluginId, logTag]
   );
-  const handleShowEditor = useCallback16(
+  const handleShowEditor = useCallback17(
     async (trackId) => {
       try {
         await host.showInstrumentEditor(trackId);
@@ -7782,12 +7948,12 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const handleBackToInstruments = useCallback16((trackId) => {
+  const handleBackToInstruments = useCallback17((trackId) => {
     setTracks(
       (prev) => prev.map((t) => t.handle.id === trackId ? { ...t, editorStage: false } : t)
     );
   }, []);
-  const handleRefreshInstruments = useCallback16(() => {
+  const handleRefreshInstruments = useCallback17(() => {
     setInstrumentsLoading(true);
     host.getAvailableInstruments().then((instruments) => {
       setAvailableInstruments(instruments);
@@ -7796,7 +7962,7 @@ function useGeneratorPanelCore({
       setInstrumentsLoading(false);
     });
   }, [host]);
-  const onAuditionNote = useCallback16(
+  const onAuditionNote = useCallback17(
     (trackId, pitch, velocity, ms) => {
       void host.auditionNote(trackId, pitch, velocity, ms);
     },
@@ -7849,7 +8015,7 @@ function useGeneratorPanelCore({
     resolvedCrossfadePairs,
     resolvedFades
   });
-  const setGroupMute = useCallback16(
+  const setGroupMute = useCallback17(
     (trackIds, muted) => {
       for (const id of trackIds) {
         setTracks(
@@ -7861,7 +8027,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const setGroupSolo = useCallback16(
+  const setGroupSolo = useCallback17(
     (trackIds, solo) => {
       for (const id of trackIds) {
         setTracks(
@@ -7873,7 +8039,7 @@ function useGeneratorPanelCore({
     },
     [host]
   );
-  const deleteGroup = useCallback16(
+  const deleteGroup = useCallback17(
     async (members, cleanupKeySuffixes) => {
       for (const member of members) {
         try {
@@ -8009,8 +8175,8 @@ function useGeneratorPanelCore({
 }
 
 // src/panel-core/GeneratorPanelShell.tsx
-import React23, { useCallback as useCallback17 } from "react";
-import { Fragment as Fragment7, jsx as jsx27, jsxs as jsxs21 } from "react/jsx-runtime";
+import React23, { useCallback as useCallback18 } from "react";
+import { Fragment as Fragment7, jsx as jsx28, jsxs as jsxs22 } from "react/jsx-runtime";
 function GeneratorPanelShell({ core, slots }) {
   const {
     ui,
@@ -8066,7 +8232,7 @@ function GeneratorPanelShell({ core, slots }) {
   const { host, activeSceneId, isAuthenticated, sceneContext, onSelectScene, onOpenContract } = ui;
   const panelBus = usePanelBus(host, activeSceneId);
   const { identity, features } = adapter;
-  const buildRowProps = useCallback17(
+  const buildRowProps = useCallback18(
     (track, drag) => {
       const id = track.handle.id;
       const pickerProps = features.instrumentPicker ? {
@@ -8166,12 +8332,12 @@ function GeneratorPanelShell({ core, slots }) {
     ]
   );
   if (!activeSceneId) {
-    return /* @__PURE__ */ jsx27(
+    return /* @__PURE__ */ jsx28(
       "div",
       {
         "data-testid": `no-scene-placeholder-${identity.familyKey}`,
         className: "flex items-center justify-center py-8",
-        children: /* @__PURE__ */ jsx27(
+        children: /* @__PURE__ */ jsx28(
           "button",
           {
             onClick: () => onSelectScene?.(),
@@ -8183,12 +8349,12 @@ function GeneratorPanelShell({ core, slots }) {
     );
   }
   if (!sceneContext?.hasContract) {
-    return /* @__PURE__ */ jsx27(
+    return /* @__PURE__ */ jsx28(
       "div",
       {
         "data-testid": `no-contract-placeholder-${identity.familyKey}`,
         className: "flex items-center justify-center py-8",
-        children: /* @__PURE__ */ jsx27(
+        children: /* @__PURE__ */ jsx28(
           "button",
           {
             onClick: () => onOpenContract?.(),
@@ -8200,7 +8366,7 @@ function GeneratorPanelShell({ core, slots }) {
     );
   }
   if (features.bulkComposePlaceholders && isComposing) {
-    return /* @__PURE__ */ jsx27("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2", children: /* @__PURE__ */ jsx27(SorceryProgressBar, { isLoading: true, statusText: "COMPOSING...", heightClass: "h-10" }) });
+    return /* @__PURE__ */ jsx28("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2", children: /* @__PURE__ */ jsx28(SorceryProgressBar, { isLoading: true, statusText: "COMPOSING...", heightClass: "h-10" }) });
   }
   const activePlaceholders = features.bulkComposePlaceholders ? placeholders : [];
   if (activePlaceholders.length > 0) {
@@ -8211,18 +8377,18 @@ function GeneratorPanelShell({ core, slots }) {
         tracksByDbId.set(t.handle.id, t);
       }
     }
-    return /* @__PURE__ */ jsx27("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2 space-y-2", children: activePlaceholders.map((ph) => {
+    return /* @__PURE__ */ jsx28("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2 space-y-2", children: activePlaceholders.map((ph) => {
       const loadedTrack = ph.status === "completed" ? tracksByDbId.get(ph.id) : void 0;
       if (loadedTrack) {
-        return /* @__PURE__ */ jsx27(TrackRow, { ...buildRowProps(loadedTrack) }, ph.id);
+        return /* @__PURE__ */ jsx28(TrackRow, { ...buildRowProps(loadedTrack) }, ph.id);
       }
-      return /* @__PURE__ */ jsx27(
+      return /* @__PURE__ */ jsx28(
         "div",
         {
           "data-testid": "bulk-placeholder-track",
           className: "relative rounded-sm border w-full overflow-hidden border-sas-border bg-sas-panel-alt",
           style: { borderLeftColor: identity.placeholderAccentColor, borderLeftWidth: "3px" },
-          children: /* @__PURE__ */ jsx27(SorceryProgressBar, { isLoading: true, statusText: "CONJURING MIDI...", heightClass: "h-10" })
+          children: /* @__PURE__ */ jsx28(SorceryProgressBar, { isLoading: true, statusText: "CONJURING MIDI...", heightClass: "h-10" })
         },
         ph.id
       );
@@ -8234,13 +8400,13 @@ function GeneratorPanelShell({ core, slots }) {
     supportsMeters,
     levels: supportsMeters ? trackLevels : void 0,
     handlers,
-    renderDefaultTrackRow: (track, overrides, drag) => /* @__PURE__ */ jsx27(TrackRow, { ...{ ...buildRowProps(track, drag), ...overrides ?? {} } }, track.handle.id),
+    renderDefaultTrackRow: (track, overrides, drag) => /* @__PURE__ */ jsx28(TrackRow, { ...{ ...buildRowProps(track, drag), ...overrides ?? {} } }, track.handle.id),
     setGroupMute,
     setGroupSolo,
     deleteGroup
   };
-  return /* @__PURE__ */ jsxs21("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2 space-y-2", children: [
-    features.importTracks && host.listImportableTracks && /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsxs22("div", { "data-testid": `${identity.familyKey}-section`, className: "p-2 space-y-2", children: [
+    features.importTracks && host.listImportableTracks && /* @__PURE__ */ jsx28(
       ImportTrackModal,
       {
         host,
@@ -8253,7 +8419,7 @@ function GeneratorPanelShell({ core, slots }) {
         testIdPrefix: `${identity.familyKey}-import`
       }
     ),
-    features.importTracks && host.listImportableTracks && host.getTrackSound && /* @__PURE__ */ jsx27(
+    features.importTracks && host.listImportableTracks && host.getTrackSound && /* @__PURE__ */ jsx28(
       ImportTrackModal,
       {
         host,
@@ -8268,7 +8434,7 @@ function GeneratorPanelShell({ core, slots }) {
       }
     ),
     slots?.modals,
-    canCrossfade && xfFromId && xfToId && /* @__PURE__ */ jsx27("div", { className: designerView ? "contents" : "hidden", children: /* @__PURE__ */ jsx27(
+    canCrossfade && xfFromId && xfToId && /* @__PURE__ */ jsx28("div", { className: designerView ? "contents" : "hidden", children: /* @__PURE__ */ jsx28(
       TransitionDesigner,
       {
         host,
@@ -8287,8 +8453,8 @@ function GeneratorPanelShell({ core, slots }) {
         testIdPrefix: `${identity.familyKey}-transition-designer`
       }
     ) }),
-    !(designerView && canCrossfade) && (isLoadingTracks ? /* @__PURE__ */ jsx27("div", { className: "text-sas-muted text-xs text-center py-4", children: "Loading tracks..." }) : /* @__PURE__ */ jsxs21(Fragment7, { children: [
-      panelBus.supported && panelBus.bus && /* @__PURE__ */ jsx27(
+    !(designerView && canCrossfade) && (isLoadingTracks ? /* @__PURE__ */ jsx28("div", { className: "text-sas-muted text-xs text-center py-4", children: "Loading tracks..." }) : /* @__PURE__ */ jsxs22(Fragment7, { children: [
+      panelBus.supported && panelBus.bus && /* @__PURE__ */ jsx28(
         PanelMasterStrip,
         {
           bus: panelBus.bus,
@@ -8309,7 +8475,7 @@ function GeneratorPanelShell({ core, slots }) {
         }
       ),
       slots?.beforeRows,
-      resolvedCrossfadePairs.map((pair) => /* @__PURE__ */ jsx27(
+      resolvedCrossfadePairs.map((pair) => /* @__PURE__ */ jsx28(
         CrossfadeTrackRow,
         {
           accentColor: identity.transitionAccentColor,
@@ -8346,7 +8512,7 @@ function GeneratorPanelShell({ core, slots }) {
         },
         pair.groupId
       )),
-      resolvedSingleFades.map((fade) => /* @__PURE__ */ jsx27(
+      resolvedSingleFades.map((fade) => /* @__PURE__ */ jsx28(
         FadeTrackRow,
         {
           accentColor: identity.transitionAccentColor,
@@ -8371,7 +8537,7 @@ function GeneratorPanelShell({ core, slots }) {
         },
         fade.dbId
       )),
-      resolvedGroupFades.map((group) => /* @__PURE__ */ jsx27(
+      resolvedGroupFades.map((group) => /* @__PURE__ */ jsx28(
         GroupFadeTrackRow,
         {
           accentColor: identity.transitionAccentColor,
@@ -8407,20 +8573,20 @@ function GeneratorPanelShell({ core, slots }) {
         group.groupId
       )),
       (adapter.groupExtensions ?? []).flatMap(
-        (ext) => (resolvedGenericGroups[ext.metaKey]?.resolved ?? []).filter((group) => !group.members.every((m) => fadeMemberDbIds.has(m.dbId))).map((group) => /* @__PURE__ */ jsx27(React23.Fragment, { children: ext.renderGroup(group, groupCtx) }, `${ext.metaKey}:${group.groupId}`))
+        (ext) => (resolvedGenericGroups[ext.metaKey]?.resolved ?? []).filter((group) => !group.members.every((m) => fadeMemberDbIds.has(m.dbId))).map((group) => /* @__PURE__ */ jsx28(React23.Fragment, { children: ext.renderGroup(group, groupCtx) }, `${ext.metaKey}:${group.groupId}`))
       ),
       tracks.map((track, index) => {
         if (crossfadeMemberDbIds.has(track.handle.dbId) || fadeMemberDbIds.has(track.handle.dbId) || genericGroupMemberDbIds.has(track.handle.dbId)) {
           return null;
         }
-        return /* @__PURE__ */ jsx27(TrackRow, { ...buildRowProps(track, reorder.dragPropsFor(index)) }, track.handle.id);
+        return /* @__PURE__ */ jsx28(TrackRow, { ...buildRowProps(track, reorder.dragPropsFor(index)) }, track.handle.id);
       }),
       slots?.afterRows
     ] })),
     features.exportMidi && !designerView && !isLoadingTracks && tracks.length > 0 && (() => {
       const hasAnyMidi = tracks.some((t) => t.hasMidi);
       const exportDisabled = isExportingMidi || !hasAnyMidi;
-      return /* @__PURE__ */ jsx27("div", { className: "pt-2", children: /* @__PURE__ */ jsx27(
+      return /* @__PURE__ */ jsx28("div", { className: "pt-2", children: /* @__PURE__ */ jsx28(
         "button",
         {
           "data-testid": "export-midi-tracks-button",
@@ -8910,7 +9076,7 @@ Your previous ensemble had these problems \u2014 fix them while keeping everythi
 }
 
 // src/constants/sdk-version.ts
-var PLUGIN_SDK_VERSION = "2.43.0";
+var PLUGIN_SDK_VERSION = "2.46.0";
 
 // src/utils/format-concurrent-tracks.ts
 function formatConcurrentTracks(ctx) {
@@ -9118,6 +9284,7 @@ export {
   TRANSITION_DESIGNER_DRAFT_KEY,
   TrackDrawer,
   TrackExternalFxSection,
+  TrackFreezeSection,
   TrackMeterStrip,
   TrackRow,
   TransitionDesigner,
@@ -9188,6 +9355,7 @@ export {
   useSceneState,
   useSoundHistory,
   useTrackExternalFx,
+  useTrackFreeze,
   useTrackLevel,
   useTrackLevels,
   useTrackMeter,