@wrongstack/webui 0.255.0 → 0.256.0

package/dist/index.js

@@ -63,26 +63,14 @@ function installFaviconVisibilityReset() {
 }
 
 // src/lib/ws-client.ts
-var WS_TOKEN_KEY = "ws_token";
-function getStoredToken() {
+function getTokenFromWsUrl(wsUrl) {
   try {
-    return sessionStorage.getItem(WS_TOKEN_KEY);
+    const u = new URL(wsUrl);
+    return u.searchParams.get("token");
   } catch {
     return null;
   }
 }
-function setStoredToken(token) {
-  try {
-    sessionStorage.setItem(WS_TOKEN_KEY, token);
-  } catch {
-  }
-}
-function clearStoredToken() {
-  try {
-    sessionStorage.removeItem(WS_TOKEN_KEY);
-  } catch {
-  }
-}
 var WrongStackWebSocketClient = class {
   ws = null;
   url;
@@ -120,7 +108,53 @@ var WrongStackWebSocketClient = class {
   constructor(url) {
     this.url = url ?? defaultWsUrl();
   }
+  /**
+   * Exchange a stored token for an HttpOnly auth cookie via `/ws-auth`.
+   * Called once before the first connect so subsequent reconnections can
+   * drop the `?token=` from the WS URL (C-2 fix — token-in-URL closes
+   * the C-598 query-string exposure class). No-op when the cookie is
+   * already set, when the server is on a loopback bind (no token
+   * required), or when no token is available yet.
+   *
+   * Failure is non-fatal: the legacy `?token=` URL path still works, so
+   * the client just continues to use it. Cookie is a defense-in-depth
+   * layer, not a hard requirement.
+   */
+  async ensureAuthCookie() {
+    if (typeof window === "undefined") return;
+    if (document.cookie.split(";").some((c) => c.trim().startsWith("ws_token="))) {
+      return;
+    }
+    const token = getTokenFromWsUrl(this.url);
+    if (!token) return;
+    const authUrl = httpOriginForAuth() + `/ws-auth?token=${encodeURIComponent(token)}`;
+    try {
+      const res = await fetch(authUrl, {
+        method: "GET",
+        credentials: "same-origin",
+        // Cache-Control: no-store on the server side. Don't let the
+        // browser cache a 401 or replay a stale response.
+        cache: "no-store"
+      });
+      if (!res.ok) {
+        console.warn(JSON.stringify({
+          level: "warn",
+          event: "ws_client.ws_auth_failed",
+          status: res.status,
+          timestamp: (/* @__PURE__ */ new Date()).toISOString()
+        }));
+      }
+    } catch (err) {
+      console.warn(JSON.stringify({
+        level: "warn",
+        event: "ws_client.ws_auth_error",
+        message: err instanceof Error ? err.message : String(err),
+        timestamp: (/* @__PURE__ */ new Date()).toISOString()
+      }));
+    }
+  }
   async connect() {
+    await this.ensureAuthCookie();
     return new Promise((resolve, reject) => {
       if (this.ws?.readyState === WebSocket.OPEN) {
         resolve();
@@ -128,8 +162,8 @@ var WrongStackWebSocketClient = class {
       }
       this.setStatus({ state: "connecting" });
       try {
-        const storedToken = getStoredToken();
-        const wsUrl = storedToken ? `${this.url}${this.url.includes("?") ? "&" : "?"}token=${storedToken}` : this.url;
+        const urlToken = getTokenFromWsUrl(this.url);
+        const wsUrl = urlToken ? `${this.url}${this.url.includes("?") ? "&" : "?"}token=${urlToken}` : this.url;
         this.ws = new WebSocket(wsUrl);
         this.ws.binaryType = "arraybuffer";
         const connectTimeout = setTimeout(() => {
@@ -264,9 +298,6 @@ var WrongStackWebSocketClient = class {
     if (msg.type === "session.start") {
       const payload = msg.payload;
       this.sessionId = payload.sessionId;
-      if (payload.wsToken) {
-        setStoredToken(payload.wsToken);
-      }
     }
     this.emit(msg);
   }
@@ -510,7 +541,6 @@ var WrongStackWebSocketClient = class {
     }
     this.ws?.close();
     this.ws = null;
-    clearStoredToken();
   }
   get isConnected() {
     return this.ws?.readyState === WebSocket.OPEN;
@@ -538,6 +568,18 @@ function defaultWsUrl() {
   }
   return `ws://${window.location.hostname}:${port}`;
 }
+function httpOriginForAuth() {
+  if (typeof window === "undefined" || !window.location?.hostname) {
+    return "http://127.0.0.1:3456";
+  }
+  const host = window.location.hostname.toLowerCase();
+  const pagePort = window.location.port ? Number.parseInt(window.location.port, 10) : Number.NaN;
+  const httpPort = Number.isFinite(pagePort) && pagePort > 0 ? pagePort : 3456;
+  if (host === "localhost" || host === "127.0.0.1" || host === "[::1]" || host === "::1") {
+    return `http://127.0.0.1:${httpPort}`;
+  }
+  return `http://${window.location.hostname}:${httpPort}`;
+}
 function getWSClient(url) {
   if (!client) {
     client = new WrongStackWebSocketClient(url);
@@ -619,11 +661,15 @@ var useChatStore = create()(
         }));
       },
       appendToolProgress: (id, line) => {
+        get().appendToolProgressLines(id, [line]);
+      },
+      appendToolProgressLines: (id, lines) => {
+        if (lines.length === 0) return;
         set((state) => ({
           messages: state.messages.map((m) => {
             if (m.id !== id) return m;
             const prev = m.progressLines ?? [];
-            const next = [...prev, line];
+            const next = [...prev, ...lines];
             const trimmed = next.length > 30 ? next.slice(next.length - 30) : next;
             return { ...m, progressLines: trimmed };
           })
@@ -828,6 +874,7 @@ var useUIStore = create4()(
       shortcutsOpen: false,
       searchOpen: false,
       searchQuery: "",
+      scrollTarget: null,
       promptHistory: [],
       sidebarWidth: SIDEBAR_DEFAULT_WIDTH,
       pinnedIds: [],
@@ -852,6 +899,7 @@ var useUIStore = create4()(
       setShortcutsOpen: (open) => set({ shortcutsOpen: open }),
       setSearchOpen: (open) => set({ searchOpen: open, searchQuery: open ? "" : "" }),
       setSearchQuery: (q) => set({ searchQuery: q }),
+      requestScrollToMessage: (id) => set((s) => ({ scrollTarget: { id, nonce: (s.scrollTarget?.nonce ?? 0) + 1 } })),
       pushPrompt: (text) => set((state) => {
         const trimmed = text.trim();
         if (!trimmed) return state;
@@ -1924,6 +1972,69 @@ function notifyIfHidden(title, body, tag) {
   }
 }
 
+// src/lib/stream-coalescer.ts
+function scheduleRaf(cb) {
+  if (typeof requestAnimationFrame === "function") {
+    requestAnimationFrame(cb);
+  } else {
+    queueMicrotask(cb);
+  }
+}
+var StreamCoalescer = class {
+  pending = /* @__PURE__ */ new Map();
+  scheduled = false;
+  /**
+   * Queue `text` under `key`, to be flushed via `flush(key, joinedText)` on the
+   * next frame. Repeated calls for the same key before a flush concatenate.
+   * The `flush` callback is captured per key from the latest push.
+   */
+  push(key, text, flush) {
+    if (!text) return;
+    const existing = this.pending.get(key);
+    if (existing) {
+      existing.buffer += text;
+      existing.flush = flush;
+    } else {
+      this.pending.set(key, { buffer: text, flush });
+    }
+    this.schedule();
+  }
+  schedule() {
+    if (this.scheduled) return;
+    this.scheduled = true;
+    scheduleRaf(() => {
+      this.scheduled = false;
+      this.drain();
+    });
+  }
+  drain() {
+    if (this.pending.size === 0) return;
+    const batch = Array.from(this.pending.entries());
+    this.pending.clear();
+    for (const [key, p] of batch) {
+      if (p.buffer) p.flush(key, p.buffer);
+    }
+  }
+  /** Discard a key's buffered text without flushing. Used when the thinking
+   *  buffer is cleared (model started replying) so a pending thinking delta
+   *  can't re-populate it a frame later. */
+  drop(key) {
+    this.pending.delete(key);
+  }
+  /** Drain a single key immediately (if buffered). Safe to call when empty. */
+  flush(key) {
+    const p = this.pending.get(key);
+    if (!p) return;
+    this.pending.delete(key);
+    if (p.buffer) p.flush(key, p.buffer);
+  }
+  /** Drain every buffered key immediately. Call at run end / before finalize. */
+  flushAll() {
+    this.drain();
+  }
+};
+var streamCoalescer = new StreamCoalescer();
+
 // src/hooks/ws-handlers.ts
 function handleSessionStart(msg) {
   const vizStart = wsToVizEvent("session.start", msg.payload);
@@ -2095,6 +2206,7 @@ function handleProviderResponse(msg) {
   if (payload.stopReason !== "tool_use" && payload.stopReason !== "tool_call") useChatStore.getState().setLoading(false);
   const id = useChatStore.getState().currentAssistantMessageId;
   if (id) {
+    streamCoalescer.flush(id);
     useChatStore.getState().finalizeMessage(id);
     if (payload.usage.output > 0) useChatStore.getState().updateMessage(id, { usage: payload.usage });
   }
@@ -2124,17 +2236,26 @@ function handleIterationStarted(msg) {
 function handleTextDelta(msg) {
   const payload = msg.payload;
   useChatStore.getState().clearThinking();
+  streamCoalescer.drop("__thinking__");
   let id = useChatStore.getState().currentAssistantMessageId;
   if (!id) {
     id = useChatStore.getState().addMessage({ role: "assistant", content: "", streaming: true });
     useChatStore.getState().setCurrentAssistantMessage(id);
   }
-  useChatStore.getState().appendToMessage(id, payload.text);
+  streamCoalescer.push(
+    id,
+    payload.text,
+    (mid, text) => useChatStore.getState().appendToMessage(mid, text)
+  );
 }
 function handleThinkingDelta(msg) {
   const payload = msg.payload;
   if (!payload.text) return;
-  useChatStore.getState().appendThinking(payload.text);
+  streamCoalescer.push(
+    "__thinking__",
+    payload.text,
+    (_k, text) => useChatStore.getState().appendThinking(text)
+  );
 }
 function handleToolStarted(msg) {
   const payload = msg.payload;
@@ -2144,6 +2265,7 @@ function handleToolStarted(msg) {
     return;
   }
   useChatStore.getState().clearThinking();
+  streamCoalescer.drop("__thinking__");
   useChatStore.getState().setCurrentAssistantMessage(null);
   const id = useChatStore.getState().addMessage({ role: "tool", content: "", toolName: payload.name, toolInput: payload.input, toolUseId: payload.id });
   useChatStore.getState().setCurrentToolId(id);
@@ -2157,7 +2279,15 @@ function handleToolProgress(msg) {
   const owner = messages.find((m) => m.toolUseId === payload.id);
   if (!owner) return;
   const prefix = payload.event?.type === "warning" ? "\u26A0 " : "";
-  useChatStore.getState().appendToolProgress(owner.id, prefix + text);
+  streamCoalescer.push(
+    owner.id,
+    `${prefix}${text}
+`,
+    (oid, buffered) => useChatStore.getState().appendToolProgressLines(
+      oid,
+      buffered.split("\n").filter((l) => l.length > 0)
+    )
+  );
 }
 function handleToolExecuted(msg) {
   const payload = msg.payload;
@@ -2165,6 +2295,7 @@ function handleToolExecuted(msg) {
   const owner = payload.id ? messages.find((m) => m.toolUseId === payload.id) : currentToolId ? messages.find((m) => m.id === currentToolId) : void 0;
   if (owner?.toolResult !== void 0) return;
   if (owner) {
+    streamCoalescer.drop(owner.id);
     useChatStore.getState().setToolResult(owner.id, payload.output ?? "", payload.ok);
     useChatStore.getState().updateMessage(owner.id, { toolDurationMs: payload.durationMs });
   }
@@ -2185,6 +2316,7 @@ function handleToolConfirmNeeded(msg) {
 }
 function handleRunResult(msg) {
   const payload = msg.payload;
+  streamCoalescer.flushAll();
   useSessionStore.getState().setIteration(null);
   useChatStore.getState().setLoading(false);
   useChatStore.getState().setCurrentAssistantMessage(null);
@@ -3062,11 +3194,103 @@ import {
 import { useCallback as useCallback2, useEffect as useEffect5, useMemo, useRef as useRef2, useState as useState3 } from "react";
 
 // src/components/ChatView/utils.ts
+import { expectDefined as expectDefined3 } from "@wrongstack/core";
 function fmtTok(n) {
   if (n >= 1e6) return `${(n / 1e6).toFixed(1)}M`;
   if (n >= 1e3) return `${(n / 1e3).toFixed(n >= 1e4 ? 0 : 1)}k`;
   return String(n);
 }
+var dayKey = (ts) => {
+  const d = new Date(ts);
+  return `${d.getFullYear()}-${d.getMonth()}-${d.getDate()}`;
+};
+function dayLabel(ts, now) {
+  const d = new Date(ts);
+  const today = new Date(now);
+  const yest = new Date(now - 864e5);
+  if (dayKey(ts) === dayKey(today.getTime())) return "Today";
+  if (dayKey(ts) === dayKey(yest.getTime())) return "Yesterday";
+  return d.toLocaleDateString(void 0, {
+    weekday: "short",
+    month: "short",
+    day: "numeric",
+    year: d.getFullYear() === today.getFullYear() ? void 0 : "numeric"
+  });
+}
+function buildChatRows(messages, now = Date.now()) {
+  const groups = [];
+  for (let i = 0; i < messages.length; i++) {
+    const m = expectDefined3(messages[i]);
+    if (m.role === "tool") {
+      const last = groups[groups.length - 1];
+      if (last && last.kind === "tools") {
+        last.tools.push(m);
+      } else {
+        groups.push({ kind: "tools", tools: [m], key: m.id });
+      }
+    } else {
+      const prev = messages[i - 1];
+      groups.push({ kind: "msg", message: m, isFirst: !prev || prev.role !== m.role });
+    }
+  }
+  const turns = [];
+  for (const g of groups) {
+    if (g.kind === "msg" && g.message.role === "user") {
+      turns.push({ kind: "user", message: g.message, key: g.message.id });
+      continue;
+    }
+    const last = turns[turns.length - 1];
+    if (last && last.kind === "agent") {
+      last.items.push(g);
+    } else {
+      const key = g.kind === "msg" ? g.message.id : g.key;
+      turns.push({ kind: "agent", items: [g], key });
+    }
+  }
+  const turnTs = (t) => {
+    if (t.kind === "user") return t.message.timestamp;
+    const first = expectDefined3(t.items[0]);
+    return first.kind === "msg" ? first.message.timestamp : first.tools[0]?.timestamp ?? 0;
+  };
+  const rows = [];
+  let prevDay = null;
+  for (let idx = 0; idx < turns.length; idx++) {
+    const t = expectDefined3(turns[idx]);
+    const ts = turnTs(t);
+    const day = dayKey(ts);
+    if (day !== prevDay) {
+      rows.push({ kind: "day", key: `day-${day}-${idx}`, label: dayLabel(ts, now) });
+      prevDay = day;
+    }
+    if (t.kind === "user") {
+      rows.push({ kind: "user", key: t.key, message: t.message });
+      continue;
+    }
+    const isLastTurn = idx === turns.length - 1;
+    const items = t.items.map((g, gi) => {
+      const isContinuation = gi > 0;
+      if (g.kind === "msg") {
+        return {
+          kind: "msg",
+          key: g.message.id,
+          message: g.message,
+          isFirst: !isContinuation && g.isFirst,
+          isContinuation
+        };
+      }
+      return {
+        kind: "tools",
+        key: g.key,
+        tools: g.tools,
+        isContinuation,
+        isLastGroup: gi === t.items.length - 1,
+        hasRunningTool: g.tools.some((tt) => tt.toolResult === void 0)
+      };
+    });
+    rows.push({ kind: "agent", key: t.key, items, isLastTurn });
+  }
+  return rows;
+}
 
 // src/components/ContextBar.tsx
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
@@ -4425,7 +4649,7 @@ function TaskBoard({
 }
 
 // src/components/WorktreeGraph.tsx
-import { expectDefined as expectDefined3 } from "@wrongstack/core";
+import { expectDefined as expectDefined4 } from "@wrongstack/core";
 import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 var LANE_COLORS = ["#3b82f6", "#06b6d4", "#22c55e", "#eab308", "#f97316", "#a855f7", "#ec4899"];
 var shortBranch = (b) => b.replace(/^wstack\/ap\//, "");
@@ -4464,7 +4688,7 @@ function WorktreeGraph({
         /* @__PURE__ */ jsx9("text", { x: trunkX - 4, y: 14, fontSize: 11, fill: "#9ca3af", children: baseBranch || "HEAD" }),
         /* @__PURE__ */ jsx9("circle", { cx: trunkX, cy: 20, r: 5, fill: "#F93951" }),
         nodes.map((n) => {
-          const e = EDGE_STATE[n.handle.status] ?? expectDefined3(EDGE_STATE.active);
+          const e = EDGE_STATE[n.handle.status] ?? expectDefined4(EDGE_STATE.active);
           const merged = n.handle.status === "merged";
           const conflict = n.handle.status === "needs-review" || n.handle.status === "failed";
           return /* @__PURE__ */ jsxs8("g", { className: "transition-all duration-500", children: [
@@ -4792,7 +5016,6 @@ function AutoPhaseView({ onClose }) {
 }
 
 // src/components/ChatView/index.tsx
-import { expectDefined as expectDefined12 } from "@wrongstack/core";
 import {
   Activity as Activity3,
   ArrowDown as ArrowDown3,
@@ -4806,7 +5029,8 @@ import {
   Terminal as Terminal4,
   Zap as Zap5
 } from "lucide-react";
-import { useCallback as useCallback10, useEffect as useEffect18, useRef as useRef14, useState as useState24 } from "react";
+import { memo as memo5, useCallback as useCallback10, useEffect as useEffect18, useMemo as useMemo8, useRef as useRef14, useState as useState24 } from "react";
+import { VList } from "virtua";
 
 // src/components/AutonomyPicker.tsx
 import {
@@ -4925,7 +5149,7 @@ function AutonomyPicker({
 }
 
 // src/components/ChatInput.tsx
-import { expectDefined as expectDefined6 } from "@wrongstack/core";
+import { expectDefined as expectDefined7 } from "@wrongstack/core";
 import { Pencil, Send, Square as Square2, Sparkles as Sparkles3 } from "lucide-react";
 import { useCallback as useCallback5, useEffect as useEffect10, useRef as useRef7, useState as useState9 } from "react";
 
@@ -5436,7 +5660,7 @@ function renderGroupedList(filtered, index, dispatch, setIndex) {
 }
 
 // src/components/FilePicker.tsx
-import { expectDefined as expectDefined4 } from "@wrongstack/core";
+import { expectDefined as expectDefined5 } from "@wrongstack/core";
 import { FileText as FileText2, Folder } from "lucide-react";
 import { useEffect as useEffect8, useRef as useRef5, useState as useState7 } from "react";
 import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
@@ -5478,7 +5702,7 @@ function FilePicker({ query, onPick, onClose }) {
       } else if (e.key === "Enter" || e.key === "Tab") {
         if (files.length === 0) return;
         e.preventDefault();
-        onPick(expectDefined4(files[index]));
+        onPick(expectDefined5(files[index]));
       } else if (e.key === "Escape") {
         e.preventDefault();
         onClose();
@@ -5516,7 +5740,7 @@ function FilePicker({ query, onPick, onClose }) {
 }
 
 // src/components/ChatInput/slash-commands.ts
-import { expectDefined as expectDefined5 } from "@wrongstack/core";
+import { expectDefined as expectDefined6 } from "@wrongstack/core";
 var SLASH_COMMANDS = [
   // Session
   { name: "/new", category: "Session", description: "Start a brand-new session (fresh on disk and in memory)" },
@@ -5543,12 +5767,12 @@ var SLASH_COMMANDS = [
   // Config
   { name: "/settings", category: "Config", aliases: ["/model"], description: "Open settings (provider/model/keys)" },
   { name: "/enhance", category: "Config", description: "Toggle prompt refinement before sending" },
-  { name: "/abort", category: "Config", aliases: ["/stop"], description: "Abort the current run" },
+  { name: "/interrupt", category: "Run", aliases: ["/abort", "/stop", "/int"], description: "Stop the current run (abort the in-flight request)" },
   // App
   { name: "/help", category: "App", description: "Show every slash command and what it does" },
   { name: "/exit", category: "App", description: "Exit the session and close WebUI" }
 ];
-var SLASH_CATEGORY_ORDER = ["Session", "Inspect", "Config", "App"];
+var SLASH_CATEGORY_ORDER = ["Run", "Session", "Inspect", "Config", "App"];
 function matchSlash(query) {
   const q = query.toLowerCase();
   if (q === "/" || q === "") return SLASH_COMMANDS;
@@ -5559,7 +5783,7 @@ function matchSlash(query) {
 function detectAtMention(value, cursor) {
   let i = cursor - 1;
   while (i >= 0) {
-    const c = expectDefined5(value[i]);
+    const c = expectDefined6(value[i]);
     if (c === "@") {
       const prev = i > 0 ? value[i - 1] : "";
       if (i === 0 || /\s/.test(prev ?? "")) {
@@ -6160,8 +6384,10 @@ function ChatInput({
           downloadChatAsMarkdown();
           addMessage({ role: "assistant", content: "\u{1F4E5} Chat exported to your downloads folder." });
           return true;
+        case "/interrupt":
         case "/abort":
         case "/stop":
+        case "/int":
           sendAbort();
           setLoading(false);
           return true;
@@ -6367,7 +6593,7 @@ function ChatInput({
     setLoading(false);
     const all = useChatStore.getState().messages;
     for (let i = all.length - 1; i >= 0; i--) {
-      const m = expectDefined6(all[i]);
+      const m = expectDefined7(all[i]);
       if (m.role === "user" && m.content) {
         setInput(m.content);
         requestAnimationFrame(() => {
@@ -7041,7 +7267,7 @@ function CheckpointTimeline({
 }
 
 // src/components/ContextModePicker.tsx
-import { expectDefined as expectDefined7 } from "@wrongstack/core";
+import { expectDefined as expectDefined8 } from "@wrongstack/core";
 import { Check as Check2, ChevronDown as ChevronDown3, Gauge as Gauge2, Wrench as Wrench4, Zap as Zap3, FileSearch } from "lucide-react";
 import { useCallback as useCallback7, useEffect as useEffect12, useRef as useRef9, useState as useState11 } from "react";
 import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
@@ -7100,7 +7326,7 @@ function ContextModePicker() {
     setOpen(false);
   }, [client2]);
   const items = contextModes.length > 0 ? contextModes : FALLBACK_MODES;
-  const active = items.find((m) => m.id === contextMode) ?? expectDefined7(items[0]);
+  const active = items.find((m) => m.id === contextMode) ?? expectDefined8(items[0]);
   return /* @__PURE__ */ jsxs17("div", { ref: rootRef, className: "relative shrink-0", children: [
     /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-1", children: [
       /* @__PURE__ */ jsxs17(
@@ -7386,7 +7612,7 @@ function CostChip() {
 }
 
 // src/components/MessageBubble/index.tsx
-import { expectDefined as expectDefined10 } from "@wrongstack/core";
+import { expectDefined as expectDefined11 } from "@wrongstack/core";
 
 // src/lib/tool-summary.ts
 var FALLBACK_HEAD_FIELDS = [
@@ -7523,7 +7749,7 @@ import ReactMarkdown from "react-markdown";
 import remarkGfm from "remark-gfm";
 
 // src/components/DiffView.tsx
-import { expectDefined as expectDefined8 } from "@wrongstack/core";
+import { expectDefined as expectDefined9 } from "@wrongstack/core";
 import { memo, useMemo as useMemo3 } from "react";
 import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
 var DiffView = memo(function DiffView2({ oldText, newText, caption }) {
@@ -7595,8 +7821,8 @@ function computeDiff(oldText, newText) {
   const dp = Array.from({ length: n + 1 }, () => new Array(m + 1).fill(0));
   for (let i2 = n - 1; i2 >= 0; i2--) {
     for (let j2 = m - 1; j2 >= 0; j2--) {
-      if (a[i2] === b[j2]) expectDefined8(dp[i2])[j2] = expectDefined8(dp[i2 + 1]?.[j2 + 1]) + 1;
-      else expectDefined8(dp[i2])[j2] = Math.max(expectDefined8(dp[i2 + 1]?.[j2]), expectDefined8(dp[i2]?.[j2 + 1]));
+      if (a[i2] === b[j2]) expectDefined9(dp[i2])[j2] = expectDefined9(dp[i2 + 1]?.[j2 + 1]) + 1;
+      else expectDefined9(dp[i2])[j2] = Math.max(expectDefined9(dp[i2 + 1]?.[j2]), expectDefined9(dp[i2]?.[j2 + 1]));
     }
   }
   const rows = [];
@@ -7604,19 +7830,19 @@ function computeDiff(oldText, newText) {
   let j = 0;
   while (i < n && j < m) {
     if (a[i] === b[j]) {
-      rows.push({ kind: "ctx", text: expectDefined8(a[i]) });
+      rows.push({ kind: "ctx", text: expectDefined9(a[i]) });
       i++;
       j++;
-    } else if (expectDefined8(dp[i + 1]?.[j]) >= expectDefined8(dp[i]?.[j + 1])) {
-      rows.push({ kind: "del", text: expectDefined8(a[i]) });
+    } else if (expectDefined9(dp[i + 1]?.[j]) >= expectDefined9(dp[i]?.[j + 1])) {
+      rows.push({ kind: "del", text: expectDefined9(a[i]) });
       i++;
     } else {
-      rows.push({ kind: "add", text: expectDefined8(b[j]) });
+      rows.push({ kind: "add", text: expectDefined9(b[j]) });
       j++;
     }
   }
-  while (i < n) rows.push({ kind: "del", text: expectDefined8(a[i++]) });
-  while (j < m) rows.push({ kind: "add", text: expectDefined8(b[j++]) });
+  while (i < n) rows.push({ kind: "del", text: expectDefined9(a[i++]) });
+  while (j < m) rows.push({ kind: "add", text: expectDefined9(b[j++]) });
   return rows;
 }
 function diffFromToolInput(toolName, input) {
@@ -8092,13 +8318,13 @@ function CopyButton({
 }
 
 // src/components/MessageBubble/ErrorBody.tsx
-import { expectDefined as expectDefined9 } from "@wrongstack/core";
+import { expectDefined as expectDefined10 } from "@wrongstack/core";
 import { useState as useState16 } from "react";
 import { jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
 function detectStackBoundary(text) {
   const lines = text.split("\n");
   for (let i = 0; i < lines.length; i++) {
-    const ln = expectDefined9(lines[i]);
+    const ln = expectDefined10(lines[i]);
     if (/^\s*at\s+\S+.*\(.*:\d+:\d+\)\s*$/.test(ln)) return i;
     if (/^\s*at\s+\S+\.\S+\(\S+\.java:\d+\)\s*$/.test(ln)) return i;
     if (/^\s+File "[^"]+", line \d+/.test(ln)) return i;
@@ -8229,7 +8455,7 @@ var MessageBubble = memo3(function MessageBubble2({
     if (message.role !== "assistant" || isLoading) return false;
     const all = useChatStore.getState().messages;
     for (let i = all.length - 1; i >= 0; i--) {
-      const m = expectDefined10(all[i]);
+      const m = expectDefined11(all[i]);
       if (m.role === "assistant") return m.id === message.id;
     }
     return false;
@@ -8246,7 +8472,7 @@ var MessageBubble = memo3(function MessageBubble2({
       }
     }
     if (userIdx === -1) return;
-    const userMsg = expectDefined10(all[userIdx]);
+    const userMsg = expectDefined11(all[userIdx]);
     truncateAfter(userMsg.id);
     addMessage({ role: "user", content: userMsg.content });
     setLoading(true);
@@ -8723,8 +8949,10 @@ function SearchOverlay() {
   const query = useUIStore((s) => s.searchQuery);
   const setQuery = useUIStore((s) => s.setSearchQuery);
   const messages = useChatStore((s) => s.messages);
+  const requestScrollToMessage = useUIStore((s) => s.requestScrollToMessage);
   const inputRef = useRef13(null);
   const [activeHit, setActiveHit] = useState21(0);
+  const [repaintNonce, setRepaintNonce] = useState21(0);
   useEffect16(() => {
     if (open) requestAnimationFrame(() => inputRef.current?.focus());
   }, [open]);
@@ -8794,15 +9022,18 @@ function SearchOverlay() {
       highlights.delete("chat-search-active");
     }
     return clear;
-  }, [query, hits, activeHit, open]);
+  }, [query, hits, activeHit, open, repaintNonce]);
   useEffect16(() => {
     const id = hits[activeHit];
     if (!id) return;
-    const el = document.querySelector(`[data-message-id="${id}"]`);
-    if (el) {
-      el.scrollIntoView({ behavior: "smooth", block: "center" });
-    }
-  }, [hits, activeHit]);
+    requestScrollToMessage(id);
+    let n = 0;
+    let raf = requestAnimationFrame(function tick() {
+      setRepaintNonce((v) => v + 1);
+      if (++n < 3) raf = requestAnimationFrame(tick);
+    });
+    return () => cancelAnimationFrame(raf);
+  }, [hits, activeHit, requestScrollToMessage]);
   if (!open) return null;
   const step = (dir) => {
     if (hits.length === 0) return;
@@ -8876,7 +9107,7 @@ function SearchOverlay() {
 }
 
 // src/components/ToolGroup.tsx
-import { expectDefined as expectDefined11 } from "@wrongstack/core";
+import { expectDefined as expectDefined12 } from "@wrongstack/core";
 import { CheckCircle2 as CheckCircle26, ChevronDown as ChevronDown7, ChevronRight as ChevronRight5, Loader2 as Loader22, Terminal as Terminal3, XCircle as XCircle6 } from "lucide-react";
 import { memo as memo4, useState as useState22 } from "react";
 import { jsx as jsx32, jsxs as jsxs30 } from "react/jsx-runtime";
@@ -8894,7 +9125,7 @@ var ToolGroup = memo4(function ToolGroup2({
 }) {
   const [open, setOpen] = useState22(defaultOpen);
   if (tools.length === 1) {
-    return /* @__PURE__ */ jsx32(MessageBubble, { message: expectDefined11(tools[0]), isFirst: true, isContinuation });
+    return /* @__PURE__ */ jsx32(MessageBubble, { message: expectDefined12(tools[0]), isFirst: true, isContinuation });
   }
   const running = tools.filter((t) => t.toolResult === void 0).length;
   const errored = tools.filter((t) => t.isError).length;
@@ -8942,13 +9173,13 @@ var ToolGroup = memo4(function ToolGroup2({
 import {
   ArchiveRestore as ArchiveRestore2,
   ArrowRight as ArrowRight3,
-  Bug,
   Clock as Clock7,
+  Crosshair,
   KeyRound,
   Keyboard as Keyboard2,
+  Lightbulb as Lightbulb2,
   Search as Search3,
   Sparkles as Sparkles4,
-  Wrench as Wrench5,
   Zap as Zap4
 } from "lucide-react";
 import { useEffect as useEffect17, useState as useState23 } from "react";
@@ -8956,46 +9187,46 @@ import { Fragment as Fragment8, jsx as jsx33, jsxs as jsxs31 } from "react/jsx-r
 var CARDS = [
   {
     icon: Search3,
-    title: "Explore",
-    hint: "Understand the code before changing it",
+    title: "Understand",
+    hint: "Explore and analyze the codebase",
     tone: "text-blue-600 dark:text-blue-400 bg-blue-500/10 border-blue-500/20",
     prompts: [
-      "Walk me through this codebase: what are the top-level packages or modules, what does each do, and how do they depend on one another? What cross-cutting patterns or abstractions should I understand first?",
-      "Find the public API surface of this project \u2014 all exported functions, classes, and types that external consumers rely on. Flag any that lack documentation or have unclear contracts.",
-      "Map the data flow for a single user action from entry point to persistence. Where does validation happen? Where are side effects triggered? Show me the call chain and any middleware involved."
+      "Map out the structure of this codebase: what are the main modules or components, how do they depend on each other, and what are the key patterns used throughout?",
+      "Find and document the public API surface \u2014 all exported interfaces, functions, and types that other parts of the system depend on.",
+      "Trace the flow of data through the system for a typical operation. Where does input validation happen? Where are side effects triggered?"
     ]
   },
   {
-    icon: Wrench5,
-    title: "Build",
-    hint: "Add a feature end-to-end",
+    icon: Lightbulb2,
+    title: "Create",
+    hint: "Build new features and functionality",
     tone: "text-emerald-600 dark:text-emerald-400 bg-emerald-500/10 border-emerald-500/20",
     prompts: [
-      "Add a new end-to-end feature. Walk through the layers: data model, API/serialization, business logic, UI (if applicable), and tests. Use existing patterns in this codebase rather than inventing new ones.",
-      "Write comprehensive tests for an existing module that has low coverage. Cover happy paths, edge cases, and error states. Use whatever test runner and patterns this project already uses.",
-      "Add structured logging or observability to a critical code path. Use the project\u2019s existing logging conventions. Make sure errors carry enough context to debug without re-running."
+      "Add a new feature that covers the full stack: data model, business logic, and any UI or API layers. Follow existing patterns in this codebase.",
+      "Write comprehensive tests for a module with low coverage. Include happy paths, edge cases, and error scenarios.",
+      "Add observability to a critical path \u2014 structured logging, error tracking, or metrics that help diagnose issues in production."
     ]
   },
   {
-    icon: Bug,
-    title: "Debug",
-    hint: "Track a problem to its root cause",
+    icon: Crosshair,
+    title: "Investigate",
+    hint: "Debug issues and find root causes",
     tone: "text-amber-600 dark:text-amber-400 bg-amber-500/10 border-amber-500/20",
     prompts: [
-      "Something isn't behaving as expected \u2014 data looks wrong, a feature silently fails, or state drifts over time. Help me trace it: start from the symptom, follow the code path, and identify where the logic diverges from intent.",
-      "The app works fine locally but breaks in production or CI. Check for environment differences, missing config, race conditions, or infrastructure-level assumptions that might explain the gap.",
-      "Performance degrades under load or over time. Profile the hot path, identify bottlenecks (N+1 queries, blocking I/O, large allocations, expensive renders), and propose targeted fixes with measurable impact."
+      "Something isn't working as expected \u2014 help me trace from the symptom to the root cause. Follow the code path and identify where behavior diverges from intent.",
+      "There's a difference between how this works locally versus in production or CI. Check for environment differences, configuration issues, or hidden assumptions.",
+      "Performance is degrading. Identify the bottlenecks \u2014 whether N+1 queries, blocking I/O, unnecessary allocations, or something else \u2014 and propose targeted fixes."
     ]
   },
   {
     icon: Sparkles4,
-    title: "Refactor",
-    hint: "Clean up without breaking behavior",
+    title: "Improve",
+    hint: "Refactor and optimize existing code",
     tone: "text-violet-600 dark:text-violet-400 bg-violet-500/10 border-violet-500/20",
     prompts: [
-      "Find duplicated or near-duplicated logic across the codebase. Extract the shared pieces into a single module or utility, update call sites, and ensure the existing tests still pass.",
-      "Identify modules that have grown too large or have too many responsibilities. Propose a split that respects the project\u2019s existing structure, keeps the public API stable, and can be done incrementally.",
-      "Audit error handling across the codebase: are errors propagated consistently? Are they wrapped with enough context? Are there swallowed errors or bare panics? Propose a uniform approach and apply it to the worst offenders."
+      "Find duplicated or similar logic that could be consolidated into shared utilities. Extract the common parts and update the call sites.",
+      "Identify modules that have grown too large or handle too many responsibilities. Propose a cleaner separation that can be done incrementally.",
+      "Review error handling across the codebase: are errors consistent, well-contextualized, and properly propagated? Suggest improvements to the worst cases."
     ]
   }
 ];
@@ -9211,62 +9442,73 @@ function WelcomeScreen() {
   ] });
 }
 
-// src/components/ui/scroll-area.tsx
-import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import * as React2 from "react";
-import { jsx as jsx34, jsxs as jsxs32 } from "react/jsx-runtime";
-var ScrollArea = React2.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs32(
-  ScrollAreaPrimitive.Root,
-  {
-    ref,
-    className: cn("relative overflow-hidden", className),
-    ...props,
-    children: [
-      /* @__PURE__ */ jsx34(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
-      /* @__PURE__ */ jsx34(ScrollBar, {}),
-      /* @__PURE__ */ jsx34(ScrollAreaPrimitive.Corner, {})
-    ]
-  }
-));
-ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollBar = React2.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx34(
-  ScrollAreaPrimitive.ScrollAreaScrollbar,
-  {
-    ref,
-    orientation,
-    className: cn(
-      "flex touch-none select-none transition-colors",
-      orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]",
-      orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]",
-      className
-    ),
-    ...props,
-    children: /* @__PURE__ */ jsx34(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
-  }
-));
-ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
-
 // src/components/ChatView/ThinkingBubble.tsx
 import { Brain as Brain2 } from "lucide-react";
-import { jsx as jsx35, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs32 } from "react/jsx-runtime";
 function ThinkingBubble() {
   const buf = useChatStore((s) => s.thinkingBuffer);
   if (!buf) return null;
   const tailLines = buf.split("\n").slice(-6);
   const tail = tailLines.join("\n").trim();
-  return /* @__PURE__ */ jsxs33("div", { className: "flex gap-3 animate-message", children: [
-    /* @__PURE__ */ jsx35("div", { className: "flex-shrink-0 w-8 h-8 rounded-full flex items-center justify-center bg-violet-500/10 text-violet-600 dark:text-violet-400 ring-2 ring-offset-2 ring-offset-background ring-violet-500/20", children: /* @__PURE__ */ jsx35(Brain2, { className: "h-4 w-4 animate-pulse" }) }),
-    /* @__PURE__ */ jsxs33("div", { className: "flex flex-col gap-1 max-w-[85%] min-w-0", children: [
-      /* @__PURE__ */ jsx35("span", { className: "text-xs font-medium text-violet-600 dark:text-violet-400 px-1", children: "Thinking\u2026" }),
-      /* @__PURE__ */ jsx35("div", { className: "rounded-2xl rounded-bl-md px-3 py-2 bg-violet-500/[0.04] border border-violet-500/20 text-foreground/80", children: /* @__PURE__ */ jsx35("pre", { className: "whitespace-pre-wrap break-words font-sans text-xs leading-relaxed italic max-h-32 overflow-hidden", children: tail || "\u2026" }) })
+  return /* @__PURE__ */ jsxs32("div", { className: "flex gap-3 animate-message", children: [
+    /* @__PURE__ */ jsx34("div", { className: "flex-shrink-0 w-8 h-8 rounded-full flex items-center justify-center bg-violet-500/10 text-violet-600 dark:text-violet-400 ring-2 ring-offset-2 ring-offset-background ring-violet-500/20", children: /* @__PURE__ */ jsx34(Brain2, { className: "h-4 w-4 animate-pulse" }) }),
+    /* @__PURE__ */ jsxs32("div", { className: "flex flex-col gap-1 max-w-[85%] min-w-0", children: [
+      /* @__PURE__ */ jsx34("span", { className: "text-xs font-medium text-violet-600 dark:text-violet-400 px-1", children: "Thinking\u2026" }),
+      /* @__PURE__ */ jsx34("div", { className: "rounded-2xl rounded-bl-md px-3 py-2 bg-violet-500/[0.04] border border-violet-500/20 text-foreground/80", children: /* @__PURE__ */ jsx34("pre", { className: "whitespace-pre-wrap break-words font-sans text-xs leading-relaxed italic max-h-32 overflow-hidden", children: tail || "\u2026" }) })
     ] })
   ] });
 }
 
 // src/components/ChatView/index.tsx
-import { Fragment as Fragment9, jsx as jsx36, jsxs as jsxs34 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx35, jsxs as jsxs33 } from "react/jsx-runtime";
+var ChatRowView = memo5(function ChatRowView2({
+  row,
+  isLoading,
+  compactMode,
+  isFirstRow
+}) {
+  const wrap = cn(
+    "mx-auto max-w-5xl w-full px-4",
+    isFirstRow && "pt-4",
+    compactMode ? "pb-3" : "pb-6"
+  );
+  if (row.kind === "day") {
+    return /* @__PURE__ */ jsx35("div", { className: wrap, children: /* @__PURE__ */ jsxs33("div", { className: "flex items-center gap-3 py-1 text-[11px] text-muted-foreground/70 uppercase tracking-wider font-medium", children: [
+      /* @__PURE__ */ jsx35("div", { className: "flex-1 h-px bg-border/50" }),
+      /* @__PURE__ */ jsx35("span", { children: row.label }),
+      /* @__PURE__ */ jsx35("div", { className: "flex-1 h-px bg-border/50" })
+    ] }) });
+  }
+  if (row.kind === "user") {
+    return /* @__PURE__ */ jsx35("div", { className: wrap, children: /* @__PURE__ */ jsx35(MessageBubble, { message: row.message, isFirst: true }) });
+  }
+  return /* @__PURE__ */ jsx35("div", { className: wrap, children: /* @__PURE__ */ jsx35("div", { className: cn("chat-turn", compactMode ? "space-y-1" : "space-y-1.5"), children: row.items.map((it) => {
+    if (it.kind === "msg") {
+      return /* @__PURE__ */ jsx35(
+        MessageBubble,
+        {
+          message: it.message,
+          isFirst: it.isFirst,
+          isContinuation: it.isContinuation
+        },
+        it.key
+      );
+    }
+    const defaultOpen = row.isLastTurn && it.isLastGroup && isLoading && it.hasRunningTool;
+    return /* @__PURE__ */ jsx35(
+      ToolGroup,
+      {
+        tools: it.tools,
+        defaultOpen,
+        isContinuation: it.isContinuation
+      },
+      it.key
+    );
+  }) }) });
+});
 function ChatView() {
-  const { messages, isLoading } = useChatStore();
+  const messages = useChatStore((s) => s.messages);
+  const isLoading = useChatStore((s) => s.isLoading);
   const sidebarOpen = useUIStore((s) => s.sidebarOpen);
   const toggleSidebar = useUIStore((s) => s.toggleSidebar);
   const compactMode = useUIStore((s) => s.compactMode);
@@ -9297,7 +9539,24 @@ function ChatView() {
     };
   }, [switcherOpen]);
   const { provider, model } = useConfigStore();
-  const scrollRef = useRef14(null);
+  const vlistRef = useRef14(null);
+  const rows = useMemo8(() => buildChatRows(messages), [messages]);
+  const childCountRef = useRef14(0);
+  childCountRef.current = rows.length + 1;
+  const rowIndexById = useMemo8(() => {
+    const map = /* @__PURE__ */ new Map();
+    rows.forEach((row, i) => {
+      if (row.kind === "user") map.set(row.message.id, i);
+      else if (row.kind === "agent") {
+        for (const it of row.items) {
+          if (it.kind === "msg") map.set(it.message.id, i);
+          else for (const t of it.tools) map.set(t.id, i);
+        }
+      }
+    });
+    return map;
+  }, [rows]);
+  const scrollTarget = useUIStore((s) => s.scrollTarget);
   const autonomy = useLocalPrefs((s) => s.autonomy);
   const handleAutonomyChange = useCallback10((mode) => {
     useLocalPrefs.getState().set({ autonomy: mode });
@@ -9318,58 +9577,52 @@ function ChatView() {
   const [unreadCount, setUnreadCount] = useState24(0);
   const [scrolledDeep, setScrolledDeep] = useState24(false);
   const lastSeenCount = useRef14(messages.length);
-  const getViewport = useCallback10(() => {
-    return scrollRef.current?.querySelector("[data-radix-scroll-area-viewport]") ?? null;
+  const handleScroll = useCallback10(() => {
+    const h = vlistRef.current;
+    if (!h) return;
+    const dist = h.scrollSize - h.scrollOffset - h.viewportSize;
+    const nowPinned = dist < 120;
+    setPinnedToBottom(nowPinned);
+    if (nowPinned) {
+      setUnreadCount(0);
+      lastSeenCount.current = useChatStore.getState().messages.length;
+    }
+    setScrolledDeep(h.scrollOffset > h.viewportSize && h.scrollSize > h.viewportSize * 2.5);
   }, []);
   useEffect18(() => {
-    const viewport = getViewport();
-    if (!viewport) return;
-    const onScroll = () => {
-      const dist = viewport.scrollHeight - viewport.scrollTop - viewport.clientHeight;
-      const nowPinned = dist < 120;
-      setPinnedToBottom(nowPinned);
-      if (nowPinned) {
-        setUnreadCount(0);
-        lastSeenCount.current = messages.length;
-      }
-      const deep = viewport.scrollTop > viewport.clientHeight && viewport.scrollHeight > viewport.clientHeight * 2.5;
-      setScrolledDeep(deep);
-    };
-    viewport.addEventListener("scroll", onScroll, { passive: true });
-    return () => viewport.removeEventListener("scroll", onScroll);
-  }, [getViewport, messages.length]);
-  useEffect18(() => {
-    const viewport = getViewport();
-    if (!viewport) return;
+    const h = vlistRef.current;
+    if (!h) return;
     if (pinnedToBottom) {
-      viewport.scrollTop = viewport.scrollHeight;
+      h.scrollToIndex(childCountRef.current - 1, { align: "end" });
       lastSeenCount.current = messages.length;
     } else {
       const delta = messages.length - lastSeenCount.current;
       if (delta > 0) setUnreadCount(delta);
     }
-  }, [messages, pinnedToBottom, getViewport]);
+  }, [messages, pinnedToBottom]);
   useEffect18(() => {
-    const viewport = getViewport();
-    if (!viewport) return;
-    viewport.scrollTop = viewport.scrollHeight;
     setPinnedToBottom(true);
     setUnreadCount(0);
     lastSeenCount.current = useChatStore.getState().messages.length;
-  }, [sessionId, getViewport]);
+    requestAnimationFrame(() => {
+      vlistRef.current?.scrollToIndex(childCountRef.current - 1, { align: "end" });
+    });
+  }, [sessionId]);
+  useEffect18(() => {
+    if (!scrollTarget) return;
+    const idx = rowIndexById.get(scrollTarget.id);
+    if (idx === void 0) return;
+    vlistRef.current?.scrollToIndex(idx, { align: "center", smooth: true });
+  }, [scrollTarget, rowIndexById]);
   const scrollToBottom = useCallback10(() => {
-    const viewport = getViewport();
-    if (!viewport) return;
-    viewport.scrollTo({ top: viewport.scrollHeight, behavior: "smooth" });
+    vlistRef.current?.scrollToIndex(childCountRef.current - 1, { align: "end", smooth: true });
     setPinnedToBottom(true);
     setUnreadCount(0);
-    lastSeenCount.current = messages.length;
-  }, [getViewport, messages.length]);
+    lastSeenCount.current = useChatStore.getState().messages.length;
+  }, []);
   const scrollToTop = useCallback10(() => {
-    const viewport = getViewport();
-    if (!viewport) return;
-    viewport.scrollTo({ top: 0, behavior: "smooth" });
-  }, [getViewport]);
+    vlistRef.current?.scrollToIndex(0, { align: "start", smooth: true });
+  }, []);
   const [runStartedAt, setRunStartedAt] = useState24(null);
   const [nowTick, setNowTick] = useState24(() => Date.now());
   const streamAnchor = useRef14(null);
@@ -9398,11 +9651,11 @@ function ChatView() {
   })();
   const stateTone = agentState === "idle" ? "bg-muted text-muted-foreground" : agentState === "streaming" ? "bg-blue-500/10 text-blue-600 dark:text-blue-400" : "bg-amber-500/10 text-amber-600 dark:text-amber-400";
   const hasStatusContent = maxContext > 0 && lastInputTokens > 0 || totalTokens.input > 0 || !!startTime;
-  return /* @__PURE__ */ jsxs34("div", { className: "flex flex-col flex-1 min-h-0", children: [
-    /* @__PURE__ */ jsxs34("header", { className: "flex flex-col border-b bg-card/95 backdrop-blur-sm supports-[backdrop-filter]:bg-card/80 shrink-0 sticky top-0 z-20", children: [
-      /* @__PURE__ */ jsxs34("div", { className: "flex items-center justify-between gap-2 px-3 py-2", children: [
-        /* @__PURE__ */ jsxs34("div", { className: "flex items-center gap-1.5 min-w-0 flex-1 overflow-hidden", children: [
-          !sidebarOpen && /* @__PURE__ */ jsx36(
+  return /* @__PURE__ */ jsxs33("div", { className: "flex flex-col flex-1 min-h-0", children: [
+    /* @__PURE__ */ jsxs33("header", { className: "flex flex-col border-b bg-card/95 backdrop-blur-sm supports-[backdrop-filter]:bg-card/80 shrink-0 sticky top-0 z-20", children: [
+      /* @__PURE__ */ jsxs33("div", { className: "flex items-center justify-between gap-2 px-3 py-2", children: [
+        /* @__PURE__ */ jsxs33("div", { className: "flex items-center gap-1.5 min-w-0 flex-1 overflow-hidden", children: [
+          !sidebarOpen && /* @__PURE__ */ jsx35(
             Button,
             {
               variant: "ghost",
@@ -9410,11 +9663,11 @@ function ChatView() {
               className: "h-7 w-7 shrink-0",
               onClick: toggleSidebar,
               title: "Open sidebar (Ctrl+\\\\)",
-              children: /* @__PURE__ */ jsx36(PanelLeftOpen, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ jsx35(PanelLeftOpen, { className: "h-4 w-4" })
             }
           ),
-          !sidebarOpen && /* @__PURE__ */ jsx36("div", { className: "flex items-center gap-1.5 shrink-0 mr-1", children: /* @__PURE__ */ jsx36("div", { className: "w-5 h-5 rounded bg-primary flex items-center justify-center", children: /* @__PURE__ */ jsx36(Zap5, { className: "h-3 w-3 text-primary-foreground" }) }) }),
-          /* @__PURE__ */ jsxs34(
+          !sidebarOpen && /* @__PURE__ */ jsx35("div", { className: "flex items-center gap-1.5 shrink-0 mr-1", children: /* @__PURE__ */ jsx35("div", { className: "w-5 h-5 rounded bg-primary flex items-center justify-center", children: /* @__PURE__ */ jsx35(Zap5, { className: "h-3 w-3 text-primary-foreground" }) }) }),
+          /* @__PURE__ */ jsxs33(
             "span",
             {
               className: cn(
@@ -9423,12 +9676,12 @@ function ChatView() {
               ),
               title: `Agent state: ${agentState}`,
               children: [
-                agentState !== "idle" && /* @__PURE__ */ jsx36("span", { className: "h-1.5 w-1.5 rounded-full bg-current animate-pulse" }),
-                /* @__PURE__ */ jsx36("span", { children: agentState })
+                agentState !== "idle" && /* @__PURE__ */ jsx35("span", { className: "h-1.5 w-1.5 rounded-full bg-current animate-pulse" }),
+                /* @__PURE__ */ jsx35("span", { children: agentState })
               ]
             }
           ),
-          sessionId && (renamingTitle ? /* @__PURE__ */ jsx36(
+          sessionId && (renamingTitle ? /* @__PURE__ */ jsx35(
             "input",
             {
               value: titleDraft,
@@ -9451,7 +9704,7 @@ function ChatView() {
               className: "h-5 px-1.5 text-[11px] bg-background border border-primary/40 rounded focus:outline-none focus:ring-1 focus:ring-ring shrink-0 w-32",
               autoFocus: true
             }
-          ) : /* @__PURE__ */ jsxs34(
+          ) : /* @__PURE__ */ jsxs33(
             "button",
             {
               type: "button",
@@ -9462,15 +9715,15 @@ function ChatView() {
               className: "flex items-center gap-1 text-[11px] font-medium text-foreground/80 hover:text-foreground truncate max-w-[12rem] shrink-0 px-1 -mx-1 rounded hover:bg-muted/50 transition-colors",
               title: "Click to rename session",
               children: [
-                /* @__PURE__ */ jsx36(Pencil3, { className: "h-2.5 w-2.5 text-muted-foreground shrink-0" }),
-                /* @__PURE__ */ jsx36("span", { className: "truncate", children: nickname || sessionTitle || "Untitled" })
+                /* @__PURE__ */ jsx35(Pencil3, { className: "h-2.5 w-2.5 text-muted-foreground shrink-0" }),
+                /* @__PURE__ */ jsx35("span", { className: "truncate", children: nickname || sessionTitle || "Untitled" })
               ]
             }
           ))
         ] }),
-        /* @__PURE__ */ jsxs34("div", { className: "flex items-center gap-1.5 shrink-0", children: [
-          historyEntries.length > 1 && /* @__PURE__ */ jsxs34("div", { ref: switcherRef, className: "relative shrink-0", children: [
-            /* @__PURE__ */ jsxs34(
+        /* @__PURE__ */ jsxs33("div", { className: "flex items-center gap-1.5 shrink-0", children: [
+          historyEntries.length > 1 && /* @__PURE__ */ jsxs33("div", { ref: switcherRef, className: "relative shrink-0", children: [
+            /* @__PURE__ */ jsxs33(
               "button",
               {
                 type: "button",
@@ -9478,12 +9731,12 @@ function ChatView() {
                 className: "flex items-center gap-0.5 px-1 py-0.5 rounded text-[10px] text-muted-foreground hover:text-foreground hover:bg-muted/50 transition-colors",
                 title: "Switch session",
                 children: [
-                  /* @__PURE__ */ jsx36(History2, { className: "h-3 w-3" }),
-                  /* @__PURE__ */ jsx36(ChevronDown8, { className: "h-2.5 w-2.5" })
+                  /* @__PURE__ */ jsx35(History2, { className: "h-3 w-3" }),
+                  /* @__PURE__ */ jsx35(ChevronDown8, { className: "h-2.5 w-2.5" })
                 ]
               }
             ),
-            switcherOpen && /* @__PURE__ */ jsx36("div", { className: "absolute left-0 top-full mt-1 z-40 w-64 rounded-md border bg-popover shadow-lg p-1 max-h-60 overflow-y-auto", children: historyEntries.slice(0, 15).map((e) => /* @__PURE__ */ jsxs34(
+            switcherOpen && /* @__PURE__ */ jsx35("div", { className: "absolute left-0 top-full mt-1 z-40 w-64 rounded-md border bg-popover shadow-lg p-1 max-h-60 overflow-y-auto", children: historyEntries.slice(0, 15).map((e) => /* @__PURE__ */ jsxs33(
               "button",
               {
                 type: "button",
@@ -9497,8 +9750,8 @@ function ChatView() {
                   e.isCurrent && "bg-primary/10"
                 ),
                 children: [
-                  /* @__PURE__ */ jsx36("div", { className: "font-medium truncate", children: e.title || "(empty)" }),
-                  /* @__PURE__ */ jsxs34("div", { className: "text-[10px] text-muted-foreground font-mono truncate", children: [
+                  /* @__PURE__ */ jsx35("div", { className: "font-medium truncate", children: e.title || "(empty)" }),
+                  /* @__PURE__ */ jsxs33("div", { className: "text-[10px] text-muted-foreground font-mono truncate", children: [
                     e.provider,
                     "/",
                     e.model,
@@ -9511,7 +9764,7 @@ function ChatView() {
               e.id
             )) })
           ] }),
-          /* @__PURE__ */ jsxs34(
+          /* @__PURE__ */ jsxs33(
             "button",
             {
               type: "button",
@@ -9519,20 +9772,20 @@ function ChatView() {
               className: "group hidden sm:flex items-center gap-1 px-2 py-0.5 rounded-md border bg-background/50 hover:bg-accent hover:border-primary/40 transition-colors text-[11px] min-w-0 shrink-0",
               title: "Change provider / model (Ctrl+M)",
               children: [
-                /* @__PURE__ */ jsx36(Cpu5, { className: "h-3 w-3 text-muted-foreground group-hover:text-foreground shrink-0" }),
-                /* @__PURE__ */ jsxs34("span", { className: "font-mono truncate max-w-[9rem] xl:max-w-[16rem]", children: [
-                  /* @__PURE__ */ jsx36("span", { className: "text-muted-foreground", children: provider || "no-provider" }),
-                  /* @__PURE__ */ jsx36("span", { className: "text-muted-foreground/40 mx-0.5", children: "/" }),
-                  /* @__PURE__ */ jsx36("span", { className: "font-medium", children: model || "no-model" })
+                /* @__PURE__ */ jsx35(Cpu5, { className: "h-3 w-3 text-muted-foreground group-hover:text-foreground shrink-0" }),
+                /* @__PURE__ */ jsxs33("span", { className: "font-mono truncate max-w-[9rem] xl:max-w-[16rem]", children: [
+                  /* @__PURE__ */ jsx35("span", { className: "text-muted-foreground", children: provider || "no-provider" }),
+                  /* @__PURE__ */ jsx35("span", { className: "text-muted-foreground/40 mx-0.5", children: "/" }),
+                  /* @__PURE__ */ jsx35("span", { className: "font-medium", children: model || "no-model" })
                 ] })
               ]
             }
           ),
-          /* @__PURE__ */ jsxs34("div", { className: "hidden md:flex items-center gap-1.5 shrink-0", children: [
-            /* @__PURE__ */ jsx36(ModePicker, {}),
-            /* @__PURE__ */ jsx36(ContextModePicker, {})
+          /* @__PURE__ */ jsxs33("div", { className: "hidden md:flex items-center gap-1.5 shrink-0", children: [
+            /* @__PURE__ */ jsx35(ModePicker, {}),
+            /* @__PURE__ */ jsx35(ContextModePicker, {})
           ] }),
-          iteration && /* @__PURE__ */ jsxs34(
+          iteration && /* @__PURE__ */ jsxs33(
             "button",
             {
               type: "button",
@@ -9540,17 +9793,17 @@ function ChatView() {
               title: "Agent iteration \u2014 click to jump to live activity",
               onClick: () => document.getElementById("chat-activity")?.scrollIntoView({ behavior: "smooth", block: "center" }),
               children: [
-                /* @__PURE__ */ jsx36(Activity3, { className: "h-3 w-3 animate-pulse" }),
+                /* @__PURE__ */ jsx35(Activity3, { className: "h-3 w-3 animate-pulse" }),
                 "iter ",
                 iteration.index,
                 iteration.max > 0 ? `/${iteration.max}` : ""
               ]
             }
           ),
-          /* @__PURE__ */ jsx36(AutonomyPicker, { value: autonomy, onChange: handleAutonomyChange, compact: true })
+          /* @__PURE__ */ jsx35(AutonomyPicker, { value: autonomy, onChange: handleAutonomyChange, compact: true })
         ] }),
-        /* @__PURE__ */ jsxs34("div", { className: "flex items-center gap-0.5 shrink-0", children: [
-          /* @__PURE__ */ jsxs34(
+        /* @__PURE__ */ jsxs33("div", { className: "flex items-center gap-0.5 shrink-0", children: [
+          /* @__PURE__ */ jsxs33(
             Button,
             {
               variant: processOpen ? "secondary" : "ghost",
@@ -9559,12 +9812,12 @@ function ChatView() {
               onClick: () => setProcessOpen((v) => !v),
               title: "Running processes",
               children: [
-                /* @__PURE__ */ jsx36(Terminal4, { className: "h-4 w-4" }),
-                processOpen && /* @__PURE__ */ jsx36("span", { className: "absolute -bottom-0.5 left-1/2 -translate-x-1/2 w-1 h-1 rounded-full bg-amber-500" })
+                /* @__PURE__ */ jsx35(Terminal4, { className: "h-4 w-4" }),
+                processOpen && /* @__PURE__ */ jsx35("span", { className: "absolute -bottom-0.5 left-1/2 -translate-x-1/2 w-1 h-1 rounded-full bg-amber-500" })
               ]
             }
           ),
-          /* @__PURE__ */ jsxs34(
+          /* @__PURE__ */ jsxs33(
             Button,
             {
               variant: checkpointOpen ? "secondary" : "ghost",
@@ -9573,16 +9826,16 @@ function ChatView() {
               onClick: () => setCheckpointOpen((v) => !v),
               title: "Session checkpoints \u2014 rewind",
               children: [
-                /* @__PURE__ */ jsx36(History2, { className: "h-4 w-4" }),
-                checkpointOpen && /* @__PURE__ */ jsx36("span", { className: "absolute -bottom-0.5 left-1/2 -translate-x-1/2 w-1 h-1 rounded-full bg-violet-500" })
+                /* @__PURE__ */ jsx35(History2, { className: "h-4 w-4" }),
+                checkpointOpen && /* @__PURE__ */ jsx35("span", { className: "absolute -bottom-0.5 left-1/2 -translate-x-1/2 w-1 h-1 rounded-full bg-violet-500" })
               ]
             }
           )
         ] })
       ] }),
-      hasStatusContent && /* @__PURE__ */ jsxs34("div", { className: "flex items-center justify-between gap-3 px-3 py-1 border-t bg-muted/20 text-[11px] text-muted-foreground", children: [
-        /* @__PURE__ */ jsxs34("div", { className: "flex items-center gap-3 min-w-0 flex-1 tabular-nums", children: [
-          lastInputTokens > 0 && /* @__PURE__ */ jsx36(
+      hasStatusContent && /* @__PURE__ */ jsxs33("div", { className: "flex items-center justify-between gap-3 px-3 py-1 border-t bg-muted/20 text-[11px] text-muted-foreground", children: [
+        /* @__PURE__ */ jsxs33("div", { className: "flex items-center gap-3 min-w-0 flex-1 tabular-nums", children: [
+          lastInputTokens > 0 && /* @__PURE__ */ jsx35(
             ContextFillBar,
             {
               pct: ctxPct,
@@ -9591,26 +9844,26 @@ function ChatView() {
               onClick: () => setBreakdownOpen(true)
             }
           ),
-          totalTokens.input > 0 && /* @__PURE__ */ jsxs34(Fragment9, { children: [
-            /* @__PURE__ */ jsxs34("span", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ jsx36("span", { className: "font-medium text-foreground", children: fmtTok(totalTokens.input) }),
-              /* @__PURE__ */ jsx36("span", { children: "in" })
+          totalTokens.input > 0 && /* @__PURE__ */ jsxs33(Fragment9, { children: [
+            /* @__PURE__ */ jsxs33("span", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsx35("span", { className: "font-medium text-foreground", children: fmtTok(totalTokens.input) }),
+              /* @__PURE__ */ jsx35("span", { children: "in" })
             ] }),
-            /* @__PURE__ */ jsxs34("span", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ jsx36("span", { className: "font-medium text-foreground", children: fmtTok(totalTokens.output) }),
-              /* @__PURE__ */ jsx36("span", { children: "out" })
+            /* @__PURE__ */ jsxs33("span", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsx35("span", { className: "font-medium text-foreground", children: fmtTok(totalTokens.output) }),
+              /* @__PURE__ */ jsx35("span", { children: "out" })
             ] }),
             totalTokens.cacheRead && totalTokens.cacheRead > 0 && (() => {
               const denom = (totalTokens.cacheRead ?? 0) + totalTokens.input;
               const pct = denom > 0 ? Math.round((totalTokens.cacheRead ?? 0) / denom * 100) : 0;
-              return /* @__PURE__ */ jsxs34(
+              return /* @__PURE__ */ jsxs33(
                 "span",
                 {
                   className: "flex items-center gap-1",
                   title: `Cache hit ratio: ${pct}%`,
                   children: [
-                    /* @__PURE__ */ jsx36("span", { className: "font-medium text-foreground", children: fmtTok(totalTokens.cacheRead) }),
-                    /* @__PURE__ */ jsxs34("span", { children: [
+                    /* @__PURE__ */ jsx35("span", { className: "font-medium text-foreground", children: fmtTok(totalTokens.cacheRead) }),
+                    /* @__PURE__ */ jsxs33("span", { children: [
                       "cache (",
                       pct,
                       "%)"
@@ -9619,15 +9872,15 @@ function ChatView() {
                 }
               );
             })(),
-            /* @__PURE__ */ jsx36(CostChip, {})
+            /* @__PURE__ */ jsx35(CostChip, {})
           ] })
         ] }),
-        startTime && /* @__PURE__ */ jsx36("span", { className: "text-muted-foreground/70 tabular-nums shrink-0", children: formatDuration3(startTime) })
+        startTime && /* @__PURE__ */ jsx35("span", { className: "text-muted-foreground/70 tabular-nums shrink-0", children: formatDuration3(startTime) })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs34("div", { className: "flex-1 relative overflow-hidden", children: [
-      /* @__PURE__ */ jsx36(SearchOverlay, {}),
-      !pinnedToBottom && /* @__PURE__ */ jsxs34(
+    /* @__PURE__ */ jsxs33("div", { className: "flex-1 relative overflow-hidden", children: [
+      /* @__PURE__ */ jsx35(SearchOverlay, {}),
+      !pinnedToBottom && /* @__PURE__ */ jsxs33(
         "button",
         {
           type: "button",
@@ -9639,12 +9892,12 @@ function ChatView() {
             "hover:bg-primary/90 transition-colors animate-message"
           ),
           children: [
-            /* @__PURE__ */ jsx36(ArrowDown3, { className: "h-3.5 w-3.5" }),
+            /* @__PURE__ */ jsx35(ArrowDown3, { className: "h-3.5 w-3.5" }),
             unreadCount > 0 ? `${unreadCount} new message${unreadCount === 1 ? "" : "s"}` : "Jump to latest"
           ]
         }
       ),
-      scrolledDeep && /* @__PURE__ */ jsxs34(
+      scrolledDeep && /* @__PURE__ */ jsxs33(
         "button",
         {
           type: "button",
@@ -9657,135 +9910,29 @@ function ChatView() {
             "hover:text-foreground hover:bg-background transition-colors animate-message"
           ),
           children: [
-            /* @__PURE__ */ jsx36(ArrowUp3, { className: "h-3 w-3" }),
-            /* @__PURE__ */ jsx36("span", { children: "Top" })
+            /* @__PURE__ */ jsx35(ArrowUp3, { className: "h-3 w-3" }),
+            /* @__PURE__ */ jsx35("span", { children: "Top" })
           ]
         }
       ),
-      /* @__PURE__ */ jsx36(ScrollArea, { className: "h-full", ref: scrollRef, children: /* @__PURE__ */ jsxs34(
-        "div",
-        {
-          className: cn(
-            "mx-auto pb-8",
-            compactMode ? "max-w-5xl p-3 space-y-3" : "max-w-5xl p-4 space-y-6"
-          ),
-          children: [
-            messages.length === 0 && !isLoading && /* @__PURE__ */ jsx36(WelcomeScreen, {}),
-            (() => {
-              const groups = [];
-              for (let i = 0; i < messages.length; i++) {
-                const m = expectDefined12(messages[i]);
-                if (m.role === "tool") {
-                  const last = groups[groups.length - 1];
-                  if (last && last.kind === "tools") {
-                    last.tools.push(m);
-                  } else {
-                    groups.push({ kind: "tools", tools: [m], key: m.id });
-                  }
-                } else {
-                  const prev = messages[i - 1];
-                  groups.push({
-                    kind: "msg",
-                    message: m,
-                    isFirst: !prev || prev.role !== m.role
-                  });
-                }
-              }
-              const turns = [];
-              for (const g of groups) {
-                if (g.kind === "msg" && g.message.role === "user") {
-                  turns.push({ kind: "user", message: g.message, key: g.message.id });
-                  continue;
-                }
-                const last = turns[turns.length - 1];
-                if (last && last.kind === "agent") {
-                  last.items.push(g);
-                } else {
-                  const key = g.kind === "msg" ? g.message.id : g.key;
-                  turns.push({ kind: "agent", items: [g], key });
-                }
-              }
-              let prevDay = null;
-              const dayKey = (ts) => {
-                const d = new Date(ts);
-                return `${d.getFullYear()}-${d.getMonth()}-${d.getDate()}`;
-              };
-              const dayLabel = (ts) => {
-                const d = new Date(ts);
-                const today = /* @__PURE__ */ new Date();
-                const yest = new Date(Date.now() - 864e5);
-                if (dayKey(ts) === dayKey(today.getTime())) return "Today";
-                if (dayKey(ts) === dayKey(yest.getTime())) return "Yesterday";
-                return d.toLocaleDateString(void 0, {
-                  weekday: "short",
-                  month: "short",
-                  day: "numeric",
-                  year: d.getFullYear() === today.getFullYear() ? void 0 : "numeric"
-                });
-              };
-              const turnTs = (t) => {
-                if (t.kind === "user") return t.message.timestamp;
-                const first = expectDefined12(t.items[0]);
-                return first.kind === "msg" ? first.message.timestamp : first.tools[0]?.timestamp;
-              };
-              const out = [];
-              for (let idx = 0; idx < turns.length; idx++) {
-                const t = expectDefined12(turns[idx]);
-                const ts = turnTs(t);
-                const day = dayKey(ts);
-                if (day !== prevDay) {
-                  out.push(
-                    /* @__PURE__ */ jsxs34(
-                      "div",
-                      {
-                        className: "flex items-center gap-3 py-1 text-[11px] text-muted-foreground/70 uppercase tracking-wider font-medium",
-                        children: [
-                          /* @__PURE__ */ jsx36("div", { className: "flex-1 h-px bg-border/50" }),
-                          /* @__PURE__ */ jsx36("span", { children: dayLabel(ts) }),
-                          /* @__PURE__ */ jsx36("div", { className: "flex-1 h-px bg-border/50" })
-                        ]
-                      },
-                      `day-${day}-${idx}`
-                    )
-                  );
-                  prevDay = day;
-                }
-                if (t.kind === "user") {
-                  out.push(/* @__PURE__ */ jsx36(MessageBubble, { message: t.message, isFirst: true }, t.key));
-                  continue;
-                }
-                const isLastTurn = idx === turns.length - 1;
-                out.push(
-                  /* @__PURE__ */ jsx36("div", { className: cn("chat-turn", compactMode ? "space-y-1" : "space-y-1.5"), children: t.items.map((g, gi) => {
-                    const continuation = gi > 0;
-                    if (g.kind === "msg") {
-                      return /* @__PURE__ */ jsx36(
-                        MessageBubble,
-                        {
-                          message: g.message,
-                          isFirst: !continuation && g.isFirst,
-                          isContinuation: continuation
-                        },
-                        g.message.id
-                      );
-                    }
-                    const isLatestRunning = isLastTurn && gi === t.items.length - 1 && isLoading && g.tools.some((tt) => tt.toolResult === void 0);
-                    return /* @__PURE__ */ jsx36(
-                      ToolGroup,
-                      {
-                        tools: g.tools,
-                        defaultOpen: isLatestRunning,
-                        isContinuation: continuation
-                      },
-                      g.key
-                    );
-                  }) }, t.key)
-                );
-              }
-              return out;
-            })(),
-            /* @__PURE__ */ jsxs34("div", { id: "chat-activity", children: [
-              /* @__PURE__ */ jsx36(ThinkingBubble, {}),
+      rows.length === 0 && !isLoading ? /* @__PURE__ */ jsx35("div", { className: "mx-auto max-w-5xl w-full px-4 pt-4", children: /* @__PURE__ */ jsx35(WelcomeScreen, {}) }) : /* @__PURE__ */ jsxs33(VList, { ref: vlistRef, className: "h-full", onScroll: handleScroll, children: [
+        rows.map((row, i) => /* @__PURE__ */ jsx35(
+          ChatRowView,
+          {
+            row,
+            isLoading,
+            compactMode,
+            isFirstRow: i === 0
+          },
+          row.key
+        )),
+        /* @__PURE__ */ jsxs33(
+          "div",
+          {
+            id: "chat-activity",
+            className: cn("mx-auto max-w-5xl w-full px-4", compactMode ? "pb-3" : "pb-8"),
+            children: [
+              /* @__PURE__ */ jsx35(ThinkingBubble, {}),
               isLoading && (() => {
                 const last = messages[messages.length - 1];
                 const runningTools = messages.filter(
@@ -9827,94 +9974,95 @@ function ChatView() {
                 } else if (streamAnchor.current) {
                   streamAnchor.current = null;
                 }
-                return /* @__PURE__ */ jsxs34("div", { className: "flex gap-3 animate-message", children: [
-                  /* @__PURE__ */ jsx36("div", { className: "flex-shrink-0 w-8 h-8 rounded-full flex items-center justify-center bg-accent text-accent-foreground ring-2 ring-offset-2 ring-offset-background ring-accent/20", children: /* @__PURE__ */ jsx36(Bot4, { className: "h-4 w-4" }) }),
-                  /* @__PURE__ */ jsx36("div", { className: "flex flex-col gap-1.5", children: /* @__PURE__ */ jsx36("div", { className: "rounded-2xl px-4 py-3 bg-card border text-foreground", children: /* @__PURE__ */ jsxs34("div", { className: "flex items-center gap-3 text-sm", children: [
-                    /* @__PURE__ */ jsxs34("span", { className: "flex gap-1", children: [
-                      /* @__PURE__ */ jsx36("span", { className: "h-1.5 w-1.5 rounded-full bg-primary/70 animate-bounce [animation-delay:-0.3s]" }),
-                      /* @__PURE__ */ jsx36("span", { className: "h-1.5 w-1.5 rounded-full bg-primary/70 animate-bounce [animation-delay:-0.15s]" }),
-                      /* @__PURE__ */ jsx36("span", { className: "h-1.5 w-1.5 rounded-full bg-primary/70 animate-bounce" })
+                return /* @__PURE__ */ jsxs33("div", { className: "flex gap-3 animate-message", children: [
+                  /* @__PURE__ */ jsx35("div", { className: "flex-shrink-0 w-8 h-8 rounded-full flex items-center justify-center bg-accent text-accent-foreground ring-2 ring-offset-2 ring-offset-background ring-accent/20", children: /* @__PURE__ */ jsx35(Bot4, { className: "h-4 w-4" }) }),
+                  /* @__PURE__ */ jsx35("div", { className: "flex flex-col gap-1.5", children: /* @__PURE__ */ jsx35("div", { className: "rounded-2xl px-4 py-3 bg-card border text-foreground", children: /* @__PURE__ */ jsxs33("div", { className: "flex items-center gap-3 text-sm", children: [
+                    /* @__PURE__ */ jsxs33("span", { className: "flex gap-1", children: [
+                      /* @__PURE__ */ jsx35("span", { className: "h-1.5 w-1.5 rounded-full bg-primary/70 animate-bounce [animation-delay:-0.3s]" }),
+                      /* @__PURE__ */ jsx35("span", { className: "h-1.5 w-1.5 rounded-full bg-primary/70 animate-bounce [animation-delay:-0.15s]" }),
+                      /* @__PURE__ */ jsx35("span", { className: "h-1.5 w-1.5 rounded-full bg-primary/70 animate-bounce" })
                     ] }),
-                    /* @__PURE__ */ jsx36("span", { className: "text-foreground/90", children: label }),
-                    /* @__PURE__ */ jsx36("span", { className: "text-xs text-muted-foreground tabular-nums", children: elapsed }),
-                    iteration && /* @__PURE__ */ jsxs34("span", { className: "text-xs text-muted-foreground tabular-nums", children: [
+                    /* @__PURE__ */ jsx35("span", { className: "text-foreground/90", children: label }),
+                    /* @__PURE__ */ jsx35("span", { className: "text-xs text-muted-foreground tabular-nums", children: elapsed }),
+                    iteration && /* @__PURE__ */ jsxs33("span", { className: "text-xs text-muted-foreground tabular-nums", children: [
                       "\xB7 iter ",
                       iteration.index,
                       iteration.max > 0 ? `/${iteration.max}` : ""
                     ] }),
-                    speedLabel && /* @__PURE__ */ jsxs34("span", { className: "text-xs text-muted-foreground/80 tabular-nums", children: [
+                    speedLabel && /* @__PURE__ */ jsxs33("span", { className: "text-xs text-muted-foreground/80 tabular-nums", children: [
                       "\xB7 ",
                       speedLabel
                     ] })
                   ] }) }) })
                 ] });
               })()
-            ] })
-          ]
-        }
-      ) })
+            ]
+          },
+          "__live"
+        )
+      ] })
     ] }),
-    /* @__PURE__ */ jsxs34("div", { className: "border-t bg-card/50 backdrop-blur supports-[backdrop-filter]:bg-card/50 shrink-0", children: [
-      /* @__PURE__ */ jsxs34("div", { className: "max-w-5xl mx-auto px-4 pt-1.5 flex items-center gap-3 text-[10px] text-muted-foreground/50 select-none overflow-x-auto", children: [
-        /* @__PURE__ */ jsxs34("span", { title: "Enter", className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx36("kbd", { children: "Enter" }),
+    /* @__PURE__ */ jsxs33("div", { className: "border-t bg-card/50 backdrop-blur supports-[backdrop-filter]:bg-card/50 shrink-0", children: [
+      /* @__PURE__ */ jsxs33("div", { className: "max-w-5xl mx-auto px-4 pt-1.5 flex items-center gap-3 text-[10px] text-muted-foreground/50 select-none overflow-x-auto", children: [
+        /* @__PURE__ */ jsxs33("span", { title: "Enter", className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx35("kbd", { children: "Enter" }),
           " send"
         ] }),
-        /* @__PURE__ */ jsx36("span", { className: "opacity-50", children: "\xB7" }),
-        /* @__PURE__ */ jsxs34("span", { title: "Shift+Enter", className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx36("kbd", { children: "Shift" }),
+        /* @__PURE__ */ jsx35("span", { className: "opacity-50", children: "\xB7" }),
+        /* @__PURE__ */ jsxs33("span", { title: "Shift+Enter", className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx35("kbd", { children: "Shift" }),
           "+",
-          /* @__PURE__ */ jsx36("kbd", { children: "\u21B5" }),
+          /* @__PURE__ */ jsx35("kbd", { children: "\u21B5" }),
           " newline"
         ] }),
-        /* @__PURE__ */ jsx36("span", { className: "opacity-50", children: "\xB7" }),
-        /* @__PURE__ */ jsxs34("span", { title: "Ctrl+\\\\", className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx36("kbd", { children: "Ctrl+\\" }),
+        /* @__PURE__ */ jsx35("span", { className: "opacity-50", children: "\xB7" }),
+        /* @__PURE__ */ jsxs33("span", { title: "Ctrl+\\\\", className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx35("kbd", { children: "Ctrl+\\" }),
           " sidebar"
         ] }),
-        /* @__PURE__ */ jsx36("span", { className: "opacity-50", children: "\xB7" }),
-        /* @__PURE__ */ jsxs34("span", { title: "Ctrl+F", className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx36("kbd", { children: "Ctrl+F" }),
+        /* @__PURE__ */ jsx35("span", { className: "opacity-50", children: "\xB7" }),
+        /* @__PURE__ */ jsxs33("span", { title: "Ctrl+F", className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx35("kbd", { children: "Ctrl+F" }),
           " search"
         ] }),
-        /* @__PURE__ */ jsx36("span", { className: "opacity-50", children: "\xB7" }),
-        /* @__PURE__ */ jsxs34("span", { title: "Ctrl+K", className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx36("kbd", { children: "Ctrl+K" }),
+        /* @__PURE__ */ jsx35("span", { className: "opacity-50", children: "\xB7" }),
+        /* @__PURE__ */ jsxs33("span", { title: "Ctrl+K", className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx35("kbd", { children: "Ctrl+K" }),
           " palette"
         ] }),
-        /* @__PURE__ */ jsx36("span", { className: "opacity-50", children: "\xB7" }),
-        /* @__PURE__ */ jsxs34("span", { title: "Ctrl+L / Ctrl+N", className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx36("kbd", { children: "Ctrl+L" }),
+        /* @__PURE__ */ jsx35("span", { className: "opacity-50", children: "\xB7" }),
+        /* @__PURE__ */ jsxs33("span", { title: "Ctrl+L / Ctrl+N", className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx35("kbd", { children: "Ctrl+L" }),
           " clear"
         ] }),
-        /* @__PURE__ */ jsx36("span", { className: "opacity-50", children: "\xB7" }),
-        /* @__PURE__ */ jsxs34("span", { title: "j/k to navigate", className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx36("kbd", { children: "j" }),
-          /* @__PURE__ */ jsx36("kbd", { children: "k" }),
+        /* @__PURE__ */ jsx35("span", { className: "opacity-50", children: "\xB7" }),
+        /* @__PURE__ */ jsxs33("span", { title: "j/k to navigate", className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx35("kbd", { children: "j" }),
+          /* @__PURE__ */ jsx35("kbd", { children: "k" }),
           " navigate"
         ] }),
-        /* @__PURE__ */ jsx36("span", { className: "opacity-50", children: "\xB7" }),
-        /* @__PURE__ */ jsxs34("span", { title: "Ctrl+M", className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx36("kbd", { children: "Ctrl+M" }),
+        /* @__PURE__ */ jsx35("span", { className: "opacity-50", children: "\xB7" }),
+        /* @__PURE__ */ jsxs33("span", { title: "Ctrl+M", className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx35("kbd", { children: "Ctrl+M" }),
           " model"
         ] }),
-        /* @__PURE__ */ jsx36("span", { className: "opacity-50", children: "\xB7" }),
-        /* @__PURE__ */ jsxs34("span", { title: "Ctrl+Shift+D", className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx36("kbd", { children: "Ctrl+\u21E7D" }),
+        /* @__PURE__ */ jsx35("span", { className: "opacity-50", children: "\xB7" }),
+        /* @__PURE__ */ jsxs33("span", { title: "Ctrl+Shift+D", className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx35("kbd", { children: "Ctrl+\u21E7D" }),
           " density"
         ] })
       ] }),
-      /* @__PURE__ */ jsx36("div", { className: "p-4", children: /* @__PURE__ */ jsx36("div", { className: "max-w-5xl mx-auto", children: /* @__PURE__ */ jsx36(ChatInput, { onOpenBreakdown: () => setBreakdownOpen(true) }) }) })
+      /* @__PURE__ */ jsx35("div", { className: "p-4", children: /* @__PURE__ */ jsx35("div", { className: "max-w-5xl mx-auto", children: /* @__PURE__ */ jsx35(ChatInput, { onOpenBreakdown: () => setBreakdownOpen(true) }) }) })
     ] }),
-    /* @__PURE__ */ jsx36(ProcessMonitor, { open: processOpen, onClose: () => setProcessOpen(false) }),
-    /* @__PURE__ */ jsx36(CheckpointTimeline, { open: checkpointOpen, onClose: () => setCheckpointOpen(false) }),
-    /* @__PURE__ */ jsx36(ContextBreakdownModal, { open: breakdownOpen, onClose: () => setBreakdownOpen(false) })
+    /* @__PURE__ */ jsx35(ProcessMonitor, { open: processOpen, onClose: () => setProcessOpen(false) }),
+    /* @__PURE__ */ jsx35(CheckpointTimeline, { open: checkpointOpen, onClose: () => setCheckpointOpen(false) }),
+    /* @__PURE__ */ jsx35(ContextBreakdownModal, { open: breakdownOpen, onClose: () => setBreakdownOpen(false) })
   ] });
 }
 
 // src/components/CodeEditor.tsx
 import { X as X8, Circle as Circle3 } from "lucide-react";
-import { useCallback as useCallback11, useEffect as useEffect19, useMemo as useMemo8, useRef as useRef15 } from "react";
+import { useCallback as useCallback11, useEffect as useEffect19, useMemo as useMemo9, useRef as useRef15 } from "react";
 import Editor, { loader } from "@monaco-editor/react";
 import * as monaco2 from "monaco-editor";
 
@@ -10274,7 +10422,7 @@ function getMonacoTheme() {
 }
 
 // src/components/CodeEditor.tsx
-import { jsx as jsx37, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs34 } from "react/jsx-runtime";
 loader.config({ monaco: monaco2 });
 var LANG_MAP = {
   ts: "typescript",
@@ -10314,10 +10462,10 @@ function EditorTabs() {
   const setActiveFile = useFileStore((s) => s.setActiveFile);
   const closeFile = useFileStore((s) => s.closeFile);
   if (openFiles.length === 0) return null;
-  return /* @__PURE__ */ jsx37("div", { className: "flex items-center border-b bg-muted/40 overflow-x-auto shrink-0", children: openFiles.map((f) => {
+  return /* @__PURE__ */ jsx36("div", { className: "flex items-center border-b bg-muted/40 overflow-x-auto shrink-0", children: openFiles.map((f) => {
     const isActive = f.path === activeFilePath;
     const baseName = f.path.split("/").pop() ?? f.path;
-    return /* @__PURE__ */ jsxs35(
+    return /* @__PURE__ */ jsxs34(
       "button",
       {
         type: "button",
@@ -10334,9 +10482,9 @@ function EditorTabs() {
         ),
         title: f.path,
         children: [
-          f.dirty && /* @__PURE__ */ jsx37(Circle3, { className: "h-2 w-2 fill-current text-primary shrink-0" }),
-          /* @__PURE__ */ jsx37("span", { className: "truncate", children: baseName }),
-          /* @__PURE__ */ jsx37(
+          f.dirty && /* @__PURE__ */ jsx36(Circle3, { className: "h-2 w-2 fill-current text-primary shrink-0" }),
+          /* @__PURE__ */ jsx36("span", { className: "truncate", children: baseName }),
+          /* @__PURE__ */ jsx36(
             X8,
             {
               className: cn(
@@ -10361,7 +10509,7 @@ function CodeEditor() {
   const updateContent = useFileStore((s) => s.updateContent);
   const { theme: appTheme } = useTheme();
   const editorRef = useRef15(null);
-  const activeFile = useMemo8(
+  const activeFile = useMemo9(
     () => openFiles.find((f) => f.path === activeFilePath) ?? null,
     [openFiles, activeFilePath]
   );
@@ -10408,14 +10556,14 @@ function CodeEditor() {
     return () => window.removeEventListener("keydown", onKeyDown);
   }, [activeFilePath]);
   if (openFiles.length === 0) {
-    return /* @__PURE__ */ jsx37("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ jsxs35("div", { className: "text-center space-y-2", children: [
-      /* @__PURE__ */ jsx37("p", { className: "text-sm text-muted-foreground", children: "No files open" }),
-      /* @__PURE__ */ jsx37("p", { className: "text-[11px] text-muted-foreground/60", children: "Select a file from the explorer to start editing" })
+    return /* @__PURE__ */ jsx36("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ jsxs34("div", { className: "text-center space-y-2", children: [
+      /* @__PURE__ */ jsx36("p", { className: "text-sm text-muted-foreground", children: "No files open" }),
+      /* @__PURE__ */ jsx36("p", { className: "text-[11px] text-muted-foreground/60", children: "Select a file from the explorer to start editing" })
     ] }) });
   }
-  return /* @__PURE__ */ jsxs35("div", { className: "flex-1 flex flex-col overflow-hidden", children: [
-    /* @__PURE__ */ jsx37(EditorTabs, {}),
-    /* @__PURE__ */ jsx37("div", { className: "flex-1 relative", children: activeFile ? /* @__PURE__ */ jsx37(
+  return /* @__PURE__ */ jsxs34("div", { className: "flex-1 flex flex-col overflow-hidden", children: [
+    /* @__PURE__ */ jsx36(EditorTabs, {}),
+    /* @__PURE__ */ jsx36("div", { className: "flex-1 relative", children: activeFile ? /* @__PURE__ */ jsx36(
       Editor,
       {
         language,
@@ -10423,7 +10571,7 @@ function CodeEditor() {
         onChange: handleChange,
         theme: monacoTheme,
         onMount: handleMount,
-        loading: /* @__PURE__ */ jsx37("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsx37("span", { className: "text-[11px] text-muted-foreground animate-pulse", children: "Loading editor\u2026" }) }),
+        loading: /* @__PURE__ */ jsx36("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsx36("span", { className: "text-[11px] text-muted-foreground animate-pulse", children: "Loading editor\u2026" }) }),
         options: {
           minimap: { enabled: false },
           fontSize: 13,
@@ -10443,23 +10591,23 @@ function CodeEditor() {
         }
       },
       activeFile.path
-    ) : /* @__PURE__ */ jsx37("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsx37("p", { className: "text-[11px] text-muted-foreground", children: "Select a tab to view its content" }) }) })
+    ) : /* @__PURE__ */ jsx36("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsx36("p", { className: "text-[11px] text-muted-foreground", children: "Select a tab to view its content" }) }) })
   ] });
 }
 
 // src/components/ConfirmDialog.tsx
-import { AlertTriangle as AlertTriangle3, FileEdit, Globe as Globe2, ShieldAlert, Terminal as Terminal5, Wrench as Wrench6 } from "lucide-react";
+import { AlertTriangle as AlertTriangle3, FileEdit, Globe as Globe2, ShieldAlert, Terminal as Terminal5, Wrench as Wrench5 } from "lucide-react";
 import { useEffect as useEffect20, useRef as useRef16 } from "react";
 
 // src/components/ui/dialog.tsx
 import * as DialogPrimitive from "@radix-ui/react-dialog";
 import { X as X9 } from "lucide-react";
-import * as React3 from "react";
-import { jsx as jsx38, jsxs as jsxs36 } from "react/jsx-runtime";
+import * as React2 from "react";
+import { jsx as jsx37, jsxs as jsxs35 } from "react/jsx-runtime";
 var Dialog = DialogPrimitive.Root;
 var DialogTrigger = DialogPrimitive.Trigger;
 var DialogPortal = DialogPrimitive.Portal;
-var DialogOverlay = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
+var DialogOverlay = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
   DialogPrimitive.Overlay,
   {
     ref,
@@ -10471,9 +10619,9 @@ var DialogOverlay = React3.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
-var DialogContent = React3.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs36(DialogPortal, { children: [
-  /* @__PURE__ */ jsx38(DialogOverlay, {}),
-  /* @__PURE__ */ jsxs36(
+var DialogContent = React2.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs35(DialogPortal, { children: [
+  /* @__PURE__ */ jsx37(DialogOverlay, {}),
+  /* @__PURE__ */ jsxs35(
     DialogPrimitive.Content,
     {
       ref,
@@ -10484,18 +10632,18 @@ var DialogContent = React3.forwardRef(({ className, children, ...props }, ref) =
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsxs36(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
-          /* @__PURE__ */ jsx38(X9, { className: "h-4 w-4" }),
-          /* @__PURE__ */ jsx38("span", { className: "sr-only", children: "Close" })
+        /* @__PURE__ */ jsxs35(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
+          /* @__PURE__ */ jsx37(X9, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx37("span", { className: "sr-only", children: "Close" })
         ] })
       ]
     }
   )
 ] }));
 DialogContent.displayName = DialogPrimitive.Content.displayName;
-var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx38("div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props });
+var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx37("div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props });
 DialogHeader.displayName = "DialogHeader";
-var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx38(
+var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx37(
   "div",
   {
     className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
@@ -10503,7 +10651,7 @@ var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx38(
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
+var DialogTitle = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
   DialogPrimitive.Title,
   {
     ref,
@@ -10512,7 +10660,7 @@ var DialogTitle = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 DialogTitle.displayName = DialogPrimitive.Title.displayName;
-var DialogDescription = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
+var DialogDescription = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
   DialogPrimitive.Description,
   {
     ref,
@@ -10523,12 +10671,12 @@ var DialogDescription = React3.forwardRef(({ className, ...props }, ref) => /* @
 DialogDescription.displayName = DialogPrimitive.Description.displayName;
 
 // src/components/ConfirmDialog.tsx
-import { jsx as jsx39, jsxs as jsxs37 } from "react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs36 } from "react/jsx-runtime";
 function pickToolIcon(toolName) {
   if (/edit|write|create|patch/i.test(toolName)) return FileEdit;
   if (/bash|shell|exec|run|command/i.test(toolName)) return Terminal5;
   if (/fetch|http|web|curl|request/i.test(toolName)) return Globe2;
-  return Wrench6;
+  return Wrench5;
 }
 function SmartInputPreview({
   toolName,
@@ -10536,7 +10684,7 @@ function SmartInputPreview({
 }) {
   const diffArgs = diffFromToolInput(toolName, input);
   if (diffArgs) {
-    return /* @__PURE__ */ jsx39("div", { className: "rounded-lg overflow-hidden border", children: /* @__PURE__ */ jsx39(
+    return /* @__PURE__ */ jsx38("div", { className: "rounded-lg overflow-hidden border", children: /* @__PURE__ */ jsx38(
       DiffView,
       {
         oldText: diffArgs.oldText,
@@ -10549,12 +10697,12 @@ function SmartInputPreview({
     const obj = input;
     const cmd = obj.command ?? obj.cmd ?? obj.script;
     if (typeof cmd === "string" && cmd.trim().length > 0) {
-      return /* @__PURE__ */ jsxs37("div", { className: "rounded-lg border bg-background/40 overflow-hidden", children: [
-        /* @__PURE__ */ jsxs37("div", { className: "px-3 py-1.5 text-[10px] uppercase tracking-wider text-muted-foreground border-b bg-muted/40 flex items-center gap-1.5", children: [
-          /* @__PURE__ */ jsx39(Terminal5, { className: "h-3 w-3" }),
-          /* @__PURE__ */ jsx39("span", { children: "Command" })
+      return /* @__PURE__ */ jsxs36("div", { className: "rounded-lg border bg-background/40 overflow-hidden", children: [
+        /* @__PURE__ */ jsxs36("div", { className: "px-3 py-1.5 text-[10px] uppercase tracking-wider text-muted-foreground border-b bg-muted/40 flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx38(Terminal5, { className: "h-3 w-3" }),
+          /* @__PURE__ */ jsx38("span", { children: "Command" })
         ] }),
-        /* @__PURE__ */ jsxs37("pre", { className: "px-3 py-2 text-xs font-mono whitespace-pre-wrap break-all max-h-40 overflow-auto", children: [
+        /* @__PURE__ */ jsxs36("pre", { className: "px-3 py-2 text-xs font-mono whitespace-pre-wrap break-all max-h-40 overflow-auto", children: [
           "$",
           cmd
         ] })
@@ -10563,16 +10711,16 @@ function SmartInputPreview({
     const url = obj.url;
     if (typeof url === "string") {
       const method = obj.method ?? "GET";
-      return /* @__PURE__ */ jsxs37("div", { className: "rounded-lg border bg-background/40 px-3 py-2 text-xs font-mono", children: [
-        /* @__PURE__ */ jsx39("span", { className: "text-muted-foreground", children: method.toUpperCase() }),
+      return /* @__PURE__ */ jsxs36("div", { className: "rounded-lg border bg-background/40 px-3 py-2 text-xs font-mono", children: [
+        /* @__PURE__ */ jsx38("span", { className: "text-muted-foreground", children: method.toUpperCase() }),
         " ",
-        /* @__PURE__ */ jsx39("span", { className: "break-all", children: url })
+        /* @__PURE__ */ jsx38("span", { className: "break-all", children: url })
       ] });
     }
   }
-  return /* @__PURE__ */ jsxs37("div", { className: "p-3 rounded-lg bg-muted/50 border text-xs font-mono", children: [
-    /* @__PURE__ */ jsx39("div", { className: "text-muted-foreground mb-2", children: "Input:" }),
-    /* @__PURE__ */ jsx39("pre", { className: "whitespace-pre-wrap break-all max-h-60 overflow-auto", children: JSON.stringify(input, null, 2) })
+  return /* @__PURE__ */ jsxs36("div", { className: "p-3 rounded-lg bg-muted/50 border text-xs font-mono", children: [
+    /* @__PURE__ */ jsx38("div", { className: "text-muted-foreground mb-2", children: "Input:" }),
+    /* @__PURE__ */ jsx38("pre", { className: "whitespace-pre-wrap break-all max-h-60 overflow-auto", children: JSON.stringify(input, null, 2) })
   ] });
 }
 function ConfirmDialog() {
@@ -10610,50 +10758,50 @@ function ConfirmDialog() {
     return () => window.removeEventListener("keydown", onKey);
   }, [showConfirmDialog, confirmInfo?.id]);
   if (!confirmInfo) {
-    return /* @__PURE__ */ jsx39(Dialog, { open: showConfirmDialog, onOpenChange: () => hideConfirm(), children: /* @__PURE__ */ jsx39(DialogContent, {}) });
+    return /* @__PURE__ */ jsx38(Dialog, { open: showConfirmDialog, onOpenChange: () => hideConfirm(), children: /* @__PURE__ */ jsx38(DialogContent, {}) });
   }
   const Icon2 = pickToolIcon(confirmInfo.toolName);
   const isEdit = /edit|write/i.test(confirmInfo.toolName);
-  return /* @__PURE__ */ jsx39(Dialog, { open: showConfirmDialog, onOpenChange: () => hideConfirm(), children: /* @__PURE__ */ jsxs37(DialogContent, { className: "sm:max-w-2xl border-yellow-500/50", ref: dialogRef, tabIndex: -1, children: [
-    /* @__PURE__ */ jsxs37(DialogHeader, { children: [
-      /* @__PURE__ */ jsxs37(DialogTitle, { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx39(ShieldAlert, { className: "h-5 w-5 text-yellow-500 animate-pulse" }),
+  return /* @__PURE__ */ jsx38(Dialog, { open: showConfirmDialog, onOpenChange: () => hideConfirm(), children: /* @__PURE__ */ jsxs36(DialogContent, { className: "sm:max-w-2xl border-yellow-500/50", ref: dialogRef, tabIndex: -1, children: [
+    /* @__PURE__ */ jsxs36(DialogHeader, { children: [
+      /* @__PURE__ */ jsxs36(DialogTitle, { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx38(ShieldAlert, { className: "h-5 w-5 text-yellow-500 animate-pulse" }),
         "Approval required: ",
         confirmInfo.toolName
       ] }),
-      /* @__PURE__ */ jsxs37(DialogDescription, { children: [
+      /* @__PURE__ */ jsxs36(DialogDescription, { children: [
         "The agent wants to ",
         isEdit ? "modify a file" : "run this tool",
         ". Review the request below and decide whether to proceed."
       ] })
     ] }),
-    /* @__PURE__ */ jsxs37("div", { className: "py-2 space-y-3", children: [
-      /* @__PURE__ */ jsxs37("div", { className: "flex items-center gap-3 p-3 rounded-lg bg-muted", children: [
-        /* @__PURE__ */ jsx39(Icon2, { className: "h-5 w-5 text-muted-foreground" }),
-        /* @__PURE__ */ jsxs37("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ jsx39("div", { className: "font-medium font-mono truncate", children: confirmInfo.toolName }),
-          /* @__PURE__ */ jsxs37("div", { className: "text-xs text-muted-foreground", children: [
+    /* @__PURE__ */ jsxs36("div", { className: "py-2 space-y-3", children: [
+      /* @__PURE__ */ jsxs36("div", { className: "flex items-center gap-3 p-3 rounded-lg bg-muted", children: [
+        /* @__PURE__ */ jsx38(Icon2, { className: "h-5 w-5 text-muted-foreground" }),
+        /* @__PURE__ */ jsxs36("div", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsx38("div", { className: "font-medium font-mono truncate", children: confirmInfo.toolName }),
+          /* @__PURE__ */ jsxs36("div", { className: "text-xs text-muted-foreground", children: [
             isEdit ? "File modification" : "Tool execution",
             " \u2014 preview below"
           ] })
         ] })
       ] }),
-      confirmInfo.input !== void 0 && /* @__PURE__ */ jsx39(SmartInputPreview, { toolName: confirmInfo.toolName, input: confirmInfo.input }),
-      confirmInfo.suggestedPattern && /* @__PURE__ */ jsxs37("div", { className: "flex items-start gap-2 p-3 rounded-lg bg-yellow-500/10 border border-yellow-500/20", children: [
-        /* @__PURE__ */ jsx39(AlertTriangle3, { className: "h-4 w-4 text-yellow-600 mt-0.5 shrink-0" }),
-        /* @__PURE__ */ jsxs37("div", { className: "text-sm min-w-0", children: [
-          /* @__PURE__ */ jsx39("div", { className: "font-medium text-yellow-800 dark:text-yellow-200", children: "Trust pattern suggestion" }),
-          /* @__PURE__ */ jsx39("div", { className: "font-mono text-xs mt-1 break-all", children: confirmInfo.suggestedPattern }),
-          /* @__PURE__ */ jsxs37("div", { className: "text-xs text-muted-foreground mt-1", children: [
+      confirmInfo.input !== void 0 && /* @__PURE__ */ jsx38(SmartInputPreview, { toolName: confirmInfo.toolName, input: confirmInfo.input }),
+      confirmInfo.suggestedPattern && /* @__PURE__ */ jsxs36("div", { className: "flex items-start gap-2 p-3 rounded-lg bg-yellow-500/10 border border-yellow-500/20", children: [
+        /* @__PURE__ */ jsx38(AlertTriangle3, { className: "h-4 w-4 text-yellow-600 mt-0.5 shrink-0" }),
+        /* @__PURE__ */ jsxs36("div", { className: "text-sm min-w-0", children: [
+          /* @__PURE__ */ jsx38("div", { className: "font-medium text-yellow-800 dark:text-yellow-200", children: "Trust pattern suggestion" }),
+          /* @__PURE__ */ jsx38("div", { className: "font-mono text-xs mt-1 break-all", children: confirmInfo.suggestedPattern }),
+          /* @__PURE__ */ jsxs36("div", { className: "text-xs text-muted-foreground mt-1", children: [
             "Picking ",
-            /* @__PURE__ */ jsx39("span", { className: "font-medium", children: "Always" }),
+            /* @__PURE__ */ jsx38("span", { className: "font-medium", children: "Always" }),
             " will whitelist matching calls for this project."
           ] })
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs37(DialogFooter, { className: "gap-2 sm:gap-2 flex-wrap", children: [
-      /* @__PURE__ */ jsxs37(
+    /* @__PURE__ */ jsxs36(DialogFooter, { className: "gap-2 sm:gap-2 flex-wrap", children: [
+      /* @__PURE__ */ jsxs36(
         Button,
         {
           variant: "outline",
@@ -10662,11 +10810,11 @@ function ConfirmDialog() {
           title: "Reject this and all future calls matching the pattern (d)",
           children: [
             "Deny always ",
-            /* @__PURE__ */ jsx39("kbd", { className: "ml-1 text-[10px] border rounded px-1 bg-background", children: "d" })
+            /* @__PURE__ */ jsx38("kbd", { className: "ml-1 text-[10px] border rounded px-1 bg-background", children: "d" })
           ]
         }
       ),
-      /* @__PURE__ */ jsxs37(
+      /* @__PURE__ */ jsxs36(
         Button,
         {
           variant: "outline",
@@ -10675,11 +10823,11 @@ function ConfirmDialog() {
           title: "Reject this single call (Esc / n)",
           children: [
             "No ",
-            /* @__PURE__ */ jsx39("kbd", { className: "ml-1 text-[10px] border rounded px-1 bg-background", children: "n" })
+            /* @__PURE__ */ jsx38("kbd", { className: "ml-1 text-[10px] border rounded px-1 bg-background", children: "n" })
           ]
         }
       ),
-      /* @__PURE__ */ jsxs37(
+      /* @__PURE__ */ jsxs36(
         Button,
         {
           variant: "outline",
@@ -10688,11 +10836,11 @@ function ConfirmDialog() {
           title: "Approve and remember the pattern for the project (a)",
           children: [
             "Always ",
-            /* @__PURE__ */ jsx39("kbd", { className: "ml-1 text-[10px] border rounded px-1 bg-background", children: "a" })
+            /* @__PURE__ */ jsx38("kbd", { className: "ml-1 text-[10px] border rounded px-1 bg-background", children: "a" })
           ]
         }
       ),
-      /* @__PURE__ */ jsxs37(
+      /* @__PURE__ */ jsxs36(
         Button,
         {
           size: "sm",
@@ -10700,7 +10848,7 @@ function ConfirmDialog() {
           title: "Approve this single call (y)",
           children: [
             "Yes ",
-            /* @__PURE__ */ jsx39("kbd", { className: "ml-1 text-[10px] border rounded px-1 bg-background/80", children: "y" })
+            /* @__PURE__ */ jsx38("kbd", { className: "ml-1 text-[10px] border rounded px-1 bg-background/80", children: "y" })
           ]
         }
       )
@@ -10711,7 +10859,7 @@ function ConfirmDialog() {
 // src/components/ConfirmModal.tsx
 import { useEffect as useEffect21 } from "react";
 import { create as create15 } from "zustand";
-import { jsx as jsx40, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs37 } from "react/jsx-runtime";
 var useConfirmModalStore = create15()((set, get) => ({
   request: null,
   open: (request) => {
@@ -10742,21 +10890,21 @@ function ConfirmModalHost() {
     window.addEventListener("keydown", onKey);
     return () => window.removeEventListener("keydown", onKey);
   }, [request]);
-  return /* @__PURE__ */ jsx40(
+  return /* @__PURE__ */ jsx39(
     Dialog,
     {
       open: request !== null,
       onOpenChange: (open) => {
         if (!open) settle(false);
       },
-      children: /* @__PURE__ */ jsxs38(DialogContent, { className: "max-w-md", children: [
-        /* @__PURE__ */ jsxs38(DialogHeader, { children: [
-          /* @__PURE__ */ jsx40(DialogTitle, { children: request?.title }),
-          request?.message && /* @__PURE__ */ jsx40(DialogDescription, { children: request.message })
+      children: /* @__PURE__ */ jsxs37(DialogContent, { className: "max-w-md", children: [
+        /* @__PURE__ */ jsxs37(DialogHeader, { children: [
+          /* @__PURE__ */ jsx39(DialogTitle, { children: request?.title }),
+          request?.message && /* @__PURE__ */ jsx39(DialogDescription, { children: request.message })
         ] }),
-        /* @__PURE__ */ jsxs38(DialogFooter, { className: "gap-2", children: [
-          /* @__PURE__ */ jsx40(Button, { variant: "outline", size: "sm", onClick: () => settle(false), children: request?.cancelLabel ?? "Cancel" }),
-          /* @__PURE__ */ jsx40(
+        /* @__PURE__ */ jsxs37(DialogFooter, { className: "gap-2", children: [
+          /* @__PURE__ */ jsx39(Button, { variant: "outline", size: "sm", onClick: () => settle(false), children: request?.cancelLabel ?? "Cancel" }),
+          /* @__PURE__ */ jsx39(
             Button,
             {
               variant: request?.danger ? "destructive" : "default",
@@ -10775,7 +10923,7 @@ function ConfirmModalHost() {
 // src/components/ConnectionBanner.tsx
 import { Loader2 as Loader23, RotateCcw as RotateCcw4, WifiOff, X as X10 } from "lucide-react";
 import { useEffect as useEffect22, useState as useState25 } from "react";
-import { jsx as jsx41, jsxs as jsxs39 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs38 } from "react/jsx-runtime";
 function ConnectionBanner() {
   const wsStatus = useConfigStore((s) => s.wsStatus);
   const wsUrl = useConfigStore((s) => s.wsUrl);
@@ -10795,7 +10943,7 @@ function ConnectionBanner() {
   const isReconnecting = wsStatus.state === "reconnecting";
   const errorText = wsStatus.state === "closed" ? wsStatus.error : wsStatus.state === "reconnecting" ? wsStatus.lastError : void 0;
   const remaining = isReconnecting ? Math.max(0, Math.ceil((wsStatus.nextRetryAt - now) / 1e3)) : 0;
-  return /* @__PURE__ */ jsxs39(
+  return /* @__PURE__ */ jsxs38(
     "div",
     {
       className: cn(
@@ -10803,12 +10951,12 @@ function ConnectionBanner() {
         isReconnecting ? "bg-orange-500/10 text-orange-700 dark:text-orange-300 border-orange-500/30" : "bg-red-500/10 text-red-700 dark:text-red-300 border-red-500/30"
       ),
       children: [
-        isReconnecting ? /* @__PURE__ */ jsx41(Loader23, { className: "h-4 w-4 animate-spin shrink-0" }) : /* @__PURE__ */ jsx41(WifiOff, { className: "h-4 w-4 shrink-0" }),
-        /* @__PURE__ */ jsxs39("div", { className: "flex-1 min-w-0", children: [
-          /* @__PURE__ */ jsx41("div", { className: "font-medium", children: isReconnecting ? `Reconnecting to backend (attempt ${wsStatus.attempt}) \u2014 retrying in ${remaining}s` : "Disconnected from backend" }),
-          errorText && /* @__PURE__ */ jsx41("div", { className: "text-xs opacity-80 truncate", children: errorText })
+        isReconnecting ? /* @__PURE__ */ jsx40(Loader23, { className: "h-4 w-4 animate-spin shrink-0" }) : /* @__PURE__ */ jsx40(WifiOff, { className: "h-4 w-4 shrink-0" }),
+        /* @__PURE__ */ jsxs38("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ jsx40("div", { className: "font-medium", children: isReconnecting ? `Reconnecting to backend (attempt ${wsStatus.attempt}) \u2014 retrying in ${remaining}s` : "Disconnected from backend" }),
+          errorText && /* @__PURE__ */ jsx40("div", { className: "text-xs opacity-80 truncate", children: errorText })
         ] }),
-        /* @__PURE__ */ jsxs39(
+        /* @__PURE__ */ jsxs38(
           "button",
           {
             type: "button",
@@ -10820,19 +10968,19 @@ function ConnectionBanner() {
             ),
             title: "Retry connection now",
             children: [
-              /* @__PURE__ */ jsx41(RotateCcw4, { className: "h-3 w-3" }),
+              /* @__PURE__ */ jsx40(RotateCcw4, { className: "h-3 w-3" }),
               "Retry now"
             ]
           }
         ),
-        /* @__PURE__ */ jsx41(
+        /* @__PURE__ */ jsx40(
           "button",
           {
             type: "button",
             onClick: () => setDismissed(true),
             className: "text-current/60 hover:text-current shrink-0",
             title: "Dismiss (chip in topbar still shows status)",
-            children: /* @__PURE__ */ jsx41(X10, { className: "h-4 w-4" })
+            children: /* @__PURE__ */ jsx40(X10, { className: "h-4 w-4" })
           }
         )
       ]
@@ -10843,7 +10991,7 @@ function ConnectionBanner() {
 // src/components/ErrorBoundary.tsx
 import { AlertTriangle as AlertTriangle4, RefreshCw as RefreshCw2 } from "lucide-react";
 import { Component } from "react";
-import { jsx as jsx42, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs39 } from "react/jsx-runtime";
 var ErrorBoundary = class extends Component {
   state = { error: null };
   static getDerivedStateFromError(error) {
@@ -10858,17 +11006,17 @@ var ErrorBoundary = class extends Component {
   };
   render() {
     if (this.state.error) {
-      return /* @__PURE__ */ jsx42("div", { className: "flex items-center justify-center h-screen bg-background", children: /* @__PURE__ */ jsxs40("div", { className: "flex flex-col items-center gap-4 p-8 max-w-md text-center", children: [
-        /* @__PURE__ */ jsx42(AlertTriangle4, { className: "h-12 w-12 text-destructive" }),
-        /* @__PURE__ */ jsx42("h1", { className: "text-lg font-semibold", children: "Something went wrong" }),
-        /* @__PURE__ */ jsx42("p", { className: "text-sm text-muted-foreground", children: "A rendering error occurred. Your session is still active on the server \u2014 reloading will pick up where you left off." }),
-        /* @__PURE__ */ jsx42("pre", { className: "text-xs font-mono text-muted-foreground bg-muted/50 rounded p-3 max-h-32 overflow-auto w-full text-left", children: this.state.error.message }),
-        /* @__PURE__ */ jsxs40("div", { className: "flex gap-2", children: [
-          /* @__PURE__ */ jsxs40(Button, { size: "sm", variant: "outline", onClick: () => window.location.reload(), children: [
-            /* @__PURE__ */ jsx42(RefreshCw2, { className: "h-4 w-4 mr-1" }),
+      return /* @__PURE__ */ jsx41("div", { className: "flex items-center justify-center h-screen bg-background", children: /* @__PURE__ */ jsxs39("div", { className: "flex flex-col items-center gap-4 p-8 max-w-md text-center", children: [
+        /* @__PURE__ */ jsx41(AlertTriangle4, { className: "h-12 w-12 text-destructive" }),
+        /* @__PURE__ */ jsx41("h1", { className: "text-lg font-semibold", children: "Something went wrong" }),
+        /* @__PURE__ */ jsx41("p", { className: "text-sm text-muted-foreground", children: "A rendering error occurred. Your session is still active on the server \u2014 reloading will pick up where you left off." }),
+        /* @__PURE__ */ jsx41("pre", { className: "text-xs font-mono text-muted-foreground bg-muted/50 rounded p-3 max-h-32 overflow-auto w-full text-left", children: this.state.error.message }),
+        /* @__PURE__ */ jsxs39("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsxs39(Button, { size: "sm", variant: "outline", onClick: () => window.location.reload(), children: [
+            /* @__PURE__ */ jsx41(RefreshCw2, { className: "h-4 w-4 mr-1" }),
             "Reload page"
           ] }),
-          /* @__PURE__ */ jsx42(Button, { size: "sm", onClick: this.handleReset, children: "Try again" })
+          /* @__PURE__ */ jsx41(Button, { size: "sm", onClick: this.handleReset, children: "Try again" })
         ] })
       ] }) });
     }
@@ -10878,7 +11026,7 @@ var ErrorBoundary = class extends Component {
 
 // src/components/QuickModelSwitcher.tsx
 import { ArrowRight as ArrowRight4, Cpu as Cpu6, Search as Search4 } from "lucide-react";
-import { useEffect as useEffect23, useMemo as useMemo9, useRef as useRef17, useState as useState26 } from "react";
+import { useEffect as useEffect23, useMemo as useMemo10, useRef as useRef17, useState as useState26 } from "react";
 
 // src/components/QuickModelSwitcher.filter.ts
 function buildModelCandidates(saved, modelsByProvider, query, currentProvider, currentModel) {
@@ -10906,7 +11054,7 @@ function buildModelCandidates(saved, modelsByProvider, query, currentProvider, c
 }
 
 // src/components/QuickModelSwitcher.tsx
-import { jsx as jsx43, jsxs as jsxs41 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs40 } from "react/jsx-runtime";
 function QuickModelSwitcher() {
   const open = useUIStore((s) => s.modelSwitcherOpen);
   const setOpen = useUIStore((s) => s.setModelSwitcherOpen);
@@ -10967,7 +11115,7 @@ function QuickModelSwitcher() {
       }
     }
   }, [open, saved, modelsByProvider, listProviderModels]);
-  const candidates = useMemo9(
+  const candidates = useMemo10(
     () => buildModelCandidates(
       saved,
       modelsByProvider,
@@ -10987,7 +11135,7 @@ function QuickModelSwitcher() {
     setOpen(false);
   };
   if (!open) return null;
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx42(
     "div",
     {
       className: "fixed inset-0 z-50 flex items-start justify-center bg-background/60 backdrop-blur-sm pt-[15vh]",
@@ -10997,10 +11145,10 @@ function QuickModelSwitcher() {
       onKeyDown: (e) => {
         if (e.key === "Escape") setOpen(false);
       },
-      children: /* @__PURE__ */ jsxs41("div", { className: "w-full max-w-xl rounded-xl border bg-popover shadow-2xl overflow-hidden", children: [
-        /* @__PURE__ */ jsxs41("div", { className: "flex items-center gap-2 border-b px-3 py-2", children: [
-          /* @__PURE__ */ jsx43(Search4, { className: "h-4 w-4 text-muted-foreground" }),
-          /* @__PURE__ */ jsx43(
+      children: /* @__PURE__ */ jsxs40("div", { className: "w-full max-w-xl rounded-xl border bg-popover shadow-2xl overflow-hidden", children: [
+        /* @__PURE__ */ jsxs40("div", { className: "flex items-center gap-2 border-b px-3 py-2", children: [
+          /* @__PURE__ */ jsx42(Search4, { className: "h-4 w-4 text-muted-foreground" }),
+          /* @__PURE__ */ jsx42(
             "input",
             {
               ref: inputRef,
@@ -11028,9 +11176,9 @@ function QuickModelSwitcher() {
               className: "flex-1 bg-transparent outline-none text-sm placeholder:text-muted-foreground"
             }
           ),
-          /* @__PURE__ */ jsx43("span", { className: "text-[10px] text-muted-foreground font-mono", children: "\u2191\u2193 \xB7 Enter \xB7 Esc" })
+          /* @__PURE__ */ jsx42("span", { className: "text-[10px] text-muted-foreground font-mono", children: "\u2191\u2193 \xB7 Enter \xB7 Esc" })
         ] }),
-        /* @__PURE__ */ jsx43("div", { className: "max-h-[50vh] overflow-y-auto py-1", children: candidates.length === 0 ? /* @__PURE__ */ jsx43("div", { className: "px-4 py-8 text-center text-sm text-muted-foreground", children: saved.length === 0 ? "No saved providers \u2014 register a key in Settings first." : "Loading models\u2026" }) : candidates.map((c, idx) => /* @__PURE__ */ jsxs41(
+        /* @__PURE__ */ jsx42("div", { className: "max-h-[50vh] overflow-y-auto py-1", children: candidates.length === 0 ? /* @__PURE__ */ jsx42("div", { className: "px-4 py-8 text-center text-sm text-muted-foreground", children: saved.length === 0 ? "No saved providers \u2014 register a key in Settings first." : "Loading models\u2026" }) : candidates.map((c, idx) => /* @__PURE__ */ jsxs40(
           "button",
           {
             type: "button",
@@ -11042,7 +11190,7 @@ function QuickModelSwitcher() {
               c.isCurrent && "font-medium"
             ),
             children: [
-              /* @__PURE__ */ jsx43(
+              /* @__PURE__ */ jsx42(
                 Cpu6,
                 {
                   className: cn(
@@ -11051,19 +11199,19 @@ function QuickModelSwitcher() {
                   )
                 }
               ),
-              /* @__PURE__ */ jsxs41("div", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ jsxs41("div", { className: "truncate", children: [
-                  /* @__PURE__ */ jsx43("span", { className: "text-muted-foreground", children: c.provider }),
-                  /* @__PURE__ */ jsx43("span", { className: "mx-1 text-muted-foreground/40", children: "\xB7" }),
-                  /* @__PURE__ */ jsx43("span", { children: c.modelName })
+              /* @__PURE__ */ jsxs40("div", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ jsxs40("div", { className: "truncate", children: [
+                  /* @__PURE__ */ jsx42("span", { className: "text-muted-foreground", children: c.provider }),
+                  /* @__PURE__ */ jsx42("span", { className: "mx-1 text-muted-foreground/40", children: "\xB7" }),
+                  /* @__PURE__ */ jsx42("span", { children: c.modelName })
                 ] }),
-                c.contextWindow && /* @__PURE__ */ jsxs41("div", { className: "text-[10px] text-muted-foreground font-mono", children: [
+                c.contextWindow && /* @__PURE__ */ jsxs40("div", { className: "text-[10px] text-muted-foreground font-mono", children: [
                   c.model,
                   " \xB7 ctx ",
                   c.contextWindow.toLocaleString()
                 ] })
               ] }),
-              c.isCurrent ? /* @__PURE__ */ jsx43("span", { className: "text-[10px] uppercase tracking-wide text-primary font-semibold", children: "active" }) : /* @__PURE__ */ jsx43(ArrowRight4, { className: "h-3.5 w-3.5 text-muted-foreground opacity-0 group-hover:opacity-100" })
+              c.isCurrent ? /* @__PURE__ */ jsx42("span", { className: "text-[10px] uppercase tracking-wide text-primary font-semibold", children: "active" }) : /* @__PURE__ */ jsx42(ArrowRight4, { className: "h-3.5 w-3.5 text-muted-foreground opacity-0 group-hover:opacity-100" })
             ]
           },
           `${c.provider}:${c.model}`
@@ -11093,11 +11241,11 @@ import {
 import { useState as useState28, useEffect as useEffect24, useCallback as useCallback13 } from "react";
 
 // src/components/ui/input.tsx
-import * as React4 from "react";
-import { jsx as jsx44 } from "react/jsx-runtime";
-var Input = React4.forwardRef(
+import * as React3 from "react";
+import { jsx as jsx43 } from "react/jsx-runtime";
+var Input = React3.forwardRef(
   ({ className, type, ...props }, ref) => {
-    return /* @__PURE__ */ jsx44(
+    return /* @__PURE__ */ jsx43(
       "input",
       {
         type,
@@ -11113,6 +11261,41 @@ var Input = React4.forwardRef(
 );
 Input.displayName = "Input";
 
+// src/components/ui/scroll-area.tsx
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
+import * as React4 from "react";
+import { jsx as jsx44, jsxs as jsxs41 } from "react/jsx-runtime";
+var ScrollArea = React4.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs41(
+  ScrollAreaPrimitive.Root,
+  {
+    ref,
+    className: cn("relative overflow-hidden", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx44(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
+      /* @__PURE__ */ jsx44(ScrollBar, {}),
+      /* @__PURE__ */ jsx44(ScrollAreaPrimitive.Corner, {})
+    ]
+  }
+));
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+var ScrollBar = React4.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx44(
+  ScrollAreaPrimitive.ScrollAreaScrollbar,
+  {
+    ref,
+    orientation,
+    className: cn(
+      "flex touch-none select-none transition-colors",
+      orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]",
+      orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx44(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
+  }
+));
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
+
 // src/components/ui/tabs.tsx
 import * as TabsPrimitive from "@radix-ui/react-tabs";
 import * as React5 from "react";
@@ -13003,7 +13186,7 @@ import {
   Database as Database3,
   FolderOpen as FolderOpen3,
   Target,
-  Wrench as Wrench7,
+  Wrench as Wrench6,
   X as X13,
   FileText as FileText3,
   Terminal as Terminal6,
@@ -13085,7 +13268,7 @@ var TOOL_ICONS = {
   exec: /* @__PURE__ */ jsx55(Terminal6, { className: "h-3 w-3" }),
   glob: /* @__PURE__ */ jsx55(FolderOpen3, { className: "h-3 w-3" }),
   grep: /* @__PURE__ */ jsx55(Target, { className: "h-3 w-3" }),
-  edit: /* @__PURE__ */ jsx55(Wrench7, { className: "h-3 w-3" }),
+  edit: /* @__PURE__ */ jsx55(Wrench6, { className: "h-3 w-3" }),
   fetch: /* @__PURE__ */ jsx55(Globe5, { className: "h-3 w-3" }),
   search: /* @__PURE__ */ jsx55(Target, { className: "h-3 w-3" })
 };
@@ -13132,7 +13315,7 @@ function AgentNode({ data }) {
       /* @__PURE__ */ jsxs50("div", { className: "flex-1 min-w-0", children: [
         /* @__PURE__ */ jsx55("div", { className: "text-[10px] font-bold truncate", style: { color: colors }, children: data.label }),
         data.currentTool && /* @__PURE__ */ jsxs50("div", { className: "flex items-center gap-1 text-[9px] text-amber-400/70", children: [
-          /* @__PURE__ */ jsx55(Wrench7, { className: "h-2.5 w-2.5" }),
+          /* @__PURE__ */ jsx55(Wrench6, { className: "h-2.5 w-2.5" }),
           /* @__PURE__ */ jsx55("span", { className: "truncate font-mono", children: data.currentTool })
         ] })
       ] }),
@@ -13172,7 +13355,7 @@ function AgentNode({ data }) {
 }
 function ToolNode({ data }) {
   const colors = data.color || "#f59e0b";
-  const icon = TOOL_ICONS[data.label?.toLowerCase() ?? ""] || /* @__PURE__ */ jsx55(Wrench7, { className: "h-3 w-3" });
+  const icon = TOOL_ICONS[data.label?.toLowerCase() ?? ""] || /* @__PURE__ */ jsx55(Wrench6, { className: "h-3 w-3" });
   return /* @__PURE__ */ jsxs50("div", { className: "rounded-lg border border-amber-500/30 bg-amber-500/10 p-2 min-w-[100px] transition-all", children: [
     /* @__PURE__ */ jsxs50("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ jsx55("span", { style: { color: colors }, children: icon }),
@@ -13744,7 +13927,7 @@ import {
   Loader2 as Loader28,
   Minimize2
 } from "lucide-react";
-import { useCallback as useCallback17, useEffect as useEffect29, useMemo as useMemo11, useRef as useRef19, useState as useState32 } from "react";
+import { useCallback as useCallback17, useEffect as useEffect29, useMemo as useMemo12, useRef as useRef19, useState as useState32 } from "react";
 import { jsx as jsx56, jsxs as jsxs51 } from "react/jsx-runtime";
 var EXT_ICONS = {
   // ── Code ──
@@ -13970,7 +14153,7 @@ function FileExplorer() {
     const segments = cwd.replace(/\\/g, "/").split("/").filter(Boolean);
     return (segments[segments.length - 1] ?? "") === projectName;
   })();
-  const breadcrumbs = useMemo11(() => {
+  const breadcrumbs = useMemo12(() => {
     if (!cwd || !projectName) return [];
     const norm = cwd.replace(/\\/g, "/");
     const segments = norm.split("/").filter(Boolean);
@@ -14063,7 +14246,7 @@ function FileExplorer() {
   }, [treeLoading]);
   const [selectedPath, setSelectedPath] = useState32(null);
   const [globalExpand, setGlobalExpand] = useState32(null);
-  const dirCount = useMemo11(() => {
+  const dirCount = useMemo12(() => {
     let count = 0;
     const walk = (nodes) => {
       for (const n of nodes) {
@@ -14074,7 +14257,7 @@ function FileExplorer() {
     walk(tree);
     return count;
   }, [tree]);
-  const cwdStats = useMemo11(() => {
+  const cwdStats = useMemo12(() => {
     let files = 0;
     let dirs = 0;
     for (const n of tree) {
@@ -14774,12 +14957,12 @@ function ProjectsPanel({ fullView }) {
 }
 
 // src/components/SidePanel/AgentsPanel.tsx
-import { Bot as Bot10, LayoutGrid as LayoutGrid2, Wrench as Wrench9 } from "lucide-react";
-import { useMemo as useMemo13, useState as useState36 } from "react";
+import { Bot as Bot10, LayoutGrid as LayoutGrid2, Wrench as Wrench8 } from "lucide-react";
+import { useMemo as useMemo14, useState as useState36 } from "react";
 
 // src/components/FleetPanel.tsx
-import { Bot as Bot9, Check as Check7, ChevronDown as ChevronDown9, ChevronRight as ChevronRight8, Clock as Clock11, Copy as Copy4, Cpu as Cpu12, Crown, Wrench as Wrench8, X as X14, Zap as Zap9 } from "lucide-react";
-import { useCallback as useCallback19, useMemo as useMemo12, useState as useState35 } from "react";
+import { Bot as Bot9, Check as Check7, ChevronDown as ChevronDown9, ChevronRight as ChevronRight8, Clock as Clock11, Copy as Copy4, Cpu as Cpu12, Crown, Wrench as Wrench7, X as X14, Zap as Zap9 } from "lucide-react";
+import { useCallback as useCallback19, useMemo as useMemo13, useState as useState35 } from "react";
 
 // src/components/ui/sparkline.tsx
 import { jsx as jsx59 } from "react/jsx-runtime";
@@ -14985,7 +15168,7 @@ function AgentDetail({
             active ? "border-primary/30 bg-primary/[0.04]" : "border-border bg-muted/30"
           ),
           children: [
-            /* @__PURE__ */ jsx60(Wrench8, { className: cn("h-3.5 w-3.5", active ? "text-primary animate-pulse" : "text-muted-foreground") }),
+            /* @__PURE__ */ jsx60(Wrench7, { className: cn("h-3.5 w-3.5", active ? "text-primary animate-pulse" : "text-muted-foreground") }),
             /* @__PURE__ */ jsx60("span", { className: "text-xs font-mono", children: tool }),
             /* @__PURE__ */ jsx60("span", { className: "text-[10px] text-muted-foreground ml-auto", children: agent.currentTool ? "running\u2026" : "last tool" })
           ]
@@ -15122,7 +15305,7 @@ function AgentCard({
             ),
             title: a.currentTool ? `running ${tool}` : `last: ${tool}`,
             children: [
-              /* @__PURE__ */ jsx60(Wrench8, { className: cn("h-2.5 w-2.5 shrink-0", active && "animate-pulse") }),
+              /* @__PURE__ */ jsx60(Wrench7, { className: cn("h-2.5 w-2.5 shrink-0", active && "animate-pulse") }),
               /* @__PURE__ */ jsx60("span", { className: "truncate font-mono", children: tool })
             ]
           }
@@ -15158,7 +15341,7 @@ function FleetPanel({
   const agents = useFleetStore((s) => s.agents);
   const [collapsed, setCollapsed] = useState35(true);
   const [selectedId, setSelectedId] = useState35(null);
-  const list = useMemo12(() => {
+  const list = useMemo13(() => {
     const arr = Array.from(agents.values());
     arr.sort((x, y) => {
       const xa = x.status === "running" ? 0 : 1;
@@ -15261,7 +15444,7 @@ function AgentRow2({ agent, onClick }) {
           /* @__PURE__ */ jsx61("span", { className: "tabular ml-auto text-[10px] text-foreground/70", children: fmtCost3(agent.costUsd) })
         ] }),
         (agent.currentTool || agent.lastTool) && /* @__PURE__ */ jsxs55("div", { className: "flex items-center gap-1 mt-1 text-[10px] text-muted-foreground truncate", children: [
-          /* @__PURE__ */ jsx61(Wrench9, { className: cn("h-2.5 w-2.5 shrink-0", active && "animate-pulse text-primary") }),
+          /* @__PURE__ */ jsx61(Wrench8, { className: cn("h-2.5 w-2.5 shrink-0", active && "animate-pulse text-primary") }),
           /* @__PURE__ */ jsx61("span", { className: "truncate font-mono", children: agent.currentTool ?? agent.lastTool })
         ] })
       ]
@@ -15272,7 +15455,7 @@ function AgentsPanel() {
   const fleetAgents = useFleetStore((s) => s.agents);
   const setCurrentView = useUIStore((s) => s.setCurrentView);
   const [selectedAgentId, setSelectedAgentId] = useState36(null);
-  const fleetList = useMemo13(() => {
+  const fleetList = useMemo14(() => {
     const arr = Array.from(fleetAgents.values());
     arr.sort((x, y) => {
       const xa = x.status === "running" ? 0 : 1;
@@ -15331,7 +15514,7 @@ import {
   Trash2 as Trash24,
   X as X15
 } from "lucide-react";
-import { useCallback as useCallback20, useEffect as useEffect32, useMemo as useMemo14, useState as useState37 } from "react";
+import { useCallback as useCallback20, useEffect as useEffect32, useMemo as useMemo15, useState as useState37 } from "react";
 import { Fragment as Fragment15, jsx as jsx62, jsxs as jsxs56 } from "react/jsx-runtime";
 var formatRelative = (iso) => {
   const ts = Date.parse(iso);
@@ -15378,7 +15561,7 @@ function SessionList({
     },
     [resumeSession]
   );
-  const emptySessionIds = useMemo14(
+  const emptySessionIds = useMemo15(
     () => getEmptySessionIds(historyEntries),
     [historyEntries]
   );
@@ -15644,7 +15827,7 @@ import {
   Wifi as Wifi2,
   WifiOff as WifiOff3
 } from "lucide-react";
-import { useCallback as useCallback21, useEffect as useEffect34, useMemo as useMemo15, useState as useState39 } from "react";
+import { useCallback as useCallback21, useEffect as useEffect34, useMemo as useMemo16, useState as useState39 } from "react";
 import { jsx as jsx64, jsxs as jsxs58 } from "react/jsx-runtime";
 function fmtCost4(v) {
   if (v <= 0) return "$0.000";
@@ -15779,7 +15962,7 @@ function SessionPanel() {
     const t = setInterval(() => setNow(Date.now()), 1e3);
     return () => clearInterval(t);
   }, [startedAt]);
-  const runningAgents = useMemo15(
+  const runningAgents = useMemo16(
     () => Array.from(fleetAgents.values()).filter((a) => a.status === "running").length,
     [fleetAgents]
   );
@@ -16215,7 +16398,7 @@ function SidePanel() {
 
 // src/components/WorkspaceDock.tsx
 import { Bot as Bot11, GitBranch as GitBranch3, ListTodo as ListTodo2, Maximize2 as Maximize22, Rocket as Rocket4, Target as Target3, Users as Users3 } from "lucide-react";
-import { useCallback as useCallback26, useEffect as useEffect41, useMemo as useMemo16, useRef as useRef24, useState as useState46 } from "react";
+import { useCallback as useCallback26, useEffect as useEffect41, useMemo as useMemo17, useRef as useRef24, useState as useState46 } from "react";
 
 // src/components/CollabPanel.tsx
 import { Eye as Eye2, LogIn, LogOut, MessageSquareWarning, Pause as Pause5, Play as Play6, Users as Users2 } from "lucide-react";
@@ -17248,7 +17431,7 @@ function WorkspaceDock({ sessionId }) {
   );
   const [worktreeView, setWorktreeView] = useState46("graph");
   const fleetTotal = fleetAgents.size;
-  const fleetRunning = useMemo16(
+  const fleetRunning = useMemo17(
     () => Array.from(fleetAgents.values()).filter((a) => a.status === "running").length,
     [fleetAgents]
   );
@@ -17398,8 +17581,8 @@ function WorkspaceDock({ sessionId }) {
 }
 
 // src/components/AgentsMonitor.tsx
-import { Bot as Bot12, ChevronLeft, ChevronRight as ChevronRight10, Cpu as Cpu14, Crown as Crown2, Loader2 as Loader211, Wrench as Wrench10, X as X16, Zap as Zap10 } from "lucide-react";
-import { useCallback as useCallback27, useEffect as useEffect42, useMemo as useMemo17, useState as useState47 } from "react";
+import { Bot as Bot12, ChevronLeft, ChevronRight as ChevronRight10, Cpu as Cpu14, Crown as Crown2, Loader2 as Loader211, Wrench as Wrench9, X as X16, Zap as Zap10 } from "lucide-react";
+import { useCallback as useCallback27, useEffect as useEffect42, useMemo as useMemo18, useState as useState47 } from "react";
 import { jsx as jsx73, jsxs as jsxs67 } from "react/jsx-runtime";
 function fmtCost5(v) {
   if (v <= 0) return "$0";
@@ -17499,7 +17682,7 @@ function AgentCard2({ agent, isLeader }) {
       ] })
     ] }),
     (agent.currentTool || agent.lastTool) && /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
-      /* @__PURE__ */ jsx73(Wrench10, { className: cn("h-3 w-3", active && "animate-pulse text-primary") }),
+      /* @__PURE__ */ jsx73(Wrench9, { className: cn("h-3 w-3", active && "animate-pulse text-primary") }),
       /* @__PURE__ */ jsx73("span", { className: "font-mono", children: agent.currentTool ?? agent.lastTool }),
       active && /* @__PURE__ */ jsx73(Loader211, { className: "h-3 w-3 animate-spin" })
     ] }),
@@ -17525,7 +17708,7 @@ function AgentsMonitor({ onClose }) {
   const fleetAgents = useFleetStore((s) => s.agents);
   const leaderId = useFleetStore((s) => s.leaderId);
   const [selectedIdx, setSelectedIdx] = useState47(0);
-  const fleetList = useMemo17(() => {
+  const fleetList = useMemo18(() => {
     const arr = Array.from(fleetAgents.values());
     arr.sort((x, y) => {
       if (x.id === leaderId) return -1;
@@ -17664,11 +17847,11 @@ import {
   Loader2 as Loader212,
   Timer as Timer2,
   Users as Users4,
-  Wrench as Wrench11,
+  Wrench as Wrench10,
   XCircle as XCircle9,
   Zap as Zap11
 } from "lucide-react";
-import { useCallback as useCallback28, useEffect as useEffect43, useMemo as useMemo18, useState as useState48 } from "react";
+import { useCallback as useCallback28, useEffect as useEffect43, useMemo as useMemo19, useState as useState48 } from "react";
 
 // src/components/ui/dropdown-menu.tsx
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
@@ -17901,7 +18084,7 @@ function FleetAgentDetailPanel({
   }, []);
   const totalToolDuration = agent.toolLog.reduce((sum, t) => sum + t.durationMs, 0);
   const avgToolDuration = agent.toolLog.length > 0 ? Math.round(totalToolDuration / agent.toolLog.length) : 0;
-  const uniqueTools = useMemo18(() => {
+  const uniqueTools = useMemo19(() => {
     const tools = /* @__PURE__ */ new Set();
     agent.toolLog.forEach((t) => tools.add(t.name));
     return tools.size;
@@ -18025,7 +18208,7 @@ function FleetAgentDetailPanel({
         "rounded-lg border px-4 py-3 flex items-center gap-3",
         active ? "border-primary/30 bg-primary/[0.04]" : "border-border bg-muted/30"
       ), children: [
-        /* @__PURE__ */ jsx77(Wrench11, { className: cn("h-4 w-4", active ? "text-primary animate-pulse" : "text-muted-foreground") }),
+        /* @__PURE__ */ jsx77(Wrench10, { className: cn("h-4 w-4", active ? "text-primary animate-pulse" : "text-muted-foreground") }),
         /* @__PURE__ */ jsx77("span", { className: "text-sm font-mono font-medium", children: agent.currentTool }),
         active ? /* @__PURE__ */ jsxs71("span", { className: "ml-auto flex items-center gap-1.5 text-[10px] text-primary", children: [
           /* @__PURE__ */ jsx77(Loader212, { className: "h-3 w-3 animate-spin" }),
@@ -18111,7 +18294,7 @@ function FleetAgentDetailPanel({
             className: "w-full flex items-center justify-between px-4 py-2 border-b bg-muted/30 hover:bg-muted/50 transition-colors",
             children: [
               /* @__PURE__ */ jsxs71("span", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider flex items-center gap-2", children: [
-                /* @__PURE__ */ jsx77(Wrench11, { className: "h-3 w-3" }),
+                /* @__PURE__ */ jsx77(Wrench10, { className: "h-3 w-3" }),
                 "Tool Log (",
                 agent.toolLog.length,
                 " calls)"
@@ -18216,7 +18399,7 @@ function FleetMonitor({
     const t = setInterval(() => setNowTick(Date.now()), 1e3);
     return () => clearInterval(t);
   }, []);
-  const fleetList = useMemo18(() => {
+  const fleetList = useMemo19(() => {
     const arr = Array.from(fleetAgents.values());
     arr.sort((x, y) => {
       if (x.id === leaderId) return -1;
@@ -18228,7 +18411,7 @@ function FleetMonitor({
     });
     return arr;
   }, [fleetAgents, leaderId]);
-  const totalCost = useMemo18(
+  const totalCost = useMemo19(
     () => Array.from(fleetAgents.values()).reduce((sum, a) => sum + a.costUsd, 0),
     [fleetAgents]
   );