@recombine-ai/bosun 0.18.0 → 0.20.0

package/build/server/chunks/_page.svelte-Yjru58jZ.js

@@ -1,1732 +0,0 @@
-import { k as escape_html, l as derived, p as ensure_array_like, y as attr_style, o as attr_class, t as clsx } from './index-Do08hKbr.js';
-import { o as onDestroy } from './index-server-CHFC9Apw.js';
-import { p as page } from './index2-B_Xf0ugP.js';
-import { B as Button } from './Button-Huqrc2wY.js';
-import { g as getTelescopeSourceIdFromUrl, b as getPersistedTelescopeSourceId, T as TelescopeClient } from './source-selection-1aBuBpkL.js';
-import { i as isMainStepName } from './steps-DzZCg39h.js';
-import { b as buildResponseLatencySpans, f as findResponseLatencyUserTurn, R as RESPONSE_LATENCY_THRESHOLD_MS } from './latency--f3JYIRg.js';
-import { g as getConversationViewMemory, c as conversationViewMemoryKey } from './conversation-view-memory-CMgSQUdu.js';
-import './client-D1Y2ZQJN.js';
-import './state.svelte-B2OaeWMp.js';
-import './root-DoSdrdfw.js';
-import './index3-C9gC86lU.js';
-import 'zod';
-
-function _page($$renderer, $$props) {
-  $$renderer.component(($$renderer2) => {
-    const SPEECH_BUBBLE_HEIGHT_PX = 30;
-    const TIMELINE_RULER_HEIGHT_PX = 32;
-    const TIMELINE_ROW_HEIGHT_PX = SPEECH_BUBBLE_HEIGHT_PX;
-    const TIMELINE_ROW_GAP_PX = 5;
-    const WAVEFORM_ROW_HEIGHT_PX = 160;
-    const SPEECH_BUBBLE_VERTICAL_GAP_PX = TIMELINE_ROW_GAP_PX;
-    const SPEECH_BUBBLE_LEVEL_HEIGHT_PX = SPEECH_BUBBLE_HEIGHT_PX + SPEECH_BUBBLE_VERTICAL_GAP_PX;
-    const SPEECH_BUBBLE_AGENT_PLAYBACK_MATCH_WINDOW_MS = 3e4;
-    const GUIDE_ROW_LABELS = /* @__PURE__ */ new Set(["VAD", "Playback"]);
-    const client = new TelescopeClient(fetch);
-    const BOSUN_COLORS = {
-      blue: "#569cd6",
-      green: "#93FF6D",
-      greenDark: "#00B58A",
-      orange: "#ce9178",
-      purple: "#81147D",
-      red: "#FF6666",
-      gray: "#767676"
-    };
-    const ROW_DEFS = [
-      {
-        label: "VAD",
-        eventTypes: ["vad.activated", "vad.deactivated"]
-      },
-      {
-        label: "STT",
-        eventTypes: [
-          "stt.started",
-          "stt.interim",
-          "stt.final",
-          "stt.final_transcript"
-        ]
-      },
-      { label: "Trigger", eventTypes: ["speech.created"] },
-      {
-        label: "Reply Pending",
-        eventTypes: ["reply.pending.started", "reply.pending.completed"]
-      },
-      {
-        label: "LLM Transport",
-        eventTypes: [
-          "llm.connect_tcp.started",
-          "llm.connect_tcp.completed",
-          "llm.connect_tcp.failed",
-          "llm.start_tls.started",
-          "llm.start_tls.completed",
-          "llm.start_tls.failed"
-        ]
-      },
-      {
-        label: "LLM Wait",
-        eventTypes: ["llm.wait.started", "llm.requested", "llm.wait.completed"]
-      },
-      {
-        label: "LLM Stream",
-        eventTypes: [
-          "llm.stream.started",
-          "llm.first_token",
-          "llm.completed",
-          "llm.stream.completed"
-        ]
-      },
-      {
-        label: "TTS Text",
-        eventTypes: ["tts.text.first_sent", "tts.text.completed"]
-      },
-      {
-        label: "Provider",
-        eventTypes: [
-          "tts.provider.started",
-          "tts.audio.first_received",
-          "tts.audio.last_received",
-          "tts.provider.completed"
-        ]
-      },
-      {
-        label: "Decode",
-        eventTypes: ["tts.decode.started", "tts.decode.completed"]
-      },
-      {
-        label: "Output Queue",
-        eventTypes: ["audio.output.wait.started", "audio.output.wait.completed"]
-      },
-      {
-        label: "Playback",
-        eventTypes: [
-          "audio.playback.started",
-          "audio.playback.stopped",
-          "audio.playback.ended"
-        ]
-      },
-      { label: "Response Latency" },
-      {
-        label: "Interruptions",
-        eventTypes: ["interruption.detected", "audio.playback.interrupted"]
-      },
-      { label: "Other" }
-    ];
-    const TIMELINE_ROW_LABELS = new Set(ROW_DEFS.map((row) => row.label));
-    const COLOR_BY_KEY = {
-      call: tintHex(BOSUN_COLORS.gray, 0.2),
-      vad: tintHex(BOSUN_COLORS.purple, 0.35),
-      stt: tintHex(BOSUN_COLORS.purple, 0.2),
-      trigger: BOSUN_COLORS.greenDark,
-      "response.latency.ok": BOSUN_COLORS.green,
-      "response.latency.high": BOSUN_COLORS.red,
-      "reply.pending": tintHex(BOSUN_COLORS.greenDark, 0.18),
-      "llm.transport": tintHex(BOSUN_COLORS.blue, 0.18),
-      "llm.wait": tintHex(BOSUN_COLORS.blue, -0.25),
-      "llm.stream": BOSUN_COLORS.blue,
-      "tts.text": BOSUN_COLORS.orange,
-      "tts.provider.lifecycle": tintHex(BOSUN_COLORS.purple, -0.18),
-      "tts.provider": tintHex(BOSUN_COLORS.purple, 0.12),
-      "tts.decode": tintHex(BOSUN_COLORS.orange, -0.12),
-      "audio.output.wait": BOSUN_COLORS.orange,
-      playback: tintHex(BOSUN_COLORS.greenDark, -0.08),
-      interruption: BOSUN_COLORS.orange,
-      other: BOSUN_COLORS.gray
-    };
-    const SPAN_RULES = [
-      {
-        startEventType: "reply.pending.started",
-        endEventType: "reply.pending.completed",
-        row: "Reply Pending",
-        colorKey: "reply.pending",
-        label: "Reply pending",
-        description: "Derived from adjacent reply-pending lifecycle events"
-      },
-      {
-        startEventType: "llm.connect_tcp.started",
-        endEventType: "llm.connect_tcp.completed",
-        row: "LLM Transport",
-        colorKey: "llm.transport",
-        label: "Connect TCP",
-        description: "Derived from adjacent TCP connect lifecycle events"
-      },
-      {
-        startEventType: "llm.start_tls.started",
-        endEventType: "llm.start_tls.completed",
-        row: "LLM Transport",
-        colorKey: "llm.transport",
-        label: "Start TLS",
-        description: "Derived from adjacent TLS lifecycle events"
-      },
-      {
-        startEventType: "llm.wait.started",
-        endEventType: "llm.wait.completed",
-        row: "LLM Wait",
-        colorKey: "llm.wait",
-        label: "LLM wait",
-        description: "Derived from adjacent LLM wait lifecycle events"
-      },
-      {
-        startEventType: "llm.stream.started",
-        endEventType: "llm.stream.completed",
-        row: "LLM Stream",
-        colorKey: "llm.stream",
-        label: "LLM stream",
-        description: "Derived from adjacent LLM stream lifecycle events"
-      },
-      {
-        startEventType: "tts.text.first_sent",
-        endEventType: "tts.text.completed",
-        row: "TTS Text",
-        colorKey: "tts.text",
-        label: "TTS text send",
-        description: "Derived from adjacent TTS text send and completion events"
-      },
-      {
-        startEventType: "tts.provider.started",
-        endEventType: "tts.audio.first_received",
-        row: "Provider",
-        colorKey: "tts.provider.lifecycle",
-        label: "Provider wait",
-        description: "Derived from adjacent provider start and first-audio events"
-      },
-      {
-        startEventType: "tts.audio.first_received",
-        endEventType: "tts.provider.completed",
-        row: "Provider",
-        colorKey: "tts.provider",
-        label: "Provider audio",
-        description: "Derived from adjacent provider first-audio and completion events"
-      },
-      {
-        startEventType: "tts.decode.started",
-        endEventType: "tts.decode.completed",
-        row: "Decode",
-        colorKey: "tts.decode",
-        label: "Decode",
-        description: "Derived from adjacent local decode lifecycle events"
-      },
-      {
-        startEventType: "audio.output.wait.started",
-        endEventType: "audio.output.wait.completed",
-        row: "Output Queue",
-        colorKey: "audio.output.wait",
-        label: "Output queue",
-        description: "Derived from adjacent audio-output wait lifecycle events"
-      },
-      {
-        startEventType: "audio.playback.started",
-        endEventType: "audio.playback.stopped",
-        row: "Playback",
-        colorKey: "playback",
-        label: "Playback",
-        description: "Derived from adjacent playback start and playback stop events"
-      }
-    ];
-    const SPAN_RULE_BY_START = new Map(SPAN_RULES.map((rule) => [rule.startEventType, rule]));
-    function emptyRecordingResponse() {
-      return {
-        exists: false,
-        audioUrl: null,
-        fileName: null,
-        mimeType: null,
-        size: null,
-        uploadedAt: null,
-        alignmentOffsetMs: 0
-      };
-    }
-    const viewMemory = getConversationViewMemory();
-    const initialSourceId = getTelescopeSourceIdFromUrl(page.url) ?? getPersistedTelescopeSourceId() ?? "";
-    const initialConversationId = page.params.conversationId ?? "";
-    const initialMemoryKey = conversationViewMemoryKey(initialConversationId, initialSourceId);
-    const initialMemory = viewMemory.latency.get(initialMemoryKey);
-    client.setSourceId(initialSourceId || void 0);
-    let sourceId = initialSourceId;
-    let conversation = initialMemory?.conversation ?? null;
-    let traces = initialMemory?.traces ?? [];
-    let conversationTraces = initialMemory?.conversationTraces ?? [];
-    let dataLoaded = initialMemory?.dataLoaded ?? false;
-    let error = initialMemory?.error ?? null;
-    let recording = initialMemory?.recording ?? emptyRecordingResponse();
-    let recordingLoaded = initialMemory?.recordingLoaded ?? false;
-    let recordingError = initialMemory?.recordingError ?? null;
-    let uploadInFlight = false;
-    let waveform = initialMemory?.waveform ?? null;
-    let waveformError = initialMemory?.waveformError ?? null;
-    let playbackPositionMs = initialMemory?.playbackPositionMs ?? 0;
-    let playbackPlaying = false;
-    let playbackError = null;
-    let alignmentSaving = false;
-    let alignmentError = null;
-    let viewDirty = initialMemory?.viewDirty ?? false;
-    let viewportStartMs = null;
-    let viewportEndMs = null;
-    let scrollViewportEl = null;
-    let fileInputEl = null;
-    let humanSpeechBubbleReservedLevels = initialMemory?.humanSpeechBubbleReservedLevels ?? 1;
-    let copyLatencyState = "idle";
-    let loadKey = "";
-    let playbackFrame = 0;
-    let playbackAudioBuffer = initialMemory?.playbackAudioBuffer ?? null;
-    let playbackAudioContext = null;
-    let playbackSourceNode = null;
-    let playbackStartedAtMs = null;
-    let playbackStartedAtContextTime = null;
-    const conversationId = derived(() => page.params.conversationId);
-    function buildRecordingApiUrlFor(cid, nextSourceId) {
-      const params = new URLSearchParams();
-      if (nextSourceId) params.set("source", nextSourceId);
-      const search = params.toString();
-      return `/traces/api/latency/${encodeURIComponent(cid)}${search ? `?${search}` : ""}`;
-    }
-    const recordingApiUrl = derived(() => {
-      if (!conversationId()) return "";
-      return buildRecordingApiUrlFor(conversationId(), sourceId);
-    });
-    const timelineOriginMs = derived(() => {
-      let min = Number.POSITIVE_INFINITY;
-      for (const trace of traces) {
-        if (typeof trace.atMs !== "number" || !Number.isFinite(trace.atMs)) continue;
-        min = Math.min(min, trace.atMs);
-      }
-      if (Number.isFinite(min)) return min;
-      if (typeof conversation?.createdAt === "number" && Number.isFinite(conversation.createdAt)) {
-        return conversation.createdAt;
-      }
-      return Number.isFinite(min) ? min : 0;
-    });
-    const callSegments = derived(() => buildCallLatencySegments(traces));
-    const latencyTraceCount = derived(() => traces.length);
-    const aiResponses = derived(() => buildAiResponses());
-    const playbackSpeechMatches = derived(() => buildPlaybackSpeechMatches(callSegments()));
-    const timelineSegments = derived(() => {
-      const playbackSegments = callSegments().map((segment) => {
-        const speech = playbackSpeechMatches().get(segment.id);
-        if (!speech || segment.row !== "Playback" || segment.durationMs <= 0) return segment;
-        return {
-          ...segment,
-          speechText: speech.text,
-          speechFullText: speech.fullText,
-          speechTraceLabel: speech.traceLabel
-        };
-      });
-      return [
-        ...playbackSegments,
-        ...buildStandaloneWaitSegments(aiResponses())
-      ];
-    });
-    const timelineRows = derived(() => {
-      const grouped = /* @__PURE__ */ new Map();
-      for (const segment of timelineSegments()) {
-        const items = grouped.get(segment.row);
-        if (items) items.push(segment);
-        else grouped.set(segment.row, [segment]);
-      }
-      return [...ROW_DEFS].reverse().map((row) => ({ label: row.label, segments: grouped.get(row.label) ?? [] })).filter((row) => row.segments.length > 0);
-    });
-    const speechBubbleBaseLayouts = derived(() => buildSpeechBubbleBaseLayouts());
-    const humanSpeechBubbleLevelCount = derived(() => Math.max(humanSpeechBubbleReservedLevels, speechBubbleRoleLevelCount(speechBubbleBaseLayouts(), "human")));
-    const speechBubbles = derived(() => compactSpeechBubbleLayouts(speechBubbleBaseLayouts()));
-    const humanSpeechBubbleLaneHeightPx = derived(() => speechBubbleLaneHeightPx(humanSpeechBubbleLevelCount()));
-    const speechBubbleAreaHeightPx = derived(() => humanSpeechBubbleLaneHeightPx());
-    const timelineRowsHeightPx = derived(() => timelineRows().length * TIMELINE_ROW_HEIGHT_PX + Math.max(0, timelineRows().length - 1) * TIMELINE_ROW_GAP_PX);
-    const traceRowsToBubbleGapPx = derived(() => timelineRows().length > 0 ? TIMELINE_ROW_GAP_PX : 0);
-    const speechBubbleAreaTopPx = derived(() => TIMELINE_RULER_HEIGHT_PX + timelineRowsHeightPx() + traceRowsToBubbleGapPx());
-    const waveformRowVisible = derived(() => recording.exists);
-    const waveformRowHeightPx = derived(() => waveformRowVisible() ? TIMELINE_ROW_GAP_PX + WAVEFORM_ROW_HEIGHT_PX : 0);
-    const guideLines = derived(() => buildGuideLines(timelineRows()));
-    const recordingStartMs = derived(() => {
-      if (!waveform) return null;
-      return timelineOriginMs() + recording.alignmentOffsetMs;
-    });
-    const timelinePlotHeightPx = derived(() => TIMELINE_RULER_HEIGHT_PX + timelineRowsHeightPx() + traceRowsToBubbleGapPx() + speechBubbleAreaHeightPx() + waveformRowHeightPx());
-    const playbackAbsoluteMs = derived(() => {
-      if (recordingStartMs() == null) return null;
-      return recordingStartMs() + playbackPositionMs;
-    });
-    const playbackCursor = derived(() => {
-      const absoluteMs = playbackAbsoluteMs();
-      if (absoluteMs == null || viewportStartMs == null || viewportEndMs == null) return null;
-      const durationMs = viewportEndMs - viewportStartMs;
-      if (!Number.isFinite(durationMs) || durationMs <= 0) return null;
-      if (absoluteMs < viewportStartMs || absoluteMs > viewportEndMs) return null;
-      return {
-        leftPercent: clamp((absoluteMs - viewportStartMs) / durationMs * 100, 0, 100),
-        topPx: TIMELINE_RULER_HEIGHT_PX,
-        heightPx: Math.max(1, timelinePlotHeightPx() - TIMELINE_RULER_HEIGHT_PX)
-      };
-    });
-    const timelineOriginLine = derived(() => {
-      if (viewportStartMs == null || viewportEndMs == null) return null;
-      const durationMs = viewportEndMs - viewportStartMs;
-      if (!Number.isFinite(durationMs) || durationMs <= 0) return null;
-      if (timelineOriginMs() < viewportStartMs || timelineOriginMs() > viewportEndMs) return null;
-      return {
-        leftPercent: (timelineOriginMs() - viewportStartMs) / durationMs * 100,
-        topPx: TIMELINE_RULER_HEIGHT_PX,
-        heightPx: Math.max(1, timelinePlotHeightPx() - TIMELINE_RULER_HEIGHT_PX)
-      };
-    });
-    const contentExtent = derived(() => {
-      let min = Number.POSITIVE_INFINITY;
-      let max = Number.NEGATIVE_INFINITY;
-      for (const segment of callSegments()) {
-        min = Math.min(min, segment.start);
-        max = Math.max(max, segment.end);
-      }
-      if (waveform && recordingStartMs() != null) {
-        min = Math.min(min, recordingStartMs());
-        max = Math.max(max, recordingStartMs() + waveform.durationMs);
-      }
-      if (!Number.isFinite(min) || !Number.isFinite(max)) return null;
-      if (max <= min) max = min + 1;
-      return { min, max };
-    });
-    const conversationTraceExtent = derived(() => {
-      let min = Number.POSITIVE_INFINITY;
-      let max = Number.NEGATIVE_INFINITY;
-      for (const segment of callSegments()) {
-        if (!TIMELINE_ROW_LABELS.has(segment.row)) continue;
-        min = Math.min(min, segment.start);
-        max = Math.max(max, segment.end);
-      }
-      if (!Number.isFinite(min) || !Number.isFinite(max)) return null;
-      if (max <= min) max = min + 1;
-      return { min, max };
-    });
-    const viewportDurationMs = derived(() => {
-      if (viewportStartMs == null || viewportEndMs == null) return null;
-      const duration = viewportEndMs - viewportStartMs;
-      return duration > 0 ? duration : null;
-    });
-    const visibleTicks = derived(() => {
-      if (viewportStartMs == null || viewportEndMs == null) return [];
-      return buildTicks(viewportStartMs, viewportEndMs, timelineOriginMs());
-    });
-    function saveViewMemory(key = loadKey) {
-      if (!key) return;
-      const previous = viewMemory.latency.get(key);
-      const memory = {
-        conversation,
-        traces,
-        conversationTraces,
-        dataLoaded,
-        error,
-        recording,
-        recordingLoaded,
-        recordingError,
-        waveform,
-        waveformError,
-        playbackAudioBuffer,
-        playbackPositionMs,
-        viewportStartMs,
-        viewportEndMs,
-        viewportOriginMs: timelineOriginMs(),
-        viewDirty,
-        humanSpeechBubbleReservedLevels,
-        scrollTop: previous?.scrollTop ?? scrollViewportEl?.scrollTop ?? 0,
-        scrollLeft: previous?.scrollLeft ?? scrollViewportEl?.scrollLeft ?? 0
-      };
-      viewMemory.latency.set(key, memory);
-      const cid = conversationId();
-      const currentSourceId = getTelescopeSourceIdFromUrl(page.url) ?? getPersistedTelescopeSourceId() ?? "";
-      if (cid && currentSourceId && key === conversationViewMemoryKey(cid, "")) {
-        viewMemory.latency.set(conversationViewMemoryKey(cid, currentSourceId), memory);
-      }
-    }
-    onDestroy(() => {
-      saveViewMemory();
-      stopPlayback(false);
-      void closePlaybackAudioContext();
-    });
-    function normalizeNonEmptyString(value) {
-      if (typeof value !== "string") return null;
-      const trimmed = value.trim();
-      return trimmed ? trimmed : null;
-    }
-    function clampByte(value) {
-      return Math.max(0, Math.min(255, Math.round(value)));
-    }
-    function clamp(value, min, max) {
-      return Math.min(max, Math.max(min, value));
-    }
-    function tintHex(hex, amount) {
-      const raw = (hex ?? "").trim().replace(/^#/, "");
-      const expanded = raw.length === 3 ? raw.split("").map((part) => `${part}${part}`).join("") : raw;
-      if (expanded.length !== 6 || !/^[0-9a-fA-F]+$/.test(expanded)) return hex;
-      const r = parseInt(expanded.slice(0, 2), 16);
-      const g = parseInt(expanded.slice(2, 4), 16);
-      const b = parseInt(expanded.slice(4, 6), 16);
-      const t = Math.abs(Math.max(-1, Math.min(1, amount)));
-      const target = amount >= 0 ? 255 : 0;
-      return `#${clampByte(r + (target - r) * t).toString(16).padStart(2, "0")}${clampByte(g + (target - g) * t).toString(16).padStart(2, "0")}${clampByte(b + (target - b) * t).toString(16).padStart(2, "0")}`;
-    }
-    function fmtSignedMs(value) {
-      if (value == null || !Number.isFinite(value)) return "0 ms";
-      const rounded = Math.round(value);
-      if (rounded === 0) return "0 ms";
-      return `${rounded > 0 ? "+" : ""}${rounded} ms`;
-    }
-    function formatRelativeTime(offsetMs) {
-      if (!Number.isFinite(offsetMs)) return "—";
-      const sign = offsetMs < 0 ? "-" : "";
-      const abs = Math.abs(offsetMs);
-      if (abs < 1e4) return `${sign}${(abs / 1e3).toFixed(1)}s`;
-      if (abs < 6e4) return `${sign}${(abs / 1e3).toFixed(2)}s`;
-      const totalSeconds = abs / 1e3;
-      const minutes = Math.floor(totalSeconds / 60);
-      const seconds = totalSeconds - minutes * 60;
-      return `${sign}${minutes}:${seconds.toFixed(1).padStart(4, "0")}`;
-    }
-    function safeJson(value) {
-      try {
-        return JSON.stringify(value ?? null, null, 2);
-      } catch {
-        return String(value);
-      }
-    }
-    async function copyLatencyStream() {
-      try {
-        await navigator.clipboard.writeText(safeJson(traces));
-        copyLatencyState = "ok";
-        window.setTimeout(
-          () => {
-            copyLatencyState = "idle";
-          },
-          2e3
-        );
-      } catch (reason) {
-        console.error("Failed to copy latency stream", reason);
-        copyLatencyState = "error";
-        window.setTimeout(
-          () => {
-            copyLatencyState = "idle";
-          },
-          3e3
-        );
-      }
-    }
-    function describeTrace(trace) {
-      const time = typeof trace.createdAt === "number" && Number.isFinite(trace.createdAt) ? new Date(trace.createdAt).toLocaleTimeString() : "unknown time";
-      if (trace.traceType === "LATENCY") {
-        return `Latency • #${trace.seq ?? "?"} • ${trace.eventType ?? "unknown"} • ${time}`;
-      }
-      if (trace.traceType === "CONVERSATIONAL") {
-        return `Conversational • ${trace.eventName} • ${time}`;
-      }
-      if (trace.traceType === "STEP") {
-        return `Step • ${trace.name ?? "unknown"} • ${time}`;
-      }
-      return `API • ${trace.operationName} • ${time}`;
-    }
-    function latencyPayload(trace) {
-      const payload = trace.payload;
-      return payload && typeof payload === "object" && !Array.isArray(payload) ? payload : {};
-    }
-    function latencyRow(eventType) {
-      if (eventType === "call.started" || eventType === "call.ended") return "Call";
-      if (eventType.startsWith("vad.")) return "VAD";
-      if (eventType.startsWith("stt.")) return "STT";
-      if (eventType === "speech.created") return "Trigger";
-      if (eventType.startsWith("reply.pending.")) return "Reply Pending";
-      if (eventType.startsWith("llm.connect_tcp.") || eventType.startsWith("llm.start_tls.")) {
-        return "LLM Transport";
-      }
-      if (eventType === "llm.requested" || eventType.startsWith("llm.wait.")) return "LLM Wait";
-      if (eventType === "llm.first_token" || eventType === "llm.completed" || eventType.startsWith("llm.stream.")) {
-        return "LLM Stream";
-      }
-      if (eventType.startsWith("tts.text.")) return "TTS Text";
-      if (eventType.startsWith("tts.provider.")) return "Provider";
-      if (eventType === "tts.audio.first_received" || eventType === "tts.audio.last_received") {
-        return "Provider";
-      }
-      if (eventType.startsWith("tts.decode.")) return "Decode";
-      if (eventType.startsWith("audio.output.wait.")) return "Output Queue";
-      if (eventType === "interruption.detected" || eventType === "audio.playback.interrupted") {
-        return "Interruptions";
-      }
-      if (eventType.startsWith("audio.playback.")) return "Playback";
-      return "Other";
-    }
-    function latencyColorKey(eventType) {
-      if (eventType === "call.started" || eventType === "call.ended") return "call";
-      if (eventType.startsWith("vad.")) return "vad";
-      if (eventType.startsWith("stt.")) return "stt";
-      if (eventType === "speech.created") return "trigger";
-      if (eventType.startsWith("reply.pending.")) return "reply.pending";
-      if (eventType.startsWith("llm.connect_tcp.") || eventType.startsWith("llm.start_tls.")) {
-        return "llm.transport";
-      }
-      if (eventType === "llm.requested" || eventType.startsWith("llm.wait.")) return "llm.wait";
-      if (eventType === "llm.first_token" || eventType === "llm.completed" || eventType.startsWith("llm.stream.")) {
-        return "llm.stream";
-      }
-      if (eventType.startsWith("tts.text.")) return "tts.text";
-      if (eventType.startsWith("tts.provider.")) return "tts.provider.lifecycle";
-      if (eventType === "tts.audio.first_received" || eventType === "tts.audio.last_received") {
-        return "tts.provider";
-      }
-      if (eventType.startsWith("tts.decode.")) return "tts.decode";
-      if (eventType.startsWith("audio.output.wait.")) return "audio.output.wait";
-      if (eventType === "interruption.detected" || eventType === "audio.playback.interrupted") {
-        return "interruption";
-      }
-      if (eventType.startsWith("audio.playback.")) return "playback";
-      return "other";
-    }
-    function latencyEventMarker(eventType) {
-      switch (eventType) {
-        case "vad.activated":
-        case "stt.started":
-          return "start";
-        case "vad.deactivated":
-        case "stt.final":
-        case "stt.final_transcript":
-          return "end";
-        default:
-          return null;
-      }
-    }
-    function latencyLabel(trace) {
-      switch (trace.eventType) {
-        case "call.started":
-          return "Call started";
-        case "call.ended":
-          return "Call ended";
-        case "vad.activated":
-          return "VAD activated";
-        case "vad.deactivated":
-          return "VAD deactivated";
-        case "stt.started":
-          return "STT start";
-        case "stt.interim":
-          return "STT interim";
-        case "stt.final":
-        case "stt.final_transcript":
-          return "STT final";
-        case "speech.created":
-          return "Speech created";
-        case "reply.pending.started":
-          return "Reply pending start";
-        case "reply.pending.completed":
-          return "Reply pending end";
-        case "llm.connect_tcp.started":
-          return "Connect TCP start";
-        case "llm.connect_tcp.completed":
-          return "Connect TCP end";
-        case "llm.connect_tcp.failed":
-          return "Connect TCP failed";
-        case "llm.start_tls.started":
-          return "TLS start";
-        case "llm.start_tls.completed":
-          return "TLS end";
-        case "llm.start_tls.failed":
-          return "TLS failed";
-        case "llm.wait.started":
-          return "LLM wait start";
-        case "llm.wait.completed":
-          return "LLM wait end";
-        case "llm.stream.started":
-          return "LLM stream start";
-        case "llm.stream.completed":
-          return "LLM stream end";
-        case "llm.requested":
-          return "LLM request";
-        case "llm.first_token":
-          return "LLM first token";
-        case "llm.completed":
-          return "LLM end";
-        case "tts.text.first_sent":
-          return "TTS first text";
-        case "tts.text.completed":
-          return "TTS text end";
-        case "tts.provider.started":
-          return "Provider start";
-        case "tts.provider.completed":
-          return "Provider end";
-        case "tts.audio.first_received":
-          return "Provider audio received";
-        case "tts.audio.last_received":
-          return "Provider audio end";
-        case "tts.decode.started":
-          return "Decode start";
-        case "tts.decode.completed":
-          return "Decode end";
-        case "audio.output.wait.started":
-          return "Output queue start";
-        case "audio.output.wait.completed":
-          return "Output queue end";
-        case "interruption.detected":
-          return "Interruption detected";
-        case "audio.playback.started":
-          return "Playback start";
-        case "audio.playback.stopped":
-          return "Playback stop";
-        case "audio.playback.ended":
-          return "Playback end";
-        case "audio.playback.interrupted":
-          return "Playback interrupted";
-        default:
-          return trace.eventType;
-      }
-    }
-    function latencyDescription(trace) {
-      const payload = latencyPayload(trace);
-      switch (trace.eventType) {
-        case "call.started":
-          return "Call-scoped latency stream started";
-        case "call.ended":
-          return "Call-scoped latency stream ended";
-        case "vad.activated":
-          return "Raw VAD activation event";
-        case "vad.deactivated":
-          return "Raw VAD deactivation event";
-        case "stt.started":
-          return "Speech-to-text detected speech start";
-        case "stt.interim":
-          return normalizeNonEmptyString(payload.originalType) === "preflight_transcript" ? "Speech-to-text preflight transcript" : "Speech-to-text interim transcript";
-        case "stt.final":
-        case "stt.final_transcript":
-          return "Speech-to-text final transcript";
-        case "speech.created":
-          return "LiveKit created a speech handle";
-        case "reply.pending.started":
-          return "Reply generation was committed, but downstream generation has not started yet";
-        case "reply.pending.completed":
-          return "Reply generation moved from pending into the LLM request phase";
-        case "llm.connect_tcp.started":
-          return "httpcore started opening a new TCP connection for the LLM request";
-        case "llm.connect_tcp.completed":
-          return "httpcore finished opening a new TCP connection for the LLM request";
-        case "llm.connect_tcp.failed":
-          return "httpcore failed while opening a new TCP connection for the LLM request";
-        case "llm.start_tls.started":
-          return "httpcore started TLS negotiation for the LLM request";
-        case "llm.start_tls.completed":
-          return "httpcore finished TLS negotiation for the LLM request";
-        case "llm.start_tls.failed":
-          return "httpcore failed during TLS negotiation for the LLM request";
-        case "llm.wait.started":
-          return "LLM request is in flight and waiting for the first token";
-        case "llm.wait.completed":
-          return "The LLM wait phase ended when the first token arrived";
-        case "llm.stream.started":
-          return "LLM streaming phase started";
-        case "llm.stream.completed":
-          return "LLM streaming phase ended";
-        case "llm.requested":
-          return "AnyVan received an LLM request";
-        case "llm.first_token":
-          return "First LLM token received";
-        case "llm.completed":
-          return "LLM streaming completed";
-        case "tts.text.first_sent":
-          return "First text chunk sent to the TTS provider";
-        case "tts.text.completed":
-          return "Last non-empty text chunk observed for this TTS stream";
-        case "tts.provider.started":
-          return "Provider lifecycle started when the first non-empty TTS text chunk was sent";
-        case "tts.provider.completed":
-          return "Provider lifecycle ended when the provider stream reported completion";
-        case "tts.audio.first_received":
-          return "First audio chunk received from the TTS provider";
-        case "tts.audio.last_received":
-          return "Last audio chunk received from the TTS provider";
-        case "tts.decode.started":
-          return "First provider audio bytes were handed into the local decode path";
-        case "tts.decode.completed":
-          return "The first decoded audio frame left the local decode path";
-        case "audio.output.wait.started":
-          return "The first local audio frame was handed to the LiveKit audio output";
-        case "audio.output.wait.completed":
-          return "The audio-output wait phase ended when low-level playback actually started";
-        case "interruption.detected":
-          return "User speech overlapped active playback; this does not guarantee playback stopped";
-        case "audio.playback.started":
-          return "First played audio frame";
-        case "audio.playback.stopped":
-          return "Playback lifecycle ended on the Playback row";
-        case "audio.playback.ended":
-          return "Audio playback finished normally";
-        case "audio.playback.interrupted":
-          return "Audio playback ended because the output buffer was interrupted";
-        default:
-          return null;
-      }
-    }
-    function latencyText(trace) {
-      const payload = latencyPayload(trace);
-      return normalizeNonEmptyString(payload.text);
-    }
-    function isFinalSttLatencyTrace(trace) {
-      return trace.eventType === "stt.final" || trace.eventType === "stt.final_transcript";
-    }
-    function bubbleText(value) {
-      const text = normalizeNonEmptyString(value);
-      if (!text) return null;
-      return text.replace(/\s+/g, " ").trim() || null;
-    }
-    function latencyTranscriptText(trace) {
-      const payload = latencyPayload(trace);
-      const text = bubbleText(payload.text) ?? bubbleText(payload.transcript) ?? bubbleText(payload.finalTranscript) ?? bubbleText(payload.final_transcript) ?? bubbleText(payload.message);
-      if (text) return text;
-      const alternatives = payload.alternatives;
-      if (Array.isArray(alternatives)) {
-        for (const alternative of alternatives) {
-          if (!alternative || typeof alternative !== "object") continue;
-          const alternativeText = bubbleText(alternative.text);
-          if (alternativeText) return alternativeText;
-        }
-      }
-      return null;
-    }
-    function isConversationalTrace(trace) {
-      return trace.traceType === "CONVERSATIONAL";
-    }
-    function isUserConversationalTrace(trace) {
-      return isConversationalTrace(trace) && trace.role.toLowerCase() === "user" && (trace.eventName === "received-message" || trace.eventName === "llm-handler-stream-requested");
-    }
-    function isAgentConversationalTrace(trace) {
-      return isConversationalTrace(trace) && (trace.eventName === "finished-main-streaming-step" || trace.eventName === "sent-message");
-    }
-    function conversationalTraceKey(trace) {
-      return normalizeNonEmptyString(trace.traceId) ?? `${trace.createdAt}:${trace.eventName}:${trace.content}`;
-    }
-    function callStartTime() {
-      for (const trace of traces.slice().sort(compareLatencyTraces)) {
-        if (trace.eventType === "call.started" && Number.isFinite(trace.atMs)) return trace.atMs;
-      }
-      return timelineOriginMs();
-    }
-    function findHumanBubbleStartTime(anchorTime, playbackSegments) {
-      const lastPlayback = playbackSegments.filter((segment) => segment.start <= anchorTime).sort((a, b) => b.start - a.start || b.end - a.end)[0];
-      if (!lastPlayback) return Math.min(callStartTime(), anchorTime);
-      if (lastPlayback.end <= anchorTime) return Math.min(lastPlayback.end, anchorTime);
-      return Math.min(lastPlayback.start, anchorTime);
-    }
-    function isWaitResponse(value) {
-      return /<WAIT\b[^>]*\/?\s*>/i.test(value);
-    }
-    function isMainStepResponse(trace) {
-      return trace.traceType === "STEP" && isMainStepName(trace.name) && normalizeNonEmptyString(trace.response) != null;
-    }
-    function responseTextWithoutTags(value) {
-      return value.replace(/<[^>]+>/g, " ").replace(/\s+/g, " ").trim();
-    }
-    function isEquivalentAiResponseText(a, b) {
-      if (a === b) return true;
-      const spokenA = responseTextWithoutTags(a);
-      const spokenB = responseTextWithoutTags(b);
-      return spokenA !== "" && spokenA === spokenB;
-    }
-    function responseTurnBounds(createdAt) {
-      let start = createdAt - SPEECH_BUBBLE_AGENT_PLAYBACK_MATCH_WINDOW_MS;
-      let end = createdAt + SPEECH_BUBBLE_AGENT_PLAYBACK_MATCH_WINDOW_MS;
-      for (const trace of conversationTraces) {
-        if (!isUserConversationalTrace(trace)) continue;
-        if (trace.createdAt <= createdAt) start = trace.createdAt;
-        else {
-          end = trace.createdAt;
-          break;
-        }
-      }
-      return { start, end };
-    }
-    function findStepResponseForAgentTrace(agentTrace, stepResponses, usedStepTraceIds) {
-      const bounds = responseTurnBounds(agentTrace.createdAt);
-      return stepResponses.filter((trace) => !usedStepTraceIds.has(traceKey(trace)) && trace.createdAt >= bounds.start && trace.createdAt < bounds.end).sort((a, b) => Math.abs(a.createdAt - agentTrace.createdAt) - Math.abs(b.createdAt - agentTrace.createdAt))[0] ?? null;
-    }
-    function buildAiResponses() {
-      const built = [];
-      const usedStepTraceIds = /* @__PURE__ */ new Set();
-      const stepResponses = conversationTraces.filter(isMainStepResponse).sort(compareConversationTraces);
-      const agentTraces = conversationTraces.filter(isAgentConversationalTrace).sort(compareConversationTraces);
-      for (const agentTrace of agentTraces) {
-        const stepTrace = findStepResponseForAgentTrace(agentTrace, stepResponses, usedStepTraceIds);
-        const stepFullText = stepTrace ? normalizeNonEmptyString(stepTrace.response) : null;
-        const fullText = stepFullText ?? normalizeNonEmptyString(agentTrace.content);
-        const text = bubbleText(fullText);
-        if (!text || !fullText) continue;
-        const duplicate = built.find((response) => response.agentTraceIds.size > 0 && Math.abs(response.createdAt - agentTrace.createdAt) <= 1e3 && isEquivalentAiResponseText(response.fullText, fullText));
-        if (duplicate) {
-          duplicate.agentTraceIds.add(conversationalTraceKey(agentTrace));
-          if (stepTrace) usedStepTraceIds.add(traceKey(stepTrace));
-          continue;
-        }
-        if (stepTrace) usedStepTraceIds.add(traceKey(stepTrace));
-        built.push({
-          id: stepTrace ? `response:step:${traceKey(stepTrace)}` : `response:agent:${conversationalTraceKey(agentTrace)}`,
-          text,
-          fullText,
-          createdAt: agentTrace.createdAt,
-          agentTraceIds: /* @__PURE__ */ new Set([conversationalTraceKey(agentTrace)]),
-          traceLabel: describeTrace(stepTrace ?? agentTrace)
-        });
-      }
-      for (const stepTrace of stepResponses) {
-        const stepTraceId = traceKey(stepTrace);
-        if (usedStepTraceIds.has(stepTraceId)) continue;
-        const fullText = normalizeNonEmptyString(stepTrace.response);
-        const text = bubbleText(fullText);
-        if (!text || !fullText) continue;
-        built.push({
-          id: `response:step:${stepTraceId}`,
-          text,
-          fullText,
-          createdAt: stepTrace.createdAt,
-          agentTraceIds: /* @__PURE__ */ new Set(),
-          traceLabel: describeTrace(stepTrace)
-        });
-      }
-      return built.sort((a, b) => a.createdAt - b.createdAt || a.id.localeCompare(b.id));
-    }
-    function traceKey(trace) {
-      return normalizeNonEmptyString(trace.traceId) ?? `${trace.seq ?? "?"}:${trace.createdAt ?? "?"}`;
-    }
-    function buildTtsTextEvents() {
-      return traces.slice().sort(compareLatencyTraces).flatMap((trace) => {
-        if (trace.eventType !== "tts.text.first_sent" && trace.eventType !== "tts.text.completed") {
-          return [];
-        }
-        const text = bubbleText(latencyText(trace));
-        return text ? [{ trace, text }] : [];
-      });
-    }
-    function findTtsTextForPlayback(playbackSegment, ttsTextEvents, usedTextTraceIds, previousPlaybackEnd) {
-      const lowerBound = previousPlaybackEnd - 250;
-      const upperBound = playbackSegment.start + 2e3;
-      const candidates = ttsTextEvents.filter(({ trace }) => {
-        if (usedTextTraceIds.has(traceKey(trace))) return false;
-        return trace.atMs >= lowerBound && trace.atMs <= upperBound;
-      }).sort((a, b) => Math.abs(a.trace.atMs - playbackSegment.start) - Math.abs(b.trace.atMs - playbackSegment.start));
-      return candidates[0] ?? null;
-    }
-    function buildPlaybackSpeechMatches(inputSegments) {
-      const bySegmentId = /* @__PURE__ */ new Map();
-      const playbackSegments = inputSegments.filter((segment) => segment.row === "Playback" && segment.durationMs > 0).sort((a, b) => a.start - b.start || a.end - b.end);
-      const usedTtsTextTraceIds = /* @__PURE__ */ new Set();
-      const ttsTextEvents = buildTtsTextEvents();
-      let previousPlaybackEnd = callStartTime();
-      for (const playbackSegment of playbackSegments) {
-        const ttsText = findTtsTextForPlayback(playbackSegment, ttsTextEvents, usedTtsTextTraceIds, previousPlaybackEnd);
-        previousPlaybackEnd = Math.max(previousPlaybackEnd, playbackSegment.end);
-        if (!ttsText) continue;
-        usedTtsTextTraceIds.add(traceKey(ttsText.trace));
-        bySegmentId.set(playbackSegment.id, {
-          text: ttsText.text,
-          fullText: ttsText.text,
-          traceLabel: describeTrace(ttsText.trace)
-        });
-      }
-      return bySegmentId;
-    }
-    function buildStandaloneWaitSegments(responses) {
-      return responses.flatMap((response) => {
-        if (!isWaitResponse(response.fullText)) return [];
-        const end = findWaitResponseEnd(response.createdAt);
-        return [
-          {
-            ...makeSegment({
-              id: `playback:wait:${response.id}`,
-              row: "Playback",
-              start: response.createdAt,
-              end,
-              colorKey: "playback",
-              label: "WAIT response",
-              traceLabel: response.traceLabel
-            }),
-            speechText: response.text,
-            speechFullText: response.fullText,
-            speechTraceLabel: response.traceLabel
-          }
-        ];
-      });
-    }
-    function findWaitResponseEnd(start) {
-      const nextActivity = traces.filter((trace) => trace.atMs > start && (trace.eventType === "audio.playback.started" || trace.eventType === "stt.started" || trace.eventType === "vad.activated" || trace.eventType === "call.ended")).sort((a, b) => a.atMs - b.atMs || a.seq - b.seq)[0];
-      return nextActivity ? nextActivity.atMs : start + 1;
-    }
-    function buildSpeechBubbleCandidates() {
-      const built = [];
-      const playbackSegments = callSegments().filter((segment) => segment.row === "Playback" && segment.durationMs > 0).sort((a, b) => a.start - b.start || a.end - b.end);
-      traces.slice().sort(compareLatencyTraces).forEach((trace) => {
-        if (!isFinalSttLatencyTrace(trace)) return;
-        const text = latencyTranscriptText(trace);
-        if (!text) return;
-        built.push({
-          id: `bubble:human:${trace.traceId ?? trace.seq}`,
-          role: "human",
-          text,
-          fullText: text,
-          anchorTime: trace.atMs,
-          minStartTime: findHumanBubbleStartTime(trace.atMs, playbackSegments),
-          anchorRow: "STT",
-          traceLabel: describeTrace(trace)
-        });
-      });
-      return built.sort((a, b) => a.anchorTime - b.anchorTime || a.role.localeCompare(b.role) || a.id.localeCompare(b.id));
-    }
-    function timelineRowAnchorPx(rowLabel) {
-      const rowIndex = timelineRows().findIndex((row) => row.label === rowLabel);
-      if (rowIndex === -1) return TIMELINE_RULER_HEIGHT_PX;
-      return TIMELINE_RULER_HEIGHT_PX + rowIndex * (TIMELINE_ROW_HEIGHT_PX + TIMELINE_ROW_GAP_PX) + Math.round(TIMELINE_ROW_HEIGHT_PX / 2);
-    }
-    function speechBubbleRoleLevelCount(bubbles, role) {
-      let maxLevel = -1;
-      for (const bubble of bubbles) {
-        if (bubble.role !== role) continue;
-        maxLevel = Math.max(maxLevel, bubble.level);
-      }
-      return maxLevel + 1;
-    }
-    function speechBubbleLaneHeightPx(levelCount) {
-      return Math.max(0, levelCount) * SPEECH_BUBBLE_LEVEL_HEIGHT_PX;
-    }
-    function compactSpeechBubbleLayouts(bubbles) {
-      const bubbleAreaTopPx = speechBubbleAreaTopPx();
-      return bubbles.map((bubble) => {
-        const topPx = bubble.level * SPEECH_BUBBLE_LEVEL_HEIGHT_PX;
-        const globalTopPx = bubbleAreaTopPx + topPx;
-        const rowAnchorPx = timelineRowAnchorPx(bubble.anchorRow);
-        return {
-          ...bubble,
-          topPx,
-          lineTopPx: rowAnchorPx,
-          lineHeightPx: Math.max(1, globalTopPx - rowAnchorPx)
-        };
-      });
-    }
-    function buildSpeechBubbleLayoutForRole(role, candidates) {
-      return [];
-    }
-    function buildSpeechBubbleBaseLayouts() {
-      buildSpeechBubbleCandidates();
-      return buildSpeechBubbleLayoutForRole();
-    }
-    function speechBubbleStyle(bubble) {
-      return `left:${Math.round(bubble.leftPx)}px;top:${Math.round(bubble.topPx)}px;width:${Math.round(bubble.widthPx)}px;height:${SPEECH_BUBBLE_HEIGHT_PX}px;`;
-    }
-    function speechBubbleLineStyle(bubble) {
-      return `left:${bubble.anchorPercent}%;top:${Math.round(bubble.lineTopPx)}px;height:${Math.round(bubble.lineHeightPx)}px;`;
-    }
-    function speechBubbleClass(bubble) {
-      const base = "absolute z-20 overflow-hidden truncate rounded-lg border-thin border-rc-gray-110 px-3 text-sm leading-[30px] text-rc-gray-100 backdrop-blur-md";
-      if (bubble.role === "agent") {
-        return `${base} bg-rc-green-700`;
-      }
-      return `${base} bg-rc-gray-700`;
-    }
-    function makeSegment(input) {
-      return {
-        id: input.id,
-        row: input.row,
-        start: input.start,
-        end: input.end,
-        durationMs: Math.max(0, input.end - input.start),
-        colorKey: input.colorKey,
-        label: input.label,
-        description: input.description ?? null,
-        explain: input.explain ?? null,
-        text: input.text ?? null,
-        speechText: null,
-        speechFullText: null,
-        speechTraceLabel: null,
-        traceLabel: input.traceLabel,
-        eventMarker: input.eventMarker ?? null
-      };
-    }
-    function compareLatencyTraces(a, b) {
-      return a.seq - b.seq || a.atMs - b.atMs || (a.createdAt ?? 0) - (b.createdAt ?? 0) || String(a.traceId ?? "").localeCompare(String(b.traceId ?? ""));
-    }
-    function findNextLatencyEvent(events, startIndex, match, stop) {
-      for (let index = startIndex + 1; index < events.length; index += 1) {
-        const next = events[index];
-        if (stop(next)) return null;
-        if (match(next)) return next;
-      }
-      return null;
-    }
-    function buildResponseLatencySegments(events) {
-      return buildResponseLatencySpans(events).filter((span) => findResponseLatencyUserTurn(conversationTraces, span) != null).map((span) => makeSegment({
-        id: `derived:${span.id}`,
-        row: "Response Latency",
-        start: span.start,
-        end: span.end,
-        colorKey: span.isHigh ? "response.latency.high" : "response.latency.ok",
-        label: "Final STT -> speech start",
-        description: span.speechCreatedTrace ? "Final STT transcript -> first audio for the next uncancelled LiveKit speech" : "Final STT transcript -> next audio playback start",
-        explain: span.isHigh ? `High latency (>${RESPONSE_LATENCY_THRESHOLD_MS}ms)` : "OK",
-        text: span.text,
-        traceLabel: span.speechCreatedTrace ? `${describeTrace(span.startTrace)} -> ${describeTrace(span.speechCreatedTrace)} -> ${describeTrace(span.endTrace)}` : `${describeTrace(span.startTrace)} -> ${describeTrace(span.endTrace)}`
-      }));
-    }
-    function buildDerivedSegments(events) {
-      const built = buildResponseLatencySegments(events);
-      events.forEach((trace, index) => {
-        const rule = SPAN_RULE_BY_START.get(trace.eventType);
-        if (!rule) return;
-        const next = findNextLatencyEvent(events, index, (candidate) => candidate.eventType === rule.endEventType, (candidate) => candidate.eventType === rule.startEventType);
-        if (!next || next.atMs < trace.atMs) return;
-        built.push(makeSegment({
-          id: `derived:${rule.row.toLowerCase().replaceAll(" ", "_")}:${trace.seq}:${next.seq}`,
-          row: rule.row,
-          start: trace.atMs,
-          end: next.atMs,
-          colorKey: rule.colorKey,
-          label: rule.label,
-          description: rule.description,
-          traceLabel: describeTrace(trace)
-        }));
-      });
-      return built;
-    }
-    function buildCallLatencySegments(input) {
-      const events = input.slice().filter((trace) => typeof trace.atMs === "number" && Number.isFinite(trace.atMs) && typeof trace.seq === "number" && Number.isFinite(trace.seq)).sort(compareLatencyTraces);
-      const pointSegments = events.map((trace, index) => makeSegment({
-        id: `point:${trace.traceId ?? trace.seq}:${index}`,
-        row: latencyRow(trace.eventType),
-        start: trace.atMs,
-        end: trace.atMs,
-        colorKey: latencyColorKey(trace.eventType),
-        label: latencyLabel(trace),
-        description: latencyDescription(trace),
-        text: latencyText(trace),
-        traceLabel: describeTrace(trace),
-        eventMarker: latencyEventMarker(trace.eventType)
-      }));
-      const derivedSegments = buildDerivedSegments(events);
-      return [...derivedSegments, ...pointSegments].sort((a, b) => a.start - b.start || (a.durationMs === 0 ? 1 : 0) - (b.durationMs === 0 ? 1 : 0) || a.end - b.end || a.row.localeCompare(b.row));
-    }
-    function buildRecordingResponse(raw) {
-      const next = raw && typeof raw === "object" ? raw : {};
-      const audioUrl = typeof next.audioUrl === "string" && next.audioUrl.trim() ? next.audioUrl : null;
-      return {
-        exists: next.exists === true && audioUrl != null,
-        audioUrl,
-        fileName: typeof next.fileName === "string" ? next.fileName : null,
-        mimeType: typeof next.mimeType === "string" ? next.mimeType : null,
-        size: typeof next.size === "number" && Number.isFinite(next.size) ? next.size : null,
-        uploadedAt: typeof next.uploadedAt === "string" ? next.uploadedAt : null,
-        alignmentOffsetMs: typeof next.alignmentOffsetMs === "number" && Number.isFinite(next.alignmentOffsetMs) ? next.alignmentOffsetMs : 0
-      };
-    }
-    function getResponseError(payload, fallback) {
-      const next = payload && typeof payload === "object" ? payload : {};
-      if (typeof next.error === "string" && next.error.trim()) return next.error;
-      if (typeof next.message === "string" && next.message.trim()) return next.message;
-      return fallback;
-    }
-    async function readResponsePayload(response) {
-      const contentType = response.headers.get("content-type") ?? "";
-      if (contentType.includes("application/json")) {
-        return response.json().catch(() => ({}));
-      }
-      const text = (await response.text().catch(() => "")).trim();
-      if (!text) return {};
-      if (contentType.includes("text/html")) {
-        const titleMatch = text.match(/<title>([^<]+)<\/title>/i);
-        const headingMatch = text.match(/<h1[^>]*>([^<]+)<\/h1>/i);
-        return {
-          message: titleMatch?.[1]?.trim() || headingMatch?.[1]?.trim() || `${response.status} ${response.statusText}`.trim()
-        };
-      }
-      return { message: text };
-    }
-    function isPlaybackTraceBubble(segment) {
-      return segment.row === "Playback" && !segment.eventMarker && segment.durationMs > 0;
-    }
-    function segmentDisplayText(segment) {
-      if (isPlaybackTraceBubble(segment)) return segment.speechText;
-      return null;
-    }
-    function segmentStyle(segment) {
-      if (viewportStartMs == null || viewportEndMs == null) return null;
-      const duration = viewportEndMs - viewportStartMs;
-      if (!Number.isFinite(duration) || duration <= 0) return null;
-      const fill = COLOR_BY_KEY[segment.colorKey] ?? BOSUN_COLORS.gray;
-      const border = tintHex(fill, -0.25);
-      if (segment.end === segment.start) {
-        if (segment.start < viewportStartMs || segment.start > viewportEndMs) return null;
-        const pointPercent = clamp((segment.start - viewportStartMs) / duration * 100, 0, 100);
-        if (segment.eventMarker === "start") {
-          return `left:${pointPercent}%;width:7px;background:${fill};border-color:${border};clip-path:polygon(0 0,100% 50%,0 100%);`;
-        }
-        if (segment.eventMarker === "end") {
-          return `left:calc(${pointPercent}% - 7px);width:7px;background:${fill};border-color:${border};clip-path:polygon(100% 0,0 50%,100% 100%);`;
-        }
-        return `left:calc(${pointPercent}% - 2px);width:4px;background:${fill};border-color:${border};`;
-      }
-      const visibleStart = Math.max(segment.start, viewportStartMs);
-      const visibleEnd = Math.min(segment.end, viewportEndMs);
-      if (visibleEnd < visibleStart) return null;
-      const leftPercent = (visibleStart - viewportStartMs) / duration * 100;
-      const widthPercent = (visibleEnd - visibleStart) / duration * 100;
-      if (isPlaybackTraceBubble(segment)) {
-        return `left:${leftPercent}%;width:max(${widthPercent}%,2px);`;
-      }
-      return `left:${leftPercent}%;width:max(${widthPercent}%,2px);background:${fill};border-color:${border};`;
-    }
-    function segmentClass(segment) {
-      if (segment.eventMarker) {
-        return "absolute inset-y-0 shadow-[0_0_0_1px_rgba(0,0,0,0.28)]";
-      }
-      if (isPlaybackTraceBubble(segment)) {
-        return "absolute inset-y-0 overflow-hidden truncate rounded-lg border-thin border-rc-gray-110 bg-rc-green-700 px-3 text-sm leading-[30px] text-rc-gray-100 shadow-[0_0_0_1px_rgba(0,0,0,0.12)] backdrop-blur-md";
-      }
-      return "absolute inset-y-0 rounded border shadow-[0_0_0_1px_rgba(0,0,0,0.12)]";
-    }
-    function guideLineStyle(guide) {
-      return `left:${guide.leftPercent}%;top:${guide.topPx}px;height:${guide.heightPx}px;border-color:${guide.color};opacity:${guide.opacity};`;
-    }
-    function timelineOriginLineStyle(originLine) {
-      return `left:${originLine.leftPercent}%;top:${originLine.topPx}px;height:${originLine.heightPx}px;`;
-    }
-    function tickLabelClass(tick) {
-      const base = "absolute top-1 whitespace-nowrap text-[11px] text-rc-gray-400";
-      if (tick.leftPercent <= 0.1) return base;
-      if (tick.leftPercent >= 99.9) return `${base} -translate-x-full`;
-      return `${base} -translate-x-1/2`;
-    }
-    function buildGuideLines(rows) {
-      if (!recording.exists || viewportStartMs == null || viewportEndMs == null) return [];
-      const rangeStartMs = viewportStartMs;
-      const rangeEndMs = viewportEndMs;
-      const durationMs = rangeEndMs - rangeStartMs;
-      if (!Number.isFinite(durationMs) || durationMs <= 0) return [];
-      const waveformBottomPx = timelinePlotHeightPx();
-      const seen = /* @__PURE__ */ new Set();
-      const built = [];
-      rows.forEach((row, rowIndex) => {
-        if (!GUIDE_ROW_LABELS.has(row.label)) return;
-        const rowTopPx = TIMELINE_RULER_HEIGHT_PX + rowIndex * (TIMELINE_ROW_HEIGHT_PX + TIMELINE_ROW_GAP_PX);
-        const rowAnchorPx = rowTopPx + Math.round(TIMELINE_ROW_HEIGHT_PX / 2);
-        row.segments.forEach((segment) => {
-          if (segment.id.startsWith("playback:wait:")) return;
-          const color = tintHex(COLOR_BY_KEY[segment.colorKey] ?? BOSUN_COLORS.gray, 0.15);
-          const times = segment.end === segment.start ? segment.start >= rangeStartMs && segment.start <= rangeEndMs ? [segment.start] : [] : (() => {
-            const visibleStart = Math.max(segment.start, rangeStartMs);
-            const visibleEnd = Math.min(segment.end, rangeEndMs);
-            return visibleEnd < visibleStart ? [] : [visibleStart, visibleEnd];
-          })();
-          for (const timeMs of times) {
-            const roundedTime = Math.round(timeMs);
-            const key = `${row.label}:${roundedTime}`;
-            if (seen.has(key)) continue;
-            seen.add(key);
-            const leftPercent = clamp((timeMs - rangeStartMs) / durationMs * 100, 0, 100);
-            built.push({
-              id: `${segment.id}:${roundedTime}`,
-              leftPercent,
-              topPx: rowAnchorPx,
-              heightPx: Math.max(1, waveformBottomPx - rowAnchorPx),
-              color,
-              opacity: row.label === "VAD" ? 0.62 : 0.48
-            });
-          }
-        });
-      });
-      return built;
-    }
-    function chooseTickStep(durationMs) {
-      const approx = durationMs / 7;
-      const magnitude = 10 ** Math.floor(Math.log10(Math.max(1, approx)));
-      const normalized = approx / magnitude;
-      if (normalized <= 1) return 1 * magnitude;
-      if (normalized <= 2) return 2 * magnitude;
-      if (normalized <= 5) return 5 * magnitude;
-      return 10 * magnitude;
-    }
-    function buildTicks(startMs, endMs, originMs) {
-      const durationMs = endMs - startMs;
-      if (!Number.isFinite(durationMs) || durationMs <= 0) return [];
-      const stepMs = chooseTickStep(durationMs);
-      const firstTick = Math.ceil((startMs - originMs) / stepMs) * stepMs + originMs;
-      const ticks = [];
-      for (let tick = firstTick; tick <= endMs; tick += stepMs) {
-        const leftPercent = (tick - startMs) / durationMs * 100;
-        ticks.push({
-          time: tick,
-          leftPercent,
-          label: formatRelativeTime(tick - originMs)
-        });
-      }
-      return ticks;
-    }
-    function createAudioContext() {
-      const next = window.AudioContext ?? window.webkitAudioContext;
-      if (!next) {
-        throw new Error("Web Audio is not available in this browser");
-      }
-      return new next();
-    }
-    function stopPlaybackTicker() {
-      if (!playbackFrame) return;
-      window.cancelAnimationFrame(playbackFrame);
-      playbackFrame = 0;
-    }
-    async function closePlaybackAudioContext() {
-      const context = playbackAudioContext;
-      playbackAudioContext = null;
-      if (!context) return;
-      await context.close().catch(() => {
-      });
-    }
-    async function ensurePlaybackAudioContext() {
-      if (!playbackAudioContext || playbackAudioContext.state === "closed") {
-        playbackAudioContext = createAudioContext();
-      }
-      if (playbackAudioContext.state === "suspended") {
-        await playbackAudioContext.resume();
-      }
-      return playbackAudioContext;
-    }
-    function getPlaybackPositionMs() {
-      const durationMs = getRecordingDurationMs();
-      if (playbackPlaying && playbackAudioContext && playbackStartedAtMs != null && playbackStartedAtContextTime != null) {
-        const elapsedMs = (playbackAudioContext.currentTime - playbackStartedAtContextTime) * 1e3;
-        const currentMs = playbackStartedAtMs + Math.max(0, elapsedMs);
-        return durationMs > 0 ? clamp(currentMs, 0, durationMs) : Math.max(0, currentMs);
-      }
-      return durationMs > 0 ? clamp(playbackPositionMs, 0, durationMs) : Math.max(0, playbackPositionMs);
-    }
-    function stopPlayback(preservePosition = true) {
-      if (preservePosition) {
-        playbackPositionMs = getPlaybackPositionMs();
-      }
-      const source = playbackSourceNode;
-      playbackSourceNode = null;
-      playbackStartedAtMs = null;
-      playbackStartedAtContextTime = null;
-      playbackPlaying = false;
-      stopPlaybackTicker();
-      if (!source) return;
-      source.onended = null;
-      try {
-        source.stop();
-      } catch {
-      }
-      source.disconnect();
-    }
-    function startPlaybackTicker() {
-      stopPlaybackTicker();
-      const tick = () => {
-        if (!playbackPlaying) {
-          playbackFrame = 0;
-          return;
-        }
-        playbackPositionMs = getPlaybackPositionMs();
-        playbackFrame = window.requestAnimationFrame(tick);
-      };
-      playbackFrame = window.requestAnimationFrame(tick);
-    }
-    function getRecordingDurationMs() {
-      if (waveform && Number.isFinite(waveform.durationMs)) {
-        return Math.max(0, waveform.durationMs);
-      }
-      if (playbackAudioBuffer && Number.isFinite(playbackAudioBuffer.duration)) {
-        return Math.max(0, playbackAudioBuffer.duration * 1e3);
-      }
-      return 0;
-    }
-    async function togglePlayback() {
-      if (!recording.exists || !recording.audioUrl) return;
-      playbackError = null;
-      if (playbackPlaying) {
-        stopPlayback(true);
-        return;
-      }
-      await startPlaybackAtMs(playbackPositionMs);
-    }
-    async function startPlaybackAtMs(nextMs) {
-      const buffer = playbackAudioBuffer;
-      if (!buffer) {
-        playbackError = "Failed to decode recording for playback";
-        return;
-      }
-      const durationMs = Math.max(0, buffer.duration * 1e3);
-      const startMs = durationMs > 0 ? nextMs >= durationMs ? 0 : clamp(nextMs, 0, durationMs) : Math.max(0, nextMs);
-      stopPlayback(false);
-      playbackPositionMs = startMs;
-      try {
-        const context = await ensurePlaybackAudioContext();
-        const source = context.createBufferSource();
-        source.buffer = buffer;
-        source.connect(context.destination);
-        source.onended = () => {
-          if (playbackSourceNode !== source) return;
-          playbackSourceNode = null;
-          playbackStartedAtMs = null;
-          playbackStartedAtContextTime = null;
-          playbackPlaying = false;
-          playbackPositionMs = durationMs;
-          stopPlaybackTicker();
-        };
-        playbackSourceNode = source;
-        playbackStartedAtMs = startMs;
-        playbackStartedAtContextTime = context.currentTime;
-        playbackPlaying = true;
-        playbackError = null;
-        startPlaybackTicker();
-        source.start(0, startMs / 1e3);
-      } catch (reason) {
-        stopPlayback(false);
-        playbackPlaying = false;
-        playbackError = reason instanceof Error ? reason.message : "Failed to play recording";
-      }
-    }
-    function compareConversationTraces(a, b) {
-      return a.createdAt - b.createdAt || String(a.traceId ?? "").localeCompare(String(b.traceId ?? ""));
-    }
-    function fitViewport(markDirty = true) {
-      const extent = conversationTraceExtent() ?? contentExtent();
-      if (!extent) return;
-      const originMs = timelineOriginMs();
-      viewportStartMs = originMs;
-      viewportEndMs = Math.max(originMs + 1e3, extent.max);
-      viewDirty = markDirty;
-    }
-    function clampViewport(startMs, endMs) {
-      const extent = contentExtent();
-      if (!extent) return { startMs, endMs };
-      const durationMs = endMs - startMs;
-      if (durationMs <= 0) return { startMs, endMs };
-      const marginMs = Math.max(1e3, durationMs * 0.25);
-      const minAllowed = extent.min - marginMs;
-      const maxAllowed = extent.max + marginMs;
-      if (durationMs >= maxAllowed - minAllowed) {
-        return { startMs: minAllowed, endMs: maxAllowed };
-      }
-      if (startMs < minAllowed) {
-        endMs += minAllowed - startMs;
-        startMs = minAllowed;
-      }
-      if (endMs > maxAllowed) {
-        startMs -= endMs - maxAllowed;
-        endMs = maxAllowed;
-      }
-      return { startMs, endMs };
-    }
-    function setViewport(startMs, endMs) {
-      if (!Number.isFinite(startMs) || !Number.isFinite(endMs) || endMs <= startMs) return;
-      const next = clampViewport(startMs, endMs);
-      viewportStartMs = next.startMs;
-      viewportEndMs = next.endMs;
-    }
-    function zoomViewport(factor, focusRatio = 0.5) {
-      if (viewportStartMs == null || viewportEndMs == null) return;
-      const currentDuration = viewportEndMs - viewportStartMs;
-      if (!Number.isFinite(currentDuration) || currentDuration <= 0) return;
-      const extent = contentExtent();
-      const contentDuration = extent ? extent.max - extent.min : currentDuration;
-      const minDuration = Math.min(100, currentDuration);
-      const maxDuration = Math.max(contentDuration + Math.max(2e3, contentDuration * 0.1), 5e3);
-      const nextDuration = clamp(currentDuration * factor, minDuration, maxDuration);
-      const nextFocusRatio = clamp(focusRatio, 0, 1);
-      const focusMs = viewportStartMs + currentDuration * nextFocusRatio;
-      const nextStartMs = focusMs - nextDuration * nextFocusRatio;
-      viewDirty = true;
-      setViewport(nextStartMs, nextStartMs + nextDuration);
-    }
-    function setLocalAlignmentOffset(nextOffsetMs) {
-      recording = { ...recording, alignmentOffsetMs: Math.round(nextOffsetMs) };
-    }
-    async function persistAlignmentOffset() {
-      if (!recording.exists || !recordingApiUrl()) return;
-      alignmentSaving = true;
-      alignmentError = null;
-      try {
-        const response = await fetch(recordingApiUrl(), {
-          method: "PATCH",
-          headers: {
-            accept: "application/json",
-            "content-type": "application/json"
-          },
-          body: JSON.stringify({ alignmentOffsetMs: recording.alignmentOffsetMs })
-        });
-        const payload = await readResponsePayload(response);
-        if (!response.ok) {
-          throw new Error(getResponseError(payload, "Failed to save alignment offset"));
-        }
-        recording = buildRecordingResponse(payload);
-      } catch (reason) {
-        alignmentError = reason instanceof Error ? reason.message : String(reason);
-      } finally {
-        alignmentSaving = false;
-      }
-    }
-    async function resetAlignment() {
-      if (!recording.exists) return;
-      viewDirty = true;
-      setLocalAlignmentOffset(0);
-      await persistAlignmentOffset();
-    }
-    $$renderer2.push(`<div class="flex h-full min-h-0 flex-col bg-rc-gray-700"><div class="flex-none border-b border-rc-gray-300/40 p-4"><div class="flex flex-wrap items-start justify-between gap-3"><div><h2 class="text-lg font-semibold text-rc-gray-100">Latency `);
-    if (conversationId()) {
-      $$renderer2.push("<!--[0-->");
-      $$renderer2.push(`<span class="text-rc-gray-100">for conversation Id:</span> <span class="text-rc-green-200">${escape_html(conversationId())}</span>`);
-    } else {
-      $$renderer2.push("<!--[-1-->");
-    }
-    $$renderer2.push(`<!--]--></h2> <div class="mt-2 flex flex-wrap gap-x-5 gap-y-1 text-xs text-rc-gray-300"><div><span class="text-rc-gray-400">Latency events:</span> <span class="font-mono text-rc-gray-100">${escape_html(latencyTraceCount())}</span></div> <div><span class="text-rc-gray-400">Timeline items:</span> <span class="font-mono text-rc-gray-100">${escape_html(callSegments().length)}</span></div> <div><span class="text-rc-gray-400">Recording offset:</span> <span class="font-mono text-rc-gray-100">${escape_html(fmtSignedMs(recording.alignmentOffsetMs))}</span></div> `);
-    if (recording.exists && playbackAbsoluteMs() != null) {
-      $$renderer2.push("<!--[0-->");
-      $$renderer2.push(`<div><span class="text-rc-gray-400">Playhead:</span> <span class="font-mono text-rc-gray-100">${escape_html(formatRelativeTime(playbackAbsoluteMs() - timelineOriginMs()))}</span></div>`);
-    } else {
-      $$renderer2.push("<!--[-1-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    if (viewportStartMs != null && viewportEndMs != null) {
-      $$renderer2.push("<!--[0-->");
-      $$renderer2.push(`<div><span class="text-rc-gray-400">Viewport:</span> <span class="font-mono text-rc-gray-100">${escape_html(formatRelativeTime(viewportStartMs - timelineOriginMs()))} → ${escape_html(formatRelativeTime(viewportEndMs - timelineOriginMs()))}</span></div>`);
-    } else {
-      $$renderer2.push("<!--[-1-->");
-    }
-    $$renderer2.push(`<!--]--></div></div> <div class="flex flex-wrap items-center gap-2"><input type="file" accept=".wav,audio/wav,audio/x-wav" class="hidden"/> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: uploadInFlight,
-      onclick: () => fileInputEl?.click(),
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->${escape_html(recording.exists ? "Replace WAV" : "Upload WAV")}`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: !recording.exists,
-      onclick: () => void togglePlayback(),
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->${escape_html(playbackPlaying ? "Pause" : "Play")}`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: viewportDurationMs() == null,
-      onclick: () => zoomViewport(0.8),
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->Zoom in`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: viewportDurationMs() == null,
-      onclick: () => zoomViewport(1.25),
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->Zoom out`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: !(conversationTraceExtent() ?? contentExtent()),
-      onclick: () => fitViewport(true),
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->Fit call`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: !recording.exists || alignmentSaving,
-      onclick: resetAlignment,
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->Reset alignment`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: !traces.length,
-      onclick: copyLatencyStream,
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->${escape_html(copyLatencyState === "ok" ? "Copied" : copyLatencyState === "error" ? "Copy failed" : "Copy latency stream")}`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----></div></div> `);
-    {
-      $$renderer2.push("<!--[-1-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    if (error) {
-      $$renderer2.push("<!--[0-->");
-      $$renderer2.push(`<div class="mt-2 text-sm text-red-300">Failed to load latency traces: ${escape_html(error)}</div>`);
-    } else {
-      $$renderer2.push("<!--[-1-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    if (recordingError) {
-      $$renderer2.push("<!--[0-->");
-      $$renderer2.push(`<div class="mt-2 text-sm text-red-300">Recording error: ${escape_html(recordingError)}</div>`);
-    } else {
-      $$renderer2.push("<!--[-1-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    if (alignmentError) {
-      $$renderer2.push("<!--[0-->");
-      $$renderer2.push(`<div class="mt-2 text-sm text-red-300">Alignment error: ${escape_html(alignmentError)}</div>`);
-    } else {
-      $$renderer2.push("<!--[-1-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    if (playbackError) {
-      $$renderer2.push("<!--[0-->");
-      $$renderer2.push(`<div class="mt-2 text-sm text-red-300">Playback error: ${escape_html(playbackError)}</div>`);
-    } else {
-      $$renderer2.push("<!--[-1-->");
-    }
-    $$renderer2.push(`<!--]--></div> <div class="rc-scroll min-h-0 flex-1 overflow-auto p-4"><div class="flex flex-col gap-4"><div class="rounded-md border border-rc-gray-650 p-3">`);
-    if (!callSegments().length) {
-      $$renderer2.push("<!--[1-->");
-      $$renderer2.push(`<div class="text-sm text-rc-gray-300">No latency events were found on this call.</div>`);
-    } else if (viewportStartMs == null || viewportEndMs == null) {
-      $$renderer2.push("<!--[2-->");
-      $$renderer2.push(`<div class="text-sm text-rc-gray-300">Preparing timeline…</div>`);
-    } else {
-      $$renderer2.push("<!--[-1-->");
-      $$renderer2.push(`<div class="grid grid-cols-[140px_minmax(0,1fr)] gap-x-3"><div class="flex flex-col"><div class="h-8"></div> <!--[-->`);
-      const each_array = ensure_array_like(timelineRows());
-      for (let rowIndex = 0, $$length = each_array.length; rowIndex < $$length; rowIndex++) {
-        let row = each_array[rowIndex];
-        $$renderer2.push(`<div class="flex items-center text-xs text-rc-gray-300"${attr_style(`height:${TIMELINE_ROW_HEIGHT_PX}px;margin-top:${rowIndex === 0 ? 0 : TIMELINE_ROW_GAP_PX}px;`)}>${escape_html(row.label)}</div>`);
-      }
-      $$renderer2.push(`<!--]--> <div class="flex items-center text-xs text-rc-gray-300"${attr_style(`height:${humanSpeechBubbleLaneHeightPx()}px;margin-top:${traceRowsToBubbleGapPx()}px;`)}>Human</div> `);
-      if (waveformRowVisible()) {
-        $$renderer2.push("<!--[0-->");
-        $$renderer2.push(`<div class="flex items-center text-xs text-rc-gray-300"${attr_style(`height:${WAVEFORM_ROW_HEIGHT_PX}px;margin-top:${TIMELINE_ROW_GAP_PX}px;`)}>Waveform</div>`);
-      } else {
-        $$renderer2.push("<!--[-1-->");
-      }
-      $$renderer2.push(`<!--]--></div> <div class="relative"><div class="pointer-events-none absolute inset-0 z-10 overflow-hidden"><!--[-->`);
-      const each_array_1 = ensure_array_like(speechBubbles());
-      for (let $$index_1 = 0, $$length = each_array_1.length; $$index_1 < $$length; $$index_1++) {
-        let bubble = each_array_1[$$index_1];
-        $$renderer2.push(`<div class="absolute -translate-x-1/2 border-l border-rc-gray-300/40"${attr_style(speechBubbleLineStyle(bubble))}></div>`);
-      }
-      $$renderer2.push(`<!--]--> <!--[-->`);
-      const each_array_2 = ensure_array_like(guideLines());
-      for (let $$index_2 = 0, $$length = each_array_2.length; $$index_2 < $$length; $$index_2++) {
-        let guide = each_array_2[$$index_2];
-        $$renderer2.push(`<div class="absolute -translate-x-1/2 border-l border-dashed"${attr_style(guideLineStyle(guide))}></div>`);
-      }
-      $$renderer2.push(`<!--]--> `);
-      if (timelineOriginLine()) {
-        $$renderer2.push("<!--[0-->");
-        $$renderer2.push(`<div class="absolute border-l border-rc-gray-200/80"${attr_style(timelineOriginLineStyle(timelineOriginLine()))}></div>`);
-      } else {
-        $$renderer2.push("<!--[-1-->");
-      }
-      $$renderer2.push(`<!--]--> `);
-      if (playbackCursor()) {
-        $$renderer2.push("<!--[0-->");
-        $$renderer2.push(`<div class="absolute -translate-x-1/2 border-l-2 border-rc-green-200/90"${attr_style(`left:${playbackCursor().leftPercent}%;top:${playbackCursor().topPx}px;height:${playbackCursor().heightPx}px;`)}></div> <div class="absolute h-2 w-2 -translate-x-1/2 rounded-full bg-rc-green-200"${attr_style(`left:${playbackCursor().leftPercent}%;top:${playbackCursor().topPx - 4}px;`)}></div>`);
-      } else {
-        $$renderer2.push("<!--[-1-->");
-      }
-      $$renderer2.push(`<!--]--></div> <div class="relative z-0 h-8 overflow-hidden rounded-t border border-b-0 border-rc-gray-700/60"><!--[-->`);
-      const each_array_3 = ensure_array_like(visibleTicks());
-      for (let $$index_3 = 0, $$length = each_array_3.length; $$index_3 < $$length; $$index_3++) {
-        let tick = each_array_3[$$index_3];
-        $$renderer2.push(`<div class="absolute inset-y-0 w-px bg-rc-gray-700/70"${attr_style(`left:${tick.leftPercent}%;`)}></div> <div${attr_class(clsx(tickLabelClass(tick)))}${attr_style(`left:${tick.leftPercent}%;`)}>${escape_html(tick.label)}</div>`);
-      }
-      $$renderer2.push(`<!--]--></div> <!--[-->`);
-      const each_array_4 = ensure_array_like(timelineRows());
-      for (let rowIndex = 0, $$length = each_array_4.length; rowIndex < $$length; rowIndex++) {
-        let row = each_array_4[rowIndex];
-        $$renderer2.push(`<div class="relative z-0 overflow-hidden border-x border-t border-rc-gray-700/60"${attr_style(`height:${TIMELINE_ROW_HEIGHT_PX}px;margin-top:${rowIndex === 0 ? 0 : TIMELINE_ROW_GAP_PX}px;`)}><!--[-->`);
-        const each_array_5 = ensure_array_like(visibleTicks());
-        for (let $$index_4 = 0, $$length2 = each_array_5.length; $$index_4 < $$length2; $$index_4++) {
-          let tick = each_array_5[$$index_4];
-          $$renderer2.push(`<div class="absolute inset-y-0 w-px bg-rc-gray-700/60"${attr_style(`left:${tick.leftPercent}%;`)}></div>`);
-        }
-        $$renderer2.push(`<!--]--> <!--[-->`);
-        const each_array_6 = ensure_array_like(row.segments);
-        for (let $$index_5 = 0, $$length2 = each_array_6.length; $$index_5 < $$length2; $$index_5++) {
-          let segment = each_array_6[$$index_5];
-          const style = segmentStyle(segment);
-          const text = segmentDisplayText(segment);
-          if (style) {
-            $$renderer2.push("<!--[0-->");
-            $$renderer2.push(`<div${attr_class(clsx(segmentClass(segment)))}${attr_style(style)}>`);
-            if (text) {
-              $$renderer2.push("<!--[0-->");
-              $$renderer2.push(`<span class="block truncate">${escape_html(text)}</span>`);
-            } else {
-              $$renderer2.push("<!--[-1-->");
-            }
-            $$renderer2.push(`<!--]--></div>`);
-          } else {
-            $$renderer2.push("<!--[-1-->");
-          }
-          $$renderer2.push(`<!--]-->`);
-        }
-        $$renderer2.push(`<!--]--></div>`);
-      }
-      $$renderer2.push(`<!--]--> <div${attr_class("relative z-0 overflow-hidden border-x border-t border-rc-gray-700/60", void 0, {
-        "rounded-b": !waveformRowVisible(),
-        "border-b": !waveformRowVisible()
-      })}${attr_style(`height:${speechBubbleAreaHeightPx()}px;margin-top:${traceRowsToBubbleGapPx()}px;`)}><div class="absolute inset-x-0 top-0 border-b border-rc-gray-700/50"${attr_style(`height:${humanSpeechBubbleLaneHeightPx()}px;`)}></div> <!--[-->`);
-      const each_array_7 = ensure_array_like(visibleTicks());
-      for (let $$index_7 = 0, $$length = each_array_7.length; $$index_7 < $$length; $$index_7++) {
-        let tick = each_array_7[$$index_7];
-        $$renderer2.push(`<div class="absolute inset-y-0 w-px bg-rc-gray-700/45"${attr_style(`left:${tick.leftPercent}%;`)}></div>`);
-      }
-      $$renderer2.push(`<!--]--> <!--[-->`);
-      const each_array_8 = ensure_array_like(speechBubbles());
-      for (let $$index_8 = 0, $$length = each_array_8.length; $$index_8 < $$length; $$index_8++) {
-        let bubble = each_array_8[$$index_8];
-        $$renderer2.push(`<div${attr_class(clsx(speechBubbleClass(bubble)))}${attr_style(speechBubbleStyle(bubble))}>${escape_html(bubble.text)}</div>`);
-      }
-      $$renderer2.push(`<!--]--></div> `);
-      if (waveformRowVisible()) {
-        $$renderer2.push("<!--[0-->");
-        $$renderer2.push(`<div class="relative z-0 overflow-hidden rounded-b border-x border-b border-t border-rc-gray-700/60"${attr_style(`height:${WAVEFORM_ROW_HEIGHT_PX}px;margin-top:${TIMELINE_ROW_GAP_PX}px;`)}>`);
-        if (waveformError) {
-          $$renderer2.push("<!--[1-->");
-          $$renderer2.push(`<div class="absolute inset-0 flex items-center justify-center px-4 text-sm text-red-300">Failed to decode waveform: ${escape_html(waveformError)}</div>`);
-        } else {
-          $$renderer2.push("<!--[-1-->");
-          $$renderer2.push(`<canvas class="absolute inset-0 h-full w-full"></canvas>`);
-        }
-        $$renderer2.push(`<!--]--> <!--[-->`);
-        const each_array_9 = ensure_array_like(visibleTicks());
-        for (let $$index_9 = 0, $$length = each_array_9.length; $$index_9 < $$length; $$index_9++) {
-          let tick = each_array_9[$$index_9];
-          $$renderer2.push(`<div class="absolute inset-y-0 w-px bg-rc-gray-700/60"${attr_style(`left:${tick.leftPercent}%;`)}></div>`);
-        }
-        $$renderer2.push(`<!--]--></div>`);
-      } else {
-        $$renderer2.push("<!--[-1-->");
-      }
-      $$renderer2.push(`<!--]--></div></div>`);
-    }
-    $$renderer2.push(`<!--]--></div></div></div></div> `);
-    {
-      $$renderer2.push("<!--[-1-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    {
-      $$renderer2.push("<!--[-1-->");
-    }
-    $$renderer2.push(`<!--]-->`);
-  });
-}
-
-export { _page as default };
-//# sourceMappingURL=_page.svelte-Yjru58jZ.js.map