@tonyclaw/agent-inspector 3.0.23 → 3.0.25

package/.output/server/_ssr/{ProxyViewerContainer-Dcs2Mq8l.mjs → ProxyViewerContainer-By-I0tJv.mjs}

@@ -1,5 +1,5 @@
 import { r as reactExports, j as jsxRuntimeExports, R as React } from "../_libs/react.mjs";
-import { C as CapturedLogSchema, q as DeleteInspectorGroupsResponseSchema, D as DEFAULT_CAPTURE_MODE, a as DEFAULT_SLOW_RESPONSE_THRESHOLD_SECONDS, b as DEFAULT_PROVIDER_TEST_TIMEOUT_SECONDS, c as DEFAULT_TIME_DISPLAY_FORMAT, d as RuntimeConfigSchema, m as extractStopReason, p as packageJson, P as ProviderConfigSchema, i as apiFormatForPath, r as GroupEvidenceExportResultSchema, t as DeleteInspectorGroupResponseSchema, N as PiAgentResponseSchema, l as isTurnBoundary, n as AlertSummarySchema, o as AlertListResponseSchema, I as InspectorGroupsListResponseSchema, G as GroupEvidenceReadResponseSchema, E as createPendingProviderTestResults, F as ProviderTestResultsSchema, H as createFailedProviderTestResults, M as MAX_SLOW_RESPONSE_THRESHOLD_SECONDS, J as MAX_PROVIDER_TEST_TIMEOUT_SECONDS, T as TimeDisplayFormatSchema, v as maskApiKey, x as PATH_V1_MESSAGES, y as PATH_V1_CHAT_COMPLETIONS, z as PATH_V1_RESPONSES, u as providerHasContextMetadata, f as parseOpenAIResponse, g as parseOpenAIResponsesResponse, O as OpenAIRequestSchema, h as OpenAIResponsesRequestSchema, A as AnthropicResponseSchema$1, e as AnthropicRequestSchema, s as safeGetOwnProperty, Q as resolveProviderContextWindow, j as getSessionPath, w as findProviderModelMetadata, B as previewUpstreamUrl, K as KnowledgeCandidateSchema, S as isPlainRecord, k as stripClaudeCodeBillingHeader, L as LogBodyChunkSchema } from "./router-DO0OntUK.mjs";
+import { C as CapturedLogSchema, z as DeleteInspectorGroupsResponseSchema, D as DEFAULT_CAPTURE_MODE, a as DEFAULT_SLOW_RESPONSE_THRESHOLD_SECONDS, b as DEFAULT_PROVIDER_TEST_TIMEOUT_SECONDS, c as DEFAULT_TIME_DISPLAY_FORMAT, d as RuntimeConfigSchema, g as readStoredUiScalePreference, h as persistUiScalePreference, i as applyUiScalePreference, w as extractStopReason, p as packageJson, P as ProviderConfigSchema, U as UI_SCALE_STORAGE_KEY, j as normalizeUiScalePreference, q as apiFormatForPath, B as GroupEvidenceExportResultSchema, E as DeleteInspectorGroupResponseSchema, $ as PiAgentResponseSchema, v as isTurnBoundary, r as readStoredThemeMode, e as applyThemeMode, f as persistThemeMode, a2 as formatUiScale, x as AlertSummarySchema, y as AlertListResponseSchema, I as InspectorGroupsListResponseSchema, G as GroupEvidenceReadResponseSchema, V as createPendingProviderTestResults, W as ProviderTestResultsSchema, X as createFailedProviderTestResults, Y as MAX_SLOW_RESPONSE_THRESHOLD_SECONDS, Z as MAX_PROVIDER_TEST_TIMEOUT_SECONDS, _ as TimeDisplayFormatSchema, T as THEME_MODE_STORAGE_KEY, n as normalizeThemeMode, H as maskApiKey, M as PATH_V1_MESSAGES, N as PATH_V1_CHAT_COMPLETIONS, Q as PATH_V1_RESPONSES, F as providerHasContextMetadata, l as parseOpenAIResponse, m as parseOpenAIResponsesResponse, O as OpenAIRequestSchema, o as OpenAIResponsesRequestSchema, A as AnthropicResponseSchema$1, k as AnthropicRequestSchema, s as safeGetOwnProperty, a0 as resolveProviderContextWindow, t as getSessionPath, J as findProviderModelMetadata, S as previewUpstreamUrl, K as KnowledgeCandidateSchema, a1 as isPlainRecord, u as stripClaudeCodeBillingHeader, L as LogBodyChunkSchema } from "./router-bofP-Ekl.mjs";
 import { u as useSWR, a as useSWRConfig } from "../_libs/swr.mjs";
 import { J as JSZip } from "../_libs/jszip.mjs";
 import { c as clsx } from "../_libs/clsx.mjs";
@@ -7,7 +7,7 @@ import { t as twMerge } from "../_libs/tailwind-merge.mjs";
 import { c as cva } from "../_libs/class-variance-authority.mjs";
 import { u as useWindowVirtualizer, a as useVirtualizer } from "../_libs/tanstack__react-virtual.mjs";
 import { d as diffJson, a as diffLines } from "../_libs/diff.mjs";
-import { T as TriangleAlert, C as CircleCheck, X, I as Info, a as ChevronDown, b as Check, P as PanelRightOpen, c as PanelRightClose, S as Search, U as Upload, D as Download, F as FileBraces, R as RefreshCw, d as Trash2, e as Plus, B as BrainCircuit, L as LoaderCircle, f as Send, A as ArrowLeft, g as ChevronUp, h as Copy, i as ChevronsLeft, j as ChevronLeft, k as ChevronRight, l as ChevronsRight, m as Clapperboard, n as Flag, o as Siren, p as Timer, G as Gauge, q as Layers, r as FlaskConical, s as Sparkles, t as Activity, u as Beaker, N as Network, v as Terminal, w as Settings, M as Monitor, x as Rocket, y as PackageCheck, H as History, z as Scan, E as CircleAlert, J as ArrowUpRight, K as ArrowDownRight, O as Cpu, Q as FolderOpen, V as Bell, W as Clock3, Y as ShieldAlert, Z as EyeOff, _ as Eye, $ as ExternalLink, a0 as Clock, a1 as RotateCw, a2 as Pencil, a3 as MessageSquare, a4 as Zap, a5 as Wrench, a6 as Brain, a7 as CircleCheckBig, a8 as Minus, a9 as CircleQuestionMark, aa as Server, ab as Lock, ac as Wifi, ad as WifiOff, ae as CircleX, af as ShieldCheck, ag as Save, ah as FileSearch, ai as CloudUpload, aj as OctagonAlert, ak as Radio, al as Globe, am as FileTerminal, an as ChevronsUp, ao as ChevronsDown, ap as FileDiff, aq as RotateCcw, ar as GitCompareArrows, as as ArrowUp, at as ArrowDown, au as Ellipsis, av as CodeXml, aw as Blocks, ax as MousePointerClick, ay as FileText, az as Rows3, aA as Columns2 } from "../_libs/lucide-react.mjs";
+import { T as TriangleAlert, C as CircleCheck, X, I as Info, a as ChevronDown, b as Check, P as PanelRightOpen, c as PanelRightClose, S as Search, U as Upload, D as Download, F as FileBraces, R as RefreshCw, d as Trash2, H as Heart, e as Pause, f as Play, g as Plus, B as BrainCircuit, L as LoaderCircle, h as Send, A as ArrowLeft, i as ChevronUp, j as Copy, k as ChevronsLeft, l as ChevronLeft, m as ChevronRight, n as ChevronsRight, o as Clapperboard, p as Flag, q as Siren, r as Timer, G as Gauge, s as Sun, E as Eye, M as Moon, t as ALargeSmall, u as Layers, v as FlaskConical, w as Sparkles, x as Activity, y as Beaker, N as Network, z as Terminal, J as Settings, K as Monitor, O as Rocket, Q as PackageCheck, V as History, W as Scan, Y as CircleAlert, Z as ArrowUpRight, _ as ArrowDownRight, $ as Cpu, a0 as FolderOpen, a1 as Bell, a2 as Clock3, a3 as ShieldAlert, a4 as EyeOff, a5 as ExternalLink, a6 as Clock, a7 as RotateCw, a8 as Pencil, a9 as MessageSquare, aa as Zap, ab as Wrench, ac as Brain, ad as CircleCheckBig, ae as Minus, af as CircleX, ag as ShieldCheck, ah as Save, ai as FileSearch, aj as CloudUpload, ak as CircleQuestionMark, al as Server, am as Lock, an as Wifi, ao as WifiOff, ap as OctagonAlert, aq as Radio, ar as Globe, as as FileTerminal, at as ChevronsUp, au as ChevronsDown, av as FileDiff, aw as RotateCcw, ax as GitCompareArrows, ay as ArrowUp, az as ArrowDown, aA as Ellipsis, aB as CodeXml, aC as Blocks, aD as MousePointerClick, aE as FileText, aF as Rows3, aG as Columns2 } from "../_libs/lucide-react.mjs";
 import { u as union, o as object, e as array, l as literal, n as number, d as boolean, b as string, _ as _enum } from "../_libs/zod.mjs";
 import { S as Select$1, a as SelectTrigger$1, b as SelectIcon, c as SelectValue$1, d as SelectPortal, e as SelectContent$1, f as SelectViewport, g as SelectItem$1, h as SelectItemIndicator, i as SelectItemText, j as SelectScrollUpButton$1, k as SelectScrollDownButton$1 } from "../_libs/radix-ui__react-select.mjs";
 import { D as Dialog$1, a as DialogContent$1, b as DialogClose, c as DialogTitle$1, d as DialogDescription$1, e as DialogPortal$1, f as DialogOverlay$1, g as DialogTrigger$1 } from "../_libs/radix-ui__react-dialog.mjs";
@@ -625,6 +625,59 @@ function getStatusCategory(status) {
   if (status >= 500) return "server_error";
   return "pending";
 }
+function useThemeMode() {
+  const [themeMode, setThemeModeState] = reactExports.useState(readStoredThemeMode);
+  const setThemeMode = reactExports.useCallback((nextThemeMode) => {
+    setThemeModeState(nextThemeMode);
+    applyThemeMode(nextThemeMode);
+    persistThemeMode(nextThemeMode);
+  }, []);
+  reactExports.useEffect(() => {
+    applyThemeMode(themeMode);
+  }, [themeMode]);
+  reactExports.useEffect(() => {
+    function handleStorage(event) {
+      if (event.key !== THEME_MODE_STORAGE_KEY) return;
+      const nextThemeMode = normalizeThemeMode(event.newValue);
+      setThemeModeState(nextThemeMode);
+      applyThemeMode(nextThemeMode);
+    }
+    window.addEventListener("storage", handleStorage);
+    return () => window.removeEventListener("storage", handleStorage);
+  }, []);
+  return { themeMode, setThemeMode };
+}
+function useUiScale() {
+  const [uiScalePreference, setUiScalePreferenceState] = reactExports.useState(
+    readStoredUiScalePreference
+  );
+  const [resolvedUiScale, setResolvedUiScale] = reactExports.useState(1);
+  const setUiScalePreference = reactExports.useCallback((nextPreference) => {
+    setUiScalePreferenceState(nextPreference);
+    persistUiScalePreference(nextPreference);
+    setResolvedUiScale(applyUiScalePreference(nextPreference));
+  }, []);
+  reactExports.useEffect(() => {
+    const refreshScale = () => {
+      setResolvedUiScale(applyUiScalePreference(uiScalePreference));
+    };
+    refreshScale();
+    if (uiScalePreference !== "auto") return;
+    window.addEventListener("resize", refreshScale);
+    return () => window.removeEventListener("resize", refreshScale);
+  }, [uiScalePreference]);
+  reactExports.useEffect(() => {
+    const handleStorage = (event) => {
+      if (event.key !== UI_SCALE_STORAGE_KEY) return;
+      const nextPreference = normalizeUiScalePreference(event.newValue);
+      setUiScalePreferenceState(nextPreference);
+      setResolvedUiScale(applyUiScalePreference(nextPreference));
+    };
+    window.addEventListener("storage", handleStorage);
+    return () => window.removeEventListener("storage", handleStorage);
+  }, []);
+  return { uiScalePreference, resolvedUiScale, setUiScalePreference };
+}
 async function fetcher(url) {
   return fetchJson(
     url,
@@ -2472,27 +2525,27 @@ function useCopyFeedback(text) {
   return { copied, copy };
 }
 const LazyCompareDrawer = reactExports.lazy(
-  () => import("./CompareDrawer-BLKjOzwD.mjs").then((m) => ({ default: m.CompareDrawer }))
+  () => import("./CompareDrawer-aH59Ab6x.mjs").then((m) => ({ default: m.CompareDrawer }))
 );
 const LazyReplayDialog = reactExports.lazy(
-  () => import("./ReplayDialog-oyiF4LIo.mjs").then((m) => ({ default: m.ReplayDialog }))
+  () => import("./ReplayDialog-BO4Vy0et.mjs").then((m) => ({ default: m.ReplayDialog }))
 );
 const LazyRequestAnatomy = reactExports.lazy(
-  () => import("./RequestAnatomy-DkyQXSuj.mjs").then((m) => ({ default: m.RequestAnatomy }))
+  () => import("./RequestAnatomy-FtOr7vSS.mjs").then((m) => ({ default: m.RequestAnatomy }))
 );
 const LazyResponseView = reactExports.lazy(
-  () => import("./ResponseView-3NTDEiDh.mjs").then((m) => ({ default: m.ResponseView }))
+  () => import("./ResponseView-cvw6ajue.mjs").then((m) => ({ default: m.ResponseView }))
 );
 const LazyStreamingChunkSequence = reactExports.lazy(
-  () => import("./StreamingChunkSequence-DRq-5Bgn.mjs").then((m) => ({
+  () => import("./StreamingChunkSequence-Oc8S2kD6.mjs").then((m) => ({
     default: m.StreamingChunkSequence
   }))
 );
 const LazyJsonViewer = reactExports.lazy(
-  () => import("./json-viewer-BhUwicvp.mjs").then((m) => ({ default: m.JsonViewer }))
+  () => import("./json-viewer-Cd6trhQr.mjs").then((m) => ({ default: m.JsonViewer }))
 );
 const LazyJsonViewerFromString = reactExports.lazy(
-  () => import("./json-viewer-BhUwicvp.mjs").then((m) => ({ default: m.JsonViewerFromString }))
+  () => import("./json-viewer-Cd6trhQr.mjs").then((m) => ({ default: m.JsonViewerFromString }))
 );
 const HIGHLIGHT_DURATION_MS = 1200;
 const MAX_HIGHLIGHT_ATTEMPTS = 12;
@@ -2951,6 +3004,58 @@ function Badge({
     }
   );
 }
+const VISIBLE_TOOL_LIMIT = 3;
+function ToolTraceEventChip({ event }) {
+  const handleClick = (clickEvent) => {
+    clickEvent.stopPropagation();
+    dispatchLogFocusRequest({
+      logId: event.logId,
+      tab: "response",
+      toolCallIndex: event.index
+    });
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "button",
+    {
+      type: "button",
+      className: "inline-flex h-5 min-w-0 max-w-[8.5rem] items-center rounded px-1.5 text-[10px] text-muted-foreground transition-colors hover:bg-background/65 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+      onClick: handleClick,
+      onKeyDown: (keyEvent) => keyEvent.stopPropagation(),
+      "aria-label": `Open response tool call ${event.name}`,
+      title: event.name,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "min-w-0 truncate font-mono font-semibold", children: event.name })
+    }
+  );
+}
+function ToolTraceEvents({ events }) {
+  if (events.length === 0) return null;
+  const visibleEvents = events.slice(0, VISIBLE_TOOL_LIMIT);
+  const hiddenCount = Math.max(0, events.length - visibleEvents.length);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "span",
+    {
+      className: "inline-flex h-7 min-w-0 max-w-full items-center gap-1 overflow-hidden rounded-md border border-cyan-300/10 bg-cyan-300/[0.055] px-1 sm:max-w-[26rem]",
+      role: "group",
+      "aria-label": `${events.length} response tool ${events.length === 1 ? "call" : "calls"}`,
+      onClick: (clickEvent) => clickEvent.stopPropagation(),
+      onKeyDown: (keyEvent) => keyEvent.stopPropagation(),
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex h-5 shrink-0 items-center gap-1 px-1 font-mono text-[9px] font-semibold uppercase text-cyan-300", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Wrench, { className: "size-3" }),
+          "Call ",
+          events.length
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex min-w-0 flex-1 items-center gap-0.5 overflow-hidden", children: [
+          visibleEvents.map((event) => /* @__PURE__ */ jsxRuntimeExports.jsx(ToolTraceEventChip, { event }, event.id)),
+          hiddenCount > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex h-5 shrink-0 items-center rounded px-1 font-mono text-[10px] font-semibold text-muted-foreground", children: [
+            "+",
+            hiddenCount
+          ] })
+        ] })
+      ]
+    }
+  );
+}
 const STATUS_BADGE_CLASSES = {
   success: "bg-slate-300/[0.08] text-slate-100 border-transparent",
   client_error: "bg-amber-300/[0.10] text-amber-100 border-transparent",
@@ -3011,6 +3116,7 @@ const LogEntryHeader = reactExports.memo(function({
   displayNumber,
   messageCount = null,
   toolCount = null,
+  toolEvents = [],
   expanded,
   onToggle,
   cacheTrend = null,
@@ -3195,6 +3301,7 @@ const LogEntryHeader = reactExports.memo(function({
             /* @__PURE__ */ jsxRuntimeExports.jsx(Wrench, { className: "size-3" }),
             /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums", children: toolCount })
           ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(ToolTraceEvents, { events: toolEvents }),
           log.origin !== null && /* @__PURE__ */ jsxRuntimeExports.jsxs(
             "span",
             {
@@ -3869,7 +3976,8 @@ const LogEntry = reactExports.memo(function({
   timeDisplayFormat,
   cacheTrend = null,
   onCompareWithPrevious,
-  showClientMetadata = true
+  showClientMetadata = true,
+  toolEvents = []
 }) {
   const [expanded, setExpanded] = reactExports.useState(false);
   const [replayOpen, setReplayOpen] = reactExports.useState(false);
@@ -4217,6 +4325,7 @@ const LogEntry = reactExports.memo(function({
               displayNumber,
               messageCount: requestAnalysis.messageCount,
               toolCount: requestAnalysis.toolCount,
+              toolEvents,
               expanded,
               onToggle: handleToggleExpanded,
               cacheTrend,
@@ -4600,52 +4709,6 @@ function ThreadConnector({
     ) })
   ] });
 }
-const VISIBLE_TOOL_LIMIT = 4;
-function ToolTraceEventChip({ event }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    "button",
-    {
-      type: "button",
-      className: "inline-flex h-6 max-w-[11rem] min-w-0 items-center gap-1 rounded-md bg-white/[0.028] px-1.5 text-[11px] text-muted-foreground transition-colors hover:bg-sky-400/[0.08] hover:text-sky-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-      onClick: () => dispatchLogFocusRequest({
-        logId: event.logId,
-        tab: "response",
-        toolCallIndex: event.index
-      }),
-      "aria-label": `Open response tool call ${event.name}`,
-      children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(Wrench, { className: "size-3 shrink-0 text-sky-400/65" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "min-w-0 truncate font-mono font-semibold", children: event.name })
-      ]
-    },
-    event.id
-  );
-}
-function ToolTraceEvents({
-  events,
-  warnings = []
-}) {
-  if (events.length === 0 && warnings.length === 0) return null;
-  const visibleEvents = events.slice(0, VISIBLE_TOOL_LIMIT);
-  const hiddenCount = Math.max(0, events.length - visibleEvents.length);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mx-3 mb-2 flex min-w-0 items-center gap-1.5 overflow-hidden rounded-md bg-black/[0.10] px-2 py-1 shadow-[inset_0_1px_0_rgba(255,255,255,0.025)]", children: [
-    events.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex h-6 shrink-0 items-center gap-1 rounded-md px-1.5 font-mono text-[10px] font-semibold uppercase tracking-[0.12em] text-sky-300/70", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(Wrench, { className: "size-3" }),
-      events.length
-    ] }),
-    warnings.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex h-6 shrink-0 items-center gap-1 rounded-md border border-amber-300/20 bg-amber-300/[0.08] px-1.5 font-mono text-[10px] font-semibold text-amber-100", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(TriangleAlert, { className: "size-3" }),
-      warnings.length
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-1 overflow-hidden", children: [
-      visibleEvents.map((event) => /* @__PURE__ */ jsxRuntimeExports.jsx(ToolTraceEventChip, { event }, event.id)),
-      hiddenCount > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex h-6 shrink-0 items-center rounded-md bg-white/[0.025] px-1.5 font-mono text-[11px] font-semibold text-muted-foreground", children: [
-        "+",
-        hiddenCount
-      ] })
-    ] })
-  ] });
-}
 const PREVIEW_LIMIT = 180;
 const toolTraceCache = /* @__PURE__ */ new WeakMap();
 function responseMayContainToolTrace(log, format) {
@@ -5161,29 +5224,21 @@ const TurnGroup = reactExports.memo(function TurnGroup2({
                 onToggle: toggleCollapse
               }
             ),
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("flex-1 min-w-0 mb-0.5 rounded-[8px]", bgClass), children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(
-                LogEntry,
-                {
-                  log,
-                  displayNumber: entry.sessionLogNumber,
-                  viewMode,
-                  strip,
-                  slowResponseThresholdSeconds,
-                  timeDisplayFormat,
-                  cacheTrend: cacheTrends?.get(log.id) ?? null,
-                  showClientMetadata: showLogClientMetadata,
-                  onCompareWithPrevious: comparisonPredecessors.has(log.id) ? onCompareWithPrevious : void 0
-                }
-              ),
-              /* @__PURE__ */ jsxRuntimeExports.jsx(
-                ToolTraceEvents,
-                {
-                  events: toolEventsByLogId.get(log.id) ?? [],
-                  warnings: log.warnings ?? []
-                }
-              )
-            ] })
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn("flex-1 min-w-0 mb-0.5 rounded-[8px]", bgClass), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+              LogEntry,
+              {
+                log,
+                displayNumber: entry.sessionLogNumber,
+                viewMode,
+                strip,
+                slowResponseThresholdSeconds,
+                timeDisplayFormat,
+                cacheTrend: cacheTrends?.get(log.id) ?? null,
+                showClientMetadata: showLogClientMetadata,
+                toolEvents: toolEventsByLogId.get(log.id),
+                onCompareWithPrevious: comparisonPredecessors.has(log.id) ? onCompareWithPrevious : void 0
+              }
+            ) })
           ] }, log.id);
         })
       )
@@ -5314,7 +5369,7 @@ function formatElapsed$1(ms) {
   if (ms < 1e3) return `${String(ms)}ms`;
   return `${(ms / 1e3).toFixed(1)}s`;
 }
-function formatTimeRange$1(startedAt, endedAt, timeDisplayFormat) {
+function formatTimeRange$2(startedAt, endedAt, timeDisplayFormat) {
   if (startedAt === null || endedAt === null) return null;
   return formatTimestampRange(startedAt, endedAt, timeDisplayFormat);
 }
@@ -5801,7 +5856,7 @@ function AgentTraceSummary({
   );
   const showElapsedSummary = showRollupMetrics || summary.maxElapsedMs !== null;
   const timeRange = reactExports.useMemo(
-    () => formatTimeRange$1(summary.startedAt, summary.endedAt, timeDisplayFormat),
+    () => formatTimeRange$2(summary.startedAt, summary.endedAt, timeDisplayFormat),
     [summary.endedAt, summary.startedAt, timeDisplayFormat]
   );
   const createCandidates = reactExports.useCallback(() => {
@@ -6167,152 +6222,451 @@ const ConversationGroup = reactExports.memo(function({
     ] })
   ] });
 });
-function CrabLogo({ className }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    "svg",
-    {
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "1.5",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      "aria-hidden": "true",
-      className: cn("inline-block size-5", className),
-      children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M5 13 C5 9 8 7 12 7 C16 7 19 9 19 13 C19 16 16 18 12 18 C8 18 5 16 5 13 Z" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M5 11 C3.5 9.5 1.5 10 2 12.5 C2.5 14 4 13.5 5 12.5" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M19 11 C20.5 9.5 22.5 10 22 12.5 C21.5 14 20 13.5 19 12.5" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "10", y1: "7", x2: "9.5", y2: "5" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "14", y1: "7", x2: "14.5", y2: "5" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "9.5", cy: "4.5", r: "0.9", fill: "currentColor", stroke: "none" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "14.5", cy: "4.5", r: "0.9", fill: "currentColor", stroke: "none" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "6.5", y1: "16", x2: "4.5", y2: "19.5" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "9", y1: "17.5", x2: "8", y2: "20.5" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "15", y1: "17.5", x2: "16", y2: "20.5" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "17.5", y1: "16", x2: "19.5", y2: "19.5" })
-      ]
-    }
-  );
+function shouldShowRawExport(captureMode) {
+  return captureMode === "full";
 }
-const McpLogoPng = "data:image/png;base64,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";
-function McpLogo({ className }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    "img",
-    {
-      src: McpLogoPng,
-      alt: "Model Context Protocol",
-      "aria-hidden": "true",
-      className: cn("inline-block size-8 object-contain invert", className)
-    }
-  );
+function getExportActionVisibility(captureMode, logCount) {
+  const hasLogs = logCount > 0;
+  return {
+    redacted: hasLogs,
+    raw: hasLogs && shouldShowRawExport(captureMode)
+  };
 }
-function Select({
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(Select$1, { "data-slot": "select", ...props });
+function formatTimeRange$1(logs, timeDisplayFormat) {
+  const first = logs[0];
+  const last = logs[logs.length - 1];
+  if (first === void 0 || last === void 0) return null;
+  return formatTimestampRange(first.timestamp, last.timestamp, timeDisplayFormat);
 }
-function SelectValue({
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(SelectValue$1, { "data-slot": "select-value", ...props });
+function hasLogFailure(log) {
+  if (log.error !== null && log.error !== void 0 && log.error.length > 0) return true;
+  return log.responseStatus !== null && log.responseStatus >= 400;
 }
-function SelectTrigger({
-  className,
-  size = "default",
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    SelectTrigger$1,
-    {
-      "data-slot": "select-trigger",
-      "data-size": size,
-      className: cn(
-        "border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        className
-      ),
-      ...props,
-      children: [
-        children,
-        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectIcon, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-4 opacity-50" }) })
-      ]
+function getModelLabel(logs) {
+  const models = /* @__PURE__ */ new Set();
+  for (const log of logs) {
+    if (log.model !== null && log.model.length > 0) {
+      models.add(log.model);
     }
-  );
+  }
+  const sorted = [...models].sort();
+  if (sorted.length === 0) return "Model unknown";
+  if (sorted.length === 1) return sorted[0] ?? "Model unknown";
+  return `${sorted.length} models`;
 }
-function SelectContent({
-  className,
-  children,
-  position = "popper",
-  align = "center",
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(SelectPortal, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    SelectContent$1,
-    {
-      "data-slot": "select-content",
-      className: cn(
-        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
-        position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-        className
-      ),
-      position,
-      align,
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectScrollUpButton, {}),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          SelectViewport,
-          {
-            className: cn(
-              "p-1",
-              position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
-            ),
-            children
-          }
-        ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectScrollDownButton, {})
-      ]
+function getProviderLabel(logs) {
+  const providers = /* @__PURE__ */ new Set();
+  for (const log of logs) {
+    if (log.providerName !== null && log.providerName !== void 0 && log.providerName.length > 0) {
+      providers.add(log.providerName);
     }
-  ) });
+  }
+  const sorted = [...providers].sort();
+  if (sorted.length === 0) return "Provider unknown";
+  if (sorted.length === 1) return sorted[0] ?? "Provider unknown";
+  return `${sorted.length} providers`;
 }
-function SelectItem({
-  className,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    SelectItem$1,
-    {
-      "data-slot": "select-item",
-      className: cn(
-        "focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItemIndicator, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Check, { className: "size-4" }) }) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItemText, { children })
-      ]
-    }
-  );
+function formatElapsedMs(ms) {
+  if (ms < 1e3) return `${ms}ms`;
+  if (ms < 6e4) {
+    const seconds2 = ms / 1e3;
+    return `${seconds2 < 10 ? seconds2.toFixed(1) : seconds2.toFixed(0)}s`;
+  }
+  const totalSeconds = Math.round(ms / 1e3);
+  const minutes = Math.floor(totalSeconds / 60);
+  const seconds = totalSeconds % 60;
+  return `${minutes}m ${seconds}s`;
 }
-function SelectScrollUpButton({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    SelectScrollUpButton$1,
-    {
-      "data-slot": "select-scroll-up-button",
-      className: cn("flex cursor-default items-center justify-center py-1", className),
-      ...props,
-      children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronUp, { className: "size-4" })
-    }
-  );
+function formatTokenPair(inputTokens, outputTokens) {
+  return `${formatTokens(inputTokens)} in / ${formatTokens(outputTokens)} out`;
 }
-function SelectScrollDownButton({
-  className,
+function countSessionTurns(logs, conversationGroups) {
+  if (logs.length === 0) return 0;
+  if (conversationGroups.length === 0) return buildTurnGroups(logs).length;
+  let turns = 0;
+  for (const group of conversationGroups) {
+    turns += buildTurnGroups(group.logs).length;
+  }
+  return turns;
+}
+function summarizeFinishReason({
+  stopReason,
+  pending,
+  lastFailureLogNumber
+}) {
+  if (pending > 0) {
+    return {
+      label: "In flight",
+      detail: `${pending} request${pending === 1 ? "" : "s"} pending`,
+      tone: "cool"
+    };
+  }
+  if (lastFailureLogNumber !== null && stopReason === null) {
+    return {
+      label: "Error",
+      detail: `Last failed request #${lastFailureLogNumber}`,
+      tone: "danger"
+    };
+  }
+  switch (stopReason) {
+    case "end_turn":
+      return { label: "End turn", detail: "Assistant completed the turn", tone: "neutral" };
+    case "stop":
+      return { label: "Stop", detail: "Model reached a stop condition", tone: "neutral" };
+    case "length":
+      return { label: "Output limit", detail: "Turn ended at max output tokens", tone: "watch" };
+    case "tool_use":
+      return { label: "Tool call", detail: "Assistant requested a tool", tone: "cool" };
+    case null:
+      return { label: "Unknown", detail: "No finish reason captured", tone: "neutral" };
+  }
+}
+function isClientAbortError(error) {
+  if (error === null) return false;
+  const lower = error.toLowerCase();
+  return lower.includes("abort") || lower.includes("cancel") || lower.includes("client disconnected") || lower.includes("stream disconnected") || lower.includes("connection closed");
+}
+function summarizeSessionOutcome({
+  pending,
+  failures,
+  lengthStops,
+  stopReason,
+  lastFailure
+}) {
+  if (lastFailure !== null && (lastFailure.status === 499 || isClientAbortError(lastFailure.error))) {
+    return {
+      label: "Client aborted",
+      detail: `Request #${lastFailure.logNumber} ended before completion`,
+      tone: "watch"
+    };
+  }
+  if (pending > 0) {
+    return {
+      label: "In flight",
+      detail: `${pending} request${pending === 1 ? "" : "s"} still running`,
+      tone: "cool"
+    };
+  }
+  if (lastFailure !== null && lastFailure.status !== null && lastFailure.status >= 500) {
+    return {
+      label: "Provider error",
+      detail: `Request #${lastFailure.logNumber} returned HTTP ${lastFailure.status}`,
+      tone: "danger"
+    };
+  }
+  if (failures > 0 && lastFailure !== null) {
+    return {
+      label: "Failed",
+      detail: `Request #${lastFailure.logNumber} needs attention`,
+      tone: "danger"
+    };
+  }
+  if (lengthStops > 0 || stopReason === "length") {
+    return {
+      label: "Output limited",
+      detail: "Model stopped at the output token limit",
+      tone: "watch"
+    };
+  }
+  switch (stopReason) {
+    case "end_turn":
+    case "stop":
+      return { label: "Completed", detail: "Assistant completed normally", tone: "neutral" };
+    case "tool_use":
+      return { label: "Tool requested", detail: "Assistant handed off to a tool", tone: "cool" };
+    case null:
+      return { label: "Unknown", detail: "No terminal signal captured", tone: "neutral" };
+  }
+}
+function buildSessionSlateStats({
+  logs,
+  conversationGroups,
+  isLoading,
+  timeDisplayFormat,
+  slowResponseThresholdSeconds
+}) {
+  let failures = 0;
+  let pending = 0;
+  let slow = 0;
+  let lengthStops = 0;
+  let totalIn = 0;
+  let totalOut = 0;
+  let terminalStopReason = null;
+  let lastFailureLogNumber = null;
+  let lastFailure = null;
+  let slowestMs = null;
+  let slowestLogNumber = null;
+  let heaviestTokens = 0;
+  let heaviestInputTokens = 0;
+  let heaviestOutputTokens = 0;
+  let heaviestLogNumber = null;
+  const slowThresholdMs = slowResponseThresholdSeconds * 1e3;
+  for (let index = 0; index < logs.length; index += 1) {
+    const log = logs[index];
+    if (log === void 0) continue;
+    const logNumber = index + 1;
+    const stopReason = extractStopReason(log);
+    if (stopReason !== null) terminalStopReason = stopReason;
+    if (stopReason === "length") lengthStops += 1;
+    if (hasLogFailure(log)) {
+      failures += 1;
+      lastFailureLogNumber = logNumber;
+      lastFailure = {
+        logNumber,
+        status: log.responseStatus,
+        error: log.error ?? null
+      };
+    }
+    if (log.responseStatus === null) pending += 1;
+    if (slowResponseThresholdSeconds > 0 && log.elapsedMs !== null && log.elapsedMs >= slowThresholdMs) {
+      slow += 1;
+    }
+    if (log.inputTokens !== null) totalIn += log.inputTokens;
+    if (log.outputTokens !== null) totalOut += log.outputTokens;
+    if (log.elapsedMs !== null && (slowestMs === null || log.elapsedMs > slowestMs)) {
+      slowestMs = log.elapsedMs;
+      slowestLogNumber = logNumber;
+    }
+    const inputTokens = log.inputTokens ?? 0;
+    const outputTokens = log.outputTokens ?? 0;
+    const requestTokens = inputTokens + outputTokens;
+    if (requestTokens > heaviestTokens) {
+      heaviestTokens = requestTokens;
+      heaviestInputTokens = inputTokens;
+      heaviestOutputTokens = outputTokens;
+      heaviestLogNumber = logNumber;
+    }
+  }
+  const status = isLoading || pending > 0 && failures === 0 ? "rolling" : failures > 0 ? "failed" : slow > 0 || lengthStops > 0 ? "watch" : "clear";
+  const statusLabel2 = status === "rolling" ? "Rolling" : status === "failed" ? "Failure" : status === "watch" ? "Watch" : "Clear";
+  const finish = summarizeFinishReason({
+    stopReason: terminalStopReason,
+    pending,
+    lastFailureLogNumber
+  });
+  const outcome = summarizeSessionOutcome({
+    pending,
+    failures,
+    lengthStops,
+    stopReason: terminalStopReason,
+    lastFailure
+  });
+  return {
+    status,
+    statusLabel: statusLabel2,
+    modelLabel: getModelLabel(logs),
+    providerLabel: getProviderLabel(logs),
+    requests: logs.length,
+    turns: countSessionTurns(logs, conversationGroups),
+    failures,
+    pending,
+    slow,
+    lengthStops,
+    timeRange: formatTimeRange$1(logs, timeDisplayFormat),
+    tokenLabel: `${formatTokens(totalIn)} in / ${formatTokens(totalOut)} out`,
+    finishLabel: finish.label,
+    finishDetail: finish.detail,
+    finishTone: finish.tone,
+    outcomeLabel: outcome.label,
+    outcomeDetail: outcome.detail,
+    outcomeTone: outcome.tone,
+    slowestLabel: slowestMs === null ? "n/a" : formatElapsedMs(slowestMs),
+    slowestDetail: slowestLogNumber === null ? "Latency pending" : `Request #${slowestLogNumber}`,
+    heaviestDetail: heaviestLogNumber === null ? "Tokens pending" : `#${heaviestLogNumber} ${formatTokenPair(heaviestInputTokens, heaviestOutputTokens)}`
+  };
+}
+function resolveSessionContextScope({
+  pinnedSessionId,
+  selectedSession,
+  sessions,
+  logs
+}) {
+  if (pinnedSessionId !== void 0) {
+    const scopedLogs = logs.filter((log) => log.sessionId === pinnedSessionId);
+    if (scopedLogs.length === 0) return null;
+    return { label: pinnedSessionId, logs: scopedLogs, showBackLink: true };
+  }
+  if (selectedSession !== "__all__") {
+    const scopedLogs = logs.filter((log) => log.sessionId === selectedSession);
+    if (scopedLogs.length === 0) return null;
+    return { label: selectedSession, logs: scopedLogs, showBackLink: true };
+  }
+  const singleSessionId = sessions.length === 1 ? sessions[0] ?? null : null;
+  if (singleSessionId !== null) {
+    const allVisibleLogsBelongToSession = logs.every((log) => log.sessionId === singleSessionId);
+    if (allVisibleLogsBelongToSession) {
+      return { label: singleSessionId, logs: [...logs], showBackLink: false };
+    }
+  }
+  const allVisibleLogsAreSessionless = sessions.length === 0 && logs.length > 0 && logs.every((log) => log.sessionId === null);
+  if (allVisibleLogsAreSessionless) {
+    return { label: "Visible requests", logs: [...logs], showBackLink: false };
+  }
+  return null;
+}
+function formatPaginationStatus({
+  logs,
+  pagination
+}) {
+  if (pagination.isLoading && logs.length === 0) return "Loading logs...";
+  if (logs.length === 0) return "No logs on this page";
+  const first = logs[0];
+  const last = logs[logs.length - 1];
+  const range = first === void 0 || last === void 0 ? "Current page" : `#${first.id}-#${last.id}`;
+  if (pagination.total === null) {
+    return `Showing ${logs.length} logs (${range})`;
+  }
+  if (pagination.total <= logs.length) {
+    return `Showing all ${pagination.total} logs`;
+  }
+  return `Showing ${logs.length} of ${pagination.total} logs (${range})`;
+}
+function CrabLogo({ className }) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "svg",
+    {
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      className: cn("inline-block size-5", className),
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M5 13 C5 9 8 7 12 7 C16 7 19 9 19 13 C19 16 16 18 12 18 C8 18 5 16 5 13 Z" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M5 11 C3.5 9.5 1.5 10 2 12.5 C2.5 14 4 13.5 5 12.5" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M19 11 C20.5 9.5 22.5 10 22 12.5 C21.5 14 20 13.5 19 12.5" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "10", y1: "7", x2: "9.5", y2: "5" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "14", y1: "7", x2: "14.5", y2: "5" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "9.5", cy: "4.5", r: "0.9", fill: "currentColor", stroke: "none" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "14.5", cy: "4.5", r: "0.9", fill: "currentColor", stroke: "none" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "6.5", y1: "16", x2: "4.5", y2: "19.5" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "9", y1: "17.5", x2: "8", y2: "20.5" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "15", y1: "17.5", x2: "16", y2: "20.5" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "17.5", y1: "16", x2: "19.5", y2: "19.5" })
+      ]
+    }
+  );
+}
+const McpLogoPng = "data:image/png;base64,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";
+function McpLogo({ className }) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "img",
+    {
+      src: McpLogoPng,
+      alt: "Model Context Protocol",
+      "aria-hidden": "true",
+      className: cn("inline-block size-8 object-contain invert", className)
+    }
+  );
+}
+function Select({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(Select$1, { "data-slot": "select", ...props });
+}
+function SelectValue({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(SelectValue$1, { "data-slot": "select-value", ...props });
+}
+function SelectTrigger({
+  className,
+  size = "default",
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    SelectTrigger$1,
+    {
+      "data-slot": "select-trigger",
+      "data-size": size,
+      className: cn(
+        "border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectIcon, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-4 opacity-50" }) })
+      ]
+    }
+  );
+}
+function SelectContent({
+  className,
+  children,
+  position = "popper",
+  align = "center",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(SelectPortal, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    SelectContent$1,
+    {
+      "data-slot": "select-content",
+      className: cn(
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
+        position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+        className
+      ),
+      position,
+      align,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectScrollUpButton, {}),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          SelectViewport,
+          {
+            className: cn(
+              "p-1",
+              position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
+            ),
+            children
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectScrollDownButton, {})
+      ]
+    }
+  ) });
+}
+function SelectItem({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    SelectItem$1,
+    {
+      "data-slot": "select-item",
+      className: cn(
+        "focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItemIndicator, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Check, { className: "size-4" }) }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItemText, { children })
+      ]
+    }
+  );
+}
+function SelectScrollUpButton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    SelectScrollUpButton$1,
+    {
+      "data-slot": "select-scroll-up-button",
+      className: cn("flex cursor-default items-center justify-center py-1", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronUp, { className: "size-4" })
+    }
+  );
+}
+function SelectScrollDownButton({
+  className,
   ...props
 }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -6719,7 +7073,7 @@ function AlertsDialog() {
   const criticalCount = summary?.critical ?? 0;
   const warningCount = summary?.warning ?? 0;
   const noticeCount = summary?.notice ?? 0;
-  const triggerTone = criticalCount > 0 ? "bg-red-500" : warningCount > 0 ? "bg-amber-400" : "bg-sky-400";
+  const triggerTone = criticalCount > 0 ? "bg-red-600 text-white" : warningCount > 0 ? "bg-amber-400 text-zinc-950" : "bg-sky-400 text-zinc-950";
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Dialog, { open, onOpenChange: setOpen, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
       Button,
@@ -6736,7 +7090,7 @@ function AlertsDialog() {
             "span",
             {
               className: cn(
-                "absolute -right-1 -top-1 min-w-4 rounded-full px-1 text-[10px] font-semibold leading-4 text-white",
+                "absolute -right-1 -top-1 min-w-4 rounded-full px-1 text-[10px] font-semibold leading-4",
                 triggerTone
               ),
               children: formatCount(totalCount)
@@ -8181,31 +8535,18 @@ function ImportWizardDialog({
     ] })
   ] }) });
 }
-const KNOWN_PROVIDER_DOCS = {
-  deepseek: "https://api-docs.deepseek.com/zh-cn/"
-};
 function hasSuccessField(result) {
   return Object.prototype.hasOwnProperty.call(result, "success");
 }
 function isNotConfiguredState(result) {
   return Object.prototype.hasOwnProperty.call(result, "notConfigured");
 }
+function providerHasEndpoint$1(value) {
+  return value !== void 0 && value !== "";
+}
 function hasText(value) {
   return value !== void 0 && value.trim() !== "";
 }
-function formatHeaders(headers) {
-  if (headers === void 0) {
-    return void 0;
-  }
-  const lines = Object.entries(headers).map(([name, value]) => `${name}: ${value}`);
-  if (lines.length === 0) {
-    return void 0;
-  }
-  return lines.join("\n");
-}
-function hasHeaderDetails(headers) {
-  return formatHeaders(headers) !== void 0;
-}
 function formatElapsed(ms) {
   if (ms < 1e3) return `${ms}ms`;
   return `${(ms / 1e3).toFixed(1)}s`;
@@ -8214,155 +8555,395 @@ function formatTokenRate(tokensPerSecond) {
   if (tokensPerSecond >= 10) return `${tokensPerSecond.toFixed(0)}/s`;
   return `${tokensPerSecond.toFixed(1)}/s`;
 }
-function hasDiagnosticDetails(result) {
-  const debug = result.debug;
-  return hasText(result.error?.hint) || hasText(result.error?.details) || hasText(result.rawResponse) || hasText(debug?.requestUrl) || hasText(debug?.requestBody) || hasText(debug?.responseBody) || hasHeaderDetails(debug?.requestHeaders) || hasHeaderDetails(debug?.responseHeaders) || debug?.responseStatus !== void 0;
+function errorLabel(type) {
+  switch (type) {
+    case "timeout":
+      return "Timeout";
+    case "network_unreachable":
+      return "Offline";
+    case "connection_refused":
+      return "Refused";
+    case "auth_failed":
+      return "Auth";
+    case "rate_limited":
+      return "Rate limit";
+    case "server_error":
+      return "Server";
+    case "invalid_response":
+      return "Invalid";
+    case "unknown":
+      return "Failed";
+  }
+}
+function compactSuccessMetric(result) {
+  if (result.firstChunkMs !== void 0 && result.firstChunkMs !== null) {
+    return formatElapsed(result.firstChunkMs);
+  }
+  if (result.latencyMs !== void 0) return formatElapsed(result.latencyMs);
+  if (result.totalStreamMs !== void 0 && result.totalStreamMs !== null) {
+    return formatElapsed(result.totalStreamMs);
+  }
+  if (result.tokensPerSecond !== void 0 && result.tokensPerSecond !== null && result.tokensPerSecond > 0) {
+    return formatTokenRate(result.tokensPerSecond);
+  }
+  return null;
+}
+function presentProviderProbe(result) {
+  if (isNotConfiguredState(result)) {
+    return { tone: "quiet", label: "N/A", metric: null, hasDetails: false };
+  }
+  if (!hasSuccessField(result)) {
+    return { tone: "pending", label: "Running", metric: null, hasDetails: false };
+  }
+  if (result.success) {
+    return {
+      tone: "success",
+      label: "Pass",
+      metric: compactSuccessMetric(result),
+      hasDetails: true
+    };
+  }
+  return {
+    tone: "failure",
+    label: errorLabel(result.error?.type ?? "unknown"),
+    metric: null,
+    hasDetails: true
+  };
+}
+function configuredFormatResults(provider, testResults) {
+  if (testResults === void 0) return [];
+  const results = [];
+  if (providerHasEndpoint$1(provider.anthropicBaseUrl)) results.push(testResults.anthropic);
+  if (providerHasEndpoint$1(provider.openaiBaseUrl)) results.push(testResults.openaiChat);
+  if (providerHasEndpoint$1(provider.openaiResponsesBaseUrl)) {
+    results.push(testResults.openaiResponses);
+  }
+  return results;
+}
+function summarizeProviderTestResults(provider, testResults) {
+  const summary = { total: 0, passed: 0, failed: 0, testing: 0 };
+  for (const results of configuredFormatResults(provider, testResults)) {
+    for (const state of [results.nonStreaming, results.streaming]) {
+      if (isNotConfiguredState(state)) continue;
+      summary.total += 1;
+      if (!hasSuccessField(state)) {
+        summary.testing += 1;
+      } else if (state.success) {
+        summary.passed += 1;
+      } else {
+        summary.failed += 1;
+      }
+    }
+  }
+  return summary;
+}
+function formatHeaders(headers) {
+  if (headers === void 0) return void 0;
+  const lines = Object.entries(headers).map(([name, value]) => `${name}: ${value}`);
+  return lines.length === 0 ? void 0 : lines.join("\n");
 }
 function DiagnosticSection({
   title,
   children
 }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium text-foreground/80", children: title }),
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: "space-y-1.5", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: "text-xs font-medium text-foreground/80", children: title }),
     children
   ] });
 }
 function DiagnosticPre({ value }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: "max-h-40 overflow-auto whitespace-pre-wrap break-all rounded-md bg-background/80 p-2 font-mono text-[11px] leading-relaxed text-foreground/80", children: value });
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: "max-h-48 overflow-auto whitespace-pre-wrap break-all rounded-md bg-muted/40 p-3 font-mono text-[11px] leading-relaxed text-foreground/80", children: value });
+}
+function ResultMetric({ label, value }) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-w-0 rounded-md bg-muted/35 px-3 py-2", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("dt", { className: "text-[10px] text-muted-foreground", children: label }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("dd", { className: "mt-1 truncate font-mono text-xs font-semibold text-foreground", title: value, children: value })
+  ] });
+}
+function ProviderTestMetrics({ result }) {
+  const hasTokens = result.inputTokens !== void 0 || result.outputTokens !== void 0;
+  const hasCache = result.cacheCreationInputTokens !== void 0 || result.cacheReadInputTokens !== void 0;
+  const hasMetrics = hasText(result.model) || hasTokens || hasCache || result.latencyMs !== void 0 || result.firstChunkMs !== void 0 && result.firstChunkMs !== null || result.totalStreamMs !== void 0 && result.totalStreamMs !== null || result.tokensPerSecond !== void 0 && result.tokensPerSecond !== null && result.tokensPerSecond > 0;
+  if (!hasMetrics) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("dl", { className: "grid grid-cols-2 gap-2 sm:grid-cols-3 lg:grid-cols-4", children: [
+    hasText(result.model) && /* @__PURE__ */ jsxRuntimeExports.jsx(ResultMetric, { label: "Model", value: result.model }),
+    result.latencyMs !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(ResultMetric, { label: "Latency", value: formatElapsed(result.latencyMs) }),
+    result.firstChunkMs !== void 0 && result.firstChunkMs !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(ResultMetric, { label: "First chunk", value: formatElapsed(result.firstChunkMs) }),
+    result.totalStreamMs !== void 0 && result.totalStreamMs !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(ResultMetric, { label: "Stream total", value: formatElapsed(result.totalStreamMs) }),
+    result.tokensPerSecond !== void 0 && result.tokensPerSecond !== null && result.tokensPerSecond > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(
+      ResultMetric,
+      {
+        label: "Token rate",
+        value: `${formatTokenRate(result.tokensPerSecond)} tok`
+      }
+    ),
+    hasTokens && /* @__PURE__ */ jsxRuntimeExports.jsx(
+      ResultMetric,
+      {
+        label: "Tokens in / out",
+        value: `${String(result.inputTokens ?? 0)} / ${String(result.outputTokens ?? 0)}`
+      }
+    ),
+    hasCache && /* @__PURE__ */ jsxRuntimeExports.jsx(
+      ResultMetric,
+      {
+        label: "Cache create / read",
+        value: `${String(result.cacheCreationInputTokens ?? 0)} / ${String(result.cacheReadInputTokens ?? 0)}`
+      }
+    )
+  ] });
 }
-function ProviderTestDetails({ result }) {
+function ProviderTestDiagnostics({ result }) {
   const debug = result.debug;
   const requestUrl = debug?.requestUrl;
   const requestMethod = debug?.requestMethod ?? "POST";
   const requestHeaders = formatHeaders(debug?.requestHeaders);
   const responseHeaders = formatHeaders(debug?.responseHeaders);
-  const responseStatus = debug?.responseStatus !== void 0 ? `${debug.responseStatus}${hasText(debug.responseStatusText) ? ` ${debug.responseStatusText}` : ""}` : void 0;
+  const responseStatus = debug?.responseStatus === void 0 ? void 0 : `${String(debug.responseStatus)}${hasText(debug.responseStatusText) ? ` ${debug.responseStatusText}` : ""}`;
   const responseBody = debug?.responseBody ?? result.rawResponse;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-h-80 max-w-full space-y-2 overflow-auto rounded-md border bg-muted/50 p-2 text-xs text-muted-foreground shadow-sm sm:w-[520px]", children: [
-    hasText(result.error?.hint) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Hint", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: result.error.hint }) }),
-    hasText(result.error?.details) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Error", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: result.error.details }) }),
-    hasText(requestUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Request", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-md bg-background/80 p-2 font-mono text-[11px] break-all text-foreground/80", children: [
-      requestMethod,
-      " ",
-      requestUrl
-    ] }) }),
-    requestHeaders !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Request Headers", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: requestHeaders }) }),
-    hasText(debug?.requestBody) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Request Body", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: debug.requestBody }) }),
-    hasText(responseStatus) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Response Status", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-md bg-background/80 p-2 font-mono text-[11px] text-foreground/80", children: responseStatus }) }),
-    responseHeaders !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Response Headers", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: responseHeaders }) }),
-    hasText(responseBody) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Response Body", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: responseBody }) })
+  const hasDiagnostics = hasText(result.error?.hint) || hasText(result.error?.details) || hasText(requestUrl) || requestHeaders !== void 0 || hasText(debug?.requestBody) || hasText(responseStatus) || responseHeaders !== void 0 || hasText(responseBody);
+  if (!hasDiagnostics) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4 border-t border-border/70 pt-4 text-xs text-muted-foreground", children: [
+    hasText(result.error?.hint) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Hint", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "break-words text-foreground/80", children: result.error.hint }) }),
+    hasText(result.error?.details) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Error details", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: result.error.details }) }),
+    hasText(requestUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Request", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: `${requestMethod} ${requestUrl}` }) }),
+    requestHeaders !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Request headers", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: requestHeaders }) }),
+    hasText(debug?.requestBody) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Request body", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: debug.requestBody }) }),
+    hasText(responseStatus) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Response status", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: responseStatus }) }),
+    responseHeaders !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Response headers", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: responseHeaders }) }),
+    hasText(responseBody) && /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticSection, { title: "Response body", children: /* @__PURE__ */ jsxRuntimeExports.jsx(DiagnosticPre, { value: responseBody }) })
   ] });
 }
-function ProviderFormatTestStatus({
-  results
+function ProviderTestResultDialog({
+  result,
+  probeLabel,
+  children
 }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid min-w-0 gap-2 sm:grid-cols-2", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-w-0 rounded-md border border-border/60 bg-muted/20 px-2 py-1.5", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-[10px] text-muted-foreground", children: "Non-stream" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(TestStatus, { result: results.nonStreaming })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-w-0 rounded-md border border-border/60 bg-muted/20 px-2 py-1.5", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-[10px] text-muted-foreground", children: "Stream" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(TestStatus, { result: results.streaming })
+  const errorMessage = result.error?.message ?? "Connection failed";
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(Dialog, { children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(DialogTrigger, { asChild: true, children }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(DialogContent, { className: "max-h-[82vh] max-w-2xl gap-0 overflow-hidden p-0", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(DialogHeader, { className: "border-b border-border/70 px-5 py-4 pr-12", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
+          result.success ? /* @__PURE__ */ jsxRuntimeExports.jsx(CircleCheckBig, { className: "size-4 text-cyan-300" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { className: "size-4 text-red-300" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(DialogTitle, { className: "text-base", children: probeLabel })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(DialogDescription, { children: result.success ? "Connection probe passed." : errorMessage })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4 overflow-y-auto p-5", children: [
+        !result.success && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-md border border-red-400/20 bg-red-400/[0.06] px-3 py-2 text-sm text-red-200", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium", children: errorLabel(result.error?.type ?? "unknown") }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 break-words text-xs text-muted-foreground", children: errorMessage })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderTestMetrics, { result }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderTestDiagnostics, { result })
+      ] })
     ] })
   ] });
 }
-function ProviderFormatStatusBlock({
-  label,
-  children
+function errorIcon(type) {
+  const className = "size-3 shrink-0";
+  switch (type) {
+    case "timeout":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { className });
+    case "network_unreachable":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(WifiOff, { className });
+    case "connection_refused":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Wifi, { className });
+    case "auth_failed":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Lock, { className });
+    case "rate_limited":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Gauge, { className });
+    case "server_error":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Server, { className });
+    case "invalid_response":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleQuestionMark, { className });
+    case "unknown":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { className });
+  }
+}
+const PROBE_TONE_CLASSES = {
+  success: "bg-cyan-300/[0.07] text-cyan-100 hover:bg-cyan-300/[0.11]",
+  failure: "bg-red-400/[0.07] text-red-200 hover:bg-red-400/[0.11]",
+  pending: "bg-muted/40 text-foreground/80",
+  quiet: "bg-transparent text-muted-foreground/70"
+};
+function ProviderProbeStatus({
+  result,
+  probeLabel
 }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-w-0 space-y-2 rounded-md border border-border/60 bg-muted/15 p-2", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs font-medium text-foreground/80", children: label }),
-    children
+  const presentation = presentProviderProbe(result);
+  const icon = isNotConfiguredState(result) ? /* @__PURE__ */ jsxRuntimeExports.jsx(Minus, { className: "size-3 shrink-0" }) : !hasSuccessField(result) ? /* @__PURE__ */ jsxRuntimeExports.jsx(RotateCw, { className: "size-3 shrink-0 animate-spin" }) : result.success ? /* @__PURE__ */ jsxRuntimeExports.jsx(CircleCheckBig, { className: "size-3 shrink-0" }) : errorIcon(result.error?.type ?? "unknown");
+  const content = /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+    icon,
+    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "min-w-0 truncate", children: presentation.label }),
+    presentation.metric !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ml-auto shrink-0 font-mono text-[10px] opacity-75", children: presentation.metric })
   ] });
-}
-function providerHasEndpoint(value) {
-  return value !== void 0 && value !== "";
-}
-function providerTestTargets(provider) {
-  const targets = [];
-  if (providerHasEndpoint(provider.anthropicBaseUrl)) {
-    targets.push("Anthropic");
-  }
-  if (providerHasEndpoint(provider.openaiBaseUrl)) {
-    targets.push("Chat");
-  }
-  if (providerHasEndpoint(provider.openaiResponsesBaseUrl)) {
-    targets.push("Responses");
+  const className = cn(
+    "inline-flex h-7 w-full min-w-0 items-center gap-1.5 rounded-md px-2 text-left text-xs transition-colors",
+    PROBE_TONE_CLASSES[presentation.tone]
+  );
+  if (hasSuccessField(result) && presentation.hasDetails) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderTestResultDialog, { result, probeLabel, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "button",
+      {
+        type: "button",
+        className,
+        "aria-label": `Open ${probeLabel} result: ${presentation.label}`,
+        children: content
+      }
+    ) });
   }
-  return targets;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className, children: content });
+}
+function ProbePlaceholder({ label }) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "inline-flex h-7 w-full min-w-0 items-center gap-1.5 rounded-md px-2 text-xs text-muted-foreground/70", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(Minus, { className: "size-3 shrink-0" }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate", children: label })
+  ] });
 }
-function CapabilityChip({
+function ProviderFormatRow({
   label,
-  enabled,
-  tone
+  results,
+  configured = true
 }) {
-  const className = enabled ? "border-border/70 bg-muted/25 text-foreground/80" : "border-border/50 bg-transparent text-muted-foreground/70";
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: `inline-flex items-center gap-1 rounded border px-1.5 py-0.5 ${className}`, children: [
-    enabled ? /* @__PURE__ */ jsxRuntimeExports.jsx(CircleCheckBig, { className: "size-3" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Minus, { className: "size-3" }),
-    label
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid min-w-0 grid-cols-[minmax(6.5rem,1fr)_minmax(6rem,0.9fr)_minmax(6rem,0.9fr)] items-center gap-2 border-t border-border/60 px-2 py-2", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min-w-0 truncate text-xs font-medium text-foreground/85", title: label, children: label }),
+    configured && results !== void 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderProbeStatus, { result: results.nonStreaming, probeLabel: `${label} non-stream` }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ProbePlaceholder, { label: configured ? "Not tested" : "Off" }),
+    configured && results !== void 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderProbeStatus, { result: results.streaming, probeLabel: `${label} stream` }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ProbePlaceholder, { label: configured ? "Not tested" : "Off" })
   ] });
 }
-function ProviderCapabilitySummary({ provider }) {
-  const hasAnthropic = providerHasEndpoint(provider.anthropicBaseUrl);
-  const hasChat = providerHasEndpoint(provider.openaiBaseUrl);
-  const hasResponses = providerHasEndpoint(provider.openaiResponsesBaseUrl);
+function ProviderTestMatrix({
+  provider,
+  results
+}) {
+  const hasAnthropic = providerHasEndpoint$1(provider.anthropicBaseUrl);
+  const hasChat = providerHasEndpoint$1(provider.openaiBaseUrl);
+  const hasResponses = providerHasEndpoint$1(provider.openaiResponsesBaseUrl);
   if (!hasAnthropic && !hasChat && !hasResponses) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground", children: "Test requires at least one configured endpoint." });
-  }
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex min-w-0 flex-wrap items-center gap-1.5 text-xs text-muted-foreground", children: [
-    hasAnthropic && /* @__PURE__ */ jsxRuntimeExports.jsx(CapabilityChip, { label: "Anthropic", enabled: true }),
-    hasChat && /* @__PURE__ */ jsxRuntimeExports.jsx(CapabilityChip, { label: "OpenAI Chat", enabled: true }),
-    hasResponses && /* @__PURE__ */ jsxRuntimeExports.jsx(CapabilityChip, { label: "OpenAI Responses", enabled: true })
-  ] });
-}
-function configuredFormatResults(provider, testResults) {
-  if (testResults === void 0) return [];
-  const results = [];
-  if (providerHasEndpoint(provider.anthropicBaseUrl)) {
-    results.push(testResults.anthropic);
-  }
-  if (providerHasEndpoint(provider.openaiBaseUrl)) {
-    results.push(testResults.openaiChat);
-  }
-  if (providerHasEndpoint(provider.openaiResponsesBaseUrl)) {
-    results.push(testResults.openaiResponses);
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground", children: "No testable endpoint configured." });
   }
-  return results;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min-w-0 overflow-x-auto rounded-md border border-border/70", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-w-[20rem]", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-[minmax(6.5rem,1fr)_minmax(6rem,0.9fr)_minmax(6rem,0.9fr)] gap-2 bg-muted/25 px-2 py-1.5 text-[10px] text-muted-foreground", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Protocol" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Non-stream" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Stream" })
+    ] }),
+    hasAnthropic && /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderFormatRow, { label: "Anthropic", results: results?.anthropic }),
+    hasChat && /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderFormatRow, { label: "OpenAI Chat", results: results?.openaiChat }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      ProviderFormatRow,
+      {
+        label: "OpenAI Responses",
+        results: results?.openaiResponses,
+        configured: hasResponses
+      }
+    )
+  ] }) });
 }
-function summarizeTestResults(provider, testResults) {
+function summarizeFormat(results) {
   const summary = { total: 0, passed: 0, failed: 0, testing: 0 };
-  for (const results of configuredFormatResults(provider, testResults)) {
-    for (const state of [results.nonStreaming, results.streaming]) {
-      if (isNotConfiguredState(state)) continue;
-      summary.total += 1;
-      if (hasSuccessField(state)) {
-        if (state.success) {
-          summary.passed += 1;
-        } else {
-          summary.failed += 1;
-        }
-      } else {
-        summary.testing += 1;
-      }
-    }
+  for (const state of [results.nonStreaming, results.streaming]) {
+    if (isNotConfiguredState(state)) continue;
+    summary.total += 1;
+    if (!hasSuccessField(state)) summary.testing += 1;
+    else if (state.success) summary.passed += 1;
+    else summary.failed += 1;
   }
   return summary;
 }
+function FormatSummaryBadge({
+  label,
+  results
+}) {
+  const summary = summarizeFormat(results);
+  const className = summary.failed > 0 ? "border-red-400/20 bg-red-400/[0.06] text-red-200" : summary.testing > 0 ? "border-amber-300/20 bg-amber-300/[0.06] text-amber-100" : summary.total > 0 && summary.passed === summary.total ? "border-cyan-300/20 bg-cyan-300/[0.06] text-cyan-100" : "border-border/60 bg-transparent text-muted-foreground";
+  const value = summary.failed > 0 ? `${summary.failed} fail` : summary.testing > 0 ? "running" : summary.total === 0 ? "off" : `${summary.passed}/${summary.total}`;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn("rounded border px-1.5 py-0.5 text-[10px]", className), children: [
+    label,
+    " ",
+    value
+  ] });
+}
+function ModelResultRow({
+  provider,
+  modelName,
+  results,
+  expanded,
+  onToggle
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-w-0", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: onToggle,
+        className: "flex w-full min-w-0 flex-wrap items-center gap-2 px-2 py-2 text-left transition-colors hover:bg-muted/20",
+        "aria-expanded": expanded,
+        children: [
+          expanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-3.5 shrink-0 text-muted-foreground" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-3.5 shrink-0 text-muted-foreground" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "min-w-[8rem] flex-1 truncate text-xs font-medium", title: modelName, children: modelName }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex flex-wrap items-center justify-end gap-1", children: [
+            providerHasEndpoint$1(provider.anthropicBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx(FormatSummaryBadge, { label: "A", results: results.anthropic }),
+            providerHasEndpoint$1(provider.openaiBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx(FormatSummaryBadge, { label: "Chat", results: results.openaiChat }),
+            providerHasEndpoint$1(provider.openaiResponsesBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx(FormatSummaryBadge, { label: "Resp", results: results.openaiResponses })
+          ] })
+        ]
+      }
+    ),
+    expanded && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-2 pb-3", children: /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderTestMatrix, { provider, results }) })
+  ] });
+}
+function ProviderModelTestResultsView({
+  provider,
+  testResults
+}) {
+  const entries = Object.entries(testResults.models ?? {});
+  const [showModels, setShowModels] = reactExports.useState(false);
+  const [expandedModelName, setExpandedModelName] = reactExports.useState(null);
+  if (entries.length === 0) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => setShowModels((value) => !value),
+        className: "flex w-full items-center gap-1.5 text-left text-xs font-medium text-foreground/80 transition-colors hover:text-foreground",
+        "aria-expanded": showModels,
+        children: [
+          showModels ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-3.5" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-3.5" }),
+          "Model probes",
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "rounded bg-muted/50 px-1.5 py-0.5 font-mono text-[10px] text-muted-foreground", children: entries.length })
+        ]
+      }
+    ),
+    showModels && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min-w-0 divide-y divide-border/60 rounded-md border border-border/70", children: entries.map(([modelName, modelResults]) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+      ModelResultRow,
+      {
+        provider,
+        modelName,
+        results: modelResults,
+        expanded: expandedModelName === modelName,
+        onToggle: () => setExpandedModelName((current) => current === modelName ? null : modelName)
+      },
+      modelName
+    )) })
+  ] });
+}
 function ProviderTestPill({
   provider,
   testResults,
   isTesting
 }) {
-  const targets = providerTestTargets(provider);
-  const summary = summarizeTestResults(provider, testResults);
+  const hasEndpoint = providerHasEndpoint$1(provider.anthropicBaseUrl) || providerHasEndpoint$1(provider.openaiBaseUrl) || providerHasEndpoint$1(provider.openaiResponsesBaseUrl);
+  const summary = summarizeProviderTestResults(provider, testResults);
   if (isTesting) {
     return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1 rounded border border-cyan-300/25 bg-cyan-300/[0.08] px-2 py-1 text-xs text-cyan-100", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(RotateCw, { className: "size-3 animate-spin" }),
       "Testing"
     ] });
   }
-  if (targets.length === 0) {
+  if (!hasEndpoint) {
     return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "rounded border border-border/70 bg-muted/20 px-2 py-1 text-xs text-muted-foreground", children: "No endpoint" });
   }
   if (testResults === void 0 || summary.total === 0) {
@@ -8371,15 +8952,12 @@ function ProviderTestPill({
   if (summary.failed > 0) {
     return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1 rounded border border-red-400/25 bg-red-500/[0.08] px-2 py-1 text-xs text-red-200", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { className: "size-3" }),
-      summary.passed,
-      "/",
-      summary.total,
-      " passed"
+      summary.failed,
+      " failed"
     ] });
   }
   if (summary.testing > 0 || summary.passed < summary.total) {
     return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "rounded border border-amber-300/25 bg-amber-400/[0.08] px-2 py-1 text-xs text-amber-100", children: [
-      "Partial ",
       summary.passed,
       "/",
       summary.total
@@ -8387,176 +8965,63 @@ function ProviderTestPill({
   }
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1 rounded border border-cyan-300/25 bg-cyan-300/[0.08] px-2 py-1 text-xs text-cyan-100", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(CircleCheckBig, { className: "size-3" }),
-    "OK ",
     summary.passed,
     "/",
     summary.total
   ] });
 }
-function compactModelLabel(provider) {
-  const models = provider.models ?? [];
-  if (models.length === 0) return "No models configured";
-  const visible = models.slice(0, 2).join(", ");
-  const hiddenCount = models.length - 2;
-  return hiddenCount > 0 ? `${visible} +${hiddenCount} more` : visible;
+const KNOWN_PROVIDER_DOCS = {
+  deepseek: "https://api-docs.deepseek.com/zh-cn/"
+};
+function providerHasEndpoint(value) {
+  return value !== void 0 && value !== "";
 }
-function ModelChip({ provider, model }) {
-  const metadata = findProviderModelMetadata(provider, model);
-  const sourceLink = getModelSourceLink(metadata?.sourceUrl);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1 rounded bg-muted px-1.5 py-0.5 text-xs text-muted-foreground", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: model }),
-    metadata !== null && metadata.contextWindow !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-foreground/80", children: formatContextWindowTokens(metadata.contextWindow) }),
-    sourceLink !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "a",
-        {
-          href: sourceLink.url,
-          target: "_blank",
-          rel: "noopener noreferrer",
-          className: "inline-flex items-center gap-0.5 rounded border border-border/70 bg-background/70 px-1 font-mono text-[10px] leading-4 text-muted-foreground transition-colors hover:text-foreground",
-          "aria-label": sourceLink.title,
-          children: sourceLink.label
-        }
-      ) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { children: sourceLink.title })
-    ] }) })
+function CapabilityChip({ label }) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1 rounded border border-border/70 bg-muted/25 px-1.5 py-0.5 text-foreground/80", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(CircleCheckBig, { className: "size-3" }),
+    label
   ] });
 }
-function getErrorIcon(type) {
-  const iconProps = { className: "size-3", strokeWidth: 2 };
-  switch (type) {
-    case "timeout":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { ...iconProps });
-    case "network_unreachable":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(WifiOff, { ...iconProps });
-    case "connection_refused":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(Wifi, { ...iconProps });
-    case "auth_failed":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(Lock, { ...iconProps });
-    case "rate_limited":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(Gauge, { ...iconProps });
-    case "server_error":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(Server, { ...iconProps });
-    case "invalid_response":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleQuestionMark, { ...iconProps });
-    case "unknown":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { ...iconProps });
-    default:
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { ...iconProps });
-  }
-}
-function TestStatus({ result }) {
-  const [showDetails, setShowDetails] = reactExports.useState(false);
-  if (!hasSuccessField(result)) {
-    if (isNotConfiguredState(result)) {
-      return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1 text-xs text-muted-foreground shrink-0", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(Minus, { className: "size-3" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Not configured" })
-      ] });
-    }
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1 text-xs text-muted-foreground shrink-0", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(RotateCw, { className: "size-3 animate-spin" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Testing..." })
-    ] });
-  }
-  if (result.success) {
-    const tokenParts = [];
-    const timingParts = [];
-    if (result.inputTokens !== void 0) {
-      tokenParts.push(/* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-        result.inputTokens,
-        " in"
-      ] }, "in"));
-    }
-    if (result.outputTokens !== void 0) {
-      tokenParts.push(/* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-        result.outputTokens,
-        " out"
-      ] }, "out"));
-    }
-    if (result.cacheCreationInputTokens !== void 0 && result.cacheCreationInputTokens > 0) {
-      tokenParts.push(
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-mono tabular-nums text-emerald-400", children: [
-          "KV Cache +",
-          result.cacheCreationInputTokens
-        ] }, "cache-create")
-      );
-    }
-    if (result.cacheReadInputTokens !== void 0 && result.cacheReadInputTokens > 0) {
-      tokenParts.push(
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-mono tabular-nums text-purple-400", children: [
-          "KV Cache ~",
-          result.cacheReadInputTokens
-        ] }, "cache-read")
-      );
-    }
-    if (result.firstChunkMs !== void 0 && result.firstChunkMs !== null) {
-      timingParts.push(/* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-        "first ",
-        formatElapsed(result.firstChunkMs)
-      ] }, "first"));
-    }
-    if (result.totalStreamMs !== void 0 && result.totalStreamMs !== null) {
-      timingParts.push(/* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-        "total ",
-        formatElapsed(result.totalStreamMs)
-      ] }, "total"));
-    }
-    if (result.tokensPerSecond !== void 0 && result.tokensPerSecond !== null && result.tokensPerSecond > 0) {
-      timingParts.push(/* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-        formatTokenRate(result.tokensPerSecond),
-        " tok/s"
-      ] }, "rate"));
-    }
-    const displayTokens = [];
-    for (let i = 0; i < tokenParts.length; i++) {
-      if (i > 0) displayTokens.push(", ");
-      displayTokens.push(tokenParts[i]);
-    }
-    const displayTiming = [];
-    for (let i = 0; i < timingParts.length; i++) {
-      if (i > 0) displayTiming.push(", ");
-      displayTiming.push(timingParts[i]);
-    }
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex shrink-0 items-center gap-1 text-xs text-cyan-100", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(CircleCheckBig, { className: "size-3 text-cyan-300" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Connected" }),
-      tokenParts.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-muted-foreground", children: [
-        "(",
-        displayTokens,
-        ")"
-      ] }),
-      timingParts.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "hidden text-muted-foreground lg:inline", children: [
-        "(",
-        displayTiming,
-        ")"
-      ] })
-    ] });
+function ProviderCapabilitySummary({ provider }) {
+  const hasAnthropic = providerHasEndpoint(provider.anthropicBaseUrl);
+  const hasChat = providerHasEndpoint(provider.openaiBaseUrl);
+  const hasResponses = providerHasEndpoint(provider.openaiResponsesBaseUrl);
+  if (!hasAnthropic && !hasChat && !hasResponses) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground", children: "Test requires at least one configured endpoint." });
   }
-  const error = result.error;
-  const errorMessage = error?.message ?? "Connection failed";
-  const errorType = error?.type ?? "unknown";
-  const hasDetails = hasDiagnosticDetails(result);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-1 shrink-0", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1 text-xs text-red-600 max-w-[200px]", children: [
-      getErrorIcon(errorType),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate", children: errorMessage }),
-      hasDetails && /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        "button",
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex min-w-0 flex-wrap items-center gap-1.5 text-xs text-muted-foreground", children: [
+    hasAnthropic && /* @__PURE__ */ jsxRuntimeExports.jsx(CapabilityChip, { label: "Anthropic" }),
+    hasChat && /* @__PURE__ */ jsxRuntimeExports.jsx(CapabilityChip, { label: "OpenAI Chat" }),
+    hasResponses && /* @__PURE__ */ jsxRuntimeExports.jsx(CapabilityChip, { label: "OpenAI Responses" })
+  ] });
+}
+function compactModelLabel(provider) {
+  const models = provider.models ?? [];
+  if (models.length === 0) return "No models configured";
+  const visible = models.slice(0, 2).join(", ");
+  const hiddenCount = models.length - 2;
+  return hiddenCount > 0 ? `${visible} +${hiddenCount} more` : visible;
+}
+function ModelChip({ provider, model }) {
+  const metadata = findProviderModelMetadata(provider, model);
+  const sourceLink = getModelSourceLink(metadata?.sourceUrl);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1 rounded bg-muted px-1.5 py-0.5 text-xs text-muted-foreground", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: model }),
+    metadata !== null && metadata.contextWindow !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-foreground/80", children: formatContextWindowTokens(metadata.contextWindow) }),
+    sourceLink !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "a",
         {
-          type: "button",
-          onClick: () => setShowDetails((value) => !value),
-          "aria-expanded": showDetails,
-          "aria-label": showDetails ? "Hide provider test diagnostics" : "Show provider test diagnostics",
-          className: "inline-flex h-5 shrink-0 items-center gap-1 rounded border border-border/70 bg-background/70 px-1.5 text-[10px] text-muted-foreground transition-colors hover:text-foreground",
-          children: [
-            showDetails ? /* @__PURE__ */ jsxRuntimeExports.jsx(EyeOff, { className: "size-3" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Eye, { className: "size-3" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: showDetails ? "Hide" : "Details" })
-          ]
+          href: sourceLink.url,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          className: "inline-flex items-center gap-0.5 rounded border border-border/70 bg-background/70 px-1 font-mono text-[10px] leading-4 text-muted-foreground transition-colors hover:text-foreground",
+          "aria-label": sourceLink.title,
+          children: sourceLink.label
         }
-      )
-    ] }),
-    showDetails && hasDetails && /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderTestDetails, { result })
+      ) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { children: sourceLink.title })
+    ] }) })
   ] });
 }
 function formatTimeAgo(isoString) {
@@ -8603,7 +9068,6 @@ function ProviderCard({
   const [showApiKey, setShowApiKey] = reactExports.useState(false);
   const [copied, setCopied] = reactExports.useState(false);
   const [showDetails, setShowDetails] = reactExports.useState(false);
-  const [showModelResults, setShowModelResults] = reactExports.useState(false);
   function handleCopy() {
     void copyTextToClipboard(provider.apiKey).then((success) => {
       if (!success) return;
@@ -8622,6 +9086,7 @@ function ProviderCard({
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(
     "div",
     {
+      "data-provider-id": provider.id,
       className: `flex flex-col gap-3 rounded-[8px] border border-border bg-card p-4 shadow-sm transition-all duration-500 ${isHighlighted === true ? "ring-2 ring-primary shadow-md" : ""}`,
       children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-wrap items-start justify-between gap-2", children: [
@@ -8720,51 +9185,11 @@ function ProviderCard({
             )
           ] }),
           provider.models !== void 0 && provider.models.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-wrap gap-1", children: provider.models.map((model) => /* @__PURE__ */ jsxRuntimeExports.jsx(ModelChip, { provider, model }, model)) }),
-          (providerHasEndpoint(provider.anthropicBaseUrl) || providerHasEndpoint(provider.openaiBaseUrl) || providerHasEndpoint(provider.openaiResponsesBaseUrl)) && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid gap-2 lg:grid-cols-3", children: [
-            providerHasEndpoint(provider.anthropicBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsxs(ProviderFormatStatusBlock, { label: "Anthropic", children: [
-              testResults !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderFormatTestStatus, { results: testResults.anthropic }),
-              testResults === void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground", children: "Not tested yet" })
-            ] }),
-            providerHasEndpoint(provider.openaiBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsxs(ProviderFormatStatusBlock, { label: "OpenAI Chat", children: [
-              testResults !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderFormatTestStatus, { results: testResults.openaiChat }),
-              testResults === void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground", children: "Not tested yet" })
-            ] }),
-            providerHasEndpoint(provider.openaiResponsesBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsxs(ProviderFormatStatusBlock, { label: "OpenAI Responses", children: [
-              testResults !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderFormatTestStatus, { results: testResults.openaiResponses }),
-              testResults === void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground", children: "Not tested yet" })
-            ] }),
-            !providerHasEndpoint(provider.openaiResponsesBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min-w-0 rounded-md border border-border/50 bg-transparent p-2 text-xs text-muted-foreground/75", children: "OpenAI Responses not configured" })
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: "text-xs font-medium text-foreground/80", children: "Connection probes" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderTestMatrix, { provider, results: testResults })
           ] }),
-          testResults?.models !== void 0 && Object.keys(testResults.models).length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsxs(
-              "button",
-              {
-                type: "button",
-                onClick: () => setShowModelResults((value) => !value),
-                className: "flex items-center gap-1 text-xs text-muted-foreground transition-colors hover:text-foreground",
-                children: [
-                  showModelResults ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-3" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-3" }),
-                  "Model Test Results (",
-                  Object.keys(testResults.models).length,
-                  ")"
-                ]
-              }
-            ),
-            showModelResults && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 overflow-x-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("table", { className: "w-full border-collapse text-xs", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx("thead", { children: /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { className: "border-b border-border", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsx("th", { className: "px-2 py-1 text-left font-medium text-muted-foreground", children: "Model" }),
-                providerHasEndpoint(provider.anthropicBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx("th", { className: "px-2 py-1 text-left font-medium text-muted-foreground", children: "Anthropic" }),
-                providerHasEndpoint(provider.openaiBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx("th", { className: "px-2 py-1 text-left font-medium text-muted-foreground", children: "Chat" }),
-                providerHasEndpoint(provider.openaiResponsesBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx("th", { className: "px-2 py-1 text-left font-medium text-muted-foreground", children: "Responses" })
-              ] }) }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx("tbody", { children: Object.entries(testResults.models).map(([modelName, modelResult]) => /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { className: "border-b border-border/50 last:border-0", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-2 py-1 font-medium", children: modelName }),
-                providerHasEndpoint(provider.anthropicBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-2 py-1 align-top", children: /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderFormatTestStatus, { results: modelResult.anthropic }) }),
-                providerHasEndpoint(provider.openaiBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-2 py-1 align-top", children: /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderFormatTestStatus, { results: modelResult.openaiChat }) }),
-                providerHasEndpoint(provider.openaiResponsesBaseUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-2 py-1 align-top", children: /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderFormatTestStatus, { results: modelResult.openaiResponses }) })
-              ] }, modelName)) })
-            ] }) })
-          ] })
+          testResults !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderModelTestResultsView, { provider, testResults })
         ] }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-2 border-t pt-1 sm:flex-row sm:items-center sm:justify-between", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsxs(
@@ -11651,62 +12076,591 @@ function AgentLabDialog({ currentSessionId, logCount }) {
             response.isLoading && runnerPresets.length === 0 && [0, 1, 2, 3].map((index) => /* @__PURE__ */ jsxRuntimeExports.jsx(
               "div",
               {
-                className: "h-32 animate-pulse rounded-lg bg-white/[0.025] shadow-[inset_0_0_0_1px_rgba(255,255,255,0.055)]"
-              },
-              index
-            ))
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: "mt-3", children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mb-2 flex items-center justify-between gap-3", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm font-semibold", children: "TonyClaw packages" }),
-            response.isLoading && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-mono text-[11px] text-muted-foreground", children: "checking npm..." })
+                className: "h-32 animate-pulse rounded-lg bg-white/[0.025] shadow-[inset_0_0_0_1px_rgba(255,255,255,0.055)]"
+              },
+              index
+            ))
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: "mt-3", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mb-2 flex items-center justify-between gap-3", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm font-semibold", children: "TonyClaw packages" }),
+            response.isLoading && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-mono text-[11px] text-muted-foreground", children: "checking npm..." })
+          ] }),
+          response.error !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-lg bg-red-500/8 p-3 text-xs text-red-100 shadow-[inset_0_0_0_1px_rgba(248,113,113,0.16)]", children: "Package status is temporarily unavailable." }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid gap-3 md:grid-cols-3", children: [
+            packages.map((pkg) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+              PackageStatusCard,
+              {
+                pkg,
+                activeTask,
+                onStartTask: handleStartTask
+              },
+              pkg.id
+            )),
+            response.isLoading && packages.length === 0 && [0, 1, 2].map((index) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "div",
+              {
+                className: "h-36 animate-pulse rounded-lg bg-white/[0.025] shadow-[inset_0_0_0_1px_rgba(255,255,255,0.055)]"
+              },
+              index
+            ))
+          ] })
+        ] }),
+        taskError !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-3 rounded-lg bg-red-500/8 p-3 text-xs text-red-100 shadow-[inset_0_0_0_1px_rgba(248,113,113,0.16)]", children: taskError }),
+        recentTasks.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: "mt-3", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mb-2 flex items-center justify-between gap-3", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm font-semibold", children: "Recent Lab runs" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "hidden font-mono text-[11px] text-muted-foreground sm:block", children: [
+              "last ",
+              String(recentTasks.length)
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid gap-2 md:grid-cols-2", children: recentTasks.map((task) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+            RecentTaskRow,
+            {
+              task,
+              selected: activeTaskId === task.id,
+              onSelect: (selectedTask) => {
+                setActiveTaskId(selectedTask.id);
+                void activeTaskResponse.mutate({ task: selectedTask }, { revalidate: true });
+              }
+            },
+            task.id
+          )) })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(TaskConsole, { task: activeTask })
+      ] })
+    ] })
+  ] });
+}
+const INSPECTOR_PET_SIZE = 56;
+const INSPECTOR_PET_MARGIN = 14;
+const INSPECTOR_PET_EDGE_PEEK = 18;
+const INSPECTOR_PET_MIN_STEP = 72;
+const INSPECTOR_PET_MAX_STEP = 156;
+const INSPECTOR_PET_SLEEP_AFTER_MS = 45e3;
+const INSPECTOR_PET_PANEL_WIDTH = 192;
+const INSPECTOR_PET_PANEL_HEIGHT = 68;
+const INSPECTOR_PET_PANEL_GAP = 10;
+const INSPECTOR_PET_VERTICAL_SAFE_MARGIN = 78;
+function viewportScale(viewport) {
+  const scale = viewport.scale ?? 1;
+  return Number.isFinite(scale) && scale > 0 ? scale : 1;
+}
+function scaledMetric(value, viewport) {
+  return value * viewportScale(viewport);
+}
+function clampUnit(value) {
+  return Math.min(Math.max(value, 0), 1);
+}
+function maximumPetX(viewport) {
+  const edgePeek = scaledMetric(INSPECTOR_PET_EDGE_PEEK, viewport);
+  return Math.max(
+    -edgePeek,
+    viewport.width - scaledMetric(INSPECTOR_PET_SIZE, viewport) + edgePeek
+  );
+}
+function maximumPetY(viewport) {
+  const edgePeek = scaledMetric(INSPECTOR_PET_EDGE_PEEK, viewport);
+  return Math.max(
+    -edgePeek,
+    viewport.height - scaledMetric(INSPECTOR_PET_SIZE, viewport) + edgePeek
+  );
+}
+function clampInspectorPetPosition(position, viewport) {
+  const edgePeek = scaledMetric(INSPECTOR_PET_EDGE_PEEK, viewport);
+  return {
+    x: Math.min(Math.max(position.x, -edgePeek), maximumPetX(viewport)),
+    y: Math.min(Math.max(position.y, -edgePeek), maximumPetY(viewport))
+  };
+}
+function nearestInspectorPetEdge(position, viewport) {
+  const clamped = clampInspectorPetPosition(position, viewport);
+  const edgePeek = scaledMetric(INSPECTOR_PET_EDGE_PEEK, viewport);
+  const distances = [
+    { edge: "left", distance: clamped.x + edgePeek },
+    { edge: "right", distance: maximumPetX(viewport) - clamped.x },
+    { edge: "top", distance: clamped.y + INSPECTOR_PET_EDGE_PEEK },
+    { edge: "bottom", distance: maximumPetY(viewport) - clamped.y }
+  ];
+  return distances.reduce((best, current) => current.distance < best.distance ? current : best).edge;
+}
+function snapInspectorPetToEdge(position, viewport) {
+  const clamped = clampInspectorPetPosition(position, viewport);
+  const edge = nearestInspectorPetEdge(clamped, viewport);
+  const edgePeek = scaledMetric(INSPECTOR_PET_EDGE_PEEK, viewport);
+  switch (edge) {
+    case "left":
+      return { x: -edgePeek, y: clamped.y };
+    case "right":
+      return { x: maximumPetX(viewport), y: clamped.y };
+    case "top":
+      return { x: clamped.x, y: -edgePeek };
+    case "bottom":
+      return { x: clamped.x, y: maximumPetY(viewport) };
+  }
+}
+function randomInspectorPetEdgePosition(viewport, edgeSample, ySample) {
+  const maxX = maximumPetX(viewport);
+  const maxY = maximumPetY(viewport);
+  const edgePeek = scaledMetric(INSPECTOR_PET_EDGE_PEEK, viewport);
+  const minimumSafeY = Math.min(scaledMetric(INSPECTOR_PET_VERTICAL_SAFE_MARGIN, viewport), maxY);
+  const randomY = minimumSafeY + clampUnit(ySample) * (maxY - minimumSafeY);
+  const edgeIndex = Math.min(1, Math.floor(clampUnit(edgeSample) * 2));
+  switch (edgeIndex) {
+    case 0:
+      return { x: -edgePeek, y: randomY };
+    case 1:
+      return { x: maxX, y: randomY };
+    default:
+      return { x: maxX, y: maxY };
+  }
+}
+function nextInspectorPetWalkingPosition(position, viewport, stepSample, directionSample) {
+  const clamped = snapInspectorPetToEdge(position, viewport);
+  const step = scaledMetric(INSPECTOR_PET_MIN_STEP, viewport) + clampUnit(stepSample) * scaledMetric(INSPECTOR_PET_MAX_STEP - INSPECTOR_PET_MIN_STEP, viewport);
+  const direction = directionSample >= 0.5 ? 1 : -1;
+  const edge = nearestInspectorPetEdge(clamped, viewport);
+  const maxX = maximumPetX(viewport);
+  const maxY = maximumPetY(viewport);
+  const edgePeek = scaledMetric(INSPECTOR_PET_EDGE_PEEK, viewport);
+  const minimumSafeY = Math.min(scaledMetric(INSPECTOR_PET_VERTICAL_SAFE_MARGIN, viewport), maxY);
+  switch (edge) {
+    case "left":
+      return {
+        x: -edgePeek,
+        y: Math.min(Math.max(clamped.y + step * direction, minimumSafeY), maxY)
+      };
+    case "right":
+      return {
+        x: maxX,
+        y: Math.min(Math.max(clamped.y + step * direction, minimumSafeY), maxY)
+      };
+    case "top":
+      return {
+        x: Math.min(Math.max(clamped.x + step * direction, -edgePeek), maxX),
+        y: -edgePeek
+      };
+    case "bottom":
+      return {
+        x: Math.min(Math.max(clamped.x + step * direction, -edgePeek), maxX),
+        y: maxY
+      };
+  }
+}
+function inspectorPetPanelPosition(position, viewport) {
+  const edge = nearestInspectorPetEdge(position, viewport);
+  const petSize = scaledMetric(INSPECTOR_PET_SIZE, viewport);
+  const panelWidth = scaledMetric(INSPECTOR_PET_PANEL_WIDTH, viewport);
+  const panelHeight = scaledMetric(INSPECTOR_PET_PANEL_HEIGHT, viewport);
+  const panelGap = scaledMetric(INSPECTOR_PET_PANEL_GAP, viewport);
+  const margin = scaledMetric(INSPECTOR_PET_MARGIN, viewport);
+  let x = position.x + petSize / 2 - panelWidth / 2;
+  let y = position.y + petSize / 2 - panelHeight / 2;
+  switch (edge) {
+    case "left":
+      x = position.x + petSize + panelGap;
+      break;
+    case "right":
+      x = position.x - panelWidth - panelGap;
+      break;
+    case "top":
+      y = position.y + petSize + panelGap;
+      break;
+    case "bottom":
+      y = position.y - panelHeight - panelGap;
+      break;
+  }
+  return {
+    x: Math.min(Math.max(x, margin), Math.max(margin, viewport.width - panelWidth - margin)),
+    y: Math.min(Math.max(y, margin), Math.max(margin, viewport.height - panelHeight - margin))
+  };
+}
+function latestCapturedLog(logs) {
+  let latest = null;
+  for (const log of logs) {
+    if (latest === null || log.id > latest.id) latest = log;
+  }
+  return latest;
+}
+function logNeedsAttention(log) {
+  const hasHttpError = log.responseStatus !== null && log.responseStatus >= 400;
+  const hasStreamError = log.error !== null && log.error !== void 0 && log.error !== "";
+  return hasHttpError || hasStreamError;
+}
+function resolveInspectorPetStatus(logs, nowMs) {
+  const pendingCount = logs.filter((log) => log.responseStatus === null).length;
+  const capturedCount = logs.length;
+  if (pendingCount > 0) {
+    return {
+      mood: "active",
+      label: `${String(pendingCount)} request${pendingCount === 1 ? "" : "s"} in flight`,
+      pendingCount,
+      capturedCount
+    };
+  }
+  const latest = latestCapturedLog(logs);
+  if (latest !== null && logNeedsAttention(latest)) {
+    return {
+      mood: "attention",
+      label: "Latest request needs attention",
+      pendingCount,
+      capturedCount
+    };
+  }
+  if (latest === null) {
+    return {
+      mood: "idle",
+      label: "Waiting for traffic",
+      pendingCount,
+      capturedCount
+    };
+  }
+  const latestTimestamp = Date.parse(latest.timestamp);
+  if (Number.isFinite(latestTimestamp) && nowMs - latestTimestamp >= INSPECTOR_PET_SLEEP_AFTER_MS) {
+    return {
+      mood: "sleeping",
+      label: "All quiet",
+      pendingCount,
+      capturedCount
+    };
+  }
+  return {
+    mood: "idle",
+    label: "Watching the session",
+    pendingCount,
+    capturedCount
+  };
+}
+const INSPECTOR_PET_ROAMING_STORAGE_KEY = "agent-inspector.pet.roaming";
+const INSPECTOR_PET_MIN_DRIFT_MS = 5200;
+const INSPECTOR_PET_DRIFT_WINDOW_MS = 2400;
+const INSPECTOR_PET_PANEL_DISMISS_MS = 6e3;
+const INSPECTOR_PET_REACTION_MS = 760;
+const INSPECTOR_PET_DRAG_THRESHOLD = 4;
+function readViewport() {
+  if (typeof window === "undefined") return { width: 1280, height: 720, scale: 1 };
+  const rawScale = window.getComputedStyle(document.documentElement).getPropertyValue("--inspector-ui-scale");
+  const parsedScale = Number.parseFloat(rawScale);
+  const scale = Number.isFinite(parsedScale) && parsedScale > 0 ? parsedScale : 1;
+  return {
+    width: Math.max(window.innerWidth, INSPECTOR_PET_MARGIN * 2),
+    height: Math.max(window.innerHeight, INSPECTOR_PET_MARGIN * 2),
+    scale
+  };
+}
+function readStoredRoaming() {
+  if (typeof window === "undefined") return true;
+  try {
+    return window.localStorage.getItem(INSPECTOR_PET_ROAMING_STORAGE_KEY) !== "0";
+  } catch {
+    return true;
+  }
+}
+function moodDotClass(mood) {
+  switch (mood) {
+    case "active":
+      return "bg-cyan-400 shadow-[0_0_9px_rgba(34,211,238,0.65)]";
+    case "attention":
+      return "bg-red-500 shadow-[0_0_9px_rgba(239,68,68,0.55)]";
+    case "idle":
+      return "bg-amber-400 shadow-[0_0_8px_rgba(251,191,36,0.45)]";
+    case "sleeping":
+      return "bg-muted-foreground/45";
+  }
+}
+function moodMotionClass(mood) {
+  switch (mood) {
+    case "active":
+      return "inspector-pet-active";
+    case "attention":
+      return "inspector-pet-attention";
+    case "idle":
+      return "";
+    case "sleeping":
+      return "inspector-pet-sleeping";
+  }
+}
+function InspectorPet({ logs }) {
+  const [viewport, setViewport] = reactExports.useState(readViewport);
+  const [position, setPosition] = reactExports.useState({
+    x: INSPECTOR_PET_MARGIN,
+    y: INSPECTOR_PET_MARGIN
+  });
+  const [clockMs, setClockMs] = reactExports.useState(() => Date.now());
+  const [motionTick, setMotionTick] = reactExports.useState(0);
+  const [panelTick, setPanelTick] = reactExports.useState(0);
+  const [panelVisible, setPanelVisible] = reactExports.useState(false);
+  const [reactionTick, setReactionTick] = reactExports.useState(0);
+  const [reactionVisible, setReactionVisible] = reactExports.useState(false);
+  const [dragging, setDragging] = reactExports.useState(false);
+  const [roaming, setRoaming] = reactExports.useState(readStoredRoaming);
+  const [reduceMotion, setReduceMotion] = reactExports.useState(false);
+  const dragStateRef = reactExports.useRef(null);
+  const dragOccurredRef = reactExports.useRef(false);
+  const status = reactExports.useMemo(() => resolveInspectorPetStatus(logs, clockMs), [clockMs, logs]);
+  const panelPosition = reactExports.useMemo(
+    () => inspectorPetPanelPosition(position, viewport),
+    [position, viewport]
+  );
+  reactExports.useEffect(() => {
+    const nextViewport = readViewport();
+    setViewport(nextViewport);
+    setPosition(randomInspectorPetEdgePosition(nextViewport, Math.random(), Math.random()));
+  }, []);
+  reactExports.useEffect(() => {
+    const mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)");
+    const handleChange = (event) => setReduceMotion(event.matches);
+    setReduceMotion(mediaQuery.matches);
+    mediaQuery.addEventListener("change", handleChange);
+    return () => mediaQuery.removeEventListener("change", handleChange);
+  }, []);
+  reactExports.useEffect(() => {
+    const intervalId = window.setInterval(() => setClockMs(Date.now()), 15e3);
+    return () => window.clearInterval(intervalId);
+  }, []);
+  reactExports.useEffect(() => {
+    try {
+      window.localStorage.setItem(INSPECTOR_PET_ROAMING_STORAGE_KEY, roaming ? "1" : "0");
+    } catch {
+    }
+  }, [roaming]);
+  reactExports.useEffect(() => {
+    if (!roaming || dragging || reduceMotion) return void 0;
+    let timeoutId = null;
+    const scheduleDrift = () => {
+      const delay = INSPECTOR_PET_MIN_DRIFT_MS + Math.random() * INSPECTOR_PET_DRIFT_WINDOW_MS;
+      timeoutId = window.setTimeout(() => {
+        setMotionTick((current) => current + 1);
+        setPosition(
+          (current) => nextInspectorPetWalkingPosition(current, viewport, Math.random(), Math.random())
+        );
+        scheduleDrift();
+      }, delay);
+    };
+    scheduleDrift();
+    return () => {
+      if (timeoutId !== null) window.clearTimeout(timeoutId);
+    };
+  }, [dragging, reduceMotion, roaming, viewport]);
+  reactExports.useEffect(() => {
+    const handleResize = () => {
+      const nextViewport = readViewport();
+      setViewport(nextViewport);
+      setPosition((current) => snapInspectorPetToEdge(current, nextViewport));
+    };
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
+  reactExports.useEffect(() => {
+    if (!panelVisible) return void 0;
+    const timeoutId = window.setTimeout(
+      () => setPanelVisible(false),
+      INSPECTOR_PET_PANEL_DISMISS_MS
+    );
+    return () => window.clearTimeout(timeoutId);
+  }, [panelTick, panelVisible]);
+  reactExports.useEffect(() => {
+    if (!reactionVisible) return void 0;
+    const timeoutId = window.setTimeout(() => setReactionVisible(false), INSPECTOR_PET_REACTION_MS);
+    return () => window.clearTimeout(timeoutId);
+  }, [reactionTick, reactionVisible]);
+  const handlePet = reactExports.useCallback(() => {
+    if (dragOccurredRef.current) {
+      dragOccurredRef.current = false;
+      return;
+    }
+    setClockMs(Date.now());
+    setPanelTick((current) => current + 1);
+    setPanelVisible(true);
+    setReactionTick((current) => current + 1);
+    setReactionVisible(true);
+  }, []);
+  const handlePointerDown = reactExports.useCallback((event) => {
+    const rect = event.currentTarget.getBoundingClientRect();
+    dragOccurredRef.current = false;
+    dragStateRef.current = {
+      pointerId: event.pointerId,
+      offsetX: event.clientX - rect.left,
+      offsetY: event.clientY - rect.top,
+      startX: event.clientX,
+      startY: event.clientY,
+      moved: false
+    };
+    event.currentTarget.setPointerCapture(event.pointerId);
+    setPanelVisible(false);
+    setDragging(true);
+  }, []);
+  const handlePointerMove = reactExports.useCallback(
+    (event) => {
+      const dragState = dragStateRef.current;
+      if (dragState === null || dragState.pointerId !== event.pointerId) return;
+      const moved = dragState.moved || Math.abs(event.clientX - dragState.startX) >= INSPECTOR_PET_DRAG_THRESHOLD || Math.abs(event.clientY - dragState.startY) >= INSPECTOR_PET_DRAG_THRESHOLD;
+      dragState.moved = moved;
+      dragOccurredRef.current = moved;
+      setPosition(
+        clampInspectorPetPosition(
+          {
+            x: event.clientX - dragState.offsetX,
+            y: event.clientY - dragState.offsetY
+          },
+          viewport
+        )
+      );
+    },
+    [viewport]
+  );
+  const handlePointerUp = reactExports.useCallback(
+    (event) => {
+      const dragState = dragStateRef.current;
+      if (dragState === null || dragState.pointerId !== event.pointerId) return;
+      if (event.currentTarget.hasPointerCapture(event.pointerId)) {
+        event.currentTarget.releasePointerCapture(event.pointerId);
+      }
+      dragOccurredRef.current = dragState.moved;
+      dragStateRef.current = null;
+      setDragging(false);
+      setPosition((current) => snapInspectorPetToEdge(current, viewport));
+    },
+    [viewport]
+  );
+  const handlePointerCancel = reactExports.useCallback((event) => {
+    if (event.currentTarget.hasPointerCapture(event.pointerId)) {
+      event.currentTarget.releasePointerCapture(event.pointerId);
+    }
+    dragStateRef.current = null;
+    dragOccurredRef.current = false;
+    setDragging(false);
+  }, []);
+  const petStyle = reactExports.useMemo(
+    () => ({
+      transform: `translate3d(${String(position.x)}px, ${String(position.y)}px, 0) rotate(${motionTick % 2 === 0 ? "-4deg" : "5deg"}) scale(${dragging ? "1.08" : "1"})`,
+      transition: dragging ? "none" : "transform 4800ms cubic-bezier(0.33, 1, 0.68, 1)",
+      touchAction: "none"
+    }),
+    [dragging, motionTick, position.x, position.y]
+  );
+  const panelStyle = reactExports.useMemo(
+    () => ({ left: panelPosition.x, top: panelPosition.y }),
+    [panelPosition.x, panelPosition.y]
+  );
+  const roamingLabel = roaming ? "Pause pet roaming" : "Resume pet roaming";
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "button",
+      {
+        type: "button",
+        className: cn(
+          "fixed left-0 top-0 z-30 flex size-14 items-center justify-center bg-transparent text-foreground outline-none transition-[filter,opacity] duration-200 hover:opacity-95 hover:drop-shadow-[0_0_24px_rgba(245,158,11,0.36)] focus-visible:drop-shadow-[0_0_12px_rgba(251,191,36,0.72)]",
+          dragging ? "cursor-grabbing" : "cursor-grab"
+        ),
+        style: petStyle,
+        "data-pet-mood": status.mood,
+        onClick: handlePet,
+        onPointerDown: handlePointerDown,
+        onPointerMove: handlePointerMove,
+        onPointerUp: handlePointerUp,
+        onPointerCancel: handlePointerCancel,
+        "aria-label": `Inspector pet: ${status.label}`,
+        title: status.label,
+        children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "span",
+          {
+            className: cn(
+              "relative flex size-12 items-center justify-center",
+              reactionVisible && "inspector-pet-patted"
+            ),
+            "aria-hidden": "true",
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "span",
+                {
+                  className: cn(
+                    "relative flex size-12 items-center justify-center",
+                    moodMotionClass(status.mood)
+                  ),
+                  children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                    "span",
+                    {
+                      className: cn(
+                        "relative flex size-12 items-center justify-center",
+                        !dragging && "floating-crab-body"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsxRuntimeExports.jsx(CrabLogo, { className: "relative z-10 size-11 text-amber-500 drop-shadow-[0_0_15px_rgba(245,158,11,0.30)]" }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "pointer-events-none absolute inset-x-0 bottom-0 z-0 flex items-end justify-center gap-1 text-amber-400/80", children: [0, 1, 2, 3, 4, 5].map((leg) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+                          "span",
+                          {
+                            className: cn(
+                              "floating-crab-leg h-2 w-0.5 rounded-full bg-current shadow-[0_0_7px_rgba(245,158,11,0.24)]",
+                              leg < 3 ? "floating-crab-leg-left" : "floating-crab-leg-right",
+                              dragging && "animate-none"
+                            ),
+                            style: { animationDelay: `${String(leg % 2 === 0 ? 0 : 180)}ms` }
+                          },
+                          leg
+                        )) })
+                      ]
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "span",
+                {
+                  className: cn(
+                    "absolute right-0 top-1 size-2 rounded-full border border-background/90",
+                    moodDotClass(status.mood),
+                    status.mood === "active" && !reduceMotion && "animate-pulse"
+                  )
+                }
+              ),
+              reactionVisible && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                Heart,
+                {
+                  className: "inspector-pet-heart absolute -right-1 -top-2 size-3.5 fill-amber-400 text-amber-400"
+                },
+                reactionTick
+              )
+            ]
+          }
+        )
+      }
+    ),
+    panelVisible && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "div",
+      {
+        className: "fixed z-50 w-48 rounded-md border border-border/80 bg-popover/95 px-3 py-2 text-popover-foreground shadow-[0_14px_34px_rgba(0,0,0,0.28)] backdrop-blur",
+        style: panelStyle,
+        role: "status",
+        "aria-live": "polite",
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn("size-2 shrink-0 rounded-full", moodDotClass(status.mood)) }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "min-w-0 flex-1 truncate text-xs font-medium", children: status.label }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "button",
+              {
+                type: "button",
+                className: "inline-flex size-6 shrink-0 items-center justify-center rounded text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-none",
+                onClick: () => setRoaming((current) => !current),
+                "aria-label": roamingLabel,
+                title: roamingLabel,
+                children: roaming ? /* @__PURE__ */ jsxRuntimeExports.jsx(Pause, { className: "size-3.5" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Play, { className: "size-3.5" })
+              }
+            )
           ] }),
-          response.error !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-lg bg-red-500/8 p-3 text-xs text-red-100 shadow-[inset_0_0_0_1px_rgba(248,113,113,0.16)]", children: "Package status is temporarily unavailable." }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid gap-3 md:grid-cols-3", children: [
-            packages.map((pkg) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-              PackageStatusCard,
-              {
-                pkg,
-                activeTask,
-                onStartTask: handleStartTask
-              },
-              pkg.id
-            )),
-            response.isLoading && packages.length === 0 && [0, 1, 2].map((index) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-              "div",
-              {
-                className: "h-36 animate-pulse rounded-lg bg-white/[0.025] shadow-[inset_0_0_0_1px_rgba(255,255,255,0.055)]"
-              },
-              index
-            ))
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mt-1 flex items-center justify-between gap-3 font-mono text-[10px] text-muted-foreground", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
+              String(status.capturedCount),
+              " captured"
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: status.pendingCount > 0 ? `${String(status.pendingCount)} active` : roaming ? "Roaming" : "Resting" })
           ] })
-        ] }),
-        taskError !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-3 rounded-lg bg-red-500/8 p-3 text-xs text-red-100 shadow-[inset_0_0_0_1px_rgba(248,113,113,0.16)]", children: taskError }),
-        recentTasks.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: "mt-3", children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mb-2 flex items-center justify-between gap-3", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm font-semibold", children: "Recent Lab runs" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "hidden font-mono text-[11px] text-muted-foreground sm:block", children: [
-              "last ",
-              String(recentTasks.length)
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid gap-2 md:grid-cols-2", children: recentTasks.map((task) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-            RecentTaskRow,
-            {
-              task,
-              selected: activeTaskId === task.id,
-              onSelect: (selectedTask) => {
-                setActiveTaskId(selectedTask.id);
-                void activeTaskResponse.mutate({ task: selectedTask }, { revalidate: true });
-              }
-            },
-            task.id
-          )) })
-        ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(TaskConsole, { task: activeTask })
-      ] })
-    ] })
+        ]
+      }
+    )
   ] });
 }
 const DEFAULT_QUESTION = "Analyze the current Inspector session. What looks abnormal, slow, or likely to hang?";
@@ -13276,353 +14230,106 @@ function riskRank(risk) {
       return 2;
     case "ok":
       return 1;
-  }
-}
-function compareModelSummary(left, right) {
-  const riskDelta = riskRank(right.latest.riskLevel) - riskRank(left.latest.riskLevel);
-  if (riskDelta !== 0) return riskDelta;
-  const leftPeak = left.peak.usagePercent ?? -1;
-  const rightPeak = right.peak.usagePercent ?? -1;
-  const peakDelta = rightPeak - leftPeak;
-  if (peakDelta !== 0) return peakDelta;
-  return right.latest.logId - left.latest.logId;
-}
-function trendPercent(first, latest) {
-  if (first.usagePercent === null || latest.usagePercent === null) return null;
-  return (latest.usagePercent - first.usagePercent) * 100;
-}
-function logsInAscendingIdOrder(logs) {
-  for (let index = 1; index < logs.length; index++) {
-    const previous = logs[index - 1];
-    const current = logs[index];
-    if (previous === void 0 || current === void 0) continue;
-    if (previous.id > current.id) return [...logs].sort((left, right) => left.id - right.id);
-  }
-  return logs;
-}
-function buildSessionContextSummary(logs, providers = []) {
-  const sortedLogs = logsInAscendingIdOrder(logs);
-  const providersSignature = providerSignature(providers);
-  const byModel = /* @__PURE__ */ new Map();
-  for (const log of sortedLogs) {
-    const snapshot = cachedSnapshotFromLog(log, providers, providersSignature);
-    if (snapshot === null) continue;
-    const existing = byModel.get(snapshot.model);
-    if (existing === void 0) {
-      byModel.set(snapshot.model, {
-        model: snapshot.model,
-        requestCount: 1,
-        first: snapshot,
-        latest: snapshot,
-        peak: snapshot
-      });
-      continue;
-    }
-    byModel.set(snapshot.model, {
-      model: existing.model,
-      requestCount: existing.requestCount + 1,
-      first: existing.first,
-      latest: snapshot,
-      peak: isHigherPeak(snapshot, existing.peak) ? snapshot : existing.peak
-    });
-  }
-  const models = [...byModel.values()].map((entry) => ({
-    model: entry.model,
-    requestCount: entry.requestCount,
-    first: entry.first,
-    latest: entry.latest,
-    peak: entry.peak,
-    trendPercent: trendPercent(entry.first, entry.latest)
-  })).sort(compareModelSummary);
-  return { models };
-}
-function truncateSessionId(id) {
-  if (id.length <= 30) return id;
-  return `${id.slice(0, 12)}...${id.slice(-12)}`;
-}
-function buildDisplayNumberByLogId(groups) {
-  const result = /* @__PURE__ */ new Map();
-  for (const group of groups) {
-    for (let index = 0; index < group.logs.length; index += 1) {
-      const log = group.logs[index];
-      if (log === void 0) continue;
-      result.set(log.id, index + 1);
-    }
-  }
-  return result;
-}
-function displayNumberForLog(log, displayNumberByLogId) {
-  return displayNumberByLogId.get(log.id) ?? log.id;
-}
-function shouldShowRawExport(captureMode) {
-  return captureMode === "full";
-}
-function getExportActionVisibility(captureMode, logCount) {
-  const hasLogs = logCount > 0;
-  return {
-    redacted: hasLogs,
-    raw: hasLogs && shouldShowRawExport(captureMode)
-  };
-}
-function computeTokenSummary(logs) {
-  let totalIn = 0;
-  let totalOut = 0;
-  for (const log of logs) {
-    if (log.inputTokens !== null) totalIn += log.inputTokens;
-    if (log.outputTokens !== null) totalOut += log.outputTokens;
-  }
-  return { totalIn, totalOut };
-}
-function formatTimeRange(logs, timeDisplayFormat) {
-  const first = logs[0];
-  const last = logs[logs.length - 1];
-  if (first === void 0 || last === void 0) return null;
-  return formatTimestampRange(first.timestamp, last.timestamp, timeDisplayFormat);
-}
-function getFirstUserAgent(logs) {
-  for (const log of logs) {
-    if (log.userAgent !== null && log.userAgent !== void 0 && log.userAgent !== "") {
-      return log.userAgent;
-    }
-  }
-  return null;
-}
-function hasLogFailure(log) {
-  if (log.error !== null && log.error !== void 0 && log.error.length > 0) return true;
-  return log.responseStatus !== null && log.responseStatus >= 400;
-}
-function getModelLabel(logs) {
-  const models = /* @__PURE__ */ new Set();
-  for (const log of logs) {
-    if (log.model !== null && log.model.length > 0) {
-      models.add(log.model);
-    }
-  }
-  const sorted = [...models].sort();
-  if (sorted.length === 0) return "Model unknown";
-  if (sorted.length === 1) return sorted[0] ?? "Model unknown";
-  return `${sorted.length} models`;
-}
-function getProviderLabel(logs) {
-  const providers = /* @__PURE__ */ new Set();
-  for (const log of logs) {
-    if (log.providerName !== null && log.providerName !== void 0 && log.providerName.length > 0) {
-      providers.add(log.providerName);
-    }
-  }
-  const sorted = [...providers].sort();
-  if (sorted.length === 0) return "Provider unknown";
-  if (sorted.length === 1) return sorted[0] ?? "Provider unknown";
-  return `${sorted.length} providers`;
-}
-function formatElapsedMs(ms) {
-  if (ms < 1e3) return `${ms}ms`;
-  if (ms < 6e4) {
-    const seconds2 = ms / 1e3;
-    return `${seconds2 < 10 ? seconds2.toFixed(1) : seconds2.toFixed(0)}s`;
-  }
-  const totalSeconds = Math.round(ms / 1e3);
-  const minutes = Math.floor(totalSeconds / 60);
-  const seconds = totalSeconds % 60;
-  return `${minutes}m ${seconds}s`;
+  }
 }
-function formatTokenPair(inputTokens, outputTokens) {
-  return `${formatTokens(inputTokens)} in / ${formatTokens(outputTokens)} out`;
+function compareModelSummary(left, right) {
+  const riskDelta = riskRank(right.latest.riskLevel) - riskRank(left.latest.riskLevel);
+  if (riskDelta !== 0) return riskDelta;
+  const leftPeak = left.peak.usagePercent ?? -1;
+  const rightPeak = right.peak.usagePercent ?? -1;
+  const peakDelta = rightPeak - leftPeak;
+  if (peakDelta !== 0) return peakDelta;
+  return right.latest.logId - left.latest.logId;
 }
-function countSessionTurns(logs, conversationGroups) {
-  if (logs.length === 0) return 0;
-  if (conversationGroups.length === 0) return buildTurnGroups(logs).length;
-  let turns = 0;
-  for (const group of conversationGroups) {
-    turns += buildTurnGroups(group.logs).length;
-  }
-  return turns;
+function trendPercent(first, latest) {
+  if (first.usagePercent === null || latest.usagePercent === null) return null;
+  return (latest.usagePercent - first.usagePercent) * 100;
 }
-function summarizeFinishReason({
-  stopReason,
-  pending,
-  lastFailureLogNumber
-}) {
-  if (pending > 0) {
-    return {
-      label: "In flight",
-      detail: `${pending} request${pending === 1 ? "" : "s"} pending`,
-      tone: "cool"
-    };
-  }
-  if (lastFailureLogNumber !== null && stopReason === null) {
-    return {
-      label: "Error",
-      detail: `Last failed request #${lastFailureLogNumber}`,
-      tone: "danger"
-    };
+function logsInAscendingIdOrder(logs) {
+  for (let index = 1; index < logs.length; index++) {
+    const previous = logs[index - 1];
+    const current = logs[index];
+    if (previous === void 0 || current === void 0) continue;
+    if (previous.id > current.id) return [...logs].sort((left, right) => left.id - right.id);
   }
-  switch (stopReason) {
-    case "end_turn":
-      return { label: "End turn", detail: "Assistant completed the turn", tone: "neutral" };
-    case "stop":
-      return { label: "Stop", detail: "Model reached a stop condition", tone: "neutral" };
-    case "length":
-      return { label: "Output limit", detail: "Turn ended at max output tokens", tone: "watch" };
-    case "tool_use":
-      return { label: "Tool call", detail: "Assistant requested a tool", tone: "cool" };
-    case null:
-      return { label: "Unknown", detail: "No finish reason captured", tone: "neutral" };
+  return logs;
+}
+function buildSessionContextSummary(logs, providers = []) {
+  const sortedLogs = logsInAscendingIdOrder(logs);
+  const providersSignature = providerSignature(providers);
+  const byModel = /* @__PURE__ */ new Map();
+  for (const log of sortedLogs) {
+    const snapshot = cachedSnapshotFromLog(log, providers, providersSignature);
+    if (snapshot === null) continue;
+    const existing = byModel.get(snapshot.model);
+    if (existing === void 0) {
+      byModel.set(snapshot.model, {
+        model: snapshot.model,
+        requestCount: 1,
+        first: snapshot,
+        latest: snapshot,
+        peak: snapshot
+      });
+      continue;
+    }
+    byModel.set(snapshot.model, {
+      model: existing.model,
+      requestCount: existing.requestCount + 1,
+      first: existing.first,
+      latest: snapshot,
+      peak: isHigherPeak(snapshot, existing.peak) ? snapshot : existing.peak
+    });
   }
+  const models = [...byModel.values()].map((entry) => ({
+    model: entry.model,
+    requestCount: entry.requestCount,
+    first: entry.first,
+    latest: entry.latest,
+    peak: entry.peak,
+    trendPercent: trendPercent(entry.first, entry.latest)
+  })).sort(compareModelSummary);
+  return { models };
 }
-function isClientAbortError(error) {
-  if (error === null) return false;
-  const lower = error.toLowerCase();
-  return lower.includes("abort") || lower.includes("cancel") || lower.includes("client disconnected") || lower.includes("stream disconnected") || lower.includes("connection closed");
+function truncateSessionId(id) {
+  if (id.length <= 30) return id;
+  return `${id.slice(0, 12)}...${id.slice(-12)}`;
 }
-function summarizeSessionOutcome({
-  pending,
-  failures,
-  lengthStops,
-  stopReason,
-  lastFailure
-}) {
-  if (lastFailure !== null && (lastFailure.status === 499 || isClientAbortError(lastFailure.error))) {
-    return {
-      label: "Client aborted",
-      detail: `Request #${lastFailure.logNumber} ended before completion`,
-      tone: "watch"
-    };
-  }
-  if (pending > 0) {
-    return {
-      label: "In flight",
-      detail: `${pending} request${pending === 1 ? "" : "s"} still running`,
-      tone: "cool"
-    };
-  }
-  if (lastFailure !== null && lastFailure.status !== null && lastFailure.status >= 500) {
-    return {
-      label: "Provider error",
-      detail: `Request #${lastFailure.logNumber} returned HTTP ${lastFailure.status}`,
-      tone: "danger"
-    };
-  }
-  if (failures > 0 && lastFailure !== null) {
-    return {
-      label: "Failed",
-      detail: `Request #${lastFailure.logNumber} needs attention`,
-      tone: "danger"
-    };
-  }
-  if (lengthStops > 0 || stopReason === "length") {
-    return {
-      label: "Output limited",
-      detail: "Model stopped at the output token limit",
-      tone: "watch"
-    };
-  }
-  switch (stopReason) {
-    case "end_turn":
-    case "stop":
-      return { label: "Completed", detail: "Assistant completed normally", tone: "neutral" };
-    case "tool_use":
-      return { label: "Tool requested", detail: "Assistant handed off to a tool", tone: "cool" };
-    case null:
-      return { label: "Unknown", detail: "No terminal signal captured", tone: "neutral" };
+function buildDisplayNumberByLogId(groups) {
+  const result = /* @__PURE__ */ new Map();
+  for (const group of groups) {
+    for (let index = 0; index < group.logs.length; index += 1) {
+      const log = group.logs[index];
+      if (log === void 0) continue;
+      result.set(log.id, index + 1);
+    }
   }
+  return result;
 }
-function buildSessionSlateStats({
-  logs,
-  conversationGroups,
-  isLoading,
-  timeDisplayFormat,
-  slowResponseThresholdSeconds
-}) {
-  let failures = 0;
-  let pending = 0;
-  let slow = 0;
-  let lengthStops = 0;
+function displayNumberForLog(log, displayNumberByLogId) {
+  return displayNumberByLogId.get(log.id) ?? log.id;
+}
+function computeTokenSummary(logs) {
   let totalIn = 0;
   let totalOut = 0;
-  let terminalStopReason = null;
-  let lastFailureLogNumber = null;
-  let lastFailure = null;
-  let slowestMs = null;
-  let slowestLogNumber = null;
-  let heaviestTokens = 0;
-  let heaviestInputTokens = 0;
-  let heaviestOutputTokens = 0;
-  let heaviestLogNumber = null;
-  const slowThresholdMs = slowResponseThresholdSeconds * 1e3;
-  for (let index = 0; index < logs.length; index += 1) {
-    const log = logs[index];
-    if (log === void 0) continue;
-    const logNumber = index + 1;
-    const stopReason = extractStopReason(log);
-    if (stopReason !== null) terminalStopReason = stopReason;
-    if (stopReason === "length") lengthStops += 1;
-    if (hasLogFailure(log)) {
-      failures += 1;
-      lastFailureLogNumber = logNumber;
-      lastFailure = {
-        logNumber,
-        status: log.responseStatus,
-        error: log.error ?? null
-      };
-    }
-    if (log.responseStatus === null) pending += 1;
-    if (slowResponseThresholdSeconds > 0 && log.elapsedMs !== null && log.elapsedMs >= slowThresholdMs) {
-      slow += 1;
-    }
-    if (log.inputTokens !== null) totalIn += log.inputTokens;
-    if (log.outputTokens !== null) totalOut += log.outputTokens;
-    if (log.elapsedMs !== null && (slowestMs === null || log.elapsedMs > slowestMs)) {
-      slowestMs = log.elapsedMs;
-      slowestLogNumber = logNumber;
-    }
-    const inputTokens = log.inputTokens ?? 0;
-    const outputTokens = log.outputTokens ?? 0;
-    const requestTokens = inputTokens + outputTokens;
-    if (requestTokens > heaviestTokens) {
-      heaviestTokens = requestTokens;
-      heaviestInputTokens = inputTokens;
-      heaviestOutputTokens = outputTokens;
-      heaviestLogNumber = logNumber;
-    }
-  }
-  const status = isLoading || pending > 0 && failures === 0 ? "rolling" : failures > 0 ? "failed" : slow > 0 || lengthStops > 0 ? "watch" : "clear";
-  const statusLabel2 = status === "rolling" ? "Rolling" : status === "failed" ? "Failure" : status === "watch" ? "Watch" : "Clear";
-  const finish = summarizeFinishReason({
-    stopReason: terminalStopReason,
-    pending,
-    lastFailureLogNumber
-  });
-  const outcome = summarizeSessionOutcome({
-    pending,
-    failures,
-    lengthStops,
-    stopReason: terminalStopReason,
-    lastFailure
-  });
-  return {
-    status,
-    statusLabel: statusLabel2,
-    modelLabel: getModelLabel(logs),
-    providerLabel: getProviderLabel(logs),
-    requests: logs.length,
-    turns: countSessionTurns(logs, conversationGroups),
-    failures,
-    pending,
-    slow,
-    lengthStops,
-    timeRange: formatTimeRange(logs, timeDisplayFormat),
-    tokenLabel: `${formatTokens(totalIn)} in / ${formatTokens(totalOut)} out`,
-    finishLabel: finish.label,
-    finishDetail: finish.detail,
-    finishTone: finish.tone,
-    outcomeLabel: outcome.label,
-    outcomeDetail: outcome.detail,
-    outcomeTone: outcome.tone,
-    slowestLabel: slowestMs === null ? "n/a" : formatElapsedMs(slowestMs),
-    slowestDetail: slowestLogNumber === null ? "Latency pending" : `Request #${slowestLogNumber}`,
-    heaviestDetail: heaviestLogNumber === null ? "Tokens pending" : `#${heaviestLogNumber} ${formatTokenPair(heaviestInputTokens, heaviestOutputTokens)}`
-  };
+  for (const log of logs) {
+    if (log.inputTokens !== null) totalIn += log.inputTokens;
+    if (log.outputTokens !== null) totalOut += log.outputTokens;
+  }
+  return { totalIn, totalOut };
+}
+function getFirstUserAgent(logs) {
+  for (const log of logs) {
+    if (log.userAgent !== null && log.userAgent !== void 0 && log.userAgent !== "") {
+      return log.userAgent;
+    }
+  }
+  return null;
+}
+function formatTimeRange(logs, timeDisplayFormat) {
+  const first = logs[0];
+  const last = logs[logs.length - 1];
+  if (first === void 0 || last === void 0) return null;
+  return formatTimestampRange(first.timestamp, last.timestamp, timeDisplayFormat);
 }
 function slateMetricToneClass(tone) {
   switch (tone) {
@@ -13746,35 +14453,6 @@ function SessionOpeningSlate({ stats }) {
     ] })
   ] });
 }
-function resolveSessionContextScope({
-  pinnedSessionId,
-  selectedSession,
-  sessions,
-  logs
-}) {
-  if (pinnedSessionId !== void 0) {
-    const scopedLogs = logs.filter((log) => log.sessionId === pinnedSessionId);
-    if (scopedLogs.length === 0) return null;
-    return { label: pinnedSessionId, logs: scopedLogs, showBackLink: true };
-  }
-  if (selectedSession !== "__all__") {
-    const scopedLogs = logs.filter((log) => log.sessionId === selectedSession);
-    if (scopedLogs.length === 0) return null;
-    return { label: selectedSession, logs: scopedLogs, showBackLink: true };
-  }
-  const singleSessionId = sessions.length === 1 ? sessions[0] ?? null : null;
-  if (singleSessionId !== null) {
-    const allVisibleLogsBelongToSession = logs.every((log) => log.sessionId === singleSessionId);
-    if (allVisibleLogsBelongToSession) {
-      return { label: singleSessionId, logs: [...logs], showBackLink: false };
-    }
-  }
-  const allVisibleLogsAreSessionless = sessions.length === 0 && logs.length > 0 && logs.every((log) => log.sessionId === null);
-  if (allVisibleLogsAreSessionless) {
-    return { label: "Visible requests", logs: [...logs], showBackLink: false };
-  }
-  return null;
-}
 function formatPercent(value) {
   if (value === null) return "Unknown";
   const percent = value * 100;
@@ -13971,23 +14649,6 @@ function SessionMembershipPanel({
     }) })
   ] });
 }
-function formatPaginationStatus({
-  logs,
-  pagination
-}) {
-  if (pagination.isLoading && logs.length === 0) return "Loading logs...";
-  if (logs.length === 0) return "No logs on this page";
-  const first = logs[0];
-  const last = logs[logs.length - 1];
-  const range = first === void 0 || last === void 0 ? "Current page" : `#${first.id}-#${last.id}`;
-  if (pagination.total === null) {
-    return `Showing ${logs.length} logs (${range})`;
-  }
-  if (pagination.total <= logs.length) {
-    return `Showing all ${pagination.total} logs`;
-  }
-  return `Showing ${logs.length} of ${pagination.total} logs (${range})`;
-}
 function LogPaginationButton({
   label,
   title,
@@ -14261,11 +14922,107 @@ function CrabFamily({
     }) })
   ] });
 }
+function ThemeModeToggle() {
+  const { themeMode, setThemeMode } = useThemeMode();
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "div",
+    {
+      className: "border-border/70 bg-muted/70 inline-flex h-8 items-center rounded-md border p-0.5 shadow-sm",
+      "aria-label": "Theme mode",
+      role: "group",
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => setThemeMode("light"),
+            className: cn(
+              "inline-flex size-7 items-center justify-center rounded-[6px] text-muted-foreground transition-colors hover:text-foreground",
+              themeMode === "light" && "bg-background text-foreground shadow-sm"
+            ),
+            "aria-label": "Use light mode",
+            "aria-pressed": themeMode === "light",
+            title: "Light mode",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(Sun, { className: "size-3.5" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => setThemeMode("eye-care"),
+            className: cn(
+              "inline-flex size-7 items-center justify-center rounded-[6px] text-muted-foreground transition-colors hover:text-foreground",
+              themeMode === "eye-care" && "bg-background text-foreground shadow-sm"
+            ),
+            "aria-label": "Use eye care mode",
+            "aria-pressed": themeMode === "eye-care",
+            title: "Eye care mode",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(Eye, { className: "size-3.5" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => setThemeMode("dark"),
+            className: cn(
+              "inline-flex size-7 items-center justify-center rounded-[6px] text-muted-foreground transition-colors hover:text-foreground",
+              themeMode === "dark" && "bg-background text-foreground shadow-sm"
+            ),
+            "aria-label": "Use dark mode",
+            "aria-pressed": themeMode === "dark",
+            title: "Dark mode",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(Moon, { className: "size-3.5" })
+          }
+        )
+      ]
+    }
+  );
+}
+function UiScaleControl({
+  preference,
+  resolvedScale,
+  onChange
+}) {
+  const resolvedLabel = formatUiScale(resolvedScale);
+  const currentLabel = preference === "auto" ? `Auto (${resolvedLabel})` : `${preference}%`;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    Select,
+    {
+      value: preference,
+      onValueChange: (value) => onChange(normalizeUiScalePreference(value)),
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          SelectTrigger,
+          {
+            size: "sm",
+            className: "bg-white/[0.035] hover:bg-white/[0.065] h-8 min-w-[4rem] justify-center gap-1 border-0 px-2 py-0 text-muted-foreground shadow-[inset_0_0_0_1px_rgba(255,255,255,0.06)] [&>svg:last-child]:hidden",
+            "aria-label": `Interface size: ${currentLabel}`,
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(ALargeSmall, { className: "size-3.5" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-[10px] font-semibold tabular-nums", children: resolvedLabel })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectContent, { align: "end", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItem, { value: "auto", children: "Auto" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItem, { value: "100", children: "100%" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItem, { value: "125", children: "125%" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItem, { value: "150", children: "150%" })
+        ] })
+      ]
+    }
+  );
+}
 function BrandHeader({
   compact,
   crabEntrancePhase,
   currentSessionId,
-  logCount
+  logCount,
+  uiScalePreference,
+  resolvedUiScale,
+  onUiScaleChange
 }) {
   if (compact) {
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "bg-white/[0.035] shadow-[inset_0_1px_0_rgba(255,255,255,0.045),0_16px_44px_rgba(0,0,0,0.18)] rounded-[8px] p-3", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-wrap items-start justify-between gap-3", children: [
@@ -14283,6 +15040,15 @@ function BrandHeader({
         ] })
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(ThemeModeToggle, {}),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          UiScaleControl,
+          {
+            preference: uiScalePreference,
+            resolvedScale: resolvedUiScale,
+            onChange: onUiScaleChange
+          }
+        ),
         /* @__PURE__ */ jsxRuntimeExports.jsx(AlertsDialog, {}),
         /* @__PURE__ */ jsxRuntimeExports.jsx(GroupsDialog, {}),
         /* @__PURE__ */ jsxRuntimeExports.jsx(AgentLabDialog, { currentSessionId, logCount }),
@@ -14308,6 +15074,15 @@ function BrandHeader({
       /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "max-w-full text-sm font-semibold text-muted-foreground", children: "Local First. Evidence First." })
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-1 justify-end gap-1", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(ThemeModeToggle, {}),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        UiScaleControl,
+        {
+          preference: uiScalePreference,
+          resolvedScale: resolvedUiScale,
+          onChange: onUiScaleChange
+        }
+      ),
       /* @__PURE__ */ jsxRuntimeExports.jsx(AlertsDialog, {}),
       /* @__PURE__ */ jsxRuntimeExports.jsx(GroupsDialog, {}),
       /* @__PURE__ */ jsxRuntimeExports.jsx(AgentLabDialog, { currentSessionId, logCount }),
@@ -14315,256 +15090,12 @@ function BrandHeader({
     ] })
   ] });
 }
-const FLOATING_LOGO_SIZE = 56;
-const FLOATING_LOGO_MARGIN = 14;
-const FLOATING_LOGO_MIN_DRIFT_MS = 5200;
-const FLOATING_LOGO_DRIFT_WINDOW_MS = 2400;
-const FLOATING_LOGO_MIN_STEP = 72;
-const FLOATING_LOGO_MAX_STEP = 156;
 const DETAILS_PANEL_COLLAPSED_STORAGE_KEY = "agent-inspector.detailsPanelCollapsed";
 function readStoredDetailsPanelCollapsed() {
   if (typeof window === "undefined") return true;
   const stored = window.localStorage.getItem(DETAILS_PANEL_COLLAPSED_STORAGE_KEY);
   return stored === null || stored === "1";
 }
-function clampFloatingLogoPosition(position) {
-  const maxX = Math.max(
-    FLOATING_LOGO_MARGIN,
-    window.innerWidth - FLOATING_LOGO_SIZE - FLOATING_LOGO_MARGIN
-  );
-  const maxY = Math.max(
-    FLOATING_LOGO_MARGIN,
-    window.innerHeight - FLOATING_LOGO_SIZE - FLOATING_LOGO_MARGIN
-  );
-  return {
-    x: Math.min(Math.max(position.x, FLOATING_LOGO_MARGIN), maxX),
-    y: Math.min(Math.max(position.y, FLOATING_LOGO_MARGIN), maxY)
-  };
-}
-function snapFloatingLogoToEdge(position) {
-  const clamped = clampFloatingLogoPosition(position);
-  const maxX = Math.max(
-    FLOATING_LOGO_MARGIN,
-    window.innerWidth - FLOATING_LOGO_SIZE - FLOATING_LOGO_MARGIN
-  );
-  const maxY = Math.max(
-    FLOATING_LOGO_MARGIN,
-    window.innerHeight - FLOATING_LOGO_SIZE - FLOATING_LOGO_MARGIN
-  );
-  const leftDistance = clamped.x - FLOATING_LOGO_MARGIN;
-  const rightDistance = maxX - clamped.x;
-  const topDistance = clamped.y - FLOATING_LOGO_MARGIN;
-  const bottomDistance = maxY - clamped.y;
-  const nearestDistance = Math.min(leftDistance, rightDistance, topDistance, bottomDistance);
-  if (nearestDistance === leftDistance) return { x: FLOATING_LOGO_MARGIN, y: clamped.y };
-  if (nearestDistance === rightDistance) return { x: maxX, y: clamped.y };
-  if (nearestDistance === topDistance) return { x: clamped.x, y: FLOATING_LOGO_MARGIN };
-  return { x: clamped.x, y: maxY };
-}
-function randomFloatingLogoEdgePosition() {
-  const maxX = Math.max(
-    FLOATING_LOGO_MARGIN,
-    window.innerWidth - FLOATING_LOGO_SIZE - FLOATING_LOGO_MARGIN
-  );
-  const maxY = Math.max(
-    FLOATING_LOGO_MARGIN,
-    window.innerHeight - FLOATING_LOGO_SIZE - FLOATING_LOGO_MARGIN
-  );
-  const randomX = FLOATING_LOGO_MARGIN + Math.random() * (maxX - FLOATING_LOGO_MARGIN);
-  const randomY = FLOATING_LOGO_MARGIN + Math.random() * (maxY - FLOATING_LOGO_MARGIN);
-  const edgeIndex = Math.floor(Math.random() * 4);
-  switch (edgeIndex) {
-    case 0:
-      return { x: FLOATING_LOGO_MARGIN, y: randomY };
-    case 1:
-      return { x: maxX, y: randomY };
-    case 2:
-      return { x: randomX, y: FLOATING_LOGO_MARGIN };
-    case 3:
-      return { x: randomX, y: maxY };
-    default:
-      return { x: maxX, y: FLOATING_LOGO_MARGIN };
-  }
-}
-function nearestFloatingLogoEdge(position) {
-  const clamped = clampFloatingLogoPosition(position);
-  const maxX = Math.max(
-    FLOATING_LOGO_MARGIN,
-    window.innerWidth - FLOATING_LOGO_SIZE - FLOATING_LOGO_MARGIN
-  );
-  const maxY = Math.max(
-    FLOATING_LOGO_MARGIN,
-    window.innerHeight - FLOATING_LOGO_SIZE - FLOATING_LOGO_MARGIN
-  );
-  const distances = [
-    { edge: "left", distance: clamped.x - FLOATING_LOGO_MARGIN },
-    { edge: "right", distance: maxX - clamped.x },
-    { edge: "top", distance: clamped.y - FLOATING_LOGO_MARGIN },
-    { edge: "bottom", distance: maxY - clamped.y }
-  ];
-  return distances.reduce((best, current) => current.distance < best.distance ? current : best).edge;
-}
-function nextFloatingLogoWalkingPosition(position) {
-  const clamped = snapFloatingLogoToEdge(position);
-  const maxX = Math.max(
-    FLOATING_LOGO_MARGIN,
-    window.innerWidth - FLOATING_LOGO_SIZE - FLOATING_LOGO_MARGIN
-  );
-  const maxY = Math.max(
-    FLOATING_LOGO_MARGIN,
-    window.innerHeight - FLOATING_LOGO_SIZE - FLOATING_LOGO_MARGIN
-  );
-  const step = FLOATING_LOGO_MIN_STEP + Math.random() * (FLOATING_LOGO_MAX_STEP - FLOATING_LOGO_MIN_STEP);
-  const direction = Math.random() > 0.5 ? 1 : -1;
-  const edge = nearestFloatingLogoEdge(clamped);
-  switch (edge) {
-    case "left": {
-      const nextY = clamped.y + step * direction;
-      if (nextY <= FLOATING_LOGO_MARGIN)
-        return { x: FLOATING_LOGO_MARGIN, y: FLOATING_LOGO_MARGIN };
-      if (nextY >= maxY) return { x: FLOATING_LOGO_MARGIN, y: maxY };
-      return { x: FLOATING_LOGO_MARGIN, y: nextY };
-    }
-    case "right": {
-      const nextY = clamped.y + step * direction;
-      if (nextY <= FLOATING_LOGO_MARGIN) return { x: maxX, y: FLOATING_LOGO_MARGIN };
-      if (nextY >= maxY) return { x: maxX, y: maxY };
-      return { x: maxX, y: nextY };
-    }
-    case "top": {
-      const nextX = clamped.x + step * direction;
-      if (nextX <= FLOATING_LOGO_MARGIN)
-        return { x: FLOATING_LOGO_MARGIN, y: FLOATING_LOGO_MARGIN };
-      if (nextX >= maxX) return { x: maxX, y: FLOATING_LOGO_MARGIN };
-      return { x: nextX, y: FLOATING_LOGO_MARGIN };
-    }
-    case "bottom": {
-      const nextX = clamped.x + step * direction;
-      if (nextX <= FLOATING_LOGO_MARGIN) return { x: FLOATING_LOGO_MARGIN, y: maxY };
-      if (nextX >= maxX) return { x: maxX, y: maxY };
-      return { x: nextX, y: maxY };
-    }
-  }
-}
-function FloatingInspectorLogo() {
-  const [position, setPosition] = reactExports.useState({
-    x: FLOATING_LOGO_MARGIN,
-    y: FLOATING_LOGO_MARGIN
-  });
-  const [motionTick, setMotionTick] = reactExports.useState(0);
-  const [dragging, setDragging] = reactExports.useState(false);
-  const dragStateRef = reactExports.useRef(null);
-  reactExports.useEffect(() => {
-    setPosition(randomFloatingLogoEdgePosition());
-  }, []);
-  reactExports.useEffect(() => {
-    if (dragging) return void 0;
-    let timeoutId = null;
-    const scheduleDrift = () => {
-      const delay = FLOATING_LOGO_MIN_DRIFT_MS + Math.random() * FLOATING_LOGO_DRIFT_WINDOW_MS;
-      timeoutId = window.setTimeout(() => {
-        setMotionTick((current) => current + 1);
-        setPosition((current) => nextFloatingLogoWalkingPosition(current));
-        scheduleDrift();
-      }, delay);
-    };
-    scheduleDrift();
-    return () => {
-      if (timeoutId !== null) {
-        window.clearTimeout(timeoutId);
-      }
-    };
-  }, [dragging]);
-  reactExports.useEffect(() => {
-    const handleResize = () => {
-      setPosition((current) => snapFloatingLogoToEdge(current));
-    };
-    window.addEventListener("resize", handleResize);
-    return () => window.removeEventListener("resize", handleResize);
-  }, []);
-  const handlePointerDown = reactExports.useCallback((event) => {
-    const rect = event.currentTarget.getBoundingClientRect();
-    dragStateRef.current = {
-      pointerId: event.pointerId,
-      offsetX: event.clientX - rect.left,
-      offsetY: event.clientY - rect.top
-    };
-    event.currentTarget.setPointerCapture(event.pointerId);
-    setDragging(true);
-  }, []);
-  const handlePointerMove = reactExports.useCallback((event) => {
-    const dragState = dragStateRef.current;
-    if (dragState === null || dragState.pointerId !== event.pointerId) return;
-    setPosition(
-      clampFloatingLogoPosition({
-        x: event.clientX - dragState.offsetX,
-        y: event.clientY - dragState.offsetY
-      })
-    );
-  }, []);
-  const handlePointerUp = reactExports.useCallback((event) => {
-    const dragState = dragStateRef.current;
-    if (dragState === null || dragState.pointerId !== event.pointerId) return;
-    if (event.currentTarget.hasPointerCapture(event.pointerId)) {
-      event.currentTarget.releasePointerCapture(event.pointerId);
-    }
-    dragStateRef.current = null;
-    setDragging(false);
-    setPosition((current) => snapFloatingLogoToEdge(current));
-  }, []);
-  const style = reactExports.useMemo(
-    () => ({
-      transform: `translate3d(${position.x}px, ${position.y}px, 0) rotate(${motionTick % 2 === 0 ? "-4deg" : "5deg"}) scale(${dragging ? "1.08" : "1"})`,
-      transition: dragging ? "none" : "transform 4800ms cubic-bezier(0.33, 1, 0.68, 1)",
-      touchAction: "none"
-    }),
-    [dragging, motionTick, position.x, position.y]
-  );
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    "button",
-    {
-      type: "button",
-      className: cn(
-        "fixed left-0 top-0 z-40 flex size-14 items-center justify-center rounded-full bg-transparent text-foreground outline-none transition-[filter,opacity] duration-200 hover:opacity-95 hover:drop-shadow-[0_0_24px_rgba(245,158,11,0.36)] focus-visible:ring-1 focus-visible:ring-amber-300/55",
-        dragging ? "cursor-grabbing" : "cursor-grab"
-      ),
-      style,
-      onPointerDown: handlePointerDown,
-      onPointerMove: handlePointerMove,
-      onPointerUp: handlePointerUp,
-      onPointerCancel: handlePointerUp,
-      "aria-label": "Floating Inspector logo",
-      title: "Drag Inspector logo",
-      children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        "span",
-        {
-          className: cn(
-            "relative flex size-12 items-center justify-center",
-            !dragging && "floating-crab-body"
-          ),
-          "aria-hidden": "true",
-          children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx(CrabLogo, { className: "relative z-10 size-11 text-amber-500 drop-shadow-[0_0_15px_rgba(245,158,11,0.30)]" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "pointer-events-none absolute inset-x-0 bottom-0 z-0 flex items-end justify-center gap-1 text-amber-400/80", children: [0, 1, 2, 3, 4, 5].map((leg) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-              "span",
-              {
-                className: cn(
-                  "floating-crab-leg h-2 w-0.5 rounded-full bg-current shadow-[0_0_7px_rgba(245,158,11,0.24)]",
-                  leg < 3 ? "floating-crab-leg-left" : "floating-crab-leg-right",
-                  dragging && "animate-none"
-                ),
-                style: {
-                  animationDelay: `${leg % 2 === 0 ? 0 : 180}ms`
-                }
-              },
-              leg
-            )) })
-          ]
-        }
-      )
-    }
-  );
-}
 function SessionContextLogButton({ label, logId }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(
     "button",
@@ -14881,6 +15412,7 @@ function ProxyViewer({
 }) {
   const { totalIn, totalOut } = reactExports.useMemo(() => computeTokenSummary(logs), [logs]);
   const { providers } = useProviders();
+  const { uiScalePreference, resolvedUiScale, setUiScalePreference } = useUiScale();
   const [exporting, setExporting] = reactExports.useState(null);
   const [exportError, setExportError] = reactExports.useState(null);
   const [importing, setImporting] = reactExports.useState(false);
@@ -15122,7 +15654,7 @@ function ProxyViewer({
         onClick: toggleDetailsPanelCollapsed,
         className: cn(
           "group fixed top-1/2 right-3 z-40 inline-flex h-14 w-7 -translate-y-1/2 items-center justify-center rounded-l-md border border-white/[0.08] bg-background/90 text-muted-foreground shadow-[0_12px_34px_rgba(0,0,0,0.26),inset_0_1px_0_rgba(255,255,255,0.06)] backdrop-blur transition-[right,background-color,color,border-color] duration-200 hover:border-white/[0.16] hover:bg-white/[0.07] hover:text-foreground focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-none",
-          detailsPanelCollapsed ? "right-3" : "lg:right-[326px] xl:right-[346px]"
+          detailsPanelCollapsed ? "right-3" : "lg:right-[calc(21.25rem-0.875rem)] xl:right-[calc(22.5rem-0.875rem)]"
         ),
         "aria-label": detailsPanelCollapsed ? "Show details panel" : "Hide details panel",
         title: detailsPanelCollapsed ? "Show details panel" : "Hide details panel",
@@ -15132,13 +15664,13 @@ function ProxyViewer({
         ]
       }
     ),
-    detailsPanelCollapsed && /* @__PURE__ */ jsxRuntimeExports.jsx(FloatingInspectorLogo, {}),
+    detailsPanelCollapsed && /* @__PURE__ */ jsxRuntimeExports.jsx(InspectorPet, { logs }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "div",
       {
         className: cn(
           "grid w-full min-w-0 grid-cols-1 lg:min-h-0 lg:flex-1 lg:overflow-hidden",
-          detailsPanelCollapsed ? "lg:grid-cols-[minmax(0,1fr)]" : "lg:grid-cols-[minmax(0,1fr)_340px] xl:grid-cols-[minmax(0,1fr)_360px]"
+          detailsPanelCollapsed ? "lg:grid-cols-[minmax(0,1fr)]" : "lg:grid-cols-[minmax(0,1fr)_21.25rem] xl:grid-cols-[minmax(0,1fr)_22.5rem]"
         ),
         children: [
           !detailsPanelCollapsed && /* @__PURE__ */ jsxRuntimeExports.jsx("aside", { className: "bg-background/95 order-1 border-b border-white/[0.045] lg:order-2 lg:h-full lg:overflow-y-auto lg:border-b-0 lg:border-l lg:border-white/[0.055] inspector-scrollbar", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4 p-4", children: [
@@ -15148,7 +15680,10 @@ function ProxyViewer({
                 compact: true,
                 crabEntrancePhase,
                 currentSessionId: labSessionId,
-                logCount: logs.length
+                logCount: logs.length,
+                uiScalePreference,
+                resolvedUiScale,
+                onUiScaleChange: setUiScalePreference
               }
             ),
             /* @__PURE__ */ jsxRuntimeExports.jsxs(SidebarPanel, { label: "Session", children: [
@@ -15489,6 +16024,32 @@ function ProxyViewer({
     ) })
   ] });
 }
+function filterLogs(logs, selectedSession, selectedModel) {
+  if (selectedSession === "__all__" && selectedModel === "__all__") return logs;
+  return logs.filter((l) => {
+    if (selectedSession !== "__all__" && l.sessionId !== selectedSession) return false;
+    if (selectedModel !== "__all__" && l.model !== selectedModel) return false;
+    return true;
+  });
+}
+function mergeLogsById(previousLogs, incomingLogs) {
+  if (previousLogs.length === 0) return [...incomingLogs];
+  if (incomingLogs.length === 0) return [...previousLogs];
+  const byId = /* @__PURE__ */ new Map();
+  for (const log of previousLogs) byId.set(log.id, log);
+  for (const log of incomingLogs) byId.set(log.id, log);
+  return [...byId.values()].toSorted((left, right) => left.id - right.id);
+}
+function mergeSessionIds(previousSessions, incomingSessions) {
+  const merged = /* @__PURE__ */ new Set();
+  for (const session of previousSessions) {
+    if (session !== "") merged.add(session);
+  }
+  for (const session of incomingSessions) {
+    if (session !== "") merged.add(session);
+  }
+  return [...merged].sort();
+}
 const SSEUpdateSchema = union([
   object({
     type: literal("init"),
@@ -15549,14 +16110,6 @@ function extractModels(logs) {
   }
   return [...set];
 }
-function filterLogs(logs, selectedSession, selectedModel) {
-  if (selectedSession === "__all__" && selectedModel === "__all__") return logs;
-  return logs.filter((l) => {
-    if (selectedSession !== "__all__" && l.sessionId !== selectedSession) return false;
-    if (selectedModel !== "__all__" && l.model !== selectedModel) return false;
-    return true;
-  });
-}
 const DEBOUNCE_MS = 100;
 const HASH_SCROLL_ATTEMPTS = 12;
 const HASH_HIGHLIGHT_MS = 1800;
@@ -15641,27 +16194,6 @@ async function deleteAllGroupsForFullHistoryDelete() {
     return { deleted: 0, ok: false };
   }
 }
-function mergeLogsById(previousLogs, incomingLogs) {
-  if (incomingLogs.length === 0) return [...previousLogs];
-  const byId = /* @__PURE__ */ new Map();
-  for (const log of previousLogs) {
-    byId.set(log.id, log);
-  }
-  for (const log of incomingLogs) {
-    byId.set(log.id, log);
-  }
-  return [...byId.values()].sort((left, right) => left.id - right.id);
-}
-function mergeSessionIds(previousSessions, incomingSessions) {
-  const sessions = /* @__PURE__ */ new Set();
-  for (const session of previousSessions) {
-    if (session !== "") sessions.add(session);
-  }
-  for (const session of incomingSessions) {
-    if (session !== "") sessions.add(session);
-  }
-  return [...sessions].sort();
-}
 function ProxyViewerContainer({
   initialSessionId
 } = {}) {