@tonyclaw/agent-inspector 2.1.13 → 2.1.15

package/.output/server/_ssr/{ProxyViewerContainer-BW2vVCBN.mjs → ProxyViewerContainer-CRBkqFlJ.mjs}

@@ -1,16 +1,15 @@
 import { r as reactExports, j as jsxRuntimeExports, a as React } from "../_libs/react.mjs";
-import { I as InspectorGroupsListResponseSchema, C as CapturedLogSchema, 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, p as packageJson, P as ProviderConfigSchema, g as apiFormatForPath, l as GroupEvidenceExportResultSchema, m as DeleteInspectorGroupResponseSchema, r as createPendingProviderTestResults, t as ProviderTestResultsSchema, u as createFailedProviderTestResults, M as MAX_SLOW_RESPONSE_THRESHOLD_SECONDS, v as MAX_PROVIDER_TEST_TIMEOUT_SECONDS, T as TimeDisplayFormatSchema, h as getSessionPath, f as parseOpenAIResponse, O as OpenAIRequestSchema, A as AnthropicResponseSchema$1, e as AnthropicRequestSchema, s as safeGetOwnProperty, w as resolveProviderContextWindow, j as AlertSummarySchema, k as AlertListResponseSchema, G as GroupEvidenceReadResponseSchema, q as maskApiKey, n as providerHasContextMetadata, o as findProviderModelMetadata, K as KnowledgeCandidateSchema, i as stripClaudeCodeBillingHeader, L as LogBodyChunkSchema, x as isPlainRecord } from "./router-DhL9Wp3N.mjs";
+import { I as InspectorGroupsListResponseSchema, C as CapturedLogSchema, 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, p as packageJson, P as ProviderConfigSchema, i as apiFormatForPath, n as GroupEvidenceExportResultSchema, o as DeleteInspectorGroupResponseSchema, v as createPendingProviderTestResults, w as ProviderTestResultsSchema, x as createFailedProviderTestResults, M as MAX_SLOW_RESPONSE_THRESHOLD_SECONDS, y as MAX_PROVIDER_TEST_TIMEOUT_SECONDS, T as TimeDisplayFormatSchema, j as getSessionPath, l as AlertSummarySchema, m as AlertListResponseSchema, G as GroupEvidenceReadResponseSchema, t as maskApiKey, q as providerHasContextMetadata, r as findProviderModelMetadata, s as safeGetOwnProperty, K as KnowledgeCandidateSchema, f as parseOpenAIResponse, g as parseOpenAIResponsesResponse, O as OpenAIRequestSchema, h as OpenAIResponsesRequestSchema, A as AnthropicResponseSchema$1, e as AnthropicRequestSchema, z as resolveProviderContextWindow, u as buildUpstreamUrl, k as stripClaudeCodeBillingHeader, L as LogBodyChunkSchema, B as isPlainRecord } from "./router-DVeuZFqI.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";
 import { t as twMerge } from "../_libs/tailwind-merge.mjs";
 import { R as Root, T as Trigger$1, C as Content, a as Close, b as Title, D as Description, P as Portal$2, O as Overlay } from "../_libs/radix-ui__react-dialog.mjs";
 import { c as cva } from "../_libs/class-variance-authority.mjs";
-import { d as diffJson, a as diffLines } from "../_libs/diff.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 { R as Root2, T as Trigger, I as Icon, V as Value, P as Portal, C as Content2, a as Viewport, b as Item, c as ItemIndicator, d as ItemText, S as ScrollUpButton, e as ScrollDownButton } from "../_libs/radix-ui__react-select.mjs";
-import { I as Info, C as ChevronDown, a as Check, X, U as Upload, D as Download, F as FileBraces, T as Trash2, P as Plus, A as ArrowLeft, b as ChevronUp, c as Copy, d as ChevronsLeft, e as ChevronLeft, f as ChevronRight, g as ChevronsRight, h as Clapperboard, S as Siren, G as Gauge, L as LoaderCircle, R as RefreshCw, i as Layers, j as Settings, k as Scan, l as CircleAlert, m as Terminal, n as ArrowUpRight, o as ArrowDownRight, p as User, q as Clock, M as MessageSquare, Z as Zap, E as ExternalLink, W as Wrench, r as TriangleAlert, B as Brain, s as Bell, t as Clock3, u as ShieldAlert, v as EyeOff, w as Eye, x as RotateCw, y as Pencil, z as CircleX, H as ShieldCheck, J as Save, K as FileSearch, N as CircleCheck, O as CloudUpload, Q as OctagonAlert, V as Radio, Y as Globe, _ as FileTerminal, $ as ChevronsUp, a0 as ChevronsDown, a1 as FileDiff, a2 as History, a3 as RotateCcw, a4 as Search, a5 as GitCompareArrows, a6 as Minus, a7 as CircleCheckBig, a8 as ArrowUp, a9 as ArrowDown, aa as CircleQuestionMark, ab as Server, ac as Lock, ad as Wifi, ae as WifiOff, af as Ellipsis, ag as CodeXml, ah as Blocks, ai as MousePointerClick, aj as FileText, ak as Rows3, al as Columns2 } from "../_libs/lucide-react.mjs";
-import { M as Markdown } from "../_libs/react-markdown.mjs";
+import { I as Info, C as ChevronDown, a as Check, X, U as Upload, D as Download, F as FileBraces, T as Trash2, P as Plus, A as ArrowLeft, b as ChevronUp, c as Copy, d as ChevronsLeft, e as ChevronLeft, f as ChevronRight, g as ChevronsRight, h as Clapperboard, S as Siren, G as Gauge, L as LoaderCircle, R as RefreshCw, i as Layers, j as Settings, k as Scan, l as CircleAlert, m as Terminal, n as ArrowUpRight, o as ArrowDownRight, p as Clock, M as MessageSquare, Z as Zap, E as ExternalLink, W as Wrench, q as TriangleAlert, B as Brain, r as Bell, s as Clock3, t as ShieldAlert, u as EyeOff, v as Eye, w as RotateCw, x as Pencil, y as CircleX, z as ShieldCheck, H as Save, J as FileSearch, K as CircleCheck, N as CloudUpload, O as Minus, Q as CircleCheckBig, V as CircleQuestionMark, Y as Server, _ as Lock, $ as Wifi, a0 as WifiOff, a1 as OctagonAlert, a2 as Radio, a3 as Globe, a4 as FileTerminal, a5 as ChevronsUp, a6 as ChevronsDown, a7 as FileDiff, a8 as History, a9 as RotateCcw, aa as Search, ab as GitCompareArrows, ac as ArrowUp, ad as ArrowDown, ae as Ellipsis, af as CodeXml, ag as Blocks, ah as MousePointerClick, ai as FileText, aj as Rows3, ak as Columns2 } from "../_libs/lucide-react.mjs";
 import { u as union, d as object, a as array, l as literal, b as string, n as number, c as boolean, _ as _enum } from "../_libs/zod.mjs";
 import { S as Slot } from "../_libs/radix-ui__react-slot.mjs";
 import { R as Root2$1, L as List, T as Trigger$2, C as Content$1 } from "../_libs/radix-ui__react-tabs.mjs";
@@ -772,6 +771,111 @@ function ConfirmDialog({
     ] })
   ] }) });
 }
+const CLIENT_LABELS = {
+  codex: "Codex",
+  opencode: "OpenCode",
+  "mimo-code": "MiMo Code",
+  "claude-code": "Claude Code"
+};
+function normalize(value) {
+  return value?.toLowerCase() ?? "";
+}
+function matchesAny(value, candidates) {
+  for (const candidate of candidates) {
+    if (value.includes(candidate)) return true;
+  }
+  return false;
+}
+function detectClientApp(input) {
+  const haystack = [
+    normalize(input.userAgent),
+    normalize(input.conversationId),
+    normalize(input.clientProjectFolder)
+  ].join(" ");
+  if (matchesAny(haystack, ["mimocode", "mimo-code", "mimo code"])) return "mimo-code";
+  if (matchesAny(haystack, ["opencode", "open-code", "open code"])) return "opencode";
+  if (matchesAny(haystack, ["claude-code", "claude code", "claudecode"])) return "claude-code";
+  if (matchesAny(haystack, ["codex desktop", "codex-cli", "openai-codex", "codex"])) {
+    return "codex";
+  }
+  return "unknown";
+}
+function clientAppLabel(client) {
+  switch (client) {
+    case "codex":
+    case "opencode":
+    case "mimo-code":
+    case "claude-code":
+      return CLIENT_LABELS[client];
+    case "unknown":
+      return null;
+  }
+}
+function CodexMark() {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { viewBox: "0 0 24 24", className: "size-full", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "12", cy: "12", r: "8", fill: "none", stroke: "currentColor", strokeWidth: "2.2" }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "path",
+      {
+        d: "M14.8 8.6a4.8 4.8 0 1 0 0 6.8",
+        fill: "none",
+        stroke: "currentColor",
+        strokeLinecap: "round",
+        strokeWidth: "2.2"
+      }
+    )
+  ] });
+}
+function OpenCodeMark() {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { viewBox: "0 0 24 24", className: "size-full", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M7 4h10v16H7z", fill: "none", stroke: "currentColor", strokeWidth: "2.2" }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M10 8h4M10 12h4M10 16h2", stroke: "currentColor", strokeLinecap: "round" })
+  ] });
+}
+function MiMoCodeMark() {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { viewBox: "0 0 24 24", className: "size-full", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "path",
+    {
+      d: "M5 18V6h3.2l3.8 6.1L15.8 6H19v12h-3V11.3l-3.1 5h-1.8L8 11.3V18z",
+      fill: "currentColor"
+    }
+  ) });
+}
+function ClaudeCodeMark() {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { viewBox: "0 0 24 24", className: "size-full", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "path",
+    {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M21 10.95h3v3.1h-3v3.03h-1.49V20H18v-2.92h-1.49V20H15v-2.92H9V20H7.49v-2.92H6V20H4.49v-2.92H3v-3.03H0v-3.1h3V5h18v5.95zM6 10.95h1.49V8.1H6v2.85zm10.51 0H18V8.1h-1.49v2.85z"
+    }
+  ) });
+}
+function ClientLogo({
+  client,
+  className
+}) {
+  const label = clientAppLabel(client);
+  if (label === null) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "span",
+    {
+      className: cn(
+        "inline-flex size-6 shrink-0 items-center justify-center rounded-md border border-white/10 bg-black/20 p-1 text-cyan-100 shadow-[inset_0_1px_0_rgba(255,255,255,0.05)]",
+        className
+      ),
+      "aria-label": label,
+      title: label,
+      children: [
+        client === "codex" && /* @__PURE__ */ jsxRuntimeExports.jsx(CodexMark, {}),
+        client === "opencode" && /* @__PURE__ */ jsxRuntimeExports.jsx(OpenCodeMark, {}),
+        client === "mimo-code" && /* @__PURE__ */ jsxRuntimeExports.jsx(MiMoCodeMark, {}),
+        client === "claude-code" && /* @__PURE__ */ jsxRuntimeExports.jsx(ClaudeCodeMark, {})
+      ]
+    }
+  );
+}
 const AnthropicLogoSvg = "data:image/svg+xml,%3csvg%20height='2500'%20viewBox='0%206.603%201192.672%201193.397'%20width='2500'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='m233.96%20800.215%20234.684-131.678%203.947-11.436-3.947-6.363h-11.436l-39.221-2.416-134.094-3.624-116.296-4.832-112.67-6.04-28.35-6.04-26.577-35.035%202.738-17.477%2023.84-16.027%2034.147%202.98%2075.463%205.155%20113.235%207.812%2082.147%204.832%20121.692%2012.644h19.329l2.738-7.812-6.604-4.832-5.154-4.832-117.182-79.41-126.845-83.92-66.443-48.321-35.92-24.484-18.12-22.953-7.813-50.093%2032.618-35.92%2043.812%202.98%2011.195%202.98%2044.375%2034.147%2094.792%2073.37%20123.786%2091.167%2018.12%2015.06%207.249-5.154.886-3.624-8.135-13.61-67.329-121.692-71.838-123.785-31.974-51.302-8.456-30.765c-2.98-12.645-5.154-23.275-5.154-36.242l37.127-50.416%2020.537-6.604%2049.53%206.604%2020.86%2018.121%2030.765%2070.39%2049.852%20110.818%2077.315%20150.684%2022.631%2044.698%2012.08%2041.396%204.51%2012.645h7.813v-7.248l6.362-84.886%2011.759-104.215%2011.436-134.094%203.946-37.772%2018.685-45.262%2037.127-24.482%2028.994%2013.852%2023.839%2034.148-3.303%2022.067-14.174%2092.134-27.785%20144.323-18.121%2096.644h10.55l12.08-12.08%2048.887-64.913%2082.147-102.685%2036.242-40.752%2042.282-45.02%2027.14-21.423h51.303l37.772%2056.135-16.913%2057.986-52.832%2067.007-43.812%2056.779-62.82%2084.563-39.22%2067.651%203.623%205.396%209.343-.886%20141.906-30.201%2076.671-13.852%2091.49-15.705%2041.396%2019.329%204.51%2019.65-16.269%2040.189-97.852%2024.16-114.764%2022.954-170.9%2040.43-2.093%201.53%202.416%202.98%2076.993%207.248%2032.94%201.771h80.617l150.12%2011.195%2039.222%2025.933%2023.517%2031.732-3.946%2024.16-60.403%2030.766-81.503-19.33-190.228-45.26-65.235-16.27h-9.02v5.397l54.362%2053.154%2099.624%2089.96%20124.752%20115.973%206.362%2028.671-16.027%2022.63-16.912-2.415-109.611-82.47-42.282-37.127-95.758-80.618h-6.363v8.456l22.067%2032.296%20116.537%20175.167%206.04%2053.719-8.456%2017.476-30.201%2010.55-33.181-6.04-68.215-95.758-70.39-107.84-56.778-96.644-6.926%203.947-33.503%20360.886-15.705%2018.443-36.243%2013.852-30.201-22.953-16.027-37.127%2016.027-73.37%2019.329-95.758%2015.704-76.107%2014.175-94.55%208.456-31.41-.563-2.094-6.927.886-71.275%2097.852-108.402%20146.497-85.772%2091.812-20.537%208.134-35.597-18.443%203.301-32.94%2019.893-29.315%20118.712-151.007%2071.597-93.583%2046.228-54.04-.322-7.813h-2.738l-315.302%20204.725-56.135%207.248-24.16-22.63%202.98-37.128%2011.435-12.08%2094.792-65.236-.322.323z'%20fill='%23d97757'/%3e%3c/svg%3e";
 const OpenAILogoSvg = "data:image/svg+xml,%3csvg%20height='2500'%20viewBox='-1%20-.1%20949.1%20959.8'%20width='2474'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='m925.8%20456.3c10.4%2023.2%2017%2048%2019.7%2073.3%202.6%2025.3%201.3%2050.9-4.1%2075.8-5.3%2024.9-14.5%2048.8-27.3%2070.8-8.4%2014.7-18.3%2028.5-29.7%2041.2-11.3%2012.6-23.9%2024-37.6%2034-13.8%2010-28.5%2018.4-44.1%2025.3-15.5%206.8-31.7%2012-48.3%2015.4-7.8%2024.2-19.4%2047.1-34.4%2067.7-14.9%2020.6-33%2038.7-53.6%2053.6-20.6%2015-43.4%2026.6-67.6%2034.4-24.2%207.9-49.5%2011.8-75%2011.8-16.9.1-33.9-1.7-50.5-5.1-16.5-3.5-32.7-8.8-48.2-15.7s-30.2-15.5-43.9-25.5c-13.6-10-26.2-21.5-37.4-34.2-25%205.4-50.6%206.7-75.9%204.1-25.3-2.7-50.1-9.3-73.4-19.7-23.2-10.3-44.7-24.3-63.6-41.4s-35-37.1-47.7-59.1c-8.5-14.7-15.5-30.2-20.8-46.3s-8.8-32.7-10.6-49.6c-1.8-16.8-1.7-33.8.1-50.7%201.8-16.8%205.5-33.4%2010.8-49.5-17-18.9-31-40.4-41.4-63.6-10.3-23.3-17-48-19.6-73.3-2.7-25.3-1.3-50.9%204-75.8s14.5-48.8%2027.3-70.8c8.4-14.7%2018.3-28.6%2029.6-41.2s24-24%2037.7-34%2028.5-18.5%2044-25.3c15.6-6.9%2031.8-12%2048.4-15.4%207.8-24.3%2019.4-47.1%2034.3-67.7%2015-20.6%2033.1-38.7%2053.7-53.7%2020.6-14.9%2043.4-26.5%2067.6-34.4%2024.2-7.8%2049.5-11.8%2075-11.7%2016.9-.1%2033.9%201.6%2050.5%205.1s32.8%208.7%2048.3%2015.6c15.5%207%2030.2%2015.5%2043.9%2025.5%2013.7%2010.1%2026.3%2021.5%2037.5%2034.2%2024.9-5.3%2050.5-6.6%2075.8-4s50%209.3%2073.3%2019.6c23.2%2010.4%2044.7%2024.3%2063.6%2041.4%2018.9%2017%2035%2036.9%2047.7%2059%208.5%2014.6%2015.5%2030.1%2020.8%2046.3%205.3%2016.1%208.9%2032.7%2010.6%2049.6%201.8%2016.9%201.8%2033.9-.1%2050.8-1.8%2016.9-5.5%2033.5-10.8%2049.6%2017.1%2018.9%2031%2040.3%2041.4%2063.6zm-333.2%20426.9c21.8-9%2041.6-22.3%2058.3-39s30-36.5%2039-58.4c9-21.8%2013.7-45.2%2013.7-68.8v-223q-.1-.3-.2-.7-.1-.3-.3-.6-.2-.3-.5-.5-.3-.3-.6-.4l-80.7-46.6v269.4c0%202.7-.4%205.5-1.1%208.1-.7%202.7-1.7%205.2-3.1%207.6s-3%204.6-5%206.5a32.1%2032.1%200%200%201%20-6.5%205l-191.1%20110.3c-1.6%201-4.3%202.4-5.7%203.2%207.9%206.7%2016.5%2012.6%2025.5%2017.8%209.1%205.2%2018.5%209.6%2028.3%2013.2%209.8%203.5%2019.9%206.2%2030.1%208%2010.3%201.8%2020.7%202.7%2031.1%202.7%2023.6%200%2047-4.7%2068.8-13.8zm-455.1-151.4c11.9%2020.5%2027.6%2038.3%2046.3%2052.7%2018.8%2014.4%2040.1%2024.9%2062.9%2031s46.6%207.7%2070%204.6%2045.9-10.7%2066.4-22.5l193.2-111.5.5-.5q.2-.2.3-.6.2-.3.3-.6v-94l-233.2%20134.9c-2.4%201.4-4.9%202.4-7.5%203.2-2.7.7-5.4%201-8.2%201-2.7%200-5.4-.3-8.1-1-2.6-.8-5.2-1.8-7.6-3.2l-191.1-110.4c-1.7-1-4.2-2.5-5.6-3.4-1.8%2010.3-2.7%2020.7-2.7%2031.1s1%2020.8%202.8%2031.1c1.8%2010.2%204.6%2020.3%208.1%2030.1%203.6%209.8%208%2019.2%2013.2%2028.2zm-50.2-417c-11.8%2020.5-19.4%2043.1-22.5%2066.5s-1.5%2047.1%204.6%2070c6.1%2022.8%2016.6%2044.1%2031%2062.9%2014.4%2018.7%2032.3%2034.4%2052.7%2046.2l193.1%20111.6q.3.1.7.2h.7q.4%200%20.7-.2.3-.1.6-.3l81-46.8-233.2-134.6c-2.3-1.4-4.5-3.1-6.5-5a32.1%2032.1%200%200%201%20-5-6.5c-1.3-2.4-2.4-4.9-3.1-7.6-.7-2.6-1.1-5.3-1-8.1v-227.1c-9.8%203.6-19.3%208-28.3%2013.2-9%205.3-17.5%2011.3-25.5%2018-7.9%206.7-15.3%2014.1-22%2022.1-6.7%207.9-12.6%2016.5-17.8%2025.5zm663.3%20154.4c2.4%201.4%204.6%203%206.6%205%201.9%201.9%203.6%204.1%205%206.5%201.3%202.4%202.4%205%203.1%207.6.6%202.7%201%205.4.9%208.2v227.1c32.1-11.8%2060.1-32.5%2080.8-59.7%2020.8-27.2%2033.3-59.7%2036.2-93.7s-3.9-68.2-19.7-98.5-39.9-55.5-69.5-72.5l-193.1-111.6q-.3-.1-.7-.2h-.7q-.3.1-.7.2-.3.1-.6.3l-80.6%2046.6%20233.2%20134.7zm80.5-121h-.1v.1zm-.1-.1c5.8-33.6%201.9-68.2-11.3-99.7-13.1-31.5-35-58.6-63-78.2-28-19.5-61-30.7-95.1-32.2-34.2-1.4-68%206.9-97.6%2023.9l-193.1%20111.5q-.3.2-.5.5l-.4.6q-.1.3-.2.7-.1.3-.1.7v93.2l233.2-134.7c2.4-1.4%205-2.4%207.6-3.2%202.7-.7%205.4-1%208.1-1%202.8%200%205.5.3%208.2%201%202.6.8%205.1%201.8%207.5%203.2l191.1%20110.4c1.7%201%204.2%202.4%205.6%203.3zm-505.3-103.2c0-2.7.4-5.4%201.1-8.1.7-2.6%201.7-5.2%203.1-7.6%201.4-2.3%203-4.5%205-6.5%201.9-1.9%204.1-3.6%206.5-4.9l191.1-110.3c1.8-1.1%204.3-2.5%205.7-3.2-26.2-21.9-58.2-35.9-92.1-40.2-33.9-4.4-68.3%201-99.2%2015.5-31%2014.5-57.2%2037.6-75.5%2066.4-18.3%2028.9-28%2062.3-28%2096.5v223q.1.4.2.7.1.3.3.6.2.3.5.6.2.2.6.4l80.7%2046.6zm43.8%20294.7%20103.9%2060%20103.9-60v-119.9l-103.8-60-103.9%2060z'/%3e%3c/svg%3e";
 const DeepSeekLogoSvg = "data:image/svg+xml,%3csvg%20fill='none'%20height='1320'%20viewBox='3.771%206.973%2023.993%2017.652'%20width='2500'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='m27.501%208.469c-.252-.123-.36.111-.508.23-.05.04-.093.09-.135.135-.368.395-.797.652-1.358.621-.821-.045-1.521.213-2.14.842-.132-.776-.57-1.238-1.235-1.535-.349-.155-.701-.309-.944-.645-.171-.238-.217-.504-.303-.765-.054-.159-.108-.32-.29-.348-.197-.031-.274.135-.352.273-.31.567-.43%201.192-.419%201.825.028%201.421.628%202.554%201.82%203.36.136.093.17.186.128.321-.081.278-.178.547-.264.824-.054.178-.135.217-.324.14a5.448%205.448%200%200%201%20-1.719-1.169c-.848-.82-1.614-1.726-2.57-2.435-.225-.166-.449-.32-.681-.467-.976-.95.128-1.729.383-1.82.267-.096.093-.428-.77-.424s-1.653.293-2.659.677a2.782%202.782%200%200%201%20-.46.135%209.554%209.554%200%200%200%20-2.853-.1c-1.866.21-3.356%201.092-4.452%202.6-1.315%201.81-1.625%203.87-1.246%206.018.399%202.261%201.552%204.136%203.326%205.601%201.837%201.518%203.955%202.262%206.37%202.12%201.466-.085%203.1-.282%204.942-1.842.465.23.952.322%201.762.392.623.059%201.223-.031%201.687-.127.728-.154.677-.828.414-.953-2.132-.994-1.665-.59-2.09-.916%201.084-1.285%202.717-2.619%203.356-6.94.05-.343.007-.558%200-.837-.004-.168.034-.235.228-.254a4.084%204.084%200%200%200%201.529-.47c1.382-.757%201.938-1.997%202.07-3.485.02-.227-.004-.463-.243-.582zm-12.041%2013.391c-2.067-1.627-3.07-2.162-3.483-2.138-.387.021-.318.465-.233.754.089.285.205.482.368.732.113.166.19.414-.112.598-.666.414-1.823-.139-1.878-.166-1.347-.793-2.473-1.842-3.267-3.276-.765-1.38-1.21-2.861-1.284-4.441-.02-.383.093-.518.472-.586a4.692%204.692%200%200%201%201.514-.04c2.109.31%203.905%201.255%205.41%202.749.86.853%201.51%201.871%202.18%202.865.711%201.057%201.478%202.063%202.454%202.887.343.289.619.51.881.672-.792.088-2.117.107-3.022-.61zm.99-6.38a.304.304%200%201%201%20.609%200c0%20.17-.136.304-.306.304a.3.3%200%200%201%20-.303-.305zm3.077%201.581c-.197.08-.394.15-.584.159a1.246%201.246%200%200%201%20-.79-.252c-.27-.227-.463-.354-.546-.752a1.752%201.752%200%200%201%20.016-.582c.07-.324-.008-.531-.235-.72-.187-.155-.422-.196-.682-.196a.551.551%200%200%201%20-.252-.078c-.108-.055-.197-.19-.112-.356.027-.053.159-.183.19-.207.352-.201.758-.135%201.134.016.349.142.611.404.99.773.388.448.457.573.678.906.174.264.333.534.441.842.066.192-.02.35-.248.448z'%20fill='%234d6bfe'/%3e%3c/svg%3e";
@@ -894,6 +998,38 @@ function TooltipContent({
     }
   ) });
 }
+const MAX_VISIBLE_LOGOS = 3;
+const ROW_CHEVRON_SLOT_CLASS = "flex h-8 w-5 shrink-0 items-center justify-center text-muted-foreground";
+function ProviderLogoStack({
+  items,
+  ariaLabel,
+  className
+}) {
+  if (items.length === 0) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn("flex h-8 w-12 shrink-0 items-center", className), "aria-hidden": "true" });
+  }
+  const visibleItems = items.slice(0, MAX_VISIBLE_LOGOS);
+  const overflowCount = items.length - visibleItems.length;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipProvider, { delayDuration: 150, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn("flex h-8 w-12 shrink-0 items-center", className), "aria-label": ariaLabel, children: [
+    visibleItems.map((item, index) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "span",
+        {
+          className: cn(
+            "inline-flex size-6 shrink-0 items-center justify-center rounded-md border border-white/10 bg-black/20 shadow-[inset_0_1px_0_rgba(255,255,255,0.05)]",
+            index > 0 && "-ml-2"
+          ),
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderLogo, { provider: item.provider, className: "size-4" })
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { children: item.tooltip })
+    ] }, `${item.provider}-${String(index)}`)),
+    overflowCount > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "-ml-2 inline-flex h-6 min-w-6 shrink-0 items-center justify-center rounded-md border border-white/10 bg-black/40 px-1 font-mono text-[10px] text-muted-foreground", children: [
+      "+",
+      overflowCount
+    ] })
+  ] }) });
+}
 function forEachCodePoint(text, visit) {
   for (const ch of Array.from(text)) {
     visit(ch);
@@ -1078,9 +1214,9 @@ function contentToText(content) {
     if (block === null || typeof block !== "object") continue;
     const b = block;
     const type = b.type;
-    if (type === "text" && typeof b.text === "string") {
+    if ((type === "text" || type === "input_text" || type === "output_text") && typeof b.text === "string") {
       parts.push(b.text);
-    } else if (type === "image_url") {
+    } else if (type === "image_url" || type === "input_image") {
       parts.push("[image]");
     }
   }
@@ -1110,15 +1246,54 @@ function toolsToText(tools) {
   const parts = [];
   for (const tool of tools) {
     if (tool === null || typeof tool !== "object") continue;
-    const t = tool;
-    const fn = t.function;
-    if (fn === void 0) continue;
-    if (typeof fn.name === "string") parts.push(fn.name);
-    if (typeof fn.description === "string") parts.push(fn.description);
-    if (fn.parameters !== void 0) parts.push(JSON.stringify(fn.parameters));
+    const fn = safeGetOwnProperty(tool, "function");
+    const name = safeGetOwnProperty(fn, "name") ?? safeGetOwnProperty(tool, "name");
+    const description = safeGetOwnProperty(fn, "description") ?? safeGetOwnProperty(tool, "description");
+    const parameters = safeGetOwnProperty(fn, "parameters") ?? safeGetOwnProperty(tool, "parameters");
+    if (typeof name === "string") parts.push(name);
+    if (typeof description === "string") parts.push(description);
+    if (parameters !== void 0) parts.push(JSON.stringify(parameters));
   }
   return parts.join("\n");
 }
+function countResponsesInput(input) {
+  if (typeof input === "string") return input.length > 0 ? 1 : 0;
+  if (Array.isArray(input)) return input.length;
+  if (input === void 0 || input === null) return null;
+  return 1;
+}
+function responsesInputItemToText(input) {
+  if (typeof input === "string") return input;
+  const directText = safeGetOwnProperty(input, "text");
+  if (typeof directText === "string") return directText;
+  const contentText = contentToText(safeGetOwnProperty(input, "content"));
+  if (contentText.length > 0) return contentText;
+  const outputText = contentToText(safeGetOwnProperty(input, "output"));
+  if (outputText.length > 0) return outputText;
+  const argumentsText = safeGetOwnProperty(input, "arguments");
+  return typeof argumentsText === "string" ? argumentsText : "";
+}
+function responsesInputRole(input) {
+  const role = safeGetOwnProperty(input, "role");
+  if (role === "system" || role === "user" || role === "assistant" || role === "tool") {
+    return role;
+  }
+  const type = safeGetOwnProperty(input, "type");
+  if (type === "function_call_output") return "tool";
+  if (type === "message") return "user";
+  return "user";
+}
+function responsesToolNames(response) {
+  const output = safeGetOwnProperty(response, "output");
+  if (!Array.isArray(output)) return [];
+  const names = [];
+  for (const item of output) {
+    if (safeGetOwnProperty(item, "type") !== "function_call") continue;
+    const name = safeGetOwnProperty(item, "name");
+    if (typeof name === "string" && name.length > 0) names.push(name);
+  }
+  return names;
+}
 function segment(role, label, text, path) {
   return {
     role,
@@ -1135,7 +1310,16 @@ const openAILogFormatAdapter = {
     if (rawBody === null) return emptyRequestAnalysis(rawBody);
     try {
       const result = OpenAIRequestSchema.safeParse(JSON.parse(rawBody));
-      if (!result.success) return emptyRequestAnalysis(rawBody);
+      if (!result.success) {
+        const responsesResult = OpenAIResponsesRequestSchema.safeParse(JSON.parse(rawBody));
+        if (!responsesResult.success) return emptyRequestAnalysis(rawBody);
+        return {
+          parsed: responsesResult.data,
+          comparisonValue: responsesResult.data,
+          messageCount: countResponsesInput(responsesResult.data.input),
+          toolCount: responsesResult.data.tools !== void 0 && responsesResult.data.tools.length > 0 ? responsesResult.data.tools.length : null
+        };
+      }
       return {
         parsed: result.data,
         comparisonValue: result.data,
@@ -1149,7 +1333,15 @@ const openAILogFormatAdapter = {
   analyzeResponse(responseText) {
     if (responseText === null) return EMPTY_RESPONSE_ANALYSIS;
     const parsed = parseOpenAIResponse(responseText);
-    if (parsed === null) return EMPTY_RESPONSE_ANALYSIS;
+    if (parsed === null) {
+      const responsesParsed = parseOpenAIResponsesResponse(responseText);
+      if (responsesParsed === null) return EMPTY_RESPONSE_ANALYSIS;
+      const toolNames2 = responsesToolNames(responsesParsed);
+      return {
+        parsed: responsesParsed,
+        toolNames: toolNames2.length > 0 ? toolNames2 : null
+      };
+    }
     const toolNames = parsed.choices[0]?.message?.tool_calls?.map((toolCall) => toolCall.function?.name ?? "").filter((name) => name !== "") ?? [];
     return {
       parsed,
@@ -1160,6 +1352,9 @@ const openAILogFormatAdapter = {
     if (parsed === null || typeof parsed !== "object") return null;
     const body = parsed;
     const segments = [];
+    if (typeof body.instructions === "string" && body.instructions.length > 0) {
+      segments.push(segment("system", "instructions", body.instructions, "/instructions"));
+    }
     if (Array.isArray(body.messages)) {
       body.messages.forEach((message, index) => {
         if (message === null || typeof message !== "object") return;
@@ -1169,6 +1364,17 @@ const openAILogFormatAdapter = {
         segments.push(segment(role, `[${index}] ${role}`, text, `/messages/${index}`));
       });
     }
+    if (!Array.isArray(body.messages)) {
+      if (typeof body.input === "string" && body.input.length > 0) {
+        segments.push(segment("user", "input", body.input, "/input"));
+      } else if (Array.isArray(body.input)) {
+        body.input.forEach((item, index) => {
+          const role = responsesInputRole(item);
+          const text = responsesInputItemToText(item);
+          segments.push(segment(role, `[${index}] ${role}`, text, `/input/${index}`));
+        });
+      }
+    }
     if (Array.isArray(body.tools) && body.tools.length > 0) {
       const text = toolsToText(body.tools);
       segments.push(segment("tools", "tools", text, "/tools"));
@@ -1230,6 +1436,15 @@ function ConversationHeader({
     },
     [conversationId]
   );
+  const providerLogoItems = providers?.map(({ provider, models }) => ({
+    provider,
+    tooltip: models.length === 1 ? models[0] ?? provider : models.join(", ")
+  })) ?? [];
+  const clientApp = detectClientApp({ userAgent, conversationId, clientProjectFolder });
+  const detectedClientLabel = clientAppLabel(clientApp);
+  const hasUserAgent = userAgent !== null && userAgent !== void 0 && userAgent !== "";
+  const clientDisplayLabel = detectedClientLabel ?? userAgent ?? null;
+  const clientTooltip = detectedClientLabel !== null && hasUserAgent ? `${detectedClientLabel} - ${userAgent}` : null;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(
     "div",
     {
@@ -1253,7 +1468,8 @@ function ConversationHeader({
         }
       },
       children: [
-        expanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-4 text-muted-foreground shrink-0" }) : isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 animate-spin text-muted-foreground shrink-0" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-4 text-muted-foreground shrink-0" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderLogoStack, { items: providerLogoItems, ariaLabel: "Models used in this session" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: ROW_CHEVRON_SLOT_CLASS, children: expanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-4 shrink-0" }) : isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 shrink-0 animate-spin" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-4 shrink-0" }) }),
         conversationId.startsWith("PID:") || conversationId.includes("|") ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
           clientPid !== null && clientPid !== void 0 ? /* @__PURE__ */ jsxRuntimeExports.jsxs(
             "span",
@@ -1295,28 +1511,17 @@ function ConversationHeader({
             }
           )
         ] }),
-        userAgent !== null && userAgent !== void 0 && userAgent !== "" && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        clientDisplayLabel !== null && clientDisplayLabel !== "" && /* @__PURE__ */ jsxRuntimeExports.jsxs(
           "span",
           {
             className: "flex items-center gap-1 text-muted-foreground text-xs shrink-0",
-            title: userAgent,
+            title: clientTooltip ?? clientDisplayLabel,
             children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(User, { className: "size-3" }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums truncate max-w-[120px]", children: userAgent })
+              /* @__PURE__ */ jsxRuntimeExports.jsx(ClientLogo, { client: clientApp, className: "size-5" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums truncate max-w-[120px]", children: clientDisplayLabel })
             ]
           }
         ),
-        providers !== void 0 && providers.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipProvider, { delayDuration: 150, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "span",
-          {
-            className: "flex items-center gap-0.5 shrink-0",
-            "aria-label": "Models used in this session",
-            children: providers.map(({ provider, models }) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "shrink-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderLogo, { provider, className: "size-4" }) }) }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { children: models.length === 1 ? models[0] : models.join(", ") })
-            ] }, provider))
-          }
-        ) }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center gap-1 text-muted-foreground text-xs shrink-0", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { className: "size-3" }),
           /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums", children: formatTimestampRange(startTime, endTime, timeDisplayFormat) })
@@ -1418,9 +1623,65 @@ function groupLogsByConversation(logs) {
   result.sort((a, b) => (a.logs[0]?.timestamp ?? "").localeCompare(b.logs[0]?.timestamp ?? ""));
   return result;
 }
+const LOG_FOCUS_REQUEST_EVENT = "agent-inspector:focus-log";
+function dispatchLogFocusRequest(request) {
+  window.dispatchEvent(new CustomEvent(LOG_FOCUS_REQUEST_EVENT, { detail: request }));
+}
+function readLogFocusRequest(event) {
+  if (typeof CustomEvent === "undefined" || !(event instanceof CustomEvent)) return null;
+  const detail = event.detail;
+  const logId = safeGetOwnProperty(detail, "logId");
+  if (typeof logId !== "number" || !Number.isInteger(logId) || logId < 0) return null;
+  const tab = safeGetOwnProperty(detail, "tab");
+  switch (tab) {
+    case "anatomy":
+    case "request":
+      break;
+    case void 0:
+      break;
+    default:
+      return null;
+  }
+  const source = safeGetOwnProperty(detail, "source");
+  switch (source) {
+    case "virtualizer":
+      return { logId, tab: tab ?? "request", source };
+    case void 0:
+      return { logId, tab: tab ?? "request" };
+    default:
+      return null;
+  }
+}
 function isRecord(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
 }
+function normalizeAnthropicStopReason(value) {
+  switch (value) {
+    case "end_turn":
+    case "tool_use":
+      return value;
+    default:
+      return null;
+  }
+}
+function normalizeOpenAIFinishReason(value) {
+  switch (value) {
+    case "stop":
+    case "length":
+      return value;
+    default:
+      return null;
+  }
+}
+function isResponsesLengthLimitReason(value) {
+  switch (value) {
+    case "max_output_tokens":
+    case "max_tokens":
+      return true;
+    default:
+      return false;
+  }
+}
 function extractStopReason(log) {
   if (log.responseText === null) return null;
   try {
@@ -1430,13 +1691,30 @@ function extractStopReason(log) {
     }
     if (!isRecord(json)) return null;
     if (typeof json.stop_reason === "string") {
-      if (json.stop_reason === "end_turn" || json.stop_reason === "tool_use") {
-        return json.stop_reason;
+      return normalizeAnthropicStopReason(json.stop_reason);
+    }
+    if (Array.isArray(json.choices)) {
+      for (const choice of json.choices) {
+        if (!isRecord(choice) || typeof choice.finish_reason !== "string") continue;
+        const reason = normalizeOpenAIFinishReason(choice.finish_reason);
+        if (reason !== null) return reason;
+      }
+    }
+    if (Array.isArray(json.output)) {
+      for (const item of json.output) {
+        if (isRecord(item) && item.type === "function_call") {
+          return "tool_use";
+        }
+      }
+      if (json.status === "completed") {
+        return "stop";
       }
-      return null;
     }
-    if (Array.isArray(json.choices) && json.choices.length > 0 && isRecord(json.choices[0]) && typeof json.choices[0].finish_reason === "string" && json.choices[0].finish_reason === "stop") {
-      return "stop";
+    if (json.status === "incomplete" && isRecord(json.incomplete_details)) {
+      const reason = json.incomplete_details.reason;
+      if (typeof reason === "string" && isResponsesLengthLimitReason(reason)) {
+        return "length";
+      }
     }
     return null;
   } catch {
@@ -1444,7 +1722,7 @@ function extractStopReason(log) {
   }
 }
 function isTurnBoundary(stopReason) {
-  return stopReason === "end_turn" || stopReason === "stop";
+  return stopReason === "end_turn" || stopReason === "stop" || stopReason === "length";
 }
 function SvgShell({
   className,
@@ -1798,8 +2076,38 @@ function getInteriorCrabVariantIndex(seed) {
 function getInteriorCrabVariant(seed) {
   return getCrabVariant(getInteriorCrabVariantIndex(seed));
 }
-function getJsonExpansionPolicy(_value) {
-  return { depth: Number.POSITIVE_INFINITY };
+const FULL_EXPAND_NODE_LIMIT = 400;
+const STRUCTURE_EXPAND_NODE_LIMIT = 2e3;
+function isJsonArray(value) {
+  return Array.isArray(value);
+}
+function countJsonNodesUpTo(value, limit) {
+  const stack = [value];
+  let count = 0;
+  while (stack.length > 0) {
+    const current = stack.pop();
+    if (current === void 0) continue;
+    count += 1;
+    if (count > limit) return count;
+    if (current === null || typeof current !== "object") continue;
+    if (isJsonArray(current)) {
+      for (const child of current) {
+        stack.push(child);
+      }
+      continue;
+    }
+    for (const key of Object.keys(current)) {
+      const child = current[key];
+      if (child !== void 0) stack.push(child);
+    }
+  }
+  return count;
+}
+function getJsonExpansionPolicy(value) {
+  const nodeCount = countJsonNodesUpTo(value, STRUCTURE_EXPAND_NODE_LIMIT + 1);
+  if (nodeCount <= FULL_EXPAND_NODE_LIMIT) return { depth: Number.POSITIVE_INFINITY };
+  if (nodeCount <= STRUCTURE_EXPAND_NODE_LIMIT) return { depth: 3 };
+  return { depth: 2 };
 }
 function parseJsonText(text) {
   try {
@@ -1813,7 +2121,7 @@ function useJsonBulkExpansion(text) {
   const parsed = reactExports.useMemo(() => text === null ? null : parseJsonText(text), [text]);
   const parsedData = parsed?.kind === "json" ? parsed.data : null;
   const policy = reactExports.useMemo(
-    () => parsedData === null ? null : getJsonExpansionPolicy(),
+    () => parsedData === null ? null : getJsonExpansionPolicy(parsedData),
     [parsedData]
   );
   const [isExpanded, setIsExpanded] = reactExports.useState(false);
@@ -1961,27 +2269,27 @@ function useCopyFeedback(text) {
   return { copied, copy };
 }
 const LazyCompareDrawer = reactExports.lazy(
-  () => import("./CompareDrawer-CMoCAoeq.mjs").then((m) => ({ default: m.CompareDrawer }))
+  () => import("./CompareDrawer-BoxztaO7.mjs").then((m) => ({ default: m.CompareDrawer }))
 );
 const LazyReplayDialog = reactExports.lazy(
-  () => import("./ReplayDialog-ChXL1t8H.mjs").then((m) => ({ default: m.ReplayDialog }))
+  () => import("./ReplayDialog-Cc1dyDuK.mjs").then((m) => ({ default: m.ReplayDialog }))
 );
 const LazyRequestAnatomy = reactExports.lazy(
-  () => import("./RequestAnatomy-DtKzIlfU.mjs").then((m) => ({ default: m.RequestAnatomy }))
+  () => import("./RequestAnatomy-CMGSsz5Z.mjs").then((m) => ({ default: m.RequestAnatomy }))
 );
 const LazyResponseView = reactExports.lazy(
-  () => import("./ResponseView-B5I8drzc.mjs").then((m) => ({ default: m.ResponseView }))
+  () => import("./ResponseView-Cp10DM1D.mjs").then((m) => ({ default: m.ResponseView }))
 );
 const LazyStreamingChunkSequence = reactExports.lazy(
-  () => import("./StreamingChunkSequence-DvwjQNcO.mjs").then((m) => ({
+  () => import("./StreamingChunkSequence-B1VGxy3A.mjs").then((m) => ({
     default: m.StreamingChunkSequence
   }))
 );
 const LazyJsonViewer = reactExports.lazy(
-  () => Promise.resolve().then(() => jsonViewer).then((m) => ({ default: m.JsonViewer }))
+  () => import("./json-viewer-zDE2rrmJ.mjs").then((m) => ({ default: m.JsonViewer }))
 );
 const LazyJsonViewerFromString = reactExports.lazy(
-  () => Promise.resolve().then(() => jsonViewer).then((m) => ({ default: m.JsonViewerFromString }))
+  () => import("./json-viewer-zDE2rrmJ.mjs").then((m) => ({ default: m.JsonViewerFromString }))
 );
 const HIGHLIGHT_DURATION_MS = 1200;
 const MAX_HIGHLIGHT_ATTEMPTS = 12;
@@ -2405,12 +2713,35 @@ function Badge({
   );
 }
 const STATUS_BADGE_CLASSES = {
-  success: "bg-emerald-500/15 text-emerald-400 border-emerald-500/25",
-  client_error: "bg-amber-500/15 text-amber-400 border-amber-500/25",
-  server_error: "bg-rose-500/15 text-rose-400 border-rose-500/25",
-  pending: "bg-muted text-muted-foreground border-border"
+  success: "bg-emerald-400/[0.08] text-emerald-200 border-emerald-300/25",
+  client_error: "bg-amber-300/[0.10] text-amber-100 border-amber-300/30",
+  server_error: "bg-rose-400/[0.10] text-rose-100 border-rose-300/30",
+  pending: "bg-cyan-300/[0.08] text-cyan-100 border-cyan-300/25"
+};
+const STATUS_CUE_CLASSES = {
+  success: {
+    frame: "border-emerald-300/20 bg-emerald-300/[0.06] text-emerald-100",
+    dot: "bg-emerald-300 shadow-[0_0_14px_rgba(110,231,183,0.8)]",
+    rail: "bg-emerald-300/45 shadow-[0_0_22px_rgba(110,231,183,0.28)]"
+  },
+  client_error: {
+    frame: "border-amber-300/25 bg-amber-300/[0.08] text-amber-100",
+    dot: "bg-amber-200 shadow-[0_0_14px_rgba(252,211,77,0.8)]",
+    rail: "bg-amber-300/50 shadow-[0_0_22px_rgba(252,211,77,0.28)]"
+  },
+  server_error: {
+    frame: "border-rose-300/25 bg-rose-300/[0.08] text-rose-100",
+    dot: "bg-rose-300 shadow-[0_0_14px_rgba(253,164,175,0.8)]",
+    rail: "bg-rose-300/50 shadow-[0_0_22px_rgba(253,164,175,0.28)]"
+  },
+  pending: {
+    frame: "border-cyan-300/25 bg-cyan-300/[0.08] text-cyan-100",
+    dot: "bg-cyan-200 shadow-[0_0_14px_rgba(103,232,249,0.8)]",
+    rail: "bg-cyan-300/50 shadow-[0_0_22px_rgba(103,232,249,0.28)]"
+  }
 };
 const HEADER_ACTION_BUTTON_CLASS = "size-8 border-white/10 bg-[#0a0d11] text-muted-foreground shadow-none hover:border-cyan-300/30 hover:bg-cyan-400/10 hover:text-cyan-100";
+const TELEMETRY_CHIP_CLASS = "flex h-7 items-center gap-1 rounded-md border border-white/10 bg-black/20 px-2 text-xs shadow-[inset_0_1px_0_rgba(255,255,255,0.04)]";
 function formatElapsed$3(ms) {
   if (ms < 1e3) return `${ms}ms`;
   return `${(ms / 1e3).toFixed(1)}s`;
@@ -2419,6 +2750,18 @@ function formatTokenRate$1(tokensPerSecond) {
   if (tokensPerSecond >= 10) return `${tokensPerSecond.toFixed(0)}/s`;
   return `${tokensPerSecond.toFixed(1)}/s`;
 }
+function statusCueLabel(category, status) {
+  switch (category) {
+    case "success":
+      return status === null ? "OK" : String(status);
+    case "client_error":
+      return status === null ? "WARN" : String(status);
+    case "server_error":
+      return status === null ? "FAIL" : String(status);
+    case "pending":
+      return "ROLL";
+  }
+}
 function CacheTrendIndicator({ trend }) {
   if (trend === null) return null;
   const isUp = trend.direction === "up";
@@ -2434,6 +2777,7 @@ function CacheTrendIndicator({ trend }) {
 }
 const LogEntryHeader = reactExports.memo(function({
   log,
+  displayNumber,
   messageCount = null,
   toolCount = null,
   expanded,
@@ -2456,6 +2800,8 @@ const LogEntryHeader = reactExports.memo(function({
   const hasClientPid = log.clientPid !== null && log.clientPid !== void 0;
   const hasClientProjectFolder = log.clientProjectFolder !== null && log.clientProjectFolder !== void 0 && log.clientProjectFolder !== "";
   const hasClientCwd = log.clientCwd !== null && log.clientCwd !== void 0 && log.clientCwd !== "";
+  const statusCue = STATUS_CUE_CLASSES[statusCategory];
+  const statusLabel2 = statusCueLabel(statusCategory, log.responseStatus);
   return /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
     "div",
     {
@@ -2465,9 +2811,9 @@ const LogEntryHeader = reactExports.memo(function({
       "data-nav-id": `log-${log.id}`,
       "data-nav-action": expanded ? "collapse" : "expand",
       className: cn(
-        "flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1 px-3 py-1.5 cursor-pointer transition-colors",
-        expanded ? "bg-[#0c1015]" : "hover:bg-muted/30",
-        "select-none",
+        "group/header relative isolate flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1 overflow-hidden px-3 py-2 cursor-pointer transition-[background-color,border-color,box-shadow]",
+        expanded ? "bg-[linear-gradient(90deg,#0f1720_0%,#090d12_50%,#07090d_100%)] shadow-[inset_0_1px_0_rgba(255,255,255,0.06)]" : "bg-[#080b10] hover:bg-[#0b1016]",
+        "select-none before:pointer-events-none before:absolute before:inset-x-0 before:top-0 before:h-px before:bg-white/10",
         "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:outline-none"
       ),
       onClick: onToggle,
@@ -2478,25 +2824,48 @@ const LogEntryHeader = reactExports.memo(function({
         }
       },
       children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-blue-400/80 font-mono text-xs font-semibold tabular-nums shrink-0", children: [
-          "#",
-          log.id
-        ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center gap-1 text-muted-foreground text-xs shrink-0", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "span",
+          {
+            className: cn(
+              "absolute left-0 top-2 bottom-2 w-0.5 rounded-r-full transition-colors",
+              statusCue.rail
+            ),
+            "aria-hidden": "true"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: ROW_CHEVRON_SLOT_CLASS, children: expanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-4 shrink-0" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-4 shrink-0" }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "span",
+          {
+            className: cn(
+              "inline-flex h-8 shrink-0 items-center gap-2 rounded-md border px-2 font-mono shadow-[inset_0_1px_0_rgba(255,255,255,0.05)]",
+              statusCue.frame
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn("size-1.5 rounded-full", statusCue.dot), "aria-hidden": "true" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-xs font-semibold tabular-nums", title: `Log ID ${String(log.id)}`, children: [
+                "#",
+                displayNumber
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex h-7 items-center gap-1 rounded-md border border-white/10 bg-black/20 px-2 text-muted-foreground text-xs shrink-0", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { className: "size-3" }),
           /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums", title: log.timestamp, children: formatTimestamp$2(log.timestamp, timeDisplayFormat) })
         ] }),
-        statusCategory !== "success" && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
           Badge,
           {
             variant: "outline",
             className: cn(
-              "text-[10px] px-1.5 py-0 h-5 font-mono tabular-nums gap-1",
+              "h-6 gap-1 rounded-md px-2 py-0 font-mono text-[10px] font-semibold uppercase tabular-nums shadow-[inset_0_1px_0_rgba(255,255,255,0.05)]",
               STATUS_BADGE_CLASSES[statusCategory]
             ),
             children: [
-              statusCategory === "server_error" ? /* @__PURE__ */ jsxRuntimeExports.jsx(OctagonAlert, { className: "size-3", "aria-label": "Server error" }) : statusCategory === "client_error" ? /* @__PURE__ */ jsxRuntimeExports.jsx(TriangleAlert, { className: "size-3", "aria-label": "Client error" }) : statusCategory === "pending" ? /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-3 animate-spin", "aria-label": "Pending" }) : null,
-              log.responseStatus
+              statusCategory === "success" ? /* @__PURE__ */ jsxRuntimeExports.jsx(Check, { className: "size-3", "aria-label": "Success" }) : statusCategory === "server_error" ? /* @__PURE__ */ jsxRuntimeExports.jsx(OctagonAlert, { className: "size-3", "aria-label": "Server error" }) : statusCategory === "client_error" ? /* @__PURE__ */ jsxRuntimeExports.jsx(TriangleAlert, { className: "size-3", "aria-label": "Client error" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-3 animate-spin", "aria-label": "Pending" }),
+              statusLabel2
             ]
           }
         ),
@@ -2505,7 +2874,7 @@ const LogEntryHeader = reactExports.memo(function({
             Badge,
             {
               variant: "outline",
-              className: "text-[10px] px-1.5 py-0 h-5 font-mono tabular-nums gap-1 bg-amber-500/15 text-amber-400 border-amber-500/25",
+              className: "h-6 gap-1 rounded-md border-amber-300/30 bg-amber-300/[0.10] px-2 py-0 font-mono text-[10px] tabular-nums text-amber-100",
               children: [
                 /* @__PURE__ */ jsxRuntimeExports.jsx(TriangleAlert, { className: "size-3", "aria-label": "Tool schema warnings" }),
                 warningCount
@@ -2515,11 +2884,20 @@ const LogEntryHeader = reactExports.memo(function({
           /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { children: warningCount === 1 ? "1 tool schema warning" : `${warningCount} tool schema warnings` })
         ] }),
         log.elapsedMs !== null && (isSlowResponse ? /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center gap-1 text-xs text-amber-400 shrink-0", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { className: "size-3" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums", children: formatElapsed$3(log.elapsedMs) }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx(TriangleAlert, { className: "size-3", "aria-label": "Slow response" })
-          ] }) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "span",
+            {
+              className: cn(
+                TELEMETRY_CHIP_CLASS,
+                "shrink-0 border-amber-300/25 text-amber-200"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { className: "size-3" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums", children: formatElapsed$3(log.elapsedMs) }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx(TriangleAlert, { className: "size-3", "aria-label": "Slow response" })
+              ]
+            }
+          ) }),
           /* @__PURE__ */ jsxRuntimeExports.jsxs(TooltipContent, { children: [
             "Slow response: ",
             formatElapsed$3(log.elapsedMs),
@@ -2527,12 +2905,12 @@ const LogEntryHeader = reactExports.memo(function({
             " ",
             formatElapsed$3(slowResponseThresholdSeconds * 1e3)
           ] })
-        ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center gap-1 text-xs text-muted-foreground shrink-0", children: [
+        ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn(TELEMETRY_CHIP_CLASS, "shrink-0 text-muted-foreground"), children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { className: "size-3" }),
           /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums", children: formatElapsed$3(log.elapsedMs) })
         ] })),
         log.streaming && firstChunkLabel !== null && /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center gap-1 text-xs text-cyan-400 shrink-0", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn(TELEMETRY_CHIP_CLASS, "shrink-0 text-cyan-300"), children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx(Radio, { className: "size-3" }),
             /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-mono tabular-nums", children: [
               "first ",
@@ -2542,13 +2920,13 @@ const LogEntryHeader = reactExports.memo(function({
           /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { children: "Time to first streaming chunk" })
         ] }),
         log.streaming && tokenRateLabel !== null && /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center gap-1 text-xs text-emerald-400 shrink-0", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn(TELEMETRY_CHIP_CLASS, "shrink-0 text-emerald-300"), children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx(Gauge, { className: "size-3" }),
             /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums", children: tokenRateLabel })
           ] }) }),
           /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipContent, { children: "Output token throughput after first chunk" })
         ] }),
-        hasTokens && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex min-w-0 items-center gap-1 text-xs sm:shrink-0", children: [
+        hasTokens && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn(TELEMETRY_CHIP_CLASS, "min-w-0 sm:shrink-0"), children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(Zap, { className: "size-3 text-muted-foreground" }),
           /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex min-w-0 flex-wrap items-center gap-x-1 font-mono tabular-nums", children: [
             /* @__PURE__ */ jsxRuntimeExports.jsxs(
@@ -2580,32 +2958,32 @@ const LogEntryHeader = reactExports.memo(function({
             )
           ] })
         ] }),
-        log.cacheCreationInputTokens !== null && log.cacheCreationInputTokens > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center gap-1 text-xs shrink-0", children: [
+        log.cacheCreationInputTokens !== null && log.cacheCreationInputTokens > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn(TELEMETRY_CHIP_CLASS, "shrink-0"), children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(CacheTrendIndicator, { trend: cacheTrend?.creation ?? null }),
           /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-mono tabular-nums text-emerald-400", children: [
             "KV Cache +",
             formatTokens(log.cacheCreationInputTokens)
           ] })
         ] }),
-        log.cacheReadInputTokens !== null && log.cacheReadInputTokens > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center gap-1 text-xs shrink-0", children: [
+        log.cacheReadInputTokens !== null && log.cacheReadInputTokens > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn(TELEMETRY_CHIP_CLASS, "shrink-0"), children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(CacheTrendIndicator, { trend: cacheTrend?.read ?? null }),
           /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-mono tabular-nums text-purple-400", children: [
             "KV Cache ~",
             formatTokens(log.cacheReadInputTokens)
           ] })
         ] }),
-        messageCount !== null && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center gap-1 text-muted-foreground text-xs shrink-0", children: [
+        messageCount !== null && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn(TELEMETRY_CHIP_CLASS, "shrink-0 text-muted-foreground"), children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(MessageSquare, { className: "size-3" }),
           /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums", children: messageCount })
         ] }),
-        toolCount !== null && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center gap-1 text-muted-foreground text-xs shrink-0", children: [
+        toolCount !== null && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn(TELEMETRY_CHIP_CLASS, "shrink-0 text-muted-foreground"), children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(Wrench, { className: "size-3" }),
           /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums", children: toolCount })
         ] }),
         log.origin !== null && /* @__PURE__ */ jsxRuntimeExports.jsxs(
           "span",
           {
-            className: "hidden xl:flex items-center gap-1 text-muted-foreground text-xs shrink-0",
+            className: cn(TELEMETRY_CHIP_CLASS, "hidden shrink-0 text-muted-foreground xl:flex"),
             title: `Origin: ${log.origin}`,
             children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx(Globe, { className: "size-3" }),
@@ -2614,7 +2992,7 @@ const LogEntryHeader = reactExports.memo(function({
           }
         ),
         (hasClientPid || hasClientProjectFolder) && /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "hidden xl:flex items-center gap-1 text-purple-400/80 text-xs shrink-0", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: cn(TELEMETRY_CHIP_CLASS, "hidden shrink-0 text-purple-300 xl:flex"), children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx(FileTerminal, { className: "size-3" }),
             hasClientProjectFolder ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono tabular-nums", children: log.clientProjectFolder }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-mono tabular-nums", children: [
               "PID ",
@@ -2719,8 +3097,7 @@ const LogEntryHeader = reactExports.memo(function({
               ] })
             ]
           }
-        ),
-        expanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-4 text-muted-foreground shrink-0" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-4 text-muted-foreground shrink-0" })
+        )
       ]
     }
   ) });
@@ -2740,365 +3117,6 @@ function CollapsibleContent({
 }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(CollapsibleContent$1, { "data-slot": "collapsible-content", ...props });
 }
-function classifyValue(value) {
-  if (value === null) return "null";
-  if (Array.isArray(value)) return "array";
-  switch (typeof value) {
-    case "string":
-      return "string";
-    case "number":
-      return "number";
-    case "boolean":
-      return "boolean";
-    case "object":
-      return "object";
-    case "bigint":
-    case "symbol":
-    case "undefined":
-    case "function":
-      return "object";
-  }
-}
-function isExpandable(value) {
-  return value !== null && (Array.isArray(value) || typeof value === "object");
-}
-function getEntries(value) {
-  if (Array.isArray(value)) {
-    return value.map((item, index) => [String(index), item]);
-  }
-  if (typeof value === "object" && value !== null) {
-    return Object.entries(value);
-  }
-  return [];
-}
-const STRING_TRUNCATE_LIMIT = 120;
-function StringValue({ text }) {
-  const [expanded, setExpanded] = reactExports.useState(false);
-  const isLong = text.length > STRING_TRUNCATE_LIMIT;
-  if (!isLong) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-emerald-400 break-all", children: [
-      '"',
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "prose prose-sm dark:prose-invert inline max-w-none [&_p]:inline [&_p]:my-0 [&_code]:text-emerald-300 [&_a]:text-emerald-300", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Markdown, { children: text }) }),
-      '"'
-    ] });
-  }
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-emerald-400 break-all", children: [
-    '"',
-    expanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "span",
-      {
-        className: "cursor-pointer prose prose-sm dark:prose-invert inline max-w-none [&_p]:inline [&_p]:my-0 [&_code]:text-emerald-300 [&_a]:text-emerald-300",
-        onClick: (e) => {
-          e.stopPropagation();
-          setExpanded(false);
-        },
-        onKeyDown: (e) => {
-          if (e.key === "Enter" || e.key === " ") {
-            e.stopPropagation();
-            setExpanded(false);
-          }
-        },
-        role: "button",
-        tabIndex: 0,
-        children: /* @__PURE__ */ jsxRuntimeExports.jsx(Markdown, { children: text })
-      }
-    ) : /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { delayDuration: 300, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        TooltipTrigger,
-        {
-          onClick: (e) => {
-            e.stopPropagation();
-            setExpanded(true);
-          },
-          className: "text-left cursor-pointer",
-          children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: text.slice(0, STRING_TRUNCATE_LIMIT) }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-emerald-400/50", children: "…" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        TooltipContent,
-        {
-          side: "bottom",
-          className: "max-w-md text-xs p-2 break-words whitespace-pre-wrap",
-          children: [
-            text.slice(0, 500),
-            text.length > 500 ? "…" : ""
-          ]
-        }
-      )
-    ] }),
-    '"'
-  ] });
-}
-function PrimitiveValue({ value }) {
-  if (value === null) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-rose-400 italic", children: "null" });
-  }
-  switch (typeof value) {
-    case "string":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(StringValue, { text: value });
-    case "number":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-amber-400", children: value });
-    case "boolean":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-blue-400", children: value ? "true" : "false" });
-    case "object":
-    case "bigint":
-    case "symbol":
-    case "undefined":
-    case "function":
-      return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-muted-foreground", children: JSON.stringify(value) });
-  }
-}
-function CopyValueButton({ value }) {
-  const [copied, setCopied] = reactExports.useState(false);
-  function handleCopy(e) {
-    e.stopPropagation();
-    void copyTextToClipboard(JSON.stringify(value, null, 2)).then((success) => {
-      if (!success) return;
-      setCopied(true);
-      setTimeout(() => {
-        setCopied(false);
-      }, 2e3);
-    });
-  }
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    "button",
-    {
-      type: "button",
-      onClick: handleCopy,
-      className: "inline-flex items-center gap-1 text-[10px] text-muted-foreground hover:text-foreground transition-colors",
-      "aria-label": copied ? "Copied JSON" : "Copy JSON",
-      title: "Copy JSON",
-      children: copied ? /* @__PURE__ */ jsxRuntimeExports.jsx(Check, { className: "size-3 text-green-500" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Copy, { className: "size-3" })
-    }
-  );
-}
-function CopyButton({ value }) {
-  const [copied, setCopied] = reactExports.useState(false);
-  function handleCopy(e) {
-    e.stopPropagation();
-    void copyTextToClipboard(JSON.stringify(value, null, 2)).then((success) => {
-      if (!success) return;
-      setCopied(true);
-      setTimeout(() => {
-        setCopied(false);
-      }, 2e3);
-    });
-  }
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    "button",
-    {
-      type: "button",
-      onClick: handleCopy,
-      className: "opacity-0 group-hover/row:opacity-100 hover:bg-muted p-0.5 rounded transition-opacity shrink-0",
-      "aria-label": copied ? "Copied JSON value" : "Copy JSON value",
-      title: "Copy to clipboard",
-      children: copied ? /* @__PURE__ */ jsxRuntimeExports.jsx(Check, { className: "size-3 text-green-500" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Copy, { className: "size-3 text-muted-foreground" })
-    }
-  );
-}
-function ExpandCollapseButton({
-  onClick
-}) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    "button",
-    {
-      type: "button",
-      onClick,
-      className: "opacity-0 group-hover/row:opacity-100 hover:bg-muted p-0.5 rounded transition-opacity shrink-0",
-      title: "Expand all descendants",
-      children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronsDown, { className: "size-3.5 text-muted-foreground" })
-    }
-  );
-}
-const JsonNode = reactExports.memo(function JsonNode2({
-  name,
-  value,
-  level,
-  defaultExpandDepth,
-  isArrayItem,
-  path,
-  expandTargetPath,
-  anatomyPaths
-}) {
-  const isAncestorOfTarget = reactExports.useMemo(() => {
-    if (expandTargetPath === null) return false;
-    if (path === "") return expandTargetPath.length > 0;
-    return expandTargetPath === path || expandTargetPath.startsWith(`${path}/`);
-  }, [expandTargetPath, path]);
-  const initialExpanded = level < defaultExpandDepth || isAncestorOfTarget && isExpandable(value);
-  const [expanded, setExpanded] = reactExports.useState(initialExpanded);
-  reactExports.useEffect(() => {
-    if (isAncestorOfTarget && isExpandable(value) && !expanded) {
-      setExpanded(true);
-    }
-  }, [expandTargetPath]);
-  const [childResetKey, setChildResetKey] = reactExports.useState(0);
-  const [childDepthOverride, setChildDepthOverride] = reactExports.useState(null);
-  const expandable = isExpandable(value);
-  const fullyExpanded = childDepthOverride === Number.POSITIVE_INFINITY;
-  const entries = reactExports.useMemo(() => getEntries(value), [value]);
-  const hasExpandableChild = reactExports.useMemo(
-    () => entries.some(([, child]) => isExpandable(child)),
-    [entries]
-  );
-  const dataType = classifyValue(value);
-  const openBracket = dataType === "array" ? "[" : "{";
-  const closeBracket = dataType === "array" ? "]" : "}";
-  const hasAnatomyPath = anatomyPaths !== null && anatomyPaths.has(path);
-  function expandAllDeep() {
-    setExpanded(true);
-    setChildDepthOverride(Number.POSITIVE_INFINITY);
-    setChildResetKey((k) => k + 1);
-  }
-  function collapseToDefault() {
-    setExpanded(false);
-    setChildDepthOverride(0);
-    setChildResetKey((k) => k + 1);
-  }
-  function handleRowToggle() {
-    if (fullyExpanded) {
-      collapseToDefault();
-    } else {
-      setExpanded(!expanded);
-    }
-  }
-  function handleExpandAll(e) {
-    e.stopPropagation();
-    expandAllDeep();
-  }
-  const effectiveChildDepth = childDepthOverride ?? defaultExpandDepth;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn(level > 0 && "border-l border-border/50 ml-2"), children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "div",
-      {
-        className: cn(
-          "flex items-start gap-1 py-0.5 px-1 -ml-1 rounded-sm group/row",
-          expandable && "cursor-pointer hover:bg-muted/50"
-        ),
-        "data-anatomy-path": hasAnatomyPath ? path : void 0,
-        onClick: expandable ? handleRowToggle : void 0,
-        onKeyDown: expandable ? (e) => {
-          if (e.key === "Enter" || e.key === " ") {
-            e.preventDefault();
-            handleRowToggle();
-          }
-        } : void 0,
-        onDoubleClick: expandable && hasExpandableChild ? () => expandAllDeep() : void 0,
-        role: expandable ? "button" : void 0,
-        tabIndex: expandable ? 0 : void 0,
-        children: [
-          expandable ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "w-4 h-5 flex items-center justify-center shrink-0", children: expanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-3 text-muted-foreground" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-3 text-muted-foreground" }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "w-4 shrink-0" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn("shrink-0", isArrayItem ? "text-muted-foreground" : "text-cyan-400"), children: isArrayItem ? name : `"${name}"` }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-muted-foreground shrink-0", children: expandable ? "" : ":" }),
-          expandable ? /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-muted-foreground", children: [
-            openBracket,
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-muted-foreground/60 text-xs", children: [
-              " ",
-              entries.length,
-              " ",
-              entries.length === 1 ? "item" : "items",
-              " ",
-              closeBracket
-            ] })
-          ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "min-w-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx(PrimitiveValue, { value }) }),
-          expandable && hasExpandableChild && !fullyExpanded && /* @__PURE__ */ jsxRuntimeExports.jsx(ExpandCollapseButton, { onClick: handleExpandAll }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(CopyButton, { value })
-        ]
-      }
-    ),
-    expandable && expanded && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "pl-4", children: [
-      entries.map(([key, childValue]) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-        JsonNode2,
-        {
-          name: key,
-          value: childValue,
-          level: level + 1,
-          defaultExpandDepth: effectiveChildDepth,
-          isArrayItem: dataType === "array",
-          path: path === "" ? `/${key}` : `${path}/${key}`,
-          expandTargetPath,
-          anatomyPaths
-        },
-        key
-      )),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-muted-foreground py-0.5 px-1", children: closeBracket })
-    ] }, childResetKey)
-  ] });
-});
-function JsonViewer({
-  data,
-  defaultExpandDepth = 0,
-  className,
-  showCopy = false,
-  bulkDepth: controlledBulkDepth,
-  bulkRevision: controlledBulkRevision,
-  anatomyPaths = null,
-  expandToPath = null
-}) {
-  const expandable = isExpandable(data);
-  const entries = reactExports.useMemo(() => getEntries(data), [data]);
-  const bulkDepth = controlledBulkDepth ?? defaultExpandDepth;
-  const bulkRevision = controlledBulkRevision ?? 0;
-  if (!expandable) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn("font-mono text-xs leading-relaxed", className), children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(PrimitiveValue, { value: data }),
-      showCopy && /* @__PURE__ */ jsxRuntimeExports.jsx(CopyValueButton, { value: data })
-    ] }) }) });
-  }
-  const dataType = classifyValue(data);
-  const isArray = dataType === "array";
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("font-mono text-xs leading-relaxed", className), children: [
-    showCopy && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mb-2 flex items-center justify-end gap-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(CopyValueButton, { value: data }) }),
-    entries.length === 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-md border border-white/10 bg-black/20 px-3 py-2 text-muted-foreground", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-cyan-300", children: isArray ? "[]" : "{}" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ml-2 text-[10px] uppercase", children: "0 items" })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: entries.map(([key, childValue]) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-      JsonNode,
-      {
-        name: key,
-        value: childValue,
-        level: 0,
-        defaultExpandDepth: bulkDepth,
-        isArrayItem: isArray,
-        path: `/${key}`,
-        expandTargetPath: expandToPath,
-        anatomyPaths
-      },
-      key
-    )) }, bulkRevision)
-  ] }) });
-}
-const JsonViewerFromString = reactExports.memo(function JsonViewerFromString2({
-  text,
-  defaultExpandDepth = 0,
-  className,
-  bulkDepth,
-  bulkRevision
-}) {
-  const parsed = reactExports.useMemo(() => parseJsonText(text), [text]);
-  if (parsed.kind === "json") {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(
-      JsonViewer,
-      {
-        data: parsed.data,
-        defaultExpandDepth,
-        className,
-        bulkDepth,
-        bulkRevision
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: cn("font-mono text-xs whitespace-pre-wrap break-words", className), children: text });
-});
-const jsonViewer = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-  __proto__: null,
-  JsonViewer,
-  JsonViewerFromString
-}, Symbol.toStringTag, { value: "Module" }));
 function ScrollArea({
   className,
   children,
@@ -3253,10 +3271,16 @@ function ToolRow({ tool, called }) {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(CollapsibleContent, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2 border-t border-white/10 bg-white/[0.02] px-2.5 py-2", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(CollapsibleContent, { children: open && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2 border-t border-white/10 bg-white/[0.02] px-2.5 py-2", children: [
       tool.description !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs leading-relaxed text-muted-foreground", children: tool.description }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(RequiredParameters, { names: tool.requiredParameters }),
-      tool.schema !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { className: "max-h-64 rounded-md border border-white/10 bg-[#06080b] p-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(JsonViewer, { data: safeJsonValue(tool.schema), defaultExpandDepth: 0 }) })
+      tool.schema !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { className: "max-h-64 rounded-md border border-white/10 bg-[#06080b] p-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+        reactExports.Suspense,
+        {
+          fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground", children: "Loading JSON..." }),
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx(LazyJsonViewer, { data: safeJsonValue(tool.schema), defaultExpandDepth: 0 })
+        }
+      ) })
     ] }) })
   ] }) });
 }
@@ -3369,26 +3393,6 @@ const RequestTools = reactExports.memo(function RequestTools2({
     ] })
   ] });
 });
-const LOG_FOCUS_REQUEST_EVENT = "agent-inspector:focus-log";
-function dispatchLogFocusRequest(request) {
-  window.dispatchEvent(new CustomEvent(LOG_FOCUS_REQUEST_EVENT, { detail: request }));
-}
-function readLogFocusRequest(event) {
-  if (typeof CustomEvent === "undefined" || !(event instanceof CustomEvent)) return null;
-  const detail = event.detail;
-  const logId = safeGetOwnProperty(detail, "logId");
-  if (typeof logId !== "number" || !Number.isInteger(logId) || logId < 0) return null;
-  const tab = safeGetOwnProperty(detail, "tab");
-  switch (tab) {
-    case "anatomy":
-    case "request":
-      return { logId, tab };
-    case void 0:
-      return { logId, tab: "request" };
-    default:
-      return null;
-  }
-}
 function shouldShowRawRequestTab(apiFormat, viewMode, strip) {
   return apiFormat === "anthropic" && viewMode === "full" && strip;
 }
@@ -3500,10 +3504,12 @@ function parseAnthropicTool(tool) {
 }
 function parseOpenAITool(tool) {
   const fn = safeGetOwnProperty(tool, "function");
-  const name = safeGetOwnProperty(fn, "name");
+  const toolType = safeGetOwnProperty(tool, "type");
+  if (fn === void 0 && toolType !== "function") return null;
+  const name = safeGetOwnProperty(fn, "name") ?? safeGetOwnProperty(tool, "name");
   if (typeof name !== "string" || name.length === 0) return null;
-  const description = safeGetOwnProperty(fn, "description");
-  const schema = safeGetOwnProperty(fn, "parameters") ?? null;
+  const description = safeGetOwnProperty(fn, "description") ?? safeGetOwnProperty(tool, "description");
+  const schema = safeGetOwnProperty(fn, "parameters") ?? safeGetOwnProperty(tool, "parameters") ?? null;
   const normalizedDescription = typeof description === "string" ? description : null;
   return {
     name,
@@ -3576,7 +3582,7 @@ const FULL_LOG_HYDRATION_TIMEOUT_MS = 15e3;
 const BODY_CHUNK_TIMEOUT_MS = 15e3;
 const BODY_CHUNK_BYTES = 256 * 1024;
 const CHUNKED_BODY_THRESHOLD_BYTES = 1024 * 1024;
-const TAB_TRIGGER_CLASS = "h-9 flex-none rounded-none border-0 border-b-2 border-transparent bg-transparent px-3 text-xs font-semibold text-muted-foreground shadow-none hover:bg-cyan-400/[0.04] hover:text-foreground data-[state=active]:border-cyan-300 data-[state=active]:bg-transparent data-[state=active]:text-cyan-100 data-[state=active]:shadow-none";
+const TAB_TRIGGER_CLASS = "h-9 flex-none rounded-none border-0 border-b-2 border-transparent bg-transparent px-3 text-xs font-semibold text-muted-foreground shadow-none transition-colors hover:bg-cyan-400/[0.05] hover:text-foreground data-[state=active]:border-cyan-300 data-[state=active]:bg-cyan-300/[0.04] data-[state=active]:text-cyan-100 data-[state=active]:shadow-none";
 function createEmptyBodyPreviewState(totalBytes = null) {
   return {
     status: "idle",
@@ -3627,7 +3633,7 @@ function ExpandedPanel({
     "div",
     {
       className: cn(
-        "inspector-scrollbar mx-3 mb-3 max-h-[72vh] overflow-auto rounded-md border border-white/10 bg-[#06080b] p-3 shadow-[inset_0_1px_0_rgba(255,255,255,0.04)]",
+        "inspector-scrollbar mx-3 mb-3 max-h-[72vh] overflow-auto rounded-md border border-cyan-300/10 bg-[#05070a] p-3 shadow-[0_16px_45px_rgba(0,0,0,0.24),inset_0_1px_0_rgba(255,255,255,0.05)]",
         className
       ),
       children
@@ -3763,6 +3769,7 @@ const HeadersDiffContent = reactExports.memo(function({
 });
 const LogEntry = reactExports.memo(function({
   log,
+  displayNumber,
   viewMode = "simple",
   strip,
   slowResponseThresholdSeconds,
@@ -3786,6 +3793,7 @@ const LogEntry = reactExports.memo(function({
   );
   const requestJsonRef = reactExports.useRef(null);
   const logIdRef = reactExports.useRef(log.id);
+  const bodyHydrationInFlightRef = reactExports.useRef(false);
   const displayLog = hydratedLog ?? log;
   const useChunkedBody = hydratedLog === null && shouldUseChunkedBodyLoading(log);
   const requestPreviewBody = bodyPreviewTextForView(useChunkedBody, requestPreview);
@@ -3817,10 +3825,10 @@ const LogEntry = reactExports.memo(function({
     requestPreviewShouldParse ? displayedRequestBody : null
   );
   const rawRequestExpansion = useJsonBulkExpansion(
-    requestPreviewShouldParse ? rawRequestBodyForView : null
+    activeTab === "raw-request" && requestPreviewShouldParse ? rawRequestBodyForView : null
   );
   const responseExpansion = useJsonBulkExpansion(
-    responsePreviewShouldParse ? responseTextForView : null
+    activeTab === "raw" && responsePreviewShouldParse ? responseTextForView : null
   );
   const headersText = reactExports.useMemo(
     () => displayLog.headers && Object.keys(displayLog.headers).length > 0 ? JSON.stringify(displayLog.headers, null, 2) : null,
@@ -3993,6 +4001,7 @@ const LogEntry = reactExports.memo(function({
   }, [anatomySegments, expanded]);
   reactExports.useEffect(() => {
     logIdRef.current = log.id;
+    bodyHydrationInFlightRef.current = false;
     setHydratedLog(null);
     setBodyHydrationState("idle");
     setRequestPreview(createEmptyBodyPreviewState(log.rawRequestBodyBytes ?? null));
@@ -4001,8 +4010,9 @@ const LogEntry = reactExports.memo(function({
   reactExports.useEffect(() => {
     if (!expanded) return;
     if (!shouldHydrateLogBody(log)) return;
-    if (hydratedLog !== null || bodyHydrationState !== "idle") return;
+    if (hydratedLog !== null || bodyHydrationInFlightRef.current) return;
     let cancelled = false;
+    bodyHydrationInFlightRef.current = true;
     setBodyHydrationState("loading");
     void fetchJsonWithTimeout(
       `/api/logs/${String(log.id)}`,
@@ -4010,17 +4020,19 @@ const LogEntry = reactExports.memo(function({
       FULL_LOG_HYDRATION_TIMEOUT_MS
     ).then((fullLog) => {
       if (cancelled) return;
+      bodyHydrationInFlightRef.current = false;
       setHydratedLog(fullLog);
       setBodyHydrationState("idle");
     }).catch(() => {
       if (cancelled) return;
+      bodyHydrationInFlightRef.current = false;
       setBodyHydrationState("failed");
     });
     return () => {
       cancelled = true;
+      bodyHydrationInFlightRef.current = false;
     };
   }, [
-    bodyHydrationState,
     expanded,
     hydratedLog,
     log.bodyContentMode,
@@ -4060,14 +4072,32 @@ const LogEntry = reactExports.memo(function({
       "div",
       {
         className: cn(
-          "mb-2 overflow-hidden rounded-md border bg-[#090a0d] transition-[background-color,border-color,box-shadow]",
-          expanded ? "border-cyan-300/20 shadow-[0_18px_60px_rgba(0,0,0,0.28),inset_0_1px_0_rgba(255,255,255,0.05)]" : "border-border/70 hover:border-border"
+          "relative mb-2 overflow-hidden rounded-lg border bg-[#07090d] transition-[background-color,border-color,box-shadow]",
+          expanded ? "border-cyan-300/25 shadow-[0_24px_80px_rgba(0,0,0,0.34),0_0_0_1px_rgba(103,232,249,0.04),inset_0_1px_0_rgba(255,255,255,0.06)]" : "border-white/10 shadow-[0_6px_24px_rgba(0,0,0,0.16)] hover:border-cyan-300/15"
         ),
         children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "div",
+            {
+              className: cn(
+                "pointer-events-none absolute inset-y-3 left-1 w-px rounded-full",
+                expanded ? "bg-cyan-300/45 shadow-[0_0_20px_rgba(103,232,249,0.28)]" : "bg-white/10"
+              ),
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "div",
+            {
+              className: "pointer-events-none absolute inset-x-3 top-0 h-px bg-gradient-to-r from-transparent via-white/15 to-transparent",
+              "aria-hidden": "true"
+            }
+          ),
           /* @__PURE__ */ jsxRuntimeExports.jsx(
             LogEntryHeader,
             {
               log: displayLog,
+              displayNumber,
               messageCount: requestAnalysis.messageCount,
               toolCount: requestAnalysis.toolCount,
               expanded,
@@ -4082,194 +4112,224 @@ const LogEntry = reactExports.memo(function({
               }
             }
           ),
-          expanded && /* @__PURE__ */ jsxRuntimeExports.jsx(
+          expanded && /* @__PURE__ */ jsxRuntimeExports.jsxs(
             "div",
             {
-              className: "border-t border-white/10 bg-[#050607]/80 pt-2",
+              className: "relative border-t border-cyan-300/10 bg-[linear-gradient(180deg,#06090d_0%,#040506_100%)] pt-2",
               onClick: (e) => e.stopPropagation(),
               onKeyDown: (e) => e.stopPropagation(),
-              children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Tabs, { value: activeTab, onValueChange: setActiveTab, className: "gap-2", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsxs(
-                  TabsList,
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  "div",
                   {
-                    variant: "line",
-                    className: "inspector-scrollbar mx-3 h-auto w-[calc(100%-1.5rem)] justify-start overflow-x-auto rounded-none border-b border-white/10 bg-transparent p-0",
-                    children: [
-                      viewMode === "full" && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "raw-headers", children: "Raw Headers" }),
-                      viewMode === "full" && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "headers", children: "Headers" }),
-                      anatomySegments !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "anatomy", children: "Context" }),
-                      shouldShowRawRequestTab(resolvedFormat, viewMode, strip) && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "raw-request", children: "Raw Request" }),
-                      /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "request", children: "Request" }),
-                      viewMode === "full" && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "raw", children: "Raw Response" }),
-                      /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "parsed", children: "Response" })
-                    ]
+                    className: "pointer-events-none absolute inset-x-0 top-0 h-12 bg-gradient-to-b from-cyan-300/[0.035] to-transparent",
+                    "aria-hidden": "true"
                   }
                 ),
-                shouldShowRawRequestTab(resolvedFormat, viewMode, strip) && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "raw-request", children: activeTab === "raw-request" && /* @__PURE__ */ jsxRuntimeExports.jsxs(ExpandedPanel, { children: [
-                  useChunkedBody && /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    BodyPreviewNotice,
-                    {
-                      label: "Request",
-                      state: requestPreview,
-                      expectedBytes: log.rawRequestBodyBytes ?? null,
-                      onLoadMore: () => loadBodyChunk("request", requestPreview.offset)
-                    }
-                  ),
-                  rawRequestBodyForView === null ? /* @__PURE__ */ jsxRuntimeExports.jsx(EmptyState, { children: useChunkedBody ? "Request preview is loading" : "No request body" }) : rawRequestExpansion.parsedData !== null ? /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    LazyJsonViewer,
-                    {
-                      data: rawRequestExpansion.parsedData,
-                      bulkDepth: rawRequestExpansion.bulkDepth,
-                      bulkRevision: rawRequestExpansion.bulkRevision
-                    }
-                  ) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(RawTextBlock, { children: rawRequestBodyForView })
-                ] }) }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "request", children: activeTab === "request" && /* @__PURE__ */ jsxRuntimeExports.jsxs(ExpandedPanel, { children: [
-                  bodyHydrationState === "loading" && /* @__PURE__ */ jsxRuntimeExports.jsx(NoticeBlock, { tone: "loading", children: "Loading full request and response bodies..." }),
-                  bodyHydrationState === "failed" && /* @__PURE__ */ jsxRuntimeExports.jsx(NoticeBlock, { tone: "warning", children: "Full request and response bodies could not be loaded. Compact metadata is still available." }),
-                  useChunkedBody && /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    BodyPreviewNotice,
+                /* @__PURE__ */ jsxRuntimeExports.jsxs(Tabs, { value: activeTab, onValueChange: setActiveTab, className: "gap-2", children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                    TabsList,
                     {
-                      label: "Request",
-                      state: requestPreview,
-                      expectedBytes: log.rawRequestBodyBytes ?? null,
-                      onLoadMore: () => loadBodyChunk("request", requestPreview.offset)
+                      variant: "line",
+                      className: "inspector-scrollbar relative mx-3 h-auto w-[calc(100%-1.5rem)] justify-start overflow-x-auto rounded-none border-b border-cyan-300/10 bg-black/10 p-0",
+                      children: [
+                        viewMode === "full" && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "raw-headers", children: "Raw Headers" }),
+                        viewMode === "full" && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "headers", children: "Headers" }),
+                        anatomySegments !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "anatomy", children: "Context" }),
+                        shouldShowRawRequestTab(resolvedFormat, viewMode, strip) && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "raw-request", children: "Raw Request" }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "request", children: "Request" }),
+                        viewMode === "full" && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "raw", children: "Raw Response" }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTrigger, { className: TAB_TRIGGER_CLASS, value: "parsed", children: "Response" })
+                      ]
                     }
                   ),
-                  warnings.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs(NoticeBlock, { tone: "warning", children: [
-                    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 font-semibold text-amber-300", children: [
-                      /* @__PURE__ */ jsxRuntimeExports.jsx(TriangleAlert, { className: "size-3.5" }),
-                      "Tool schema warnings"
+                  shouldShowRawRequestTab(resolvedFormat, viewMode, strip) && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "raw-request", children: activeTab === "raw-request" && /* @__PURE__ */ jsxRuntimeExports.jsxs(ExpandedPanel, { children: [
+                    useChunkedBody && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      BodyPreviewNotice,
+                      {
+                        label: "Request",
+                        state: requestPreview,
+                        expectedBytes: log.rawRequestBodyBytes ?? null,
+                        onLoadMore: () => loadBodyChunk("request", requestPreview.offset)
+                      }
+                    ),
+                    rawRequestBodyForView === null ? /* @__PURE__ */ jsxRuntimeExports.jsx(EmptyState, { children: useChunkedBody ? "Request preview is loading" : "No request body" }) : rawRequestExpansion.parsedData !== null ? /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      LazyJsonViewer,
+                      {
+                        data: rawRequestExpansion.parsedData,
+                        bulkDepth: rawRequestExpansion.bulkDepth,
+                        bulkRevision: rawRequestExpansion.bulkRevision
+                      }
+                    ) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(RawTextBlock, { children: rawRequestBodyForView })
+                  ] }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "request", children: activeTab === "request" && /* @__PURE__ */ jsxRuntimeExports.jsxs(ExpandedPanel, { children: [
+                    bodyHydrationState === "loading" && /* @__PURE__ */ jsxRuntimeExports.jsx(NoticeBlock, { tone: "loading", children: "Loading full request and response bodies..." }),
+                    bodyHydrationState === "failed" && /* @__PURE__ */ jsxRuntimeExports.jsx(NoticeBlock, { tone: "warning", children: "Full request and response bodies could not be loaded. Compact metadata is still available." }),
+                    useChunkedBody && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      BodyPreviewNotice,
+                      {
+                        label: "Request",
+                        state: requestPreview,
+                        expectedBytes: log.rawRequestBodyBytes ?? null,
+                        onLoadMore: () => loadBodyChunk("request", requestPreview.offset)
+                      }
+                    ),
+                    warnings.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs(NoticeBlock, { tone: "warning", children: [
+                      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 font-semibold text-amber-300", children: [
+                        /* @__PURE__ */ jsxRuntimeExports.jsx(TriangleAlert, { className: "size-3.5" }),
+                        "Tool schema warnings"
+                      ] }),
+                      /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: "mt-2 space-y-1 text-muted-foreground", children: warnings.map((warning) => /* @__PURE__ */ jsxRuntimeExports.jsx("li", { children: warning }, warning)) })
                     ] }),
-                    /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: "mt-2 space-y-1 text-muted-foreground", children: warnings.map((warning) => /* @__PURE__ */ jsxRuntimeExports.jsx("li", { children: warning }, warning)) })
-                  ] }),
-                  /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    RequestTools,
-                    {
-                      summary: requestTools,
-                      calledToolNames: responseAnalysis.toolNames ?? []
-                    }
-                  ),
-                  requestDiff ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    RequestDiffContent,
-                    {
-                      rawBody: displayLog.rawRequestBody,
-                      displayedBody: displayedRequestBody,
-                      emptyLabel: "No transformation applied; raw and sent request bodies are identical."
-                    }
-                  ) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: requestJsonRef, children: displayedRequestBody === null ? /* @__PURE__ */ jsxRuntimeExports.jsx(EmptyState, { children: useChunkedBody ? "Request preview is loading" : "No request body" }) : requestExpansion.parsedData !== null ? /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    LazyJsonViewer,
-                    {
-                      data: requestExpansion.parsedData,
-                      bulkDepth: requestExpansion.bulkDepth,
-                      bulkRevision: requestExpansion.bulkRevision,
-                      anatomyPaths,
-                      expandToPath
-                    }
-                  ) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(RawTextBlock, { children: displayedRequestBody }) })
-                ] }) }),
-                anatomySegments !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "anatomy", children: activeTab === "anatomy" && /* @__PURE__ */ jsxRuntimeExports.jsx(ExpandedPanel, { className: "p-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                  LazyRequestAnatomy,
-                  {
-                    parsed: requestExpansion.parsedData,
-                    inputTokens: displayLog.inputTokens ?? null,
-                    model: displayLog.model,
-                    segments: anatomySegments,
-                    onSegmentActivate: jumpToAnatomySegment
-                  }
-                ) }) }) }),
-                viewMode === "full" && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "headers", children: activeTab === "headers" && /* @__PURE__ */ jsxRuntimeExports.jsxs(ExpandedPanel, { children: [
-                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex justify-end gap-2 mb-2", children: shouldShowHeadersDiffButton(
-                    viewMode,
-                    displayLog.rawHeaders !== void 0 && Object.keys(displayLog.rawHeaders).length > 0
-                  ) && /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    DiffToggleButton,
-                    {
-                      active: headersDiff,
-                      onClick: (e) => {
-                        e.stopPropagation();
-                        setHeadersDiff(!headersDiff);
+                    /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      RequestTools,
+                      {
+                        summary: requestTools,
+                        calledToolNames: responseAnalysis.toolNames ?? []
                       }
-                    }
-                  ) }),
-                  headersDiff ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    HeadersDiffContent,
-                    {
-                      rawHeaders: displayLog.rawHeaders,
-                      headers: displayLog.headers,
-                      emptyLabel: "No transformation applied; raw and processed headers are identical."
-                    }
-                  ) : /* @__PURE__ */ jsxRuntimeExports.jsx(HeaderRows, { headers: displayLog.headers, emptyLabel: "No headers captured" })
-                ] }) }),
-                viewMode === "full" && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "raw-headers", children: activeTab === "raw-headers" && /* @__PURE__ */ jsxRuntimeExports.jsx(ExpandedPanel, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                  HeaderRows,
-                  {
-                    headers: displayLog.rawHeaders,
-                    emptyLabel: "No raw headers captured"
-                  }
-                ) }) }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "raw", children: activeTab === "raw" && /* @__PURE__ */ jsxRuntimeExports.jsxs(ExpandedPanel, { className: "space-y-3", children: [
-                  useChunkedBody && /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    BodyPreviewNotice,
-                    {
-                      label: "Response",
-                      state: responsePreview,
-                      expectedBytes: log.responseTextBytes ?? null,
-                      onLoadMore: () => loadBodyChunk("response", responsePreview.offset)
-                    }
-                  ),
-                  displayLog.error !== void 0 && displayLog.error !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(NoticeBlock, { tone: "danger", title: "SSE Error", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono", children: displayLog.error }) }),
-                  responseTextForView !== null && responsePreviewShouldParse ? /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    LazyJsonViewerFromString,
-                    {
-                      text: responseTextForView,
-                      defaultExpandDepth: 0,
-                      bulkDepth: responseExpansion.bulkDepth,
-                      bulkRevision: responseExpansion.bulkRevision
-                    }
-                  ) }) : responseTextForView !== null ? /* @__PURE__ */ jsxRuntimeExports.jsx(RawTextBlock, { children: responseTextForView }) : /* @__PURE__ */ jsxRuntimeExports.jsx(EmptyState, { children: useChunkedBody ? "Response preview is loading" : "No response" }),
-                  displayLog.streaming === true && /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    LazyStreamingChunkSequence,
-                    {
-                      logId: displayLog.id,
-                      truncated: displayLog.streamingChunksPath !== null
-                    }
-                  ) })
-                ] }) }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "parsed", children: activeTab === "parsed" && /* @__PURE__ */ jsxRuntimeExports.jsxs(ExpandedPanel, { children: [
-                  useChunkedBody && /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    BodyPreviewNotice,
+                    ),
+                    requestDiff ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      RequestDiffContent,
+                      {
+                        rawBody: displayLog.rawRequestBody,
+                        displayedBody: displayedRequestBody,
+                        emptyLabel: "No transformation applied; raw and sent request bodies are identical."
+                      }
+                    ) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: requestJsonRef, children: displayedRequestBody === null ? /* @__PURE__ */ jsxRuntimeExports.jsx(EmptyState, { children: useChunkedBody ? "Request preview is loading" : "No request body" }) : requestExpansion.parsedData !== null ? /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      LazyJsonViewer,
+                      {
+                        data: requestExpansion.parsedData,
+                        bulkDepth: requestExpansion.bulkDepth,
+                        bulkRevision: requestExpansion.bulkRevision,
+                        anatomyPaths,
+                        expandToPath
+                      }
+                    ) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(RawTextBlock, { children: displayedRequestBody }) })
+                  ] }) }),
+                  anatomySegments !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "anatomy", children: activeTab === "anatomy" && /* @__PURE__ */ jsxRuntimeExports.jsx(ExpandedPanel, { className: "p-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    LazyRequestAnatomy,
                     {
-                      label: "Response",
-                      state: responsePreview,
-                      expectedBytes: log.responseTextBytes ?? null,
-                      onLoadMore: () => loadBodyChunk("response", responsePreview.offset)
+                      parsed: requestExpansion.parsedData,
+                      inputTokens: displayLog.inputTokens ?? null,
+                      model: displayLog.model,
+                      segments: anatomySegments,
+                      onSegmentActivate: jumpToAnatomySegment
                     }
-                  ),
-                  responsePreviewIsActive && !responsePreviewShouldParse ? /* @__PURE__ */ jsxRuntimeExports.jsx(RawTextBlock, { children: responseTextForView }) : /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    LazyResponseView,
+                  ) }) }) }),
+                  viewMode === "full" && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "headers", children: activeTab === "headers" && /* @__PURE__ */ jsxRuntimeExports.jsxs(ExpandedPanel, { children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex justify-end gap-2 mb-2", children: shouldShowHeadersDiffButton(
+                      viewMode,
+                      displayLog.rawHeaders !== void 0 && Object.keys(displayLog.rawHeaders).length > 0
+                    ) && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      DiffToggleButton,
+                      {
+                        active: headersDiff,
+                        onClick: (e) => {
+                          e.stopPropagation();
+                          setHeadersDiff(!headersDiff);
+                        }
+                      }
+                    ) }),
+                    headersDiff ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      HeadersDiffContent,
+                      {
+                        rawHeaders: displayLog.rawHeaders,
+                        headers: displayLog.headers,
+                        emptyLabel: "No transformation applied; raw and processed headers are identical."
+                      }
+                    ) : /* @__PURE__ */ jsxRuntimeExports.jsx(HeaderRows, { headers: displayLog.headers, emptyLabel: "No headers captured" })
+                  ] }) }),
+                  viewMode === "full" && /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "raw-headers", children: activeTab === "raw-headers" && /* @__PURE__ */ jsxRuntimeExports.jsx(ExpandedPanel, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    HeaderRows,
                     {
-                      responseText: responseTextForView,
-                      responseStatus: displayLog.responseStatus,
-                      streaming: displayLog.streaming,
-                      inputTokens: displayLog.inputTokens,
-                      outputTokens: displayLog.outputTokens,
-                      cacheCreationInputTokens: displayLog.cacheCreationInputTokens,
-                      cacheReadInputTokens: displayLog.cacheReadInputTokens,
-                      apiFormat: resolvedFormat,
-                      error: displayLog.error
+                      headers: displayLog.rawHeaders,
+                      emptyLabel: "No raw headers captured"
                     }
-                  ) })
-                ] }) })
-              ] })
+                  ) }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "raw", children: activeTab === "raw" && /* @__PURE__ */ jsxRuntimeExports.jsxs(ExpandedPanel, { className: "space-y-3", children: [
+                    useChunkedBody && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      BodyPreviewNotice,
+                      {
+                        label: "Response",
+                        state: responsePreview,
+                        expectedBytes: log.responseTextBytes ?? null,
+                        onLoadMore: () => loadBodyChunk("response", responsePreview.offset)
+                      }
+                    ),
+                    displayLog.error !== void 0 && displayLog.error !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(NoticeBlock, { tone: "danger", title: "SSE Error", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono", children: displayLog.error }) }),
+                    responseTextForView !== null && responsePreviewShouldParse ? /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      LazyJsonViewerFromString,
+                      {
+                        text: responseTextForView,
+                        defaultExpandDepth: 0,
+                        bulkDepth: responseExpansion.bulkDepth,
+                        bulkRevision: responseExpansion.bulkRevision
+                      }
+                    ) }) : responseTextForView !== null ? /* @__PURE__ */ jsxRuntimeExports.jsx(RawTextBlock, { children: responseTextForView }) : /* @__PURE__ */ jsxRuntimeExports.jsx(EmptyState, { children: useChunkedBody ? "Response preview is loading" : "No response" }),
+                    displayLog.streaming === true && /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      LazyStreamingChunkSequence,
+                      {
+                        logId: displayLog.id,
+                        truncated: displayLog.streamingChunksPath !== null
+                      }
+                    ) })
+                  ] }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "parsed", children: activeTab === "parsed" && /* @__PURE__ */ jsxRuntimeExports.jsxs(ExpandedPanel, { children: [
+                    useChunkedBody && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      BodyPreviewNotice,
+                      {
+                        label: "Response",
+                        state: responsePreview,
+                        expectedBytes: log.responseTextBytes ?? null,
+                        onLoadMore: () => loadBodyChunk("response", responsePreview.offset)
+                      }
+                    ),
+                    responsePreviewIsActive && !responsePreviewShouldParse ? /* @__PURE__ */ jsxRuntimeExports.jsx(RawTextBlock, { children: responseTextForView }) : /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(TabFallback, {}), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      LazyResponseView,
+                      {
+                        responseText: responseTextForView,
+                        responseStatus: displayLog.responseStatus,
+                        streaming: displayLog.streaming,
+                        inputTokens: displayLog.inputTokens,
+                        outputTokens: displayLog.outputTokens,
+                        cacheCreationInputTokens: displayLog.cacheCreationInputTokens,
+                        cacheReadInputTokens: displayLog.cacheReadInputTokens,
+                        apiFormat: resolvedFormat,
+                        error: displayLog.error
+                      }
+                    ) })
+                  ] }) })
+                ] })
+              ]
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: null, children: /* @__PURE__ */ jsxRuntimeExports.jsx(LazyReplayDialog, { log: displayLog, open: replayOpen, onOpenChange: setReplayOpen }) })
+    /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: null, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      LazyReplayDialog,
+      {
+        log: displayLog,
+        displayNumber,
+        open: replayOpen,
+        onOpenChange: setReplayOpen
+      }
+    ) })
   ] });
 });
+function boundaryTitle(stopReason) {
+  switch (stopReason) {
+    case "end_turn":
+      return "End of Turn (Anthropic)";
+    case "stop":
+      return "End of Turn (OpenAI)";
+    case "length":
+      return "End of Turn (length limit)";
+    case "tool_use":
+    case null:
+      return "End of Turn";
+  }
+}
 function ThreadConnector({
   stopReason,
   isPending,
@@ -4280,7 +4340,7 @@ function ThreadConnector({
   collapsible = false,
   onToggle
 }) {
-  const isBoundary = stopReason === "end_turn" || stopReason === "stop";
+  const isBoundary = isTurnBoundary(stopReason);
   const isFusedBoundary = isOnlyEntry && isTurnStart && isBoundary;
   const isRunning = isPending && !isBoundary;
   const Crab = reactExports.useMemo(() => getCrabVariant(crabIndex), [crabIndex]);
@@ -4311,23 +4371,16 @@ function ThreadConnector({
           "drop-shadow-[0_0_4px_rgba(128,255,0,0.5)]"
         )
       }
-    ) }) : isBoundary ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "span",
+    ) }) : isBoundary ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { title: boundaryTitle(stopReason), ...interactiveProps, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      Crab,
       {
-        title: stopReason === "end_turn" ? "End of Turn (Anthropic)" : "End of Turn (OpenAI)",
-        ...interactiveProps,
-        children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          Crab,
-          {
-            className: cn(
-              "size-3.5 text-amber-400",
-              "animate-crab-settle",
-              "drop-shadow-[0_0_4px_rgba(251,191,36,0.5)]"
-            )
-          }
+        className: cn(
+          "size-3.5 text-amber-400",
+          "animate-crab-settle",
+          "drop-shadow-[0_0_4px_rgba(251,191,36,0.5)]"
         )
       }
-    ) : isTurnStart ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { title: "Start of turn", ...interactiveProps, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+    ) }) : isTurnStart ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { title: "Start of turn", ...interactiveProps, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
       Crab,
       {
         className: cn(
@@ -4383,6 +4436,19 @@ function ToolTraceEvents({ events }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mx-3 mb-2 grid gap-1.5", children: events.map((event) => /* @__PURE__ */ jsxRuntimeExports.jsx(ToolTraceEventRow, { event }, event.id)) });
 }
 const PREVIEW_LIMIT = 180;
+const toolTraceCache = /* @__PURE__ */ new WeakMap();
+function responseMayContainToolTrace(log, format) {
+  const responseText = log.responseText;
+  if (responseText === null) return false;
+  switch (format) {
+    case "anthropic":
+      return responseText.includes("tool_use");
+    case "openai":
+      return responseText.includes("tool_calls") || responseText.includes("function_call");
+    case "unknown":
+      return false;
+  }
+}
 function shouldRenderConversationContent(standalone, expanded) {
   return standalone || expanded;
 }
@@ -4393,8 +4459,10 @@ function buildTurnGroups(logs) {
   const groups = [];
   let entries = [];
   let turnIndex = 0;
-  for (const log of logs) {
-    entries.push({ log, stopReason: extractStopReason(log) });
+  for (let index = 0; index < logs.length; index += 1) {
+    const log = logs[index];
+    if (log === void 0) continue;
+    entries.push({ log, stopReason: extractStopReason(log), sessionLogNumber: index + 1 });
     const current = entries[entries.length - 1];
     if (current !== void 0 && isTurnBoundary(current.stopReason)) {
       groups.push({ entries, turnIndex });
@@ -4494,18 +4562,59 @@ function extractOpenAIToolTraceEvents(log) {
       });
     }
   }
+  const output = safeGetOwnProperty(parsed, "output");
+  if (Array.isArray(output)) {
+    for (const item of output) {
+      if (safeGetOwnProperty(item, "type") !== "function_call") continue;
+      const name = safeGetOwnProperty(item, "name");
+      if (typeof name !== "string" || name.length === 0) continue;
+      const args = safeGetOwnProperty(item, "arguments");
+      events.push({
+        id: `${String(log.id)}-openai-tool-${String(events.length)}`,
+        logId: log.id,
+        index: events.length,
+        provider: "openai",
+        name,
+        argumentsText: copyValue(args),
+        argumentsPreview: previewValue(args)
+      });
+    }
+  }
   return events;
 }
 function extractToolTraceEvents(log) {
+  const cached = toolTraceCache.get(log);
+  if (cached !== void 0 && cached.apiFormat === log.apiFormat && cached.responseText === log.responseText) {
+    return cached.events;
+  }
   const format = resolveLogFormat(log);
+  if (!responseMayContainToolTrace(log, format)) {
+    const events2 = [];
+    toolTraceCache.set(log, {
+      apiFormat: log.apiFormat,
+      responseText: log.responseText,
+      events: events2
+    });
+    return events2;
+  }
+  let events;
   switch (format) {
     case "anthropic":
-      return extractAnthropicToolTraceEvents(log);
+      events = extractAnthropicToolTraceEvents(log);
+      break;
     case "openai":
-      return extractOpenAIToolTraceEvents(log);
+      events = extractOpenAIToolTraceEvents(log);
+      break;
     case "unknown":
-      return [];
+      events = [];
+      break;
   }
+  toolTraceCache.set(log, {
+    apiFormat: log.apiFormat,
+    responseText: log.responseText,
+    events
+  });
+  return events;
 }
 function buildTraceSummary(logs, slowResponseThresholdSeconds, knowledgeCandidateCount = 0) {
   let failedCallCount = 0;
@@ -4571,7 +4680,8 @@ const TurnGroup = reactExports.memo(function TurnGroup2({
   onCompareWithPrevious,
   comparisonPredecessors,
   turnIndex = 0,
-  timeDisplayFormat
+  timeDisplayFormat,
+  pendingFocusRequest
 }) {
   const lastIdx = entries.length - 1;
   const lastStop = entries[lastIdx]?.stopReason ?? null;
@@ -4601,6 +4711,19 @@ const TurnGroup = reactExports.memo(function TurnGroup2({
       window.removeEventListener(LOG_FOCUS_REQUEST_EVENT, handleLogFocusRequest);
     };
   }, [collapsible, entries]);
+  reactExports.useEffect(() => {
+    if (pendingFocusRequest === void 0) return void 0;
+    if (!entries.some((entry) => entry.log.id === pendingFocusRequest.logId)) return void 0;
+    if (collapsible) setCollapsed(false);
+    const timer = window.setTimeout(() => {
+      dispatchLogFocusRequest({
+        logId: pendingFocusRequest.logId,
+        tab: pendingFocusRequest.tab,
+        source: "virtualizer"
+      });
+    }, 0);
+    return () => window.clearTimeout(timer);
+  }, [collapsible, entries, pendingFocusRequest]);
   const toggleCollapse = reactExports.useCallback(() => {
     if (collapsible) setCollapsed((prev) => !prev);
   }, [collapsible]);
@@ -4629,17 +4752,9 @@ const TurnGroup = reactExports.memo(function TurnGroup2({
       maxElapsed
     };
   }, [entries, lastIdx]);
-  const uniqueProviders = reactExports.useMemo(() => {
-    const seen = /* @__PURE__ */ new Set();
-    for (const e of entries) {
-      const p = detectProvider(e.log.model);
-      if (p !== "unknown") seen.add(p);
-    }
-    return [...seen];
-  }, [entries]);
   const StartCrab = reactExports.useMemo(() => getCrabVariant(entries[0]?.log.id ?? 0), [entries]);
   const EndCrab = reactExports.useMemo(() => getCrabVariant(entries[lastIdx]?.log.id ?? 0), [entries, lastIdx]);
-  const bgClass = turnIndex % 2 === 0 ? "bg-muted/10" : "bg-muted/25";
+  const bgClass = turnIndex % 2 === 0 ? "bg-[#070a0f]" : "bg-[#090d12]";
   const aggregateIsSlow = aggregate.maxElapsed !== null && slowResponseThresholdSeconds > 0 && aggregate.maxElapsed > slowResponseThresholdSeconds * 1e3;
   const toolEventsByLogId = reactExports.useMemo(() => {
     const events = /* @__PURE__ */ new Map();
@@ -4667,17 +4782,25 @@ const TurnGroup = reactExports.memo(function TurnGroup2({
   }, []);
   const firstLogId = entries[0]?.log.id ?? turnIndex;
   const turnLabel = `Turn ${String(turnIndex + 1)}`;
+  const containmentStyle = reactExports.useMemo(
+    () => ({
+      contentVisibility: "auto",
+      containIntrinsicSize: collapsed ? "48px" : "160px"
+    }),
+    [collapsed]
+  );
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     "div",
     {
       ref: containerRef,
+      style: containmentStyle,
       tabIndex: collapsed ? void 0 : 0,
       role: collapsed ? void 0 : "group",
       "aria-label": collapsed ? void 0 : turnLabel,
       "data-nav-id": collapsed ? void 0 : `turn-${String(firstLogId)}`,
       className: cn(
-        "border rounded-lg",
-        isPending ? "border-amber-500/10" : "border-transparent",
+        "border rounded-lg transition-[border-color,box-shadow]",
+        isPending ? "border-amber-300/15 shadow-[0_0_0_1px_rgba(252,211,77,0.04)]" : "border-transparent",
         !collapsed && "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:outline-none"
       ),
       children: collapsed ? (
@@ -4763,22 +4886,31 @@ const TurnGroup = reactExports.memo(function TurnGroup2({
                 "div",
                 {
                   className: cn(
-                    "flex-1 min-w-0 mb-0.5 rounded-lg border border-border py-1 px-3 flex items-center gap-3 text-xs",
+                    "flex-1 min-w-0 mb-0.5 rounded-lg border border-cyan-300/10 py-1.5 px-3 flex items-center gap-3 text-xs shadow-[inset_0_1px_0_rgba(255,255,255,0.04)]",
                     bgClass
                   ),
                   children: [
-                    /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-blue-400/80 font-mono font-semibold tabular-nums shrink-0", children: [
-                      "#",
-                      entries[0]?.log.id ?? "?",
-                      " ~ #",
-                      entries[lastIdx]?.log.id ?? "?"
-                    ] }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: ROW_CHEVRON_SLOT_CLASS, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-4 shrink-0" }) }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                      "span",
+                      {
+                        className: "text-blue-400/80 font-mono font-semibold tabular-nums shrink-0",
+                        title: `Log IDs ${String(entries[0]?.log.id ?? "?")} ~ ${String(
+                          entries[lastIdx]?.log.id ?? "?"
+                        )}`,
+                        children: [
+                          "#",
+                          entries[0]?.sessionLogNumber ?? "?",
+                          " ~ #",
+                          entries[lastIdx]?.sessionLogNumber ?? "?"
+                        ]
+                      }
+                    ),
                     /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-muted-foreground shrink-0", children: [
                       entries.length,
                       " request",
                       entries.length > 1 ? "s" : ""
                     ] }),
-                    uniqueProviders.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "flex items-center gap-0.5 shrink-0", children: uniqueProviders.map((p) => /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderLogo, { provider: p, className: "size-4" }, p)) }),
                     aggregate.maxElapsed !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Tooltip, { children: [
                       /* @__PURE__ */ jsxRuntimeExports.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
                         "span",
@@ -4812,8 +4944,7 @@ const TurnGroup = reactExports.memo(function TurnGroup2({
                         ] })
                       ] })
                     ] }),
-                    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "flex-1 min-w-0" }),
-                    /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-4 text-muted-foreground shrink-0" })
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "flex-1 min-w-0" })
                   ]
                 }
               )
@@ -4845,6 +4976,7 @@ const TurnGroup = reactExports.memo(function TurnGroup2({
                 LogEntry,
                 {
                   log,
+                  displayNumber: entry.sessionLogNumber,
                   viewMode,
                   strip,
                   slowResponseThresholdSeconds,
@@ -4861,6 +4993,103 @@ const TurnGroup = reactExports.memo(function TurnGroup2({
     }
   );
 });
+const VIRTUALIZE_TURN_THRESHOLD = 24;
+const ESTIMATED_TURN_HEIGHT = 132;
+const VIRTUAL_OVERSCAN$1 = 8;
+function shouldVirtualizeTurnGroups(turnCount) {
+  return turnCount > VIRTUALIZE_TURN_THRESHOLD;
+}
+function buildLogTurnIndex(turnGroups) {
+  const result = /* @__PURE__ */ new Map();
+  for (let index = 0; index < turnGroups.length; index++) {
+    const group = turnGroups[index];
+    if (group === void 0) continue;
+    for (const entry of group.entries) {
+      result.set(entry.log.id, index);
+    }
+  }
+  return result;
+}
+function renderTurnGroup(turnGroup, props, pendingFocusRequest) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    TurnGroup,
+    {
+      entries: turnGroup.entries,
+      viewMode: props.viewMode,
+      strip: props.strip,
+      slowResponseThresholdSeconds: props.slowResponseThresholdSeconds,
+      timeDisplayFormat: props.timeDisplayFormat,
+      cacheTrends: props.cacheTrends,
+      onCompareWithPrevious: props.onCompareWithPrevious,
+      comparisonPredecessors: props.comparisonPredecessors,
+      turnIndex: turnGroup.turnIndex,
+      pendingFocusRequest
+    },
+    turnGroup.turnIndex
+  );
+}
+function TurnGroupList(props) {
+  if (!shouldVirtualizeTurnGroups(props.turnGroups.length)) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: props.turnGroups.map((turnGroup) => renderTurnGroup(turnGroup, props)) });
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(VirtualizedTurnGroupList, { ...props });
+}
+function VirtualizedTurnGroupList(props) {
+  const { turnGroups } = props;
+  const [pendingFocusRequest, setPendingFocusRequest] = reactExports.useState(
+    null
+  );
+  const virtualizer = useWindowVirtualizer({
+    count: turnGroups.length,
+    estimateSize: () => ESTIMATED_TURN_HEIGHT,
+    overscan: VIRTUAL_OVERSCAN$1,
+    getItemKey: (index) => turnGroups[index]?.turnIndex ?? index
+  });
+  const turnIndexByLogId = reactExports.useMemo(() => buildLogTurnIndex(turnGroups), [turnGroups]);
+  reactExports.useEffect(() => {
+    const handleLogFocusRequest = (event) => {
+      const request = readLogFocusRequest(event);
+      if (request === null) return;
+      if (request.source === "virtualizer") return;
+      const turnIndex = turnIndexByLogId.get(request.logId);
+      if (turnIndex === void 0) return;
+      virtualizer.scrollToIndex(turnIndex, { align: "center" });
+      setPendingFocusRequest((previous) => ({
+        ...request,
+        turnIndex,
+        nonce: previous === null ? 1 : previous.nonce + 1
+      }));
+    };
+    window.addEventListener(LOG_FOCUS_REQUEST_EVENT, handleLogFocusRequest);
+    return () => {
+      window.removeEventListener(LOG_FOCUS_REQUEST_EVENT, handleLogFocusRequest);
+    };
+  }, [turnIndexByLogId, virtualizer]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "div",
+    {
+      className: "relative w-full",
+      style: { height: `${virtualizer.getTotalSize()}px` },
+      "data-virtualized-turn-list": "true",
+      children: virtualizer.getVirtualItems().map((virtualItem) => {
+        const turnGroup = turnGroups[virtualItem.index];
+        if (turnGroup === void 0) return null;
+        const itemFocusRequest = pendingFocusRequest !== null && pendingFocusRequest.turnIndex === virtualItem.index ? pendingFocusRequest : void 0;
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "div",
+          {
+            "data-index": virtualItem.index,
+            ref: virtualizer.measureElement,
+            className: "absolute left-0 top-0 w-full",
+            style: { transform: `translateY(${virtualItem.start}px)` },
+            children: renderTurnGroup(turnGroup, props, itemFocusRequest)
+          },
+          virtualItem.key
+        );
+      })
+    }
+  );
+}
 const CandidateResponseSchema = object({
   candidates: array(KnowledgeCandidateSchema)
 });
@@ -4926,6 +5155,18 @@ function firstToolLog(logs) {
   }
   return null;
 }
+function buildDisplayNumberByLogId$1(logs) {
+  const result = /* @__PURE__ */ new Map();
+  for (let index = 0; index < logs.length; index += 1) {
+    const log = logs[index];
+    if (log === void 0) continue;
+    result.set(log.id, index + 1);
+  }
+  return result;
+}
+function displayLogNumber(logId, displayNumberByLogId) {
+  return String(displayNumberByLogId.get(logId) ?? logId);
+}
 function buildTraceInsights(input) {
   const insights = [
     {
@@ -4940,7 +5181,7 @@ function buildTraceInsights(input) {
     insights.push({
       kind: "tool",
       title: `${String(input.summary.toolCallCount)} tool call${input.summary.toolCallCount === 1 ? "" : "s"}`,
-      detail: `First tool evidence at #${String(toolLog.id)}`,
+      detail: `First tool evidence at #${displayLogNumber(toolLog.id, input.displayNumberByLogId)}`,
       logId: toolLog.id
     });
   }
@@ -4949,7 +5190,7 @@ function buildTraceInsights(input) {
     insights.push({
       kind: "failure",
       title: `Failure #${String(failure.responseStatus)}`,
-      detail: `First failed request is #${String(failure.id)}`,
+      detail: `First failed request is #${displayLogNumber(failure.id, input.displayNumberByLogId)}`,
       logId: failure.id
     });
   }
@@ -4958,7 +5199,7 @@ function buildTraceInsights(input) {
     insights.push({
       kind: "slow",
       title: `Slowest ${formatElapsed$1(input.summary.maxElapsedMs)}`,
-      detail: `Max latency observed at #${String(slowest.id)}`,
+      detail: `Max latency observed at #${displayLogNumber(slowest.id, input.displayNumberByLogId)}`,
       logId: slowest.id
     });
   }
@@ -5046,12 +5287,13 @@ function previewText(value, maxLength) {
   if (normalized.length <= maxLength) return normalized;
   return `${normalized.slice(0, maxLength - 3)}...`;
 }
-function logRangeLabel(logIds) {
+function logRangeLabel(logIds, displayNumberByLogId) {
   const first = logIds[0];
   const last = logIds[logIds.length - 1];
   if (first === void 0) return "No evidence logs";
-  if (last === void 0 || first === last) return `#${String(first)}`;
-  return `#${String(first)}-#${String(last)}`;
+  const firstLabel = displayLogNumber(first, displayNumberByLogId);
+  if (last === void 0 || first === last) return `#${firstLabel}`;
+  return `#${firstLabel}-#${displayLogNumber(last, displayNumberByLogId)}`;
 }
 function tagsToText(tags) {
   return tags.join(", ");
@@ -5064,7 +5306,8 @@ function CandidateItem({
   isPromoting,
   isUpdating,
   onPromoteCandidate,
-  onUpdateCandidate
+  onUpdateCandidate,
+  displayNumberByLogId
 }) {
   const [editing, setEditing] = reactExports.useState(false);
   const [draftType, setDraftType] = reactExports.useState(candidate.type);
@@ -5233,7 +5476,7 @@ function CandidateItem({
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mt-2 flex flex-wrap items-center gap-x-3 gap-y-1 text-[10px] text-muted-foreground", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(FileSearch, { className: "size-3" }),
-        logRangeLabel(candidate.logIds)
+        logRangeLabel(candidate.logIds, displayNumberByLogId)
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(ShieldCheck, { className: "size-3" }),
@@ -5249,23 +5492,27 @@ function CandidateItem({
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mt-1 flex flex-wrap items-center gap-1.5", children: [
-      candidate.logIds.map((logId) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        "a",
-        {
-          href: `#${getLogAnchor(logId)}`,
-          onClick: (event) => {
-            event.preventDefault();
-            jumpToLog(logId);
+      candidate.logIds.map((logId) => {
+        const displayNumber = displayLogNumber(logId, displayNumberByLogId);
+        return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "a",
+          {
+            href: `#${getLogAnchor(logId)}`,
+            onClick: (event) => {
+              event.preventDefault();
+              jumpToLog(logId);
+            },
+            className: "rounded border border-blue-400/25 px-1.5 py-0.5 font-mono text-[10px] text-blue-400 underline-offset-2 transition-colors hover:bg-blue-400/10 hover:text-blue-300 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+            "aria-label": `Jump to evidence log ${displayNumber}`,
+            title: `Log ID ${String(logId)}`,
+            children: [
+              "#",
+              displayNumber
+            ]
           },
-          className: "rounded border border-blue-400/25 px-1.5 py-0.5 font-mono text-[10px] text-blue-400 underline-offset-2 transition-colors hover:bg-blue-400/10 hover:text-blue-300 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-          "aria-label": `Jump to evidence log ${String(logId)}`,
-          children: [
-            "#",
-            logId
-          ]
-        },
-        logId
-      )),
+          logId
+        );
+      }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "flex-1" }),
       canEdit && /* @__PURE__ */ jsxRuntimeExports.jsxs(
         Button,
@@ -5305,7 +5552,8 @@ function CandidateList({
   promotingCandidateIds,
   updatingCandidateIds,
   onPromoteCandidate,
-  onUpdateCandidate
+  onUpdateCandidate,
+  displayNumberByLogId
 }) {
   if (candidates.length === 0) return null;
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 grid gap-1.5", children: candidates.map((candidate) => /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -5315,7 +5563,8 @@ function CandidateList({
       isPromoting: promotingCandidateIds.has(candidate.id),
       isUpdating: updatingCandidateIds.has(candidate.id),
       onPromoteCandidate,
-      onUpdateCandidate
+      onUpdateCandidate,
+      displayNumberByLogId
     },
     candidate.id
   )) });
@@ -5344,9 +5593,10 @@ function AgentTraceSummary({
     () => buildTraceSummary(logs, slowResponseThresholdSeconds, candidates.length),
     [candidates.length, logs, slowResponseThresholdSeconds]
   );
+  const displayNumberByLogId = reactExports.useMemo(() => buildDisplayNumberByLogId$1(logs), [logs]);
   const traceInsights = reactExports.useMemo(
-    () => buildTraceInsights({ logs, scopeId, summary, candidates }),
-    [candidates, logs, scopeId, summary]
+    () => buildTraceInsights({ logs, scopeId, summary, candidates, displayNumberByLogId }),
+    [candidates, displayNumberByLogId, logs, scopeId, summary]
   );
   const showElapsedSummary = showRollupMetrics || summary.maxElapsedMs !== null;
   const timeRange = reactExports.useMemo(
@@ -5574,7 +5824,8 @@ function AgentTraceSummary({
         promotingCandidateIds,
         updatingCandidateIds,
         onPromoteCandidate: promoteCandidate,
-        onUpdateCandidate: updateCandidate
+        onUpdateCandidate: updateCandidate,
+        displayNumberByLogId
       }
     )
   ] });
@@ -5703,21 +5954,19 @@ const ConversationGroup = reactExports.memo(function({
           timeDisplayFormat
         }
       ),
-      turnGroups.map((tg) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-        TurnGroup,
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        TurnGroupList,
         {
-          entries: tg.entries,
+          turnGroups,
           viewMode,
           strip,
           slowResponseThresholdSeconds,
           timeDisplayFormat,
           cacheTrends,
           onCompareWithPrevious,
-          comparisonPredecessors,
-          turnIndex: tg.turnIndex
-        },
-        tg.turnIndex
-      ))
+          comparisonPredecessors
+        }
+      )
     ] })
   ] });
 });
@@ -7342,28 +7591,31 @@ function LatestLogsPreview({ logs }) {
   }
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "overflow-hidden rounded-md border border-border", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "border-b border-border bg-muted/30 px-3 py-2 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Latest logs" }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "divide-y divide-border", children: visibleLogs.map((log) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "div",
-      {
-        className: "grid gap-2 px-3 py-2 text-xs sm:grid-cols-[72px_1fr_88px_88px]",
-        children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-mono text-muted-foreground", children: [
-            "#",
-            log.id
-          ] }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "min-w-0 truncate", children: [
-            displayText(log.model),
-            " · ",
-            log.apiFormat,
-            " · ",
-            log.path
-          ] }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-muted-foreground", children: formatMs(log.firstChunkMs) }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-muted-foreground", children: formatMs(log.latencyMs) })
-        ]
-      },
-      log.id
-    )) })
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "divide-y divide-border", children: visibleLogs.map((log) => {
+      const displayNumber = log.sessionLogNumber ?? log.id;
+      return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        "div",
+        {
+          className: "grid gap-2 px-3 py-2 text-xs sm:grid-cols-[72px_1fr_88px_88px]",
+          children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-mono text-muted-foreground", title: `Log ID ${String(log.id)}`, children: [
+              "#",
+              displayNumber
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "min-w-0 truncate", children: [
+              displayText(log.model),
+              " · ",
+              log.apiFormat,
+              " · ",
+              log.path
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-muted-foreground", children: formatMs(log.firstChunkMs) }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-muted-foreground", children: formatMs(log.latencyMs) })
+          ]
+        },
+        log.id
+      );
+    }) })
   ] });
 }
 function MemberMetadata({ entries }) {
@@ -7449,6 +7701,7 @@ const ExternalProviderSchema = object({
   format: _enum(["anthropic", "openai"]),
   anthropicBaseUrl: string(),
   openaiBaseUrl: string(),
+  openaiResponsesBaseUrl: string().optional().default(""),
   models: array(string()),
   sourceTool: _enum(["claude-code", "opencode", "mimo-code"]),
   alreadyExists: boolean()
@@ -7545,6 +7798,7 @@ function ImportWizardDialog({
       format: p.format,
       anthropicBaseUrl: p.anthropicBaseUrl,
       openaiBaseUrl: p.openaiBaseUrl,
+      openaiResponsesBaseUrl: p.openaiResponsesBaseUrl,
       models: p.models,
       createdAt: now,
       updatedAt: now
@@ -7624,7 +7878,7 @@ function ImportWizardDialog({
                 p.models.slice(0, 4).join(", "),
                 p.models.length > 4 ? ` +${p.models.length - 4} more` : ""
               ] }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground mt-0.5 truncate", children: p.format === "anthropic" ? p.anthropicBaseUrl : p.openaiBaseUrl }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground mt-0.5 truncate", children: p.format === "anthropic" ? p.anthropicBaseUrl : p.openaiResponsesBaseUrl !== "" ? p.openaiResponsesBaseUrl : p.openaiBaseUrl }),
               /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground mt-0.5 font-mono", children: p.apiKey.length > 8 ? `${p.apiKey.slice(0, 4)}••••${p.apiKey.slice(-4)}` : "••••" })
             ] })
           ]
@@ -8069,12 +8323,17 @@ function ProviderCard({
         ] }),
         provider.openaiBaseUrl !== void 0 && provider.openaiBaseUrl !== "" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-w-0 text-xs text-muted-foreground", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-medium", children: "OpenAI:" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-medium", children: "OpenAI Chat:" }),
             " ",
             /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate", children: provider.openaiBaseUrl })
           ] }),
           testResults !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(ProviderFormatTestStatus, { results: testResults.openai })
         ] }),
+        provider.openaiResponsesBaseUrl !== void 0 && provider.openaiResponsesBaseUrl !== "" && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex min-w-0 flex-col gap-2", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-w-0 text-xs text-muted-foreground", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-medium", children: "OpenAI Responses:" }),
+          " ",
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate", children: provider.openaiResponsesBaseUrl })
+        ] }) }),
         testResults?.testedAt !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-xs text-muted-foreground flex items-center gap-1", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { className: "size-3" }),
           /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
@@ -8166,12 +8425,17 @@ const ZHIPU_CODING_PROVIDER_KEYWORDS = [
   "z.ai coding",
   "zai coding"
 ];
+const ANTHROPIC_MESSAGES_ENDPOINT = "/v1/messages";
+const OPENAI_CHAT_COMPLETIONS_ENDPOINT = "/v1/chat/completions";
+const OPENAI_RESPONSES_ENDPOINT = "/v1/responses";
 const KNOWN_PROVIDER_PRESETS = {
   deepseek: {
     openaiBaseUrl: "https://api.deepseek.com"
   },
   minimax: {
     anthropicBaseUrl: "https://api.minimaxi.com/anthropic",
+    openaiBaseUrl: "https://api.minimaxi.com",
+    openaiResponsesBaseUrl: "https://api.minimaxi.com",
     apiDocsUrl: "https://platform.minimaxi.com/docs/api-reference/api-overview"
   },
   "zhipu coding": {
@@ -8345,6 +8609,27 @@ function readPositiveIntegerInput(value) {
   if (!Number.isInteger(parsed) || parsed <= 0) return null;
   return parsed;
 }
+function stripEndpointSuffix(value, endpoint) {
+  if (value === void 0) return "";
+  const trimmed = value.trim();
+  const normalized = trimmed.replace(/\/+$/, "");
+  return normalized.endsWith(endpoint) ? normalized.slice(0, -endpoint.length).replace(/\/+$/, "") : trimmed;
+}
+function previewEndpointUrl(baseUrl, endpoint) {
+  const trimmed = baseUrl.trim();
+  return trimmed === "" ? null : buildUpstreamUrl(trimmed, endpoint);
+}
+function EndpointUrlPreview({
+  baseUrl,
+  endpoint
+}) {
+  const finalUrl = previewEndpointUrl(baseUrl, endpoint);
+  if (finalUrl === null) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-md border border-border/70 bg-muted/35 px-3 py-2 text-xs", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-muted-foreground", children: "Final URL" }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "break-all font-mono text-foreground", children: finalUrl })
+  ] });
+}
 function ProviderForm({ provider, onSubmit, onCancel }) {
   const [name, setName] = reactExports.useState(provider?.name ?? "");
   const [apiKey, setApiKey] = reactExports.useState(provider?.apiKey ?? "");
@@ -8361,8 +8646,15 @@ function ProviderForm({ provider, onSubmit, onCancel }) {
     )
   );
   const [activeTab, setActiveTab] = reactExports.useState("anthropic");
-  const [anthropicBaseUrl, setAnthropicBaseUrl] = reactExports.useState(provider?.anthropicBaseUrl ?? "");
-  const [openaiBaseUrl, setOpenaiBaseUrl] = reactExports.useState(provider?.openaiBaseUrl ?? "");
+  const [anthropicBaseUrl, setAnthropicBaseUrl] = reactExports.useState(
+    stripEndpointSuffix(provider?.anthropicBaseUrl, ANTHROPIC_MESSAGES_ENDPOINT)
+  );
+  const [openaiBaseUrl, setOpenaiBaseUrl] = reactExports.useState(
+    stripEndpointSuffix(provider?.openaiBaseUrl, OPENAI_CHAT_COMPLETIONS_ENDPOINT)
+  );
+  const [openaiResponsesBaseUrl, setOpenaiResponsesBaseUrl] = reactExports.useState(
+    stripEndpointSuffix(provider?.openaiResponsesBaseUrl, OPENAI_RESPONSES_ENDPOINT)
+  );
   const [apiDocsUrl, setApiDocsUrl] = reactExports.useState(provider?.apiDocsUrl ?? "");
   const [modelMetadataUrl, setModelMetadataUrl] = reactExports.useState(provider?.modelMetadataUrl ?? "");
   const [source, setSource] = reactExports.useState(provider?.source);
@@ -8385,6 +8677,7 @@ function ProviderForm({ provider, onSubmit, onCancel }) {
   }, [openModelDropdown]);
   const [manualAnthropicUrlOverride, setManualAnthropicUrlOverride] = reactExports.useState(false);
   const [manualOpenaiUrlOverride, setManualOpenaiUrlOverride] = reactExports.useState(false);
+  const [manualOpenaiResponsesUrlOverride, setManualOpenaiResponsesUrlOverride] = reactExports.useState(false);
   const isMiniMax = name.toLowerCase().includes("minimax");
   const isAlibaba = name.toLowerCase().includes("alibaba");
   const isZhipu = [...ZHIPU_PROVIDER_KEYWORDS, ...ZHIPU_CODING_PROVIDER_KEYWORDS].some(
@@ -8406,13 +8699,21 @@ function ProviderForm({ provider, onSubmit, onCancel }) {
       const nextModels = (provider.models?.length ?? 0) > 0 ? provider.models : [""];
       setModels(nextModels);
       setModelMetadataDrafts(createMetadataDrafts(provider, nextModels));
-      setAnthropicBaseUrl(provider.anthropicBaseUrl ?? "");
-      setOpenaiBaseUrl(provider.openaiBaseUrl ?? "");
+      setAnthropicBaseUrl(
+        stripEndpointSuffix(provider.anthropicBaseUrl, ANTHROPIC_MESSAGES_ENDPOINT)
+      );
+      setOpenaiBaseUrl(
+        stripEndpointSuffix(provider.openaiBaseUrl, OPENAI_CHAT_COMPLETIONS_ENDPOINT)
+      );
+      setOpenaiResponsesBaseUrl(
+        stripEndpointSuffix(provider.openaiResponsesBaseUrl, OPENAI_RESPONSES_ENDPOINT)
+      );
       setApiDocsUrl(provider.apiDocsUrl ?? "");
       setModelMetadataUrl(provider.modelMetadataUrl ?? "");
       setSource(provider.source);
       setManualAnthropicUrlOverride(false);
       setManualOpenaiUrlOverride(false);
+      setManualOpenaiResponsesUrlOverride(false);
     }
   }, [provider]);
   reactExports.useEffect(() => {
@@ -8425,6 +8726,9 @@ function ProviderForm({ provider, onSubmit, onCancel }) {
         if (preset.openaiBaseUrl !== void 0 && !manualOpenaiUrlOverride) {
           setOpenaiBaseUrl(preset.openaiBaseUrl);
         }
+        if (preset.openaiResponsesBaseUrl !== void 0 && !manualOpenaiResponsesUrlOverride) {
+          setOpenaiResponsesBaseUrl(preset.openaiResponsesBaseUrl);
+        }
         if (preset.apiDocsUrl !== void 0 && !apiDocsUrl) {
           setApiDocsUrl(preset.apiDocsUrl);
         }
@@ -8458,6 +8762,9 @@ function ProviderForm({ provider, onSubmit, onCancel }) {
     if (openaiBaseUrl.trim() && !isValidUrl(openaiBaseUrl.trim())) {
       newErrors.openaiBaseUrl = "Invalid URL format";
     }
+    if (openaiResponsesBaseUrl.trim() && !isValidUrl(openaiResponsesBaseUrl.trim())) {
+      newErrors.openaiResponsesBaseUrl = "Invalid URL format";
+    }
     if (modelMetadataUrl.trim() && !isValidUrl(modelMetadataUrl.trim())) {
       newErrors.modelMetadataUrl = "Invalid URL format";
     }
@@ -8474,7 +8781,7 @@ function ProviderForm({ provider, onSubmit, onCancel }) {
         newErrors[`modelMetadata.${index}.outputLimit`] = "Output limit should not exceed context window";
       }
     });
-    if (!anthropicBaseUrl.trim() && !openaiBaseUrl.trim()) {
+    if (!anthropicBaseUrl.trim() && !openaiBaseUrl.trim() && !openaiResponsesBaseUrl.trim()) {
       newErrors.format = "At least one format URL (Anthropic or OpenAI) is required";
     }
     setErrors(newErrors);
@@ -8590,6 +8897,7 @@ function ProviderForm({ provider, onSubmit, onCancel }) {
         models: models.map((m) => m.trim()).filter((m) => m !== ""),
         anthropicBaseUrl: anthropicBaseUrl.trim() || void 0,
         openaiBaseUrl: openaiBaseUrl.trim() || void 0,
+        openaiResponsesBaseUrl: openaiResponsesBaseUrl.trim() || void 0,
         apiDocsUrl: apiDocsUrl.trim() || void 0,
         modelMetadataUrl: modelMetadataUrl.trim() || void 0,
         modelMetadata: buildModelMetadata(),
@@ -8902,41 +9210,86 @@ function ProviderForm({ provider, onSubmit, onCancel }) {
     ] }),
     activeTab === "anthropic" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx("label", { htmlFor: "provider-anthropic-base-url", className: "text-sm font-medium", children: "Anthropic Base URL" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "input",
-        {
-          id: "provider-anthropic-base-url",
-          type: "text",
-          value: anthropicBaseUrl,
-          onChange: (e) => {
-            setManualAnthropicUrlOverride(true);
-            setAnthropicBaseUrl(e.target.value);
-          },
-          placeholder: "https://api.anthropic.com",
-          className: "w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:border-ring focus-visible:outline-ring focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50"
-        }
-      ),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex min-w-0 overflow-hidden rounded-md border border-input bg-background ring-offset-background focus-within:border-ring focus-within:outline-ring focus-within:ring-[3px]", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "input",
+          {
+            id: "provider-anthropic-base-url",
+            type: "text",
+            value: anthropicBaseUrl,
+            onChange: (e) => {
+              setManualAnthropicUrlOverride(true);
+              setAnthropicBaseUrl(e.target.value);
+            },
+            placeholder: "https://api.anthropic.com",
+            className: "min-w-0 flex-1 bg-background px-3 py-2 text-sm placeholder:text-muted-foreground focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "shrink-0 select-none border-l bg-muted px-3 py-2 font-mono text-xs text-muted-foreground", children: ANTHROPIC_MESSAGES_ENDPOINT })
+      ] }),
       errors.anthropicBaseUrl !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-destructive", children: errors.anthropicBaseUrl }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-muted-foreground", children: "Anthropic-compatible endpoint URL. Leave empty if this provider does not support Anthropic format." })
+      /* @__PURE__ */ jsxRuntimeExports.jsx(EndpointUrlPreview, { baseUrl: anthropicBaseUrl, endpoint: ANTHROPIC_MESSAGES_ENDPOINT }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-muted-foreground", children: "Anthropic-compatible base URL. Leave empty if this provider does not support Anthropic format." })
     ] }),
-    activeTab === "openai" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("label", { htmlFor: "provider-openai-base-url", className: "text-sm font-medium", children: "OpenAI Base URL" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "input",
-        {
-          id: "provider-openai-base-url",
-          type: "text",
-          value: openaiBaseUrl,
-          onChange: (e) => {
-            setManualOpenaiUrlOverride(true);
-            setOpenaiBaseUrl(e.target.value);
-          },
-          placeholder: "https://api.openai.com/v1",
-          className: "w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:border-ring focus-visible:outline-ring focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50"
-        }
-      ),
-      errors.openaiBaseUrl !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-destructive", children: errors.openaiBaseUrl }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-muted-foreground", children: "OpenAI-compatible endpoint URL. Leave empty if this provider does not support OpenAI format." })
+    activeTab === "openai" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("label", { htmlFor: "provider-openai-base-url", className: "text-sm font-medium", children: "OpenAI Chat Base URL" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex min-w-0 overflow-hidden rounded-md border border-input bg-background ring-offset-background focus-within:border-ring focus-within:outline-ring focus-within:ring-[3px]", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "input",
+            {
+              id: "provider-openai-base-url",
+              type: "text",
+              value: openaiBaseUrl,
+              onChange: (e) => {
+                setManualOpenaiUrlOverride(true);
+                setOpenaiBaseUrl(e.target.value);
+              },
+              placeholder: "https://api.openai.com",
+              className: "min-w-0 flex-1 bg-background px-3 py-2 text-sm placeholder:text-muted-foreground focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "shrink-0 select-none border-l bg-muted px-3 py-2 font-mono text-xs text-muted-foreground", children: OPENAI_CHAT_COMPLETIONS_ENDPOINT })
+        ] }),
+        errors.openaiBaseUrl !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-destructive", children: errors.openaiBaseUrl }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          EndpointUrlPreview,
+          {
+            baseUrl: openaiBaseUrl,
+            endpoint: OPENAI_CHAT_COMPLETIONS_ENDPOINT
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-muted-foreground", children: "OpenAI Chat Completions-compatible base URL. Leave empty if this provider only supports the Responses API." })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("label", { htmlFor: "provider-openai-responses-base-url", className: "text-sm font-medium", children: "OpenAI Responses Base URL" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex min-w-0 overflow-hidden rounded-md border border-input bg-background ring-offset-background focus-within:border-ring focus-within:outline-ring focus-within:ring-[3px]", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "input",
+            {
+              id: "provider-openai-responses-base-url",
+              type: "text",
+              value: openaiResponsesBaseUrl,
+              onChange: (e) => {
+                setManualOpenaiResponsesUrlOverride(true);
+                setOpenaiResponsesBaseUrl(e.target.value);
+              },
+              placeholder: "https://api.openai.com",
+              className: "min-w-0 flex-1 bg-background px-3 py-2 text-sm placeholder:text-muted-foreground focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "shrink-0 select-none border-l bg-muted px-3 py-2 font-mono text-xs text-muted-foreground", children: OPENAI_RESPONSES_ENDPOINT })
+        ] }),
+        errors.openaiResponsesBaseUrl !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-destructive", children: errors.openaiResponsesBaseUrl }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          EndpointUrlPreview,
+          {
+            baseUrl: openaiResponsesBaseUrl,
+            endpoint: OPENAI_RESPONSES_ENDPOINT
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-muted-foreground", children: "Optional Responses-compatible base URL. Set only when the provider supports the Responses API." })
+      ] })
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx("label", { htmlFor: "provider-api-docs-url", className: "text-sm font-medium", children: "API Docs URL" }),
@@ -8983,6 +9336,7 @@ function createProviderPayload(data) {
     models: data.models,
     anthropicBaseUrl: (data.anthropicBaseUrl?.length ?? 0) > 0 ? data.anthropicBaseUrl : void 0,
     openaiBaseUrl: (data.openaiBaseUrl?.length ?? 0) > 0 ? data.openaiBaseUrl : void 0,
+    openaiResponsesBaseUrl: (data.openaiResponsesBaseUrl?.length ?? 0) > 0 ? data.openaiResponsesBaseUrl : void 0,
     apiDocsUrl: (data.apiDocsUrl?.length ?? 0) > 0 ? data.apiDocsUrl : void 0,
     modelMetadataUrl: (data.modelMetadataUrl?.length ?? 0) > 0 ? data.modelMetadataUrl : void 0,
     modelMetadata: data.modelMetadata,
@@ -9272,7 +9626,7 @@ function ProvidersPanel({
           await refreshProviderMetadata(updated.id, data.modelMetadataUrl, false);
         }
         refreshProviders();
-        const criticalFieldsChanged = (data.apiKey ?? "") !== (editingProvider.apiKey ?? "") || JSON.stringify(data.models) !== JSON.stringify(editingProvider.models) || (data.anthropicBaseUrl ?? "") !== (editingProvider.anthropicBaseUrl ?? "") || (data.openaiBaseUrl ?? "") !== (editingProvider.openaiBaseUrl ?? "");
+        const criticalFieldsChanged = (data.apiKey ?? "") !== (editingProvider.apiKey ?? "") || JSON.stringify(data.models) !== JSON.stringify(editingProvider.models) || (data.anthropicBaseUrl ?? "") !== (editingProvider.anthropicBaseUrl ?? "") || (data.openaiBaseUrl ?? "") !== (editingProvider.openaiBaseUrl ?? "") || (data.openaiResponsesBaseUrl ?? "") !== (editingProvider.openaiResponsesBaseUrl ?? "");
         if (criticalFieldsChanged) {
           await runTest(updated.id);
         }
@@ -11259,6 +11613,13 @@ const CONTEXT_USAGE_THRESHOLDS = {
   watch: WATCH_USAGE_PERCENT,
   danger: DANGER_USAGE_PERCENT
 };
+const snapshotCache = /* @__PURE__ */ new WeakMap();
+function providerSignature(providers) {
+  return providers.map((provider) => {
+    const metadata = provider.modelMetadata?.map((entry) => `${entry.model}:${String(entry.contextWindow ?? "")}`).join(",") ?? "";
+    return `${provider.id}:${provider.updatedAt}:${provider.models.join(",")}:${metadata}`;
+  }).join("|");
+}
 function parseRequestBody(rawBody) {
   if (rawBody === null) return null;
   try {
@@ -11308,6 +11669,25 @@ function snapshotFromLog(log, providers) {
     roleTotalTokens: roleSegments.reduce((sum, segment2) => sum + segment2.size, 0)
   };
 }
+function cachedSnapshotFromLog(log, providers, providersSignature) {
+  const cached = snapshotCache.get(log);
+  if (cached !== void 0 && cached.id === log.id && cached.rawRequestBody === log.rawRequestBody && cached.inputTokens === log.inputTokens && cached.model === log.model && cached.path === log.path && cached.apiFormat === log.apiFormat && cached.timestamp === log.timestamp && cached.providersSignature === providersSignature) {
+    return cached.snapshot;
+  }
+  const snapshot = snapshotFromLog(log, providers);
+  snapshotCache.set(log, {
+    id: log.id,
+    rawRequestBody: log.rawRequestBody,
+    inputTokens: log.inputTokens,
+    model: log.model,
+    path: log.path,
+    apiFormat: log.apiFormat,
+    timestamp: log.timestamp,
+    providersSignature,
+    snapshot
+  });
+  return snapshot;
+}
 function isHigherPeak(candidate, current) {
   if (candidate.usagePercent !== null && current.usagePercent !== null) {
     return candidate.usagePercent > current.usagePercent;
@@ -11341,11 +11721,21 @@ 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 = [...logs].sort((left, right) => left.id - right.id);
+  const sortedLogs = logsInAscendingIdOrder(logs);
+  const providersSignature = providerSignature(providers);
   const byModel = /* @__PURE__ */ new Map();
   for (const log of sortedLogs) {
-    const snapshot = snapshotFromLog(log, providers);
+    const snapshot = cachedSnapshotFromLog(log, providers, providersSignature);
     if (snapshot === null) continue;
     const existing = byModel.get(snapshot.model);
     if (existing === void 0) {
@@ -11380,6 +11770,20 @@ 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";
 }
@@ -12429,6 +12833,7 @@ function ProxyViewer({
     setComparePair(null);
   }, []);
   const groups = reactExports.useMemo(() => groupLogsByConversation(logs), [logs]);
+  const displayNumberByLogId = reactExports.useMemo(() => buildDisplayNumberByLogId(groups), [groups]);
   const sessionContextScope = reactExports.useMemo(
     () => resolveSessionContextScope({ pinnedSessionId, selectedSession, sessions, logs }),
     [logs, pinnedSessionId, selectedSession, sessions]
@@ -12667,7 +13072,16 @@ function ProxyViewer({
         ] })
       ] })
     ] }),
-    comparePair !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: null, children: /* @__PURE__ */ jsxRuntimeExports.jsx(LazyCompareDrawer, { left: comparePair[0], right: comparePair[1], onClose: closeCompare }) })
+    comparePair !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: null, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      LazyCompareDrawer,
+      {
+        left: comparePair[0],
+        right: comparePair[1],
+        leftDisplayNumber: displayNumberForLog(comparePair[0], displayNumberByLogId),
+        rightDisplayNumber: displayNumberForLog(comparePair[1], displayNumberByLogId),
+        onClose: closeCompare
+      }
+    ) })
   ] });
 }
 const SSEUpdateSchema = union([
@@ -12730,7 +13144,7 @@ function filterLogs(logs, selectedSession, selectedModel) {
     return true;
   });
 }
-const DEBOUNCE_MS = 50;
+const DEBOUNCE_MS = 100;
 const HASH_SCROLL_ATTEMPTS = 12;
 const HASH_HIGHLIGHT_MS = 1800;
 const MAX_CLIENT_LOGS = 500;
@@ -12787,6 +13201,7 @@ function ProxyViewerContainer({
   const [logPage, setLogPage] = reactExports.useState(null);
   const [sessionPageLoading, setSessionPageLoading] = reactExports.useState(initialSessionId !== void 0);
   const [sessionMemberships, setSessionMemberships] = reactExports.useState([]);
+  const [, startLogTransition] = reactExports.useTransition();
   const eventSourceRef = reactExports.useRef(null);
   const reconnectTimeoutRef = reactExports.useRef(null);
   const handledHashRef = reactExports.useRef(null);
@@ -12805,22 +13220,28 @@ function ProxyViewerContainer({
     const updates = pendingUpdatesRef.current;
     pendingUpdatesRef.current = [];
     if (updates.length === 0) return;
-    setAllLogs((prev) => {
-      let next = prev;
-      for (const log of updates) {
-        const idx = logIndexRef.current.get(log.id);
-        if (idx !== void 0) {
-          next = [...next.slice(0, idx), log, ...next.slice(idx + 1)];
-        } else {
-          logIndexRef.current.set(log.id, next.length);
-          next = [...next, log];
+    startLogTransition(() => {
+      setAllLogs((prev) => {
+        const next = [...prev];
+        for (const log of updates) {
+          const indexedPosition = logIndexRef.current.get(log.id);
+          if (indexedPosition !== void 0 && next[indexedPosition]?.id === log.id) {
+            next[indexedPosition] = log;
+            continue;
+          }
+          const existingPosition = next.findIndex((entry) => entry.id === log.id);
+          if (existingPosition >= 0) {
+            next[existingPosition] = log;
+            continue;
+          }
+          next.push(log);
         }
-      }
-      next = trimClientLogs(next);
-      logIndexRef.current = buildLogIndex(next);
-      return next;
+        const trimmed = trimClientLogs(next);
+        logIndexRef.current = buildLogIndex(trimmed);
+        return trimmed;
+      });
     });
-  }, []);
+  }, [startLogTransition]);
   const scheduleUpdate = reactExports.useCallback(
     (log) => {
       pendingUpdatesRef.current.push(log);
@@ -13142,9 +13563,10 @@ export {
   Badge as B,
   CONTEXT_USAGE_THRESHOLDS as C,
   Dialog as D,
-  JsonViewer as E,
+  LazyJsonViewer as E,
   safeJsonValue as F,
-  JsonViewerFromString as J,
+  parseJsonText as G,
+  LazyJsonViewerFromString as L,
   ProxyViewerContainer as P,
   ROLE_COLOR_CLASSES as R,
   SegmentBar as S,