@tangle-network/agent-app 0.45.48 → 0.45.50

package/dist/{chunk-C7AQW6US.js → chunk-7HY4LX7O.js}

@@ -4,7 +4,7 @@ import {
 import {
   WorkProductCard,
   workProductPartsFromMessageParts
-} from "./chunk-J6OJTFNE.js";
+} from "./chunk-ENLRJYVW.js";
 import {
   ChevronDown,
   OVERLAY_SHADOW,
@@ -12,7 +12,10 @@ import {
   PopoverSurface,
   usePending,
   usePopover
-} from "./chunk-XVRHISF3.js";
+} from "./chunk-CJHIAZKK.js";
+import {
+  AsyncView
+} from "./chunk-3UBAO3N5.js";
 import {
   UNTITLED_SESSION_LABEL,
   mergeSessionPages,
@@ -37,7 +40,7 @@ import {
 } from "./chunk-YJMCRXQQ.js";
 
 // src/web-react/index.tsx
-import { useEffect as useEffect11, useMemo as useMemo7, useRef as useRef11, useState as useState14, memo } from "react";
+import { useEffect as useEffect12, useMemo as useMemo7, useRef as useRef12, useState as useState15, memo } from "react";
 import { InlineToolItem } from "@tangle-network/ui/run";
 
 // src/web-react/smooth-text.ts
@@ -1058,7 +1061,7 @@ function useAttachmentObjectUrl(blob) {
 function AttachmentThumbnailError({ name }) {
   return /* @__PURE__ */ jsxs4("span", { className: "inline-flex h-16 w-16 shrink-0 flex-col items-center justify-center gap-1 rounded-md border border-destructive/40 bg-destructive/10 px-1 text-center text-destructive", children: [
     /* @__PURE__ */ jsx6(WarningGlyph, { className: "h-4 w-4 shrink-0" }),
-    /* @__PURE__ */ jsx6("span", { className: "line-clamp-2 text-[11px] leading-tight", children: name })
+    /* @__PURE__ */ jsx6("span", { className: "line-clamp-2 text-xs leading-tight", children: name })
   ] });
 }
 function AttachmentUnavailable({ shape }) {
@@ -1070,7 +1073,7 @@ function AttachmentUnavailable({ shape }) {
         className: "inline-flex h-16 w-16 shrink-0 flex-col items-center justify-center gap-1 rounded-md border border-border bg-muted px-1 text-center text-muted-foreground",
         children: [
           /* @__PURE__ */ jsx6(WarningGlyph, { className: "h-4 w-4 shrink-0" }),
-          /* @__PURE__ */ jsx6("span", { className: "line-clamp-2 text-[11px] leading-tight", children: "Attachment unavailable" })
+          /* @__PURE__ */ jsx6("span", { className: "line-clamp-2 text-xs leading-tight", children: "Attachment unavailable" })
         ]
       }
     );
@@ -1079,7 +1082,7 @@ function AttachmentUnavailable({ shape }) {
     "span",
     {
       "aria-disabled": "true",
-      className: "inline-flex items-center gap-1 rounded-md border border-border bg-muted px-2 py-0.5 text-[11px] text-muted-foreground",
+      className: "inline-flex items-center gap-1 rounded-md border border-border bg-muted px-2 py-0.5 text-xs text-muted-foreground",
       children: [
         /* @__PURE__ */ jsx6(WarningGlyph, { className: "h-3 w-3 shrink-0" }),
         "Attachment unavailable"
@@ -1156,7 +1159,7 @@ function AttachmentChip({ part, resolveFileUrl, fetchFile }) {
   }
   const Icon = status === "error" ? WarningGlyph : iconForMediaType(part.mediaType);
   const className = [
-    "inline-flex items-center gap-1 rounded-md border px-2 py-0.5 text-[11px]",
+    "inline-flex items-center gap-1 rounded-md border px-2 py-0.5 text-xs",
     status === "error" ? "border-destructive/40 bg-destructive/10 text-destructive" : "border-border bg-secondary text-muted-foreground"
   ].join(" ");
   return /* @__PURE__ */ jsxs4(
@@ -1729,7 +1732,7 @@ function ChatComposer({
                   disabled,
                   rows: 2,
                   "aria-label": "Message input",
-                  className: "max-h-[168px] min-h-[56px] w-full resize-none bg-transparent px-1.5 py-1 text-[15px] leading-6 text-foreground outline-none placeholder:text-muted-foreground disabled:opacity-50"
+                  className: "max-h-[168px] min-h-[56px] w-full resize-none bg-transparent px-1.5 py-1 text-base leading-6 text-foreground outline-none placeholder:text-muted-foreground disabled:opacity-50"
                 }
               ),
               /* @__PURE__ */ jsxs5("div", { className: "flex items-end gap-2", children: [
@@ -1812,8 +1815,8 @@ function ChatComposer({
           }
         ),
         focusShortcut && /* @__PURE__ */ jsx7("div", { className: "mt-1.5 flex justify-end px-1", children: /* @__PURE__ */ jsxs5("span", { className: "text-xs text-muted-foreground", children: [
-          /* @__PURE__ */ jsx7("kbd", { className: "rounded border border-border bg-background px-1 py-0.5 text-[11px]", children: IS_APPLE_PLATFORM ? "Cmd" : "Ctrl" }),
-          /* @__PURE__ */ jsx7("kbd", { className: "ml-0.5 rounded border border-border bg-background px-1 py-0.5 text-[11px]", children: "L" }),
+          /* @__PURE__ */ jsx7("kbd", { className: "rounded border border-border bg-background px-1 py-0.5 text-xs", children: IS_APPLE_PLATFORM ? "Cmd" : "Ctrl" }),
+          /* @__PURE__ */ jsx7("kbd", { className: "ml-0.5 rounded border border-border bg-background px-1 py-0.5 text-xs", children: "L" }),
           /* @__PURE__ */ jsx7("span", { className: "ml-1", children: "to focus" })
         ] }) })
       ]
@@ -2471,7 +2474,7 @@ function FlowWaterfall({ trace }) {
   const cost = formatActivityCost(trace.costUsd);
   return /* @__PURE__ */ jsxs6("div", { className: "space-y-1", children: [
     rows.map((row, i) => /* @__PURE__ */ jsxs6("div", { className: "grid grid-cols-[minmax(0,2fr)_minmax(0,3fr)_auto] items-center gap-2", children: [
-      /* @__PURE__ */ jsx8("span", { className: "truncate font-mono text-[11px] text-muted-foreground", title: row.name, children: row.name }),
+      /* @__PURE__ */ jsx8("span", { className: "truncate font-mono text-xs text-muted-foreground", title: row.name, children: row.name }),
       /* @__PURE__ */ jsx8("div", { className: "relative h-2 rounded-sm bg-secondary", children: /* @__PURE__ */ jsx8(
         "div",
         {
@@ -2479,9 +2482,9 @@ function FlowWaterfall({ trace }) {
           style: { left: `${row.offsetPct}%`, width: `${row.widthPct}%` }
         }
       ) }),
-      /* @__PURE__ */ jsx8("span", { className: "shrink-0 font-mono text-[11px] tabular-nums text-muted-foreground/70", children: row.durationLabel })
+      /* @__PURE__ */ jsx8("span", { className: "shrink-0 font-mono text-xs tabular-nums text-muted-foreground/70", children: row.durationLabel })
     ] }, i)),
-    /* @__PURE__ */ jsxs6("p", { className: "pt-0.5 text-right font-mono text-[11px] tabular-nums text-muted-foreground/60", children: [
+    /* @__PURE__ */ jsxs6("p", { className: "pt-0.5 text-right font-mono text-xs tabular-nums text-muted-foreground/60", children: [
       (trace.totalMs / 1e3).toFixed(1),
       "s",
       cost ? ` \xB7 ${cost}` : ""
@@ -2505,8 +2508,8 @@ function MissionActivityLane({ activity, startedAt, nowMs }) {
             run.detail
           ] })
         ] }),
-        tone === "live" && (run.iteration !== void 0 || run.phase !== void 0) && /* @__PURE__ */ jsx8("span", { className: "shrink-0 rounded-full bg-warning/10 px-1.5 py-0.5 font-mono text-[11px] text-warning", children: [run.iteration !== void 0 ? `iter ${run.iteration}` : null, run.phase ?? null].filter(Boolean).join(" \xB7 ") }),
-        /* @__PURE__ */ jsxs6("span", { className: "flex shrink-0 items-center gap-1.5 font-mono text-[11px] tabular-nums text-muted-foreground/70", children: [
+        tone === "live" && (run.iteration !== void 0 || run.phase !== void 0) && /* @__PURE__ */ jsx8("span", { className: "shrink-0 rounded-full bg-warning/10 px-1.5 py-0.5 font-mono text-xs text-warning", children: [run.iteration !== void 0 ? `iter ${run.iteration}` : null, run.phase ?? null].filter(Boolean).join(" \xB7 ") }),
+        /* @__PURE__ */ jsxs6("span", { className: "flex shrink-0 items-center gap-1.5 font-mono text-xs tabular-nums text-muted-foreground/70", children: [
           tone !== "live" && tone !== "ok" && /* @__PURE__ */ jsx8("span", { children: run.status }),
           cost && /* @__PURE__ */ jsx8("span", { children: cost }),
           duration && /* @__PURE__ */ jsx8("span", { children: duration })
@@ -2518,7 +2521,7 @@ function MissionActivityLane({ activity, startedAt, nowMs }) {
       {
         type: "button",
         onClick: () => setExpanded((v) => !v),
-        className: "flex items-center gap-1 py-0.5 text-[11px] font-medium text-muted-foreground/70 transition hover:text-foreground",
+        className: "flex items-center gap-1 py-0.5 text-xs font-medium text-muted-foreground/70 transition hover:text-foreground",
         children: [
           /* @__PURE__ */ jsx8(ChevronGlyph, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` }),
           "timeline"
@@ -2554,20 +2557,20 @@ function ActivityRow({
           record.detail
         ] })
       ] }),
-      tone === "live" && (record.iteration !== void 0 || record.phase !== void 0) && /* @__PURE__ */ jsx8("span", { className: "shrink-0 rounded-full bg-warning/10 px-2 py-0.5 font-mono text-[11px] text-warning", children: [record.iteration !== void 0 ? `iter ${record.iteration}` : null, record.phase ?? null].filter(Boolean).join(" \xB7 ") }),
+      tone === "live" && (record.iteration !== void 0 || record.phase !== void 0) && /* @__PURE__ */ jsx8("span", { className: "shrink-0 rounded-full bg-warning/10 px-2 py-0.5 font-mono text-xs text-warning", children: [record.iteration !== void 0 ? `iter ${record.iteration}` : null, record.phase ?? null].filter(Boolean).join(" \xB7 ") }),
       /* @__PURE__ */ jsx8(
         "span",
         {
-          className: `shrink-0 rounded-full px-2 py-0.5 text-[11px] font-medium ${tone === "ok" ? "bg-success/10 text-success" : tone === "error" ? "bg-destructive/10 text-destructive" : tone === "live" ? "bg-warning/10 text-warning" : "bg-secondary text-muted-foreground"}`,
+          className: `shrink-0 rounded-full px-2 py-0.5 text-xs font-medium ${tone === "ok" ? "bg-success/10 text-success" : tone === "error" ? "bg-destructive/10 text-destructive" : tone === "live" ? "bg-warning/10 text-warning" : "bg-secondary text-muted-foreground"}`,
           children: record.status
         }
       ),
-      cost && /* @__PURE__ */ jsx8("span", { className: "shrink-0 font-mono text-[11px] tabular-nums text-muted-foreground", children: cost }),
+      cost && /* @__PURE__ */ jsx8("span", { className: "shrink-0 font-mono text-xs tabular-nums text-muted-foreground", children: cost }),
       /* @__PURE__ */ jsx8(ChevronGlyph, { className: `h-3 w-3 shrink-0 text-muted-foreground transition-transform ${open ? "rotate-180" : ""}` })
     ] }),
     open && /* @__PURE__ */ jsxs6("div", { className: "space-y-2.5 border-t border-border px-3 py-2.5", children: [
       record.durationMs !== void 0 && /* @__PURE__ */ jsx8("div", { className: "rounded-md border border-border bg-secondary p-2", children: /* @__PURE__ */ jsx8(FlowWaterfall, { trace: stepActivityFlowTrace([record]) }) }),
-      /* @__PURE__ */ jsxs6("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1 font-mono text-[11px]", children: [
+      /* @__PURE__ */ jsxs6("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1 font-mono text-xs", children: [
         /* @__PURE__ */ jsx8("dt", { className: "text-muted-foreground/60", children: "task" }),
         /* @__PURE__ */ jsx8("dd", { className: "truncate text-muted-foreground", children: record.taskId }),
         /* @__PURE__ */ jsx8("dt", { className: "text-muted-foreground/60", children: "started" }),
@@ -2871,13 +2874,13 @@ function SourceRow({
   return /* @__PURE__ */ jsxs7("li", { className: "rounded-md border border-card-edge bg-card px-2.5 py-2", children: [
     /* @__PURE__ */ jsxs7("div", { className: "flex flex-wrap items-baseline gap-x-2 gap-y-1", children: [
       /* @__PURE__ */ jsx9("span", { className: "text-sm font-medium text-foreground", children: source.label }),
-      source.locator && /* @__PURE__ */ jsx9("span", { className: "text-[11px] text-muted-foreground", children: source.locator }),
+      source.locator && /* @__PURE__ */ jsx9("span", { className: "text-xs text-muted-foreground", children: source.locator }),
       openable && (onOpenSource ? /* @__PURE__ */ jsxs7(
         "button",
         {
           type: "button",
           onClick: () => onOpenSource(source, record),
-          className: "rounded px-1 text-[11px] font-medium text-primary underline-offset-2 hover:underline focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          className: "rounded px-1 text-xs font-medium text-primary underline-offset-2 hover:underline focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
           children: [
             "Open ",
             source.label
@@ -2889,7 +2892,7 @@ function SourceRow({
           href: source.href,
           target: "_blank",
           rel: "noreferrer",
-          className: "rounded px-1 text-[11px] font-medium text-primary underline-offset-2 hover:underline focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          className: "rounded px-1 text-xs font-medium text-primary underline-offset-2 hover:underline focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
           children: [
             "Open ",
             source.label
@@ -2910,7 +2913,7 @@ function SourceRow({
       "p",
       {
         role: "status",
-        className: `mt-1 text-[11px] ${status === "unavailable" ? "text-destructive" : "text-muted-foreground"}`,
+        className: `mt-1 text-xs ${status === "unavailable" ? "text-destructive" : "text-muted-foreground"}`,
         children: [
           statusLine,
           status === "unavailable" && onRetrySource && /* @__PURE__ */ jsx9(
@@ -2918,7 +2921,7 @@ function SourceRow({
             {
               type: "button",
               onClick: () => onRetrySource(source, record),
-              className: "ml-2 rounded border border-border px-1.5 py-0.5 text-[11px] font-medium text-foreground hover:bg-accent focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              className: "ml-2 rounded border border-border px-1.5 py-0.5 text-xs font-medium text-foreground hover:bg-accent focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
               children: "Try again"
             }
           )
@@ -2981,7 +2984,7 @@ function ProvenanceValue({
     };
   }, [open]);
   const summary = /* @__PURE__ */ jsxs7("span", { className: "inline-flex flex-wrap items-baseline gap-x-1.5", children: [
-    record.label && /* @__PURE__ */ jsx9("span", { className: "text-[11px] text-muted-foreground", children: record.label }),
+    record.label && /* @__PURE__ */ jsx9("span", { className: "text-xs text-muted-foreground", children: record.label }),
     /* @__PURE__ */ jsx9("span", { className: hasValue ? "text-sm text-foreground" : "text-sm italic text-muted-foreground", children: hasValue ? record.display : missingValueLabel })
   ] });
   if (maxDepth <= 0) {
@@ -2996,14 +2999,14 @@ function ProvenanceValue({
           /* @__PURE__ */ jsxs7(
             "span",
             {
-              className: `ml-1.5 inline-flex items-center gap-1 rounded-full border px-1.5 py-0.5 text-[11px] font-medium ${BASIS_TONES[record.basis]}`,
+              className: `ml-1.5 inline-flex items-center gap-1 rounded-full border px-1.5 py-0.5 text-xs font-medium ${BASIS_TONES[record.basis]}`,
               children: [
                 /* @__PURE__ */ jsx9(BasisGlyph, { basis: record.basis, className: "h-3 w-3" }),
                 basisMeta.label
               ]
             }
           ),
-          /* @__PURE__ */ jsx9("span", { className: "mt-0.5 block text-[11px] text-muted-foreground", children: describeProvenance(record) })
+          /* @__PURE__ */ jsx9("span", { className: "mt-0.5 block text-xs text-muted-foreground", children: describeProvenance(record) })
         ]
       }
     );
@@ -3028,7 +3031,7 @@ function ProvenanceValue({
               "aria-expanded": open,
               "aria-controls": panelId,
               "aria-label": provenanceTriggerLabel(record, standing),
-              className: `inline-flex items-center gap-1 rounded-full border px-1.5 py-0.5 text-[11px] font-medium transition hover:brightness-105 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring ${BASIS_TONES[record.basis]}`,
+              className: `inline-flex items-center gap-1 rounded-full border px-1.5 py-0.5 text-xs font-medium transition hover:brightness-105 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring ${BASIS_TONES[record.basis]}`,
               children: [
                 /* @__PURE__ */ jsx9(BasisGlyph, { basis: record.basis, className: "h-3 w-3" }),
                 /* @__PURE__ */ jsx9("span", { "aria-hidden": true, children: basisMeta.label })
@@ -3038,7 +3041,7 @@ function ProvenanceValue({
           standing !== "settled" && // Legible at rest: what to do about the value does not wait for
           // someone to open the panel. `aria-hidden` because the trigger's
           // accessible name already carries it — this is the visual half.
-          /* @__PURE__ */ jsx9("span", { "aria-hidden": true, className: `text-[11px] font-medium ${STANDING_TONES[standing]}`, children: standingMeta.label })
+          /* @__PURE__ */ jsx9("span", { "aria-hidden": true, className: `text-xs font-medium ${STANDING_TONES[standing]}`, children: standingMeta.label })
         ] }),
         open && /* @__PURE__ */ jsxs7(
           "div",
@@ -3050,12 +3053,12 @@ function ProvenanceValue({
             children: [
               /* @__PURE__ */ jsxs7("div", { children: [
                 /* @__PURE__ */ jsx9("p", { className: "text-[12px] leading-snug text-foreground", children: describeProvenance(record) }),
-                /* @__PURE__ */ jsxs7("p", { className: `mt-0.5 text-[11px] leading-snug ${STANDING_TONES[standing]}`, children: [
+                /* @__PURE__ */ jsxs7("p", { className: `mt-0.5 text-xs leading-snug ${STANDING_TONES[standing]}`, children: [
                   standingMeta.label,
                   " \u2014 ",
                   provenanceNextMove(record, standing, confidencePolicy)
                 ] }),
-                basisMeta.checkableAgainst === null && /* @__PURE__ */ jsxs7("p", { className: "mt-0.5 text-[11px] leading-snug text-muted-foreground", children: [
+                basisMeta.checkableAgainst === null && /* @__PURE__ */ jsxs7("p", { className: "mt-0.5 text-xs leading-snug text-muted-foreground", children: [
                   basisMeta.meaning,
                   " There is nothing outside the model to check it against."
                 ] })
@@ -3073,11 +3076,11 @@ function ProvenanceValue({
               gaps.filter((gap) => gap.kind !== "unavailable-source").map((gap) => (
                 // An unavailable source already states itself on its own row; a
                 // structural gap has no row to state it, so it gets one here.
-                /* @__PURE__ */ jsx9("p", { className: "rounded-md bg-destructive/10 px-2 py-1.5 text-[11px] leading-snug text-destructive", children: gap.message }, gap.kind)
+                /* @__PURE__ */ jsx9("p", { className: "rounded-md bg-destructive/10 px-2 py-1.5 text-xs leading-snug text-destructive", children: gap.message }, gap.kind)
               )),
-              loading.length > 0 && sources.length === 0 && /* @__PURE__ */ jsx9("p", { role: "status", className: "text-[11px] text-muted-foreground", children: "Looking up where this came from\u2026" }),
+              loading.length > 0 && sources.length === 0 && /* @__PURE__ */ jsx9("p", { role: "status", className: "text-xs text-muted-foreground", children: "Looking up where this came from\u2026" }),
               inputs.length > 0 && /* @__PURE__ */ jsxs7("div", { className: "border-t border-border pt-2", children: [
-                /* @__PURE__ */ jsx9("p", { className: "text-[11px] font-medium uppercase tracking-[0.05em] text-muted-foreground", children: record.derivation ? `Computed from ${record.derivation}` : "Computed from" }),
+                /* @__PURE__ */ jsx9("p", { className: "text-xs font-medium uppercase tracking-[0.05em] text-muted-foreground", children: record.derivation ? `Computed from ${record.derivation}` : "Computed from" }),
                 /* @__PURE__ */ jsx9("ul", { className: "mt-1.5 space-y-1.5", children: inputs.map((input, index) => /* @__PURE__ */ jsx9("li", { children: /* @__PURE__ */ jsx9(
                   ProvenanceValue,
                   {
@@ -3101,11 +3104,11 @@ function ProvenanceLegend({ bases, className }) {
   if (bases.length === 0) return null;
   return /* @__PURE__ */ jsx9("ul", { className: `flex flex-wrap items-center gap-x-3 gap-y-1.5 ${className ?? ""}`, children: bases.map((basis) => {
     const meta = provenanceBasisMeta(basis);
-    return /* @__PURE__ */ jsxs7("li", { className: "flex items-center gap-1.5 text-[11px] text-muted-foreground", children: [
+    return /* @__PURE__ */ jsxs7("li", { className: "flex items-center gap-1.5 text-xs text-muted-foreground", children: [
       /* @__PURE__ */ jsxs7(
         "span",
         {
-          className: `inline-flex items-center gap-1 rounded-full border px-1.5 py-0.5 text-[11px] font-medium ${BASIS_TONES[basis]}`,
+          className: `inline-flex items-center gap-1 rounded-full border px-1.5 py-0.5 text-xs font-medium ${BASIS_TONES[basis]}`,
           children: [
             /* @__PURE__ */ jsx9(BasisGlyph, { basis, className: "h-3 w-3" }),
             meta.label
@@ -3165,7 +3168,7 @@ function SeatPaywall({
   const recurringUsage = offer ? usd(offer.recurring.includedCreditsCents) : `$${includedUsageUsd}`;
   const introductory = offer?.introductory ?? null;
   return /* @__PURE__ */ jsx10("div", { className: "flex min-h-[60vh] w-full items-center justify-center p-6", children: /* @__PURE__ */ jsxs8("div", { className: "w-full max-w-md rounded-2xl border border-card-edge bg-card p-8", children: [
-    /* @__PURE__ */ jsx10("p", { className: "text-[11px] font-semibold uppercase tracking-[0.05em] text-muted-foreground", children: product }),
+    /* @__PURE__ */ jsx10("p", { className: "text-xs font-semibold uppercase tracking-[0.05em] text-muted-foreground", children: product }),
     /* @__PURE__ */ jsxs8("h1", { className: "mt-2 text-2xl font-semibold tracking-tight text-foreground", children: [
       "Unlock ",
       product
@@ -4727,7 +4730,7 @@ function RecordGrid({
         className: "w-full border-collapse text-left text-sm",
         onKeyDown: handleGridKeyDown,
         children: [
-          /* @__PURE__ */ jsx12("thead", { children: /* @__PURE__ */ jsxs10("tr", { role: "row", className: "border-b border-border text-[11px] uppercase tracking-[0.05em] text-muted-foreground", children: [
+          /* @__PURE__ */ jsx12("thead", { children: /* @__PURE__ */ jsxs10("tr", { role: "row", className: "border-b border-border text-xs uppercase tracking-[0.05em] text-muted-foreground", children: [
             columns.map((column) => /* @__PURE__ */ jsx12(
               "th",
               {
@@ -4771,7 +4774,7 @@ function RecordGrid({
                           onCancel: () => cancelEdit(row, column)
                         }
                       ),
-                      cellError !== void 0 && /* @__PURE__ */ jsx12("p", { id: errorId, role: "alert", className: "mt-1 text-[11px] leading-snug text-destructive", children: cellError })
+                      cellError !== void 0 && /* @__PURE__ */ jsx12("p", { id: errorId, role: "alert", className: "mt-1 text-xs leading-snug text-destructive", children: cellError })
                     ] }, column.id);
                   }
                   if (column.kind === "boolean" && editable) {
@@ -5049,7 +5052,7 @@ function SourceMarker({ panelId, columnHeader, rowLabel, source, open, onToggle
             source.quote,
             "\u201D"
           ] }),
-          /* @__PURE__ */ jsxs10("span", { className: "mt-2 block text-[11px] text-muted-foreground", children: [
+          /* @__PURE__ */ jsxs10("span", { className: "mt-2 block text-xs text-muted-foreground", children: [
             source.label ?? "Source",
             source.locator ? ` \xB7 ${source.locator}` : "",
             ` \xB7 ${BASIS_TITLES[basis]}`
@@ -5061,7 +5064,7 @@ function SourceMarker({ panelId, columnHeader, rowLabel, source, open, onToggle
               target: "_blank",
               rel: "noreferrer",
               onClick: (event) => event.stopPropagation(),
-              className: "mt-1.5 inline-block text-[11px] font-medium text-primary underline-offset-2 hover:underline",
+              className: "mt-1.5 inline-block text-xs font-medium text-primary underline-offset-2 hover:underline",
               children: "Open source"
             }
           )
@@ -5129,8 +5132,8 @@ function AddRecordForm({
                             onValue: (next) => setDraft({ ...draft, [column.id]: next })
                           }
                         ),
-                        column.hint && /* @__PURE__ */ jsx12("p", { className: "mt-1 text-[11px] text-muted-foreground", children: column.hint }),
-                        message !== void 0 && /* @__PURE__ */ jsx12("p", { id: errorId, role: "alert", className: "mt-1 text-[11px] text-destructive", children: message })
+                        column.hint && /* @__PURE__ */ jsx12("p", { className: "mt-1 text-xs text-muted-foreground", children: column.hint }),
+                        message !== void 0 && /* @__PURE__ */ jsx12("p", { id: errorId, role: "alert", className: "mt-1 text-xs text-destructive", children: message })
                       ]
                     },
                     column.id
@@ -5243,8 +5246,597 @@ function DraftField({ column, id, value, invalid, describedBy, onValue }) {
   );
 }
 
+// src/web-react/class-names.ts
+function joinClasses(...parts) {
+  const kept = [];
+  for (const part of parts) {
+    if (typeof part !== "string") continue;
+    const trimmed = part.trim();
+    if (trimmed.length > 0) kept.push(trimmed);
+  }
+  return kept.join(" ");
+}
+
+// src/web-react/sparkline.tsx
+import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+var DEFAULT_SPARKLINE_WIDTH = 96;
+var DEFAULT_SPARKLINE_HEIGHT = 24;
+var DEFAULT_INSET = 2.5;
+var STROKE_WIDTH = 1.5;
+var DOT_RADIUS = 1.75;
+var DEFAULT_SPARKLINE_LABEL = "Trend";
+var DEFAULT_SPARKLINE_EMPTY_LABEL = "No history yet";
+var DEFAULT_SPARKLINE_UNAVAILABLE_LABEL = "No readings available";
+var NUMBER_FORMAT = new Intl.NumberFormat("en-US", { maximumFractionDigits: 2 });
+function formatSparklineValue(value) {
+  return NUMBER_FORMAT.format(value);
+}
+function isReading(value) {
+  return typeof value === "number" && Number.isFinite(value);
+}
+function sparklineReadings(values) {
+  return values.filter(isReading);
+}
+function round(value) {
+  return Math.round(value * 100) / 100;
+}
+function sparklineGeometry(values, { width = DEFAULT_SPARKLINE_WIDTH, height = DEFAULT_SPARKLINE_HEIGHT, inset = DEFAULT_INSET } = {}) {
+  const samples = values.length;
+  const plotted = [];
+  for (let index = 0; index < samples; index += 1) {
+    const value = values[index];
+    if (isReading(value)) plotted.push({ index, value });
+  }
+  const readings = plotted.map((entry) => entry.value);
+  const gaps = samples - readings.length;
+  if (readings.length === 0) {
+    return { readings, points: [], segments: [], gaps, min: 0, max: 0, first: 0, last: 0, direction: "flat" };
+  }
+  let min = readings[0];
+  let max = readings[0];
+  for (const value of readings) {
+    if (value < min) min = value;
+    if (value > max) max = value;
+  }
+  const first = readings[0];
+  const last = readings[readings.length - 1];
+  const span = max - min;
+  const top = inset;
+  const bottom = height - inset;
+  const left = inset;
+  const right = width - inset;
+  const points = plotted.map(({ index, value }) => ({
+    // A series of ONE SAMPLE sits in the middle rather than at the left edge,
+    // where it reads as the start of a line whose rest failed to render. A
+    // single reading among several samples keeps its own position — that is the
+    // one thing that says where in the window the reading is.
+    x: round(samples <= 1 ? width / 2 : left + (right - left) * index / (samples - 1)),
+    // `span === 0` is the stable metric. Mid-height is the honest render of it;
+    // dividing by the span here is the NaN that erases the whole polyline.
+    y: round(span === 0 ? height / 2 : bottom - (bottom - top) * (value - min) / span)
+  }));
+  const segments = [];
+  let run = [];
+  let previous = Number.NEGATIVE_INFINITY;
+  plotted.forEach(({ index }, position) => {
+    if (index !== previous + 1 && run.length > 0) {
+      segments.push(run);
+      run = [];
+    }
+    run.push(points[position]);
+    previous = index;
+  });
+  if (run.length > 0) segments.push(run);
+  return {
+    readings,
+    points,
+    segments,
+    gaps,
+    min,
+    max,
+    first,
+    last,
+    direction: last > first ? "rising" : last < first ? "falling" : "flat"
+  };
+}
+function sparklinePointsAttribute(points) {
+  return points.map((point) => `${point.x},${point.y}`).join(" ");
+}
+function sparklineLabel(values, { label = DEFAULT_SPARKLINE_LABEL, format = formatSparklineValue } = {}) {
+  const { readings, gaps, min, max, first, last, direction } = sparklineGeometry(values);
+  const missing = gaps === 0 ? "" : `, ${gaps} not available`;
+  if (readings.length === 0) return gaps === 0 ? `${label}: no readings yet` : `${label}: no readings${missing}`;
+  if (readings.length === 1) return `${label}: one reading${missing}, ${format(first)}`;
+  if (max === min) return `${label}: ${readings.length} readings${missing}, unchanged at ${format(first)}`;
+  const movement = direction === "flat" ? "net unchanged" : direction;
+  return `${label}: ${readings.length} readings${missing}, range ${format(min)} to ${format(max)}, ${movement} from ${format(first)} to ${format(last)}`;
+}
+function Sparkline({
+  values,
+  label = DEFAULT_SPARKLINE_LABEL,
+  format = formatSparklineValue,
+  width = DEFAULT_SPARKLINE_WIDTH,
+  height = DEFAULT_SPARKLINE_HEIGHT,
+  emptyLabel = DEFAULT_SPARKLINE_EMPTY_LABEL,
+  unavailableLabel = DEFAULT_SPARKLINE_UNAVAILABLE_LABEL,
+  className
+}) {
+  const geometry = sparklineGeometry(values, { width, height });
+  const accessibleName = sparklineLabel(values, { label, format });
+  if (geometry.points.length === 0) {
+    return /* @__PURE__ */ jsxs11(
+      "span",
+      {
+        "data-sparkline": geometry.gaps > 0 ? "unavailable" : "empty",
+        className: joinClasses("text-[11px] text-muted-foreground", className),
+        children: [
+          /* @__PURE__ */ jsx13("span", { className: "sr-only", children: accessibleName }),
+          /* @__PURE__ */ jsx13("span", { "aria-hidden": "true", children: geometry.gaps > 0 ? unavailableLabel : emptyLabel })
+        ]
+      }
+    );
+  }
+  const drawsLine = geometry.segments.some((segment) => segment.length > 1);
+  const end = geometry.points[geometry.points.length - 1];
+  return /* @__PURE__ */ jsxs11(
+    "svg",
+    {
+      role: "img",
+      "aria-label": accessibleName,
+      "data-sparkline": drawsLine ? "line" : "point",
+      "data-direction": geometry.direction,
+      "data-gaps": geometry.gaps > 0 ? geometry.gaps : void 0,
+      width,
+      height,
+      viewBox: `0 0 ${width} ${height}`,
+      className,
+      focusable: "false",
+      children: [
+        geometry.segments.map((segment, index) => {
+          const key = `segment-${index}`;
+          if (segment.length > 1) {
+            return /* @__PURE__ */ jsx13(
+              "polyline",
+              {
+                points: sparklinePointsAttribute(segment),
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: STROKE_WIDTH,
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                vectorEffect: "non-scaling-stroke"
+              },
+              key
+            );
+          }
+          const only = segment[0];
+          if (only.x === end.x && only.y === end.y) return null;
+          return /* @__PURE__ */ jsx13("circle", { cx: only.x, cy: only.y, r: DOT_RADIUS, fill: "currentColor" }, key);
+        }),
+        /* @__PURE__ */ jsx13("circle", { cx: end.x, cy: end.y, r: DOT_RADIUS, fill: "currentColor" })
+      ]
+    }
+  );
+}
+
+// src/web-react/insight-card.tsx
+import {
+  isValidElement as isValidElement2,
+  useCallback as useCallback10,
+  useEffect as useEffect11,
+  useRef as useRef11,
+  useState as useState14
+} from "react";
+import { Fragment as Fragment7, jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+function insightDelta(value, previous) {
+  if (typeof value !== "number" || !Number.isFinite(value)) return null;
+  if (typeof previous !== "number" || !Number.isFinite(previous)) return null;
+  const absolute = value - previous;
+  return {
+    previous,
+    absolute,
+    percent: previous === 0 ? null : absolute / previous,
+    direction: absolute > 0 ? "up" : absolute < 0 ? "down" : "flat"
+  };
+}
+function insightDeltaTone(direction, polarity = "neutral") {
+  if (direction === "flat" || polarity === "neutral") return "neutral";
+  const welcome = polarity === "higher-is-better" ? "up" : "down";
+  return direction === welcome ? "positive" : "negative";
+}
+function formatInsightDelta(delta, format = formatSparklineValue) {
+  const from = format(delta.previous);
+  if (delta.direction === "flat") return `No change from ${from}`;
+  const word = delta.direction === "up" ? "Up" : "Down";
+  const magnitude = delta.percent === null ? format(Math.abs(delta.absolute)) : `${(Math.abs(delta.percent) * 100).toFixed(1)}%`;
+  return `${word} ${magnitude} from ${from}`;
+}
+var TONE_CLASS = {
+  positive: "text-success",
+  negative: "text-destructive",
+  neutral: "text-muted-foreground"
+};
+var DIRECTION_GLYPH = { up: "\u2191", down: "\u2193", flat: "\u2192" };
+var INSIGHT_UNAVAILABLE_GLYPH = "\u2014";
+var INSIGHT_UNAVAILABLE_LABEL = "Not available";
+function InsightCard({
+  title,
+  value,
+  unit,
+  previous,
+  polarity = "neutral",
+  format = formatSparklineValue,
+  series,
+  seriesLabel,
+  description,
+  action,
+  live = false,
+  liveLabel = "Updating",
+  className,
+  style
+}) {
+  const delta = insightDelta(value, previous);
+  const tone = delta ? insightDeltaTone(delta.direction, polarity) : "neutral";
+  const unavailable = typeof value === "number" && !Number.isFinite(value);
+  const shown = typeof value === "number" ? format(value) : value;
+  return /* @__PURE__ */ jsxs12(
+    "article",
+    {
+      "data-insight-card": "",
+      "data-tone": tone,
+      className: joinClasses("agent-arrive flex h-full flex-col rounded-xl border border-card-edge bg-card p-4", className),
+      style,
+      children: [
+        /* @__PURE__ */ jsxs12("div", { className: "flex items-baseline justify-between gap-2", children: [
+          /* @__PURE__ */ jsx14("h3", { className: "text-[13px] font-medium text-muted-foreground", children: title }),
+          live ? (
+            // No `data-motion` opt-out: the word is the signal and the sweep is
+            // emphasis, so the reduced-motion floor reaches this like everything
+            // else and leaves a static, legible label.
+            /* @__PURE__ */ jsx14("span", { className: "agent-shimmer shrink-0 text-[11px] font-medium", "data-insight-live": "", children: liveLabel })
+          ) : null
+        ] }),
+        /* @__PURE__ */ jsx14("p", { className: "mt-1 flex items-baseline gap-1", children: unavailable ? /* @__PURE__ */ jsxs12("span", { "data-insight-value": "unavailable", className: "text-xl font-semibold text-muted-foreground", children: [
+          /* @__PURE__ */ jsx14("span", { "aria-hidden": "true", children: INSIGHT_UNAVAILABLE_GLYPH }),
+          /* @__PURE__ */ jsx14("span", { className: "sr-only", children: INSIGHT_UNAVAILABLE_LABEL })
+        ] }) : /* @__PURE__ */ jsxs12(Fragment7, { children: [
+          /* @__PURE__ */ jsx14("span", { className: "text-xl font-semibold tabular-nums text-foreground", children: shown }),
+          unit ? /* @__PURE__ */ jsx14("span", { className: "text-[11px] text-muted-foreground", children: unit }) : null
+        ] }) }),
+        delta ? /* @__PURE__ */ jsxs12("p", { "data-insight-delta": delta.direction, className: `mt-0.5 text-[11px] font-medium ${TONE_CLASS[tone]}`, children: [
+          /* @__PURE__ */ jsxs12("span", { "aria-hidden": "true", children: [
+            DIRECTION_GLYPH[delta.direction],
+            " "
+          ] }),
+          formatInsightDelta(delta, format)
+        ] }) : null,
+        description ? /* @__PURE__ */ jsx14("p", { className: "mt-1 text-[11px] text-muted-foreground", children: description }) : null,
+        series ? /* @__PURE__ */ jsx14("div", { className: "mt-2 text-muted-foreground", children: /* @__PURE__ */ jsx14(Sparkline, { values: series, label: seriesLabel ?? title, format }) }) : null,
+        action ? /* @__PURE__ */ jsx14("div", { className: "mt-3", children: renderInsightAction(action) }) : null
+      ]
+    }
+  );
+}
+function renderInsightAction(action) {
+  if (isValidElement2(action)) return action;
+  return /* @__PURE__ */ jsx14(
+    "button",
+    {
+      type: "button",
+      onClick: action.onClick,
+      className: "h-8 rounded-md border border-border px-3 text-xs font-medium text-foreground transition hover:bg-accent",
+      children: action.label
+    }
+  );
+}
+var DEFAULT_INSIGHT_PAGE_SIZE = 3;
+var MAX_PAGE_DOTS = 8;
+var PAGE_SIZE_FAULT_REASON = {
+  "not-a-number": "A page size that is not a number cannot count cards at all.",
+  "below-one": "A page size below one card gives the deck a page nothing fits on.",
+  fractional: "A fractional page size hides cards on no page at all."
+};
+var MAX_NAMED_PAGE_SIZES = 8;
+var warnedPageSizes = {
+  "not-a-number": { named: /* @__PURE__ */ new Set(), latched: false },
+  "below-one": { named: /* @__PURE__ */ new Set(), latched: false },
+  fractional: { named: /* @__PURE__ */ new Set(), latched: false }
+};
+function pageSizeFault(pageSize) {
+  if (!Number.isFinite(pageSize)) return "not-a-number";
+  if (pageSize < 1) return "below-one";
+  return "fractional";
+}
+function warnPageSize(pageSize) {
+  const fault = pageSizeFault(pageSize);
+  const record = warnedPageSizes[fault];
+  if (record.latched || record.named.has(pageSize)) return;
+  record.named.add(pageSize);
+  console.warn(
+    `[insight-card] pageSize must be a whole number of cards, 1 or more \u2014 received ${String(pageSize)}. Using ${DEFAULT_INSIGHT_PAGE_SIZE}. ${PAGE_SIZE_FAULT_REASON[fault]}`
+  );
+  if (record.named.size >= MAX_NAMED_PAGE_SIZES) {
+    record.named.clear();
+    record.latched = true;
+    console.warn(`[insight-card] further "${fault}" pageSize warnings are suppressed.`);
+  }
+}
+function insightPageSize(pageSize = DEFAULT_INSIGHT_PAGE_SIZE) {
+  if (Number.isInteger(pageSize) && pageSize >= 1) return pageSize;
+  warnPageSize(pageSize);
+  return DEFAULT_INSIGHT_PAGE_SIZE;
+}
+function insightPageCount(total, pageSize = DEFAULT_INSIGHT_PAGE_SIZE) {
+  const size = insightPageSize(pageSize);
+  const counted = Number.isFinite(total) && total > 0 ? total : 0;
+  return Math.max(1, Math.ceil(counted / size));
+}
+function insightPageSlice(items, page, pageSize = DEFAULT_INSIGHT_PAGE_SIZE) {
+  const size = insightPageSize(pageSize);
+  const count = insightPageCount(items.length, size);
+  const requested = Number.isFinite(page) ? Math.floor(page) : 0;
+  const safe = Math.min(Math.max(requested, 0), count - 1);
+  return items.slice(safe * size, safe * size + size);
+}
+function staggerStyle(index, base) {
+  return { ...base, "--stagger-index": index };
+}
+function InsightDeck({
+  state,
+  empty,
+  label = "Insights",
+  pageSize = DEFAULT_INSIGHT_PAGE_SIZE,
+  loadingLabel = "Loading insights\u2026",
+  retryLabel,
+  className,
+  onPageChange
+}) {
+  const [page, setPage] = useState14(0);
+  const [held, setHeld] = useState14(null);
+  const answered = state.status === "error" || state.status === "empty";
+  const carried = state.status === "ready" ? state.value : answered ? null : held;
+  if (carried !== held) setHeld(carried);
+  const shown = carried !== null && state.status !== "ready" ? { status: "ready", value: carried, retry: state.retry } : state;
+  const refreshing = shown !== state;
+  const reported = useRef11(0);
+  const settlePage = useCallback10(
+    (next) => {
+      if (reported.current === next) return;
+      reported.current = next;
+      onPageChange?.(next);
+    },
+    [onPageChange]
+  );
+  return /* @__PURE__ */ jsx14(
+    AsyncView,
+    {
+      state: shown,
+      empty,
+      loadingLabel,
+      retryLabel,
+      className,
+      children: (insights) => /* @__PURE__ */ jsx14(
+        InsightPages,
+        {
+          insights,
+          label,
+          pageSize,
+          className,
+          page,
+          busy: refreshing,
+          onSelectPage: setPage,
+          onPageSettled: settlePage
+        }
+      )
+    }
+  );
+}
+var EDITABLE_TAG = /^(INPUT|TEXTAREA|SELECT)$/;
+var ARROW_KEY_ROLES = /* @__PURE__ */ new Set([
+  "application",
+  "combobox",
+  "grid",
+  "gridcell",
+  "listbox",
+  "menu",
+  "menubar",
+  "menuitem",
+  "menuitemcheckbox",
+  "menuitemradio",
+  "option",
+  "radiogroup",
+  "row",
+  "scrollbar",
+  "searchbox",
+  "slider",
+  "spinbutton",
+  "tab",
+  "tablist",
+  "textbox",
+  "tree",
+  "treegrid",
+  "treeitem"
+]);
+function ownsArrowKeys(target, boundary) {
+  let node = target instanceof Element ? target : null;
+  while (node !== null && node !== boundary) {
+    if (EDITABLE_TAG.test(node.tagName)) return true;
+    if (node instanceof HTMLElement && node.isContentEditable) return true;
+    const role = node.getAttribute("role");
+    if (role !== null && role.split(/\s+/).some((token) => ARROW_KEY_ROLES.has(token))) return true;
+    node = node.parentElement;
+  }
+  return false;
+}
+function InsightPages({
+  insights,
+  label,
+  pageSize,
+  className,
+  page,
+  busy,
+  onSelectPage,
+  onPageSettled
+}) {
+  const size = insightPageSize(pageSize);
+  const pageCount = insightPageCount(insights.length, size);
+  const current = Math.min(Math.max(page, 0), pageCount - 1);
+  const visible = insightPageSlice(insights, current, size);
+  const sectionRef = useRef11(null);
+  const listRef = useRef11(null);
+  const recoverFocus = useRef11(false);
+  useEffect11(() => {
+    onPageSettled(current);
+  }, [current, onPageSettled]);
+  useEffect11(() => {
+    if (!recoverFocus.current) return;
+    recoverFocus.current = false;
+    sectionRef.current?.focus();
+  }, [current]);
+  const goTo = useCallback10(
+    (next) => {
+      const clamped = Math.min(Math.max(next, 0), pageCount - 1);
+      if (clamped === current) return false;
+      const active = typeof document === "undefined" ? null : document.activeElement;
+      recoverFocus.current = active instanceof Node && (listRef.current?.contains(active) ?? false);
+      onSelectPage(clamped);
+      return true;
+    },
+    [current, onSelectPage, pageCount]
+  );
+  const onKeyDown = (event) => {
+    if (event.defaultPrevented) return;
+    if (ownsArrowKeys(event.target, event.currentTarget)) return;
+    let moved = false;
+    switch (event.key) {
+      case "ArrowRight":
+      case "PageDown":
+        moved = goTo(current + 1);
+        break;
+      case "ArrowLeft":
+      case "PageUp":
+        moved = goTo(current - 1);
+        break;
+      case "Home":
+        moved = goTo(0);
+        break;
+      case "End":
+        moved = goTo(pageCount - 1);
+        break;
+      default:
+        return;
+    }
+    if (moved) event.preventDefault();
+  };
+  return /* @__PURE__ */ jsxs12(
+    "section",
+    {
+      ref: sectionRef,
+      "aria-label": label,
+      "data-insight-deck": "",
+      "aria-busy": busy,
+      className: joinClasses("space-y-3", className),
+      onKeyDown,
+      tabIndex: pageCount > 1 ? 0 : void 0,
+      "aria-keyshortcuts": pageCount > 1 ? "ArrowLeft ArrowRight PageUp PageDown Home End" : void 0,
+      children: [
+        /* @__PURE__ */ jsx14("ul", { ref: listRef, className: "grid gap-3 sm:grid-cols-2 lg:grid-cols-3", children: visible.map(({ id, style, ...card }, index) => (
+          // The page index is in the key on purpose: a page turn is an arrival,
+          // and reusing the node would swap the text under a card that never
+          // moved. Remounting replays `.agent-arrive` with the new stagger.
+          //
+          // A REFRESH is the other case and the key is why it behaves the other
+          // way: the page has not changed and the id is stable, so the key
+          // matches, React keeps the node, and a card that was already settled
+          // does not arrive a second time. The key does BOTH jobs — but only
+          // because the deck now keeps this subtree mounted across a reload
+          // (see `InsightDeck`); a key is never compared across a teardown.
+          /* @__PURE__ */ jsx14("li", { children: /* @__PURE__ */ jsx14(InsightCard, { ...card, style: staggerStyle(index, style) }) }, `${current}:${id}`)
+        )) }),
+        /* @__PURE__ */ jsxs12("div", { className: pageCount > 1 ? "flex items-center justify-between gap-2" : void 0, children: [
+          /* @__PURE__ */ jsxs12(
+            "p",
+            {
+              role: "status",
+              "aria-live": "polite",
+              className: pageCount > 1 ? "text-[11px] text-muted-foreground" : "sr-only",
+              children: [
+                "Page ",
+                current + 1,
+                " of ",
+                pageCount
+              ]
+            }
+          ),
+          pageCount > 1 ? /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx14(PagerButton, { label: "Previous insights", glyph: "\u2039", atEnd: current === 0, onClick: () => goTo(current - 1) }),
+            pageCount <= MAX_PAGE_DOTS ? Array.from({ length: pageCount }, (_, index) => (
+              // WCAG 2.2 SC 2.5.8 wants a 24x24 CSS px target. The dot stays
+              // 8px because a 24px dot is a different control; the BUTTON
+              // around it carries the target, so the padding is the hit area
+              // and the span is the graphic. The Spacing exception cannot
+              // rescue the bare dot — at a 12px pitch the 24px circle around
+              // each centre overlaps its neighbour's.
+              /* @__PURE__ */ jsx14(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": `Page ${index + 1} of ${pageCount}`,
+                  "aria-current": index === current ? "page" : void 0,
+                  onClick: () => goTo(index),
+                  className: "group flex h-6 w-6 shrink-0 items-center justify-center rounded-full",
+                  children: /* @__PURE__ */ jsx14(
+                    "span",
+                    {
+                      "aria-hidden": "true",
+                      className: joinClasses(
+                        "block rounded-full transition",
+                        index === current ? "h-2 w-4 bg-foreground" : "h-2 w-2 bg-muted-foreground group-hover:bg-foreground"
+                      )
+                    }
+                  )
+                },
+                index
+              )
+            )) : null,
+            /* @__PURE__ */ jsx14(
+              PagerButton,
+              {
+                label: "Next insights",
+                glyph: "\u203A",
+                atEnd: current === pageCount - 1,
+                onClick: () => goTo(current + 1)
+              }
+            )
+          ] }) : null
+        ] })
+      ]
+    }
+  );
+}
+function PagerButton({
+  label,
+  glyph,
+  atEnd,
+  onClick
+}) {
+  return /* @__PURE__ */ jsx14(
+    "button",
+    {
+      type: "button",
+      "aria-label": label,
+      "aria-disabled": atEnd,
+      onClick: () => {
+        if (!atEnd) onClick();
+      },
+      className: `flex h-6 w-6 items-center justify-center rounded-md border border-border text-xs text-muted-foreground transition ${atEnd ? "opacity-40" : "hover:bg-accent hover:text-foreground"}`,
+      children: /* @__PURE__ */ jsx14("span", { "aria-hidden": "true", children: glyph })
+    }
+  );
+}
+
 // src/web-react/index.tsx
-import { Fragment as Fragment7, jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
 function formatModelCost(msg, models) {
   if (msg.promptTokens == null && msg.completionTokens == null) return null;
   const pricing = models.find((m) => m.id === msg.modelUsed)?.pricing;
@@ -5258,41 +5850,41 @@ function formatTokensPerSecond(msg) {
   return `${Math.round(msg.completionTokens / (msg.durationMs / 1e3))} tok/s`;
 }
 function RunDrillIn({ run, onClose }) {
-  return /* @__PURE__ */ jsxs11("div", { className: `fixed inset-y-0 right-0 z-50 flex w-[480px] max-w-full flex-col border-l border-card-edge bg-popover ${OVERLAY_SHADOW}`, children: [
-    /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 border-b border-border px-4 py-3", children: [
-      /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsxs13("div", { className: `fixed inset-y-0 right-0 z-50 flex w-[480px] max-w-full flex-col border-l border-card-edge bg-popover ${OVERLAY_SHADOW}`, children: [
+    /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2 border-b border-border px-4 py-3", children: [
+      /* @__PURE__ */ jsx15(
         "span",
         {
           className: `h-2 w-2 shrink-0 rounded-full ${run.status === "running" ? "bg-warning" : run.status === "error" ? "bg-destructive" : "bg-success"}`
         }
       ),
-      /* @__PURE__ */ jsxs11("div", { className: "min-w-0 flex-1", children: [
-        /* @__PURE__ */ jsx13("p", { className: "truncate text-[15px] font-semibold", children: run.title }),
-        /* @__PURE__ */ jsx13("p", { className: "truncate font-mono text-[11px] text-muted-foreground", children: run.toolName })
+      /* @__PURE__ */ jsxs13("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx15("p", { className: "truncate text-[15px] font-semibold", children: run.title }),
+        /* @__PURE__ */ jsx15("p", { className: "truncate font-mono text-xs text-muted-foreground", children: run.toolName })
       ] }),
-      /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx15(
         "button",
         {
           type: "button",
           onClick: onClose,
           "aria-label": "Close",
           className: "rounded-md p-1.5 text-muted-foreground transition hover:bg-accent hover:text-foreground",
-          children: /* @__PURE__ */ jsx13("svg", { className: "h-4 w-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx13("path", { d: "M18 6 6 18M6 6l12 12" }) })
+          children: /* @__PURE__ */ jsx15("svg", { className: "h-4 w-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx15("path", { d: "M18 6 6 18M6 6l12 12" }) })
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs11("div", { className: "flex-1 space-y-3 overflow-y-auto p-4", children: [
-      run.steps.length === 0 && /* @__PURE__ */ jsx13("p", { className: "text-sm text-muted-foreground", children: "No steps recorded yet." }),
-      run.steps.map((step, i) => /* @__PURE__ */ jsxs11("div", { className: "rounded-lg border border-card-edge bg-card", children: [
-        /* @__PURE__ */ jsxs11("div", { className: "flex items-baseline gap-2 border-b border-border px-3 py-1.5", children: [
-          /* @__PURE__ */ jsx13("span", { className: `font-mono text-[11px] ${step.status === "error" ? "text-destructive" : "text-muted-foreground"}`, children: step.status === "error" ? "\u2717" : "$" }),
-          /* @__PURE__ */ jsx13("code", { className: "min-w-0 flex-1 truncate font-mono text-xs", children: step.label }),
-          /* @__PURE__ */ jsx13("span", { className: "shrink-0 text-[11px] tabular-nums text-muted-foreground", children: new Date(step.at).toLocaleTimeString([], { hour: "numeric", minute: "2-digit" }) })
+    /* @__PURE__ */ jsxs13("div", { className: "flex-1 space-y-3 overflow-y-auto p-4", children: [
+      run.steps.length === 0 && /* @__PURE__ */ jsx15("p", { className: "text-sm text-muted-foreground", children: "No steps recorded yet." }),
+      run.steps.map((step, i) => /* @__PURE__ */ jsxs13("div", { className: "rounded-lg border border-card-edge bg-card", children: [
+        /* @__PURE__ */ jsxs13("div", { className: "flex items-baseline gap-2 border-b border-border px-3 py-1.5", children: [
+          /* @__PURE__ */ jsx15("span", { className: `font-mono text-xs ${step.status === "error" ? "text-destructive" : "text-muted-foreground"}`, children: step.status === "error" ? "\u2717" : "$" }),
+          /* @__PURE__ */ jsx15("code", { className: "min-w-0 flex-1 truncate font-mono text-xs", children: step.label }),
+          /* @__PURE__ */ jsx15("span", { className: "shrink-0 text-xs tabular-nums text-muted-foreground", children: new Date(step.at).toLocaleTimeString([], { hour: "numeric", minute: "2-digit" }) })
         ] }),
-        step.detail && /* @__PURE__ */ jsx13("pre", { className: "max-h-48 overflow-auto whitespace-pre-wrap px-3 py-2 font-mono text-[11px] leading-relaxed text-muted-foreground", children: step.detail })
+        step.detail && /* @__PURE__ */ jsx15("pre", { className: "max-h-48 overflow-auto whitespace-pre-wrap px-3 py-2 font-mono text-xs leading-relaxed text-muted-foreground", children: step.detail })
       ] }, i))
     ] }),
-    /* @__PURE__ */ jsx13("p", { className: "border-t border-border px-4 py-2 text-[11px] text-muted-foreground", children: "Read-only transcript \u2014 reply in the main chat." })
+    /* @__PURE__ */ jsx15("p", { className: "border-t border-border px-4 py-2 text-xs text-muted-foreground", children: "Read-only transcript \u2014 reply in the main chat." })
   ] });
 }
 function pendingApprovalOf(call) {
@@ -5308,23 +5900,23 @@ function ChatEmptyState({
 }) {
   const doorCount = Math.min(doors?.length ?? 0, 3);
   const doorsGridClass = doorCount === 1 ? "mx-auto max-w-sm sm:grid-cols-1" : doorCount === 2 ? "sm:grid-cols-2" : "sm:grid-cols-3";
-  return /* @__PURE__ */ jsxs11("div", { className: "mx-auto flex w-full max-w-2xl flex-col items-center px-6 py-12 text-center sm:py-20", children: [
-    /* @__PURE__ */ jsx13("span", { className: "mb-5 inline-flex h-14 w-14 items-center justify-center rounded-2xl bg-primary/10 ring-1 ring-primary/15", children: /* @__PURE__ */ jsx13(BrandMark, { size: 32, className: "shrink-0" }) }),
-    /* @__PURE__ */ jsx13("p", { className: "text-[11px] font-semibold uppercase tracking-[0.05em] text-muted-foreground", children: productName }),
-    /* @__PURE__ */ jsx13("h2", { className: "mt-1.5 text-balance text-2xl font-semibold leading-tight text-foreground", children: headline }),
-    subline && /* @__PURE__ */ jsx13("p", { className: "mt-3 max-w-md text-[15px] leading-relaxed text-muted-foreground", children: subline }),
-    doors && doors.length > 0 && /* @__PURE__ */ jsx13("div", { className: `mt-7 grid w-full gap-2.5 ${doorsGridClass}`, children: doors.slice(0, 3).map((door, i) => /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs13("div", { className: "mx-auto flex w-full max-w-2xl flex-col items-center px-6 py-12 text-center sm:py-20", children: [
+    /* @__PURE__ */ jsx15("span", { className: "mb-5 inline-flex h-14 w-14 items-center justify-center rounded-2xl bg-primary/10 ring-1 ring-primary/15", children: /* @__PURE__ */ jsx15(BrandMark, { size: 32, className: "shrink-0" }) }),
+    /* @__PURE__ */ jsx15("p", { className: "text-xs font-semibold uppercase tracking-[0.05em] text-muted-foreground", children: productName }),
+    /* @__PURE__ */ jsx15("h2", { className: "mt-1.5 text-balance text-2xl font-semibold leading-tight text-foreground", children: headline }),
+    subline && /* @__PURE__ */ jsx15("p", { className: "mt-3 max-w-md text-[15px] leading-relaxed text-muted-foreground", children: subline }),
+    doors && doors.length > 0 && /* @__PURE__ */ jsx15("div", { className: `mt-7 grid w-full gap-2.5 ${doorsGridClass}`, children: doors.slice(0, 3).map((door, i) => /* @__PURE__ */ jsxs13(
       "button",
       {
         type: "button",
         onClick: door.onSelect,
         className: "group flex min-h-[44px] flex-col items-start rounded-xl border border-border bg-card px-4 py-3 text-left transition hover:border-primary/40 hover:bg-accent",
         children: [
-          /* @__PURE__ */ jsxs11("span", { className: "flex items-center gap-2 text-sm font-semibold text-foreground", children: [
+          /* @__PURE__ */ jsxs13("span", { className: "flex items-center gap-2 text-sm font-semibold text-foreground", children: [
             door.icon,
             door.label
           ] }),
-          door.description && /* @__PURE__ */ jsx13("span", { className: "mt-0.5 text-[12px] leading-snug text-muted-foreground", children: door.description })
+          door.description && /* @__PURE__ */ jsx15("span", { className: "mt-0.5 text-[12px] leading-snug text-muted-foreground", children: door.description })
         ]
       },
       i
@@ -5333,26 +5925,26 @@ function ChatEmptyState({
 }
 function ToolGlyph({ name, className }) {
   if (name.startsWith("sandbox_")) {
-    return /* @__PURE__ */ jsxs11("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx13("polyline", { points: "4 17 10 11 4 5" }),
-      /* @__PURE__ */ jsx13("line", { x1: "12", y1: "19", x2: "20", y2: "19" })
+    return /* @__PURE__ */ jsxs13("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx15("polyline", { points: "4 17 10 11 4 5" }),
+      /* @__PURE__ */ jsx15("line", { x1: "12", y1: "19", x2: "20", y2: "19" })
     ] });
   }
   if (name === "submit_proposal") {
-    return /* @__PURE__ */ jsxs11("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx13("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
-      /* @__PURE__ */ jsx13("path", { d: "M14 2v6h6M9 15l2 2 4-4" })
+    return /* @__PURE__ */ jsxs13("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx15("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
+      /* @__PURE__ */ jsx15("path", { d: "M14 2v6h6M9 15l2 2 4-4" })
     ] });
   }
   if (name === "schedule_followup") {
-    return /* @__PURE__ */ jsxs11("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx13("circle", { cx: "12", cy: "12", r: "9" }),
-      /* @__PURE__ */ jsx13("path", { d: "M12 7v5l3 3" })
+    return /* @__PURE__ */ jsxs13("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx15("circle", { cx: "12", cy: "12", r: "9" }),
+      /* @__PURE__ */ jsx15("path", { d: "M12 7v5l3 3" })
     ] });
   }
-  return /* @__PURE__ */ jsxs11("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-    /* @__PURE__ */ jsx13("path", { d: "M12 3v3m0 12v3M3 12h3m12 0h3" }),
-    /* @__PURE__ */ jsx13("circle", { cx: "12", cy: "12", r: "4" })
+  return /* @__PURE__ */ jsxs13("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx15("path", { d: "M12 3v3m0 12v3M3 12h3m12 0h3" }),
+    /* @__PURE__ */ jsx15("circle", { cx: "12", cy: "12", r: "4" })
   ] });
 }
 function toolOutcomeOf(call) {
@@ -5438,40 +6030,40 @@ function truncate(v, max = 240) {
 function KvRows({ data }) {
   const entries = Object.entries(data).filter(([, v]) => v !== void 0 && v !== null && v !== "");
   if (!entries.length) return null;
-  return /* @__PURE__ */ jsx13("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1", children: entries.map(([k, v]) => /* @__PURE__ */ jsxs11("div", { className: "contents", children: [
-    /* @__PURE__ */ jsx13("dt", { className: "font-mono text-[11px] text-muted-foreground", children: k }),
-    /* @__PURE__ */ jsx13("dd", { className: "min-w-0 whitespace-pre-wrap break-words font-mono text-[11px] text-muted-foreground", children: truncate(v) })
+  return /* @__PURE__ */ jsx15("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1", children: entries.map(([k, v]) => /* @__PURE__ */ jsxs13("div", { className: "contents", children: [
+    /* @__PURE__ */ jsx15("dt", { className: "font-mono text-xs text-muted-foreground", children: k }),
+    /* @__PURE__ */ jsx15("dd", { className: "min-w-0 whitespace-pre-wrap break-words font-mono text-xs text-muted-foreground", children: truncate(v) })
   ] }, k)) });
 }
 function ShellDetail({ call }) {
   const outcome = toolOutcomeOf(call);
   const r = outcome?.result ?? {};
-  return /* @__PURE__ */ jsxs11("div", { className: "overflow-hidden rounded-md bg-zinc-900 font-mono text-[11px] leading-relaxed", children: [
-    /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 px-3 pt-2 text-zinc-400", children: [
-      /* @__PURE__ */ jsx13("span", { className: "select-none text-zinc-500", children: "$" }),
-      /* @__PURE__ */ jsx13("span", { className: "min-w-0 flex-1 truncate text-zinc-200", children: String(call.args?.command ?? "") }),
-      r.exitCode != null && /* @__PURE__ */ jsxs11("span", { className: r.exitCode === 0 ? "text-success" : "text-destructive", children: [
+  return /* @__PURE__ */ jsxs13("div", { className: "overflow-hidden rounded-md bg-zinc-900 font-mono text-xs leading-relaxed", children: [
+    /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2 px-3 pt-2 text-zinc-400", children: [
+      /* @__PURE__ */ jsx15("span", { className: "select-none text-zinc-500", children: "$" }),
+      /* @__PURE__ */ jsx15("span", { className: "min-w-0 flex-1 truncate text-zinc-200", children: String(call.args?.command ?? "") }),
+      r.exitCode != null && /* @__PURE__ */ jsxs13("span", { className: r.exitCode === 0 ? "text-success" : "text-destructive", children: [
         "exit ",
         r.exitCode
       ] })
     ] }),
-    /* @__PURE__ */ jsx13("pre", { className: "max-h-56 overflow-auto whitespace-pre-wrap px-3 pb-2.5 pt-1.5 text-zinc-300", children: outcome?.ok === false ? outcome.message ?? "failed" : [r.stdout, r.stderr].filter(Boolean).join("\n") || "(no output)" })
+    /* @__PURE__ */ jsx15("pre", { className: "max-h-56 overflow-auto whitespace-pre-wrap px-3 pb-2.5 pt-1.5 text-zinc-300", children: outcome?.ok === false ? outcome.message ?? "failed" : [r.stdout, r.stderr].filter(Boolean).join("\n") || "(no output)" })
   ] });
 }
 function DefaultToolDetail({ call }) {
   const result = call.result;
   const envelope = typeof result === "object" && result !== null ? result : null;
-  return /* @__PURE__ */ jsxs11("div", { className: "space-y-2", children: [
-    call.args && Object.keys(call.args).length > 0 && /* @__PURE__ */ jsxs11("div", { children: [
-      /* @__PURE__ */ jsx13("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Called with" }),
-      /* @__PURE__ */ jsx13(KvRows, { data: call.args })
+  return /* @__PURE__ */ jsxs13("div", { className: "space-y-2", children: [
+    call.args && Object.keys(call.args).length > 0 && /* @__PURE__ */ jsxs13("div", { children: [
+      /* @__PURE__ */ jsx15("p", { className: "mb-1 text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: "Called with" }),
+      /* @__PURE__ */ jsx15(KvRows, { data: call.args })
     ] }),
-    envelope ? /* @__PURE__ */ jsxs11("div", { children: [
-      /* @__PURE__ */ jsx13("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: envelope.ok === false ? "Failed" : "Result" }),
-      envelope.ok === false ? /* @__PURE__ */ jsx13("p", { className: "text-xs text-destructive", children: envelope.message ?? "Tool failed" }) : envelope.result && typeof envelope.result === "object" ? /* @__PURE__ */ jsx13(KvRows, { data: envelope.result }) : envelope.result != null ? /* @__PURE__ */ jsx13("p", { className: "font-mono text-[11px] text-muted-foreground", children: truncate(envelope.result) }) : null
-    ] }) : result != null ? /* @__PURE__ */ jsxs11("div", { children: [
-      /* @__PURE__ */ jsx13("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Result" }),
-      /* @__PURE__ */ jsx13("p", { className: "font-mono text-[11px] text-muted-foreground", children: truncate(result) })
+    envelope ? /* @__PURE__ */ jsxs13("div", { children: [
+      /* @__PURE__ */ jsx15("p", { className: "mb-1 text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: envelope.ok === false ? "Failed" : "Result" }),
+      envelope.ok === false ? /* @__PURE__ */ jsx15("p", { className: "text-xs text-destructive", children: envelope.message ?? "Tool failed" }) : envelope.result && typeof envelope.result === "object" ? /* @__PURE__ */ jsx15(KvRows, { data: envelope.result }) : envelope.result != null ? /* @__PURE__ */ jsx15("p", { className: "font-mono text-xs text-muted-foreground", children: truncate(envelope.result) }) : null
+    ] }) : result != null ? /* @__PURE__ */ jsxs13("div", { children: [
+      /* @__PURE__ */ jsx15("p", { className: "mb-1 text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: "Result" }),
+      /* @__PURE__ */ jsx15("p", { className: "font-mono text-xs text-muted-foreground", children: truncate(result) })
     ] }) : null
   ] });
 }
@@ -5482,24 +6074,24 @@ function ProposalCard({
   approval,
   renderers
 }) {
-  const [expanded, setExpanded] = useState14(false);
+  const [expanded, setExpanded] = useState15(false);
   const { summary, meta, typeSlug } = proposalPreview(call);
   const custom = renderers?.[call.name]?.(call, message);
   const { pending: deciding, run: decide } = usePending();
-  return /* @__PURE__ */ jsxs11("div", { className: "w-full max-w-full rounded-xl border border-warning/50 bg-warning/[0.06] text-sm shadow-sm ring-1 ring-warning/10", children: [
-    /* @__PURE__ */ jsxs11("div", { className: "flex items-start gap-2.5 px-4 pt-3.5", children: [
-      /* @__PURE__ */ jsx13("span", { className: "mt-0.5 inline-flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-warning/15 text-warning", children: /* @__PURE__ */ jsx13(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5" }) }),
-      /* @__PURE__ */ jsxs11("div", { className: "min-w-0 flex-1", children: [
-        /* @__PURE__ */ jsx13("p", { className: "text-[11px] font-semibold uppercase tracking-[0.05em] text-warning-strong", children: approval ? "Needs your approval" : "Awaiting approval" }),
-        /* @__PURE__ */ jsx13("p", { className: "mt-0.5 text-[15px] font-semibold leading-snug text-foreground", children: friendlyToolTitle(call) }),
-        summary && /* @__PURE__ */ jsx13("p", { className: "mt-1 text-xs leading-relaxed text-muted-foreground", children: summary }),
-        typeSlug && /* @__PURE__ */ jsx13("p", { className: "mt-1 font-mono text-xs text-muted-foreground", children: typeSlug }),
-        meta.length > 0 && /* @__PURE__ */ jsx13("div", { className: "mt-1.5 flex flex-wrap items-center gap-1.5", children: meta.map((m, i) => /* @__PURE__ */ jsx13("span", { className: "rounded-full bg-secondary px-2 py-0.5 text-[11px] font-medium text-muted-foreground", children: m }, i)) })
+  return /* @__PURE__ */ jsxs13("div", { className: "w-full max-w-full rounded-xl border border-warning/50 bg-warning/[0.06] text-sm shadow-sm ring-1 ring-warning/10", children: [
+    /* @__PURE__ */ jsxs13("div", { className: "flex items-start gap-2.5 px-4 pt-3.5", children: [
+      /* @__PURE__ */ jsx15("span", { className: "mt-0.5 inline-flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-warning/15 text-warning", children: /* @__PURE__ */ jsx15(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5" }) }),
+      /* @__PURE__ */ jsxs13("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx15("p", { className: "text-xs font-semibold uppercase tracking-[0.05em] text-warning-strong", children: approval ? "Needs your approval" : "Awaiting approval" }),
+        /* @__PURE__ */ jsx15("p", { className: "mt-0.5 text-[15px] font-semibold leading-snug text-foreground", children: friendlyToolTitle(call) }),
+        summary && /* @__PURE__ */ jsx15("p", { className: "mt-1 text-xs leading-relaxed text-muted-foreground", children: summary }),
+        typeSlug && /* @__PURE__ */ jsx15("p", { className: "mt-1 font-mono text-xs text-muted-foreground", children: typeSlug }),
+        meta.length > 0 && /* @__PURE__ */ jsx15("div", { className: "mt-1.5 flex flex-wrap items-center gap-1.5", children: meta.map((m, i) => /* @__PURE__ */ jsx15("span", { className: "rounded-full bg-secondary px-2 py-0.5 text-xs font-medium text-muted-foreground", children: m }, i)) })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs11("div", { className: "flex flex-wrap items-center gap-2 px-4 pb-3.5 pt-3", children: [
-      approval && /* @__PURE__ */ jsxs11(Fragment7, { children: [
-        /* @__PURE__ */ jsx13(
+    /* @__PURE__ */ jsxs13("div", { className: "flex flex-wrap items-center gap-2 px-4 pb-3.5 pt-3", children: [
+      approval && /* @__PURE__ */ jsxs13(Fragment8, { children: [
+        /* @__PURE__ */ jsx15(
           "button",
           {
             type: "button",
@@ -5509,7 +6101,7 @@ function ProposalCard({
             children: "Approve & run"
           }
         ),
-        /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsx15(
           "button",
           {
             type: "button",
@@ -5520,7 +6112,7 @@ function ProposalCard({
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs11(
+      /* @__PURE__ */ jsxs13(
         "button",
         {
           type: "button",
@@ -5529,12 +6121,12 @@ function ProposalCard({
           className: "ml-auto inline-flex items-center gap-1 rounded text-[12px] font-medium text-muted-foreground transition hover:text-foreground",
           children: [
             expanded ? "Hide details" : "View details",
-            /* @__PURE__ */ jsx13(ChevronDown, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` })
+            /* @__PURE__ */ jsx15(ChevronDown, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` })
           ]
         }
       )
     ] }),
-    expanded && /* @__PURE__ */ jsx13("div", { className: "border-t border-warning/20 px-4 py-3 text-xs", children: custom ?? /* @__PURE__ */ jsx13(DefaultToolDetail, { call }) })
+    expanded && /* @__PURE__ */ jsx15("div", { className: "border-t border-warning/20 px-4 py-3 text-xs", children: custom ?? /* @__PURE__ */ jsx15(DefaultToolDetail, { call }) })
   ] });
 }
 function formatFollowupWhen(when) {
@@ -5549,14 +6141,14 @@ function FollowupCard({ call }) {
   const when = typeof a.when === "string" ? a.when : typeof a.at === "string" ? a.at : typeof a.schedule === "string" ? a.schedule : null;
   const failed = toolCallFailed(call);
   const errorText = failed ? toolOutcomeOf(call)?.message ?? "Scheduling failed" : null;
-  return /* @__PURE__ */ jsx13("div", { className: "flex items-start gap-2", children: /* @__PURE__ */ jsxs11("div", { className: "min-w-0 flex-1 overflow-hidden rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)]", children: [
-    /* @__PURE__ */ jsxs11("div", { className: "flex w-full items-center gap-2.5 px-3 py-2", children: [
-      /* @__PURE__ */ jsx13("span", { className: "flex h-6 w-6 shrink-0 items-center justify-center rounded-[var(--radius-sm)] border border-border bg-muted text-muted-foreground", children: /* @__PURE__ */ jsx13(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5" }) }),
-      /* @__PURE__ */ jsx13("span", { className: "shrink-0 whitespace-nowrap text-xs font-medium text-foreground", children: friendlyToolTitle(call) }),
-      when && /* @__PURE__ */ jsx13("span", { title: when, className: "hidden min-w-0 flex-1 truncate font-mono text-xs tabular-nums text-muted-foreground sm:inline", children: formatFollowupWhen(when) }),
-      /* @__PURE__ */ jsx13("span", { className: "ml-auto flex shrink-0 items-center gap-1.5", children: call.status === "running" ? /* @__PURE__ */ jsx13("svg", { className: "h-3 w-3 shrink-0 animate-spin text-[var(--accent-text)]", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": true, children: /* @__PURE__ */ jsx13("path", { d: "M21 12a9 9 0 1 1-6.219-8.56", strokeLinecap: "round" }) }) : /* @__PURE__ */ jsx13("span", { className: `h-1.5 w-1.5 shrink-0 rounded-full ${failed ? "bg-[var(--surface-danger-text)]" : "bg-[var(--surface-success-text)]"}` }) })
+  return /* @__PURE__ */ jsx15("div", { className: "flex items-start gap-2", children: /* @__PURE__ */ jsxs13("div", { className: "min-w-0 flex-1 overflow-hidden rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)]", children: [
+    /* @__PURE__ */ jsxs13("div", { className: "flex w-full items-center gap-2.5 px-3 py-2", children: [
+      /* @__PURE__ */ jsx15("span", { className: "flex h-6 w-6 shrink-0 items-center justify-center rounded-[var(--radius-sm)] border border-border bg-muted text-muted-foreground", children: /* @__PURE__ */ jsx15(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5" }) }),
+      /* @__PURE__ */ jsx15("span", { className: "shrink-0 whitespace-nowrap text-xs font-medium text-foreground", children: friendlyToolTitle(call) }),
+      when && /* @__PURE__ */ jsx15("span", { title: when, className: "hidden min-w-0 flex-1 truncate font-mono text-xs tabular-nums text-muted-foreground sm:inline", children: formatFollowupWhen(when) }),
+      /* @__PURE__ */ jsx15("span", { className: "ml-auto flex shrink-0 items-center gap-1.5", children: call.status === "running" ? /* @__PURE__ */ jsx15("svg", { className: "h-3 w-3 shrink-0 animate-spin text-[var(--accent-text)]", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": true, children: /* @__PURE__ */ jsx15("path", { d: "M21 12a9 9 0 1 1-6.219-8.56", strokeLinecap: "round" }) }) : /* @__PURE__ */ jsx15("span", { className: `h-1.5 w-1.5 shrink-0 rounded-full ${failed ? "bg-[var(--surface-danger-text)]" : "bg-[var(--surface-success-text)]"}` }) })
     ] }),
-    errorText && /* @__PURE__ */ jsx13("div", { className: "border-t border-border px-3 py-2 text-xs text-[var(--surface-danger-text)]", children: errorText })
+    errorText && /* @__PURE__ */ jsx15("div", { className: "border-t border-border px-3 py-2 text-xs text-[var(--surface-danger-text)]", children: errorText })
   ] }) });
 }
 function toolRowTitle(call) {
@@ -5578,7 +6170,7 @@ function ToolCallCard({
   const pending = call.status === "done" ? pendingApprovalOf(call) : null;
   const kind = blockKindOf(call);
   if (pending) {
-    return /* @__PURE__ */ jsx13(
+    return /* @__PURE__ */ jsx15(
       ProposalCard,
       {
         call,
@@ -5590,17 +6182,17 @@ function ToolCallCard({
     );
   }
   if (kind === "followup") {
-    return /* @__PURE__ */ jsx13(FollowupCard, { call });
+    return /* @__PURE__ */ jsx15(FollowupCard, { call });
   }
   const custom = renderers?.[call.name]?.(call, message);
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx15(
     InlineToolItem,
     {
       part: chatToolCallPart(call),
       title: toolRowTitle(call),
       description: toolRowDescription(call),
-      renderToolDetail: () => custom ?? (call.name === "sandbox_run_command" ? /* @__PURE__ */ jsx13(ShellDetail, { call }) : /* @__PURE__ */ jsx13(DefaultToolDetail, { call })),
-      actions: onOpenRun && call.name.startsWith("sandbox_") ? /* @__PURE__ */ jsx13(
+      renderToolDetail: () => custom ?? (call.name === "sandbox_run_command" ? /* @__PURE__ */ jsx15(ShellDetail, { call }) : /* @__PURE__ */ jsx15(DefaultToolDetail, { call })),
+      actions: onOpenRun && call.name.startsWith("sandbox_") ? /* @__PURE__ */ jsx15(
         "button",
         {
           type: "button",
@@ -5608,9 +6200,9 @@ function ToolCallCard({
           "aria-label": "Open full transcript",
           title: "Open full transcript",
           className: "rounded-md p-1.5 text-muted-foreground transition hover:bg-accent hover:text-foreground",
-          children: /* @__PURE__ */ jsxs11("svg", { className: "h-3.5 w-3.5", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-            /* @__PURE__ */ jsx13("path", { d: "M7 17 17 7" }),
-            /* @__PURE__ */ jsx13("path", { d: "M7 7h10v10" })
+          children: /* @__PURE__ */ jsxs13("svg", { className: "h-3.5 w-3.5", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+            /* @__PURE__ */ jsx15("path", { d: "M7 17 17 7" }),
+            /* @__PURE__ */ jsx15("path", { d: "M7 7h10v10" })
           ] })
         }
       ) : void 0
@@ -5618,7 +6210,7 @@ function ToolCallCard({
   );
 }
 function StreamingCaret() {
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx15(
     "span",
     {
       className: "ml-0.5 inline-block h-[1.1em] w-[3px] translate-y-[2px] animate-[agent-caret_1s_step-end_infinite] rounded-sm bg-foreground/70",
@@ -5643,9 +6235,9 @@ function SegmentText({
     // the container on top of that makes the paragraph shimmer while it types.
     // The distinction is what separates "the answer materialised" from "the
     // log was appended to".
-    /* @__PURE__ */ jsxs11("div", { className: `${messageClassName}${streaming ? "" : " agent-stream-in"}`, children: [
+    /* @__PURE__ */ jsxs13("div", { className: `${messageClassName}${streaming ? "" : " agent-stream-in"}`, children: [
       body,
-      showCaret && /* @__PURE__ */ jsx13(StreamingCaret, {})
+      showCaret && /* @__PURE__ */ jsx15(StreamingCaret, {})
     ] })
   );
 }
@@ -5670,7 +6262,7 @@ function SegmentedBody({
   const leftoverToolCalls = (msg.toolCalls ?? []).filter(
     (tc) => !segmentToolIds.has(tc.id)
   );
-  const renderToolCard = (call) => /* @__PURE__ */ jsx13(
+  const renderToolCard = (call) => /* @__PURE__ */ jsx15(
     ToolCallCard,
     {
       call,
@@ -5693,9 +6285,9 @@ function SegmentedBody({
       else groups.push({ kind: "tools", index: i, calls: [seg.call] });
     }
   }
-  return /* @__PURE__ */ jsxs11("div", { className: "flex flex-col gap-2", children: [
+  return /* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-2", children: [
     groups.map(
-      (g) => g.kind === "text" ? /* @__PURE__ */ jsx13(
+      (g) => g.kind === "text" ? /* @__PURE__ */ jsx15(
         SegmentText,
         {
           content: g.content,
@@ -5708,30 +6300,30 @@ function SegmentedBody({
       ) : !streaming && g.calls.length >= COLLAPSE_TOOL_RUN_AT && !g.calls.some(isImportantTool) ? (
         // The fold is a quiet disclosure line, not a filled box — the
         // canonical rows inside it carry the row chrome.
-        /* @__PURE__ */ jsxs11("details", { children: [
-          /* @__PURE__ */ jsxs11("summary", { className: "cursor-pointer select-none rounded-md py-0.5 text-xs font-medium text-muted-foreground transition-colors hover:text-foreground", children: [
+        /* @__PURE__ */ jsxs13("details", { children: [
+          /* @__PURE__ */ jsxs13("summary", { className: "cursor-pointer select-none rounded-md py-0.5 text-xs font-medium text-muted-foreground transition-colors hover:text-foreground", children: [
             "Worked through ",
             g.calls.length,
             " steps"
           ] }),
-          /* @__PURE__ */ jsx13("div", { className: "mt-1.5 flex flex-col gap-1.5", children: g.calls.map(renderToolCard) })
+          /* @__PURE__ */ jsx15("div", { className: "mt-1.5 flex flex-col gap-1.5", children: g.calls.map(renderToolCard) })
         ] }, `tools-${g.index}`)
-      ) : /* @__PURE__ */ jsx13("div", { className: "flex flex-col gap-2", children: g.calls.map(renderToolCard) }, `tools-${g.index}`)
+      ) : /* @__PURE__ */ jsx15("div", { className: "flex flex-col gap-2", children: g.calls.map(renderToolCard) }, `tools-${g.index}`)
     ),
     leftoverToolCalls.map(renderToolCard),
-    streaming && segments[lastIndex]?.kind === "tool" && /* @__PURE__ */ jsx13(StreamingCaret, {})
+    streaming && segments[lastIndex]?.kind === "tool" && /* @__PURE__ */ jsx15(StreamingCaret, {})
   ] });
 }
-var QUIET_META_LANE_CLASS = "mt-1 flex h-[18px] items-center gap-2 text-[11px] tabular-nums text-muted-foreground opacity-0 transition-opacity duration-150 group-hover:opacity-100 group-focus-within:opacity-100 motion-reduce:transition-none [@media(hover:none)]:opacity-100";
+var QUIET_META_LANE_CLASS = "mt-1 flex h-[18px] items-center gap-2 text-xs tabular-nums text-muted-foreground opacity-0 transition-opacity duration-150 group-hover:opacity-100 group-focus-within:opacity-100 motion-reduce:transition-none [@media(hover:none)]:opacity-100";
 function copyTextOf(msg) {
   const textRuns = msg.segments?.filter((s) => s.kind === "text") ?? [];
   if (textRuns.length > 0) return textRuns.map((s) => s.content).join("\n\n");
   return msg.content;
 }
 function CopyMessageButton({ text }) {
-  const [copied, setCopied] = useState14(false);
-  const timerRef = useRef11(null);
-  useEffect11(
+  const [copied, setCopied] = useState15(false);
+  const timerRef = useRef12(null);
+  useEffect12(
     () => () => {
       if (timerRef.current !== null) clearTimeout(timerRef.current);
     },
@@ -5750,7 +6342,7 @@ function CopyMessageButton({ text }) {
       }
     );
   };
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx15(
     "button",
     {
       type: "button",
@@ -5758,9 +6350,9 @@ function CopyMessageButton({ text }) {
       "aria-label": "Copy message",
       title: "Copy message",
       className: "rounded p-0.5 text-muted-foreground transition hover:bg-accent hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-      children: copied ? /* @__PURE__ */ jsx13("svg", { className: "h-3.5 w-3.5", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx13("polyline", { points: "20 6 9 17 4 12" }) }) : /* @__PURE__ */ jsxs11("svg", { className: "h-3.5 w-3.5", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-        /* @__PURE__ */ jsx13("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2" }),
-        /* @__PURE__ */ jsx13("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
+      children: copied ? /* @__PURE__ */ jsx15("svg", { className: "h-3.5 w-3.5", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx15("polyline", { points: "20 6 9 17 4 12" }) }) : /* @__PURE__ */ jsxs13("svg", { className: "h-3.5 w-3.5", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+        /* @__PURE__ */ jsx15("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2" }),
+        /* @__PURE__ */ jsx15("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
       ] })
     }
   );
@@ -5786,16 +6378,16 @@ function AssistantMessageImpl({
   const body = useMemo7(() => renderBody(content), [renderBody, content]);
   const segments = msg.segments;
   const hasAnswerText = content !== "" || (segments?.some((s) => s.kind === "text" && s.content.trim() !== "") ?? false);
-  const reasoningScrollRef = useRef11(null);
-  const thinkStartRef = useRef11(null);
-  const thinkMsRef = useRef11(null);
+  const reasoningScrollRef = useRef12(null);
+  const thinkStartRef = useRef12(null);
+  const thinkMsRef = useRef12(null);
   if (streaming && reasoning && !hasAnswerText && thinkStartRef.current === null) {
     thinkStartRef.current = performance.now();
   }
   if (hasAnswerText && thinkStartRef.current !== null && thinkMsRef.current === null) {
     thinkMsRef.current = performance.now() - thinkStartRef.current;
   }
-  useEffect11(() => {
+  useEffect12(() => {
     const el = reasoningScrollRef.current;
     if (el && streaming && !hasAnswerText) el.scrollTop = el.scrollHeight;
   }, [reasoning, streaming, hasAnswerText]);
@@ -5803,29 +6395,29 @@ function AssistantMessageImpl({
     streaming && !!reasoning && !hasAnswerText
   );
   const quiet = chrome === "quiet";
-  return /* @__PURE__ */ jsxs11("div", { className: `mx-auto w-full max-w-3xl px-6 ${quiet ? "group pb-1 pt-3" : "py-3"}`, children: [
-    !quiet && /* @__PURE__ */ jsxs11("div", { className: "mb-1 flex items-baseline gap-2 text-[11px] tabular-nums text-muted-foreground", children: [
-      /* @__PURE__ */ jsx13("span", { className: "font-semibold uppercase tracking-[0.05em]", children: agentLabel }),
-      msg.modelUsed && /* @__PURE__ */ jsx13("span", { className: "font-mono normal-case", children: msg.modelUsed }),
-      formatTokensPerSecond(msg) && /* @__PURE__ */ jsx13("span", { children: formatTokensPerSecond(msg) }),
-      formatModelCost(msg, models) && /* @__PURE__ */ jsx13("span", { children: formatModelCost(msg, models) })
+  return /* @__PURE__ */ jsxs13("div", { className: `mx-auto w-full max-w-3xl px-6 ${quiet ? "group pb-1 pt-3" : "py-3"}`, children: [
+    !quiet && /* @__PURE__ */ jsxs13("div", { className: "mb-1 flex items-baseline gap-2 text-xs tabular-nums text-muted-foreground", children: [
+      /* @__PURE__ */ jsx15("span", { className: "font-semibold uppercase tracking-[0.05em]", children: agentLabel }),
+      msg.modelUsed && /* @__PURE__ */ jsx15("span", { className: "font-mono normal-case", children: msg.modelUsed }),
+      formatTokensPerSecond(msg) && /* @__PURE__ */ jsx15("span", { children: formatTokensPerSecond(msg) }),
+      formatModelCost(msg, models) && /* @__PURE__ */ jsx15("span", { children: formatModelCost(msg, models) })
     ] }),
-    reasoning && /* @__PURE__ */ jsxs11("details", { className: "mb-2 rounded-lg border-l-2 border-border bg-secondary px-3 py-2", open: !hasAnswerText, children: [
-      /* @__PURE__ */ jsx13("summary", { className: "cursor-pointer select-none text-xs font-medium text-muted-foreground", children: !hasAnswerText ? (
+    reasoning && /* @__PURE__ */ jsxs13("details", { className: "mb-2 rounded-lg border-l-2 border-border bg-secondary px-3 py-2", open: !hasAnswerText, children: [
+      /* @__PURE__ */ jsx15("summary", { className: "cursor-pointer select-none text-xs font-medium text-muted-foreground", children: !hasAnswerText ? (
         // A pulse dims the whole word on a loop, which is the same cue a
         // skeleton placeholder uses — it reads as "nothing here yet". A
         // sweep travels THROUGH the glyphs, which reads as work in
         // flight, and the elapsed seconds say how much. `essential`
         // because it is the only signal separating a working agent from
         // a stuck one, and reduced-motion still collapses its duration.
-        /* @__PURE__ */ jsxs11("span", { className: "agent-shimmer", "data-motion": "essential", children: [
+        /* @__PURE__ */ jsxs13("span", { className: "agent-shimmer", "data-motion": "essential", children: [
           "Thinking",
           thinkingSeconds >= 1 ? ` \xB7 ${thinkingSeconds}s` : "\u2026"
         ] })
       ) : thinkMsRef.current != null ? `Thought for ${Math.max(1, Math.round(thinkMsRef.current / 1e3))}s` : "Thought process" }),
-      /* @__PURE__ */ jsx13("div", { ref: reasoningScrollRef, className: "mt-2 max-h-48 overflow-y-auto whitespace-pre-wrap text-xs leading-relaxed text-muted-foreground", children: reasoning })
+      /* @__PURE__ */ jsx15("div", { ref: reasoningScrollRef, className: "mt-2 max-h-48 overflow-y-auto whitespace-pre-wrap text-xs leading-relaxed text-muted-foreground", children: reasoning })
     ] }),
-    segments && segments.length > 0 ? /* @__PURE__ */ jsx13(
+    segments && segments.length > 0 ? /* @__PURE__ */ jsx15(
       SegmentedBody,
       {
         segments,
@@ -5837,12 +6429,12 @@ function AssistantMessageImpl({
         toolRenderers,
         messageClassName
       }
-    ) : /* @__PURE__ */ jsxs11(Fragment7, { children: [
-      /* @__PURE__ */ jsxs11("div", { className: messageClassName, children: [
+    ) : /* @__PURE__ */ jsxs13(Fragment8, { children: [
+      /* @__PURE__ */ jsxs13("div", { className: messageClassName, children: [
         body,
-        streaming && content && !msg.toolCalls?.length && /* @__PURE__ */ jsx13(StreamingCaret, {})
+        streaming && content && !msg.toolCalls?.length && /* @__PURE__ */ jsx15(StreamingCaret, {})
       ] }),
-      msg.toolCalls && msg.toolCalls.length > 0 && /* @__PURE__ */ jsx13("div", { className: "mt-2 flex flex-col gap-1.5", children: msg.toolCalls.map((tc) => /* @__PURE__ */ jsx13(
+      msg.toolCalls && msg.toolCalls.length > 0 && /* @__PURE__ */ jsx15("div", { className: "mt-2 flex flex-col gap-1.5", children: msg.toolCalls.map((tc) => /* @__PURE__ */ jsx15(
         ToolCallCard,
         {
           call: tc,
@@ -5854,7 +6446,7 @@ function AssistantMessageImpl({
         tc.id
       )) })
     ] }),
-    durableCards && msg.parts && /* @__PURE__ */ jsx13(
+    durableCards && msg.parts && /* @__PURE__ */ jsx15(
       DurableChatCards,
       {
         ...durableCards,
@@ -5863,7 +6455,7 @@ function AssistantMessageImpl({
         className: "mt-3"
       }
     ),
-    workProductCards && workProductPartsFromMessageParts(msg.parts).map((part) => /* @__PURE__ */ jsx13(
+    workProductCards && workProductPartsFromMessageParts(msg.parts).map((part) => /* @__PURE__ */ jsx15(
       WorkProductCard,
       {
         part,
@@ -5873,7 +6465,7 @@ function AssistantMessageImpl({
       `${part.ref.id}:${part.ref.version}`
     )),
     renderExtras?.(msg),
-    resolveAttachmentUrl && attachmentPartsFromMessageParts(msg.parts).length > 0 && /* @__PURE__ */ jsx13("div", { className: "mt-2", children: /* @__PURE__ */ jsx13(
+    resolveAttachmentUrl && attachmentPartsFromMessageParts(msg.parts).length > 0 && /* @__PURE__ */ jsx15("div", { className: "mt-2", children: /* @__PURE__ */ jsx15(
       MessageAttachments,
       {
         parts: attachmentPartsFromMessageParts(msg.parts),
@@ -5881,18 +6473,18 @@ function AssistantMessageImpl({
         justify: "start"
       }
     ) }),
-    quiet && /* @__PURE__ */ jsxs11("div", { "data-testid": "message-meta-lane", className: QUIET_META_LANE_CLASS, children: [
-      /* @__PURE__ */ jsx13(CopyMessageButton, { text: copyTextOf(msg) }),
-      msg.modelUsed && /* @__PURE__ */ jsx13("span", { className: "font-mono", children: msg.modelUsed }),
-      formatTokensPerSecond(msg) && /* @__PURE__ */ jsx13("span", { children: formatTokensPerSecond(msg) }),
-      formatModelCost(msg, models) && /* @__PURE__ */ jsx13("span", { children: formatModelCost(msg, models) })
+    quiet && /* @__PURE__ */ jsxs13("div", { "data-testid": "message-meta-lane", className: QUIET_META_LANE_CLASS, children: [
+      /* @__PURE__ */ jsx15(CopyMessageButton, { text: copyTextOf(msg) }),
+      msg.modelUsed && /* @__PURE__ */ jsx15("span", { className: "font-mono", children: msg.modelUsed }),
+      formatTokensPerSecond(msg) && /* @__PURE__ */ jsx15("span", { children: formatTokensPerSecond(msg) }),
+      formatModelCost(msg, models) && /* @__PURE__ */ jsx15("span", { children: formatModelCost(msg, models) })
     ] })
   ] });
 }
 var AssistantMessage = memo(AssistantMessageImpl);
 function useThinkingSeconds(active) {
-  const [seconds, setSeconds] = useState14(0);
-  useEffect11(() => {
+  const [seconds, setSeconds] = useState15(0);
+  useEffect12(() => {
     if (!active) return;
     setSeconds(0);
     const id = setInterval(() => setSeconds((s) => s + 1), 1e3);
@@ -5902,28 +6494,28 @@ function useThinkingSeconds(active) {
 }
 function ThinkingRow({ agentLabel, chrome = "labeled" }) {
   const seconds = useThinkingSeconds(true);
-  return /* @__PURE__ */ jsxs11("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: [
-    chrome !== "quiet" && /* @__PURE__ */ jsx13("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-[0.05em] text-muted-foreground", children: agentLabel }),
-    /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 text-[15px] text-muted-foreground", children: [
-      /* @__PURE__ */ jsx13("svg", { className: "h-4 w-4 animate-spin", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": true, children: /* @__PURE__ */ jsx13("path", { d: "M21 12a9 9 0 1 1-6.219-8.56", strokeLinecap: "round" }) }),
+  return /* @__PURE__ */ jsxs13("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: [
+    chrome !== "quiet" && /* @__PURE__ */ jsx15("p", { className: "mb-1 text-xs font-semibold uppercase tracking-[0.05em] text-muted-foreground", children: agentLabel }),
+    /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2 text-[15px] text-muted-foreground", children: [
+      /* @__PURE__ */ jsx15("svg", { className: "h-4 w-4 animate-spin", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": true, children: /* @__PURE__ */ jsx15("path", { d: "M21 12a9 9 0 1 1-6.219-8.56", strokeLinecap: "round" }) }),
       "Thinking",
       seconds >= 3 ? ` \xB7 ${seconds}s` : "..."
     ] })
   ] });
 }
 function StreamErrorRow({ message, onRetry }) {
-  return /* @__PURE__ */ jsx13("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: /* @__PURE__ */ jsxs11("div", { role: "alert", className: "flex items-start gap-2.5 rounded-lg border border-destructive/40 bg-destructive/5 px-3 py-2.5 text-sm text-destructive", children: [
-    /* @__PURE__ */ jsxs11("svg", { className: "mt-0.5 h-4 w-4 shrink-0", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx13("circle", { cx: "12", cy: "12", r: "9" }),
-      /* @__PURE__ */ jsx13("path", { d: "M12 8v4m0 4h.01" })
+  return /* @__PURE__ */ jsx15("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: /* @__PURE__ */ jsxs13("div", { role: "alert", className: "flex items-start gap-2.5 rounded-lg border border-destructive/40 bg-destructive/5 px-3 py-2.5 text-sm text-destructive", children: [
+    /* @__PURE__ */ jsxs13("svg", { className: "mt-0.5 h-4 w-4 shrink-0", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx15("circle", { cx: "12", cy: "12", r: "9" }),
+      /* @__PURE__ */ jsx15("path", { d: "M12 8v4m0 4h.01" })
     ] }),
-    /* @__PURE__ */ jsx13("span", { className: "min-w-0 flex-1 break-words", children: message }),
-    onRetry && /* @__PURE__ */ jsx13(
+    /* @__PURE__ */ jsx15("span", { className: "min-w-0 flex-1 break-words", children: message }),
+    onRetry && /* @__PURE__ */ jsx15(
       "button",
       {
         type: "button",
         onClick: onRetry,
-        className: `shrink-0 rounded border border-destructive/40 bg-card px-2 py-0.5 text-[11px] font-medium text-destructive transition hover:bg-destructive/10 ${POPOVER_OPTION_FOCUS}`,
+        className: `shrink-0 rounded border border-destructive/40 bg-card px-2 py-0.5 text-xs font-medium text-destructive transition hover:bg-destructive/10 ${POPOVER_OPTION_FOCUS}`,
         children: "Retry"
       }
     )
@@ -5951,34 +6543,34 @@ function ChatMessages({
   resolveAttachmentUrl,
   workProductCards
 }) {
-  const messageClassName = messageSize === "large" ? "agent-app-message-copy text-[16px] leading-[1.6]" : "agent-app-message-copy text-[15px] leading-[1.6]";
+  const messageClassName = messageSize === "large" ? "agent-app-message-copy text-[17px] leading-[1.6]" : "agent-app-message-copy text-base leading-[1.6]";
   const renderBody = useMemo7(
-    () => renderMarkdown ?? ((content) => /* @__PURE__ */ jsx13("p", { className: "whitespace-pre-wrap", children: content })),
+    () => renderMarkdown ?? ((content) => /* @__PURE__ */ jsx15("p", { className: "whitespace-pre-wrap", children: content })),
     [renderMarkdown]
   );
   const lastIsUser = messages[messages.length - 1]?.role === "user";
   const quiet = chrome === "quiet";
   if (messages.length === 0 && !loading && !error) {
-    const empty = renderEmpty ? renderEmpty() : /* @__PURE__ */ jsx13(ChatEmptyState, { ...emptyState });
-    return /* @__PURE__ */ jsxs11(Fragment7, { children: [
+    const empty = renderEmpty ? renderEmpty() : /* @__PURE__ */ jsx15(ChatEmptyState, { ...emptyState });
+    return /* @__PURE__ */ jsxs13(Fragment8, { children: [
       header,
       empty
     ] });
   }
-  return /* @__PURE__ */ jsxs11(Fragment7, { children: [
+  return /* @__PURE__ */ jsxs13(Fragment8, { children: [
     header,
     messages.map(
-      (msg) => msg.role === "user" ? /* @__PURE__ */ jsxs11("div", { className: `mx-auto w-full max-w-3xl px-6 ${quiet ? "group pb-1 pt-3" : "py-3"}`, children: [
-        /* @__PURE__ */ jsxs11("div", { className: `ml-auto w-fit ${quiet ? "max-w-[72%]" : "max-w-[85%]"}`, children: [
-          !quiet && /* @__PURE__ */ jsx13("p", { className: "mb-1 text-right text-[11px] font-semibold uppercase tracking-[0.05em] text-muted-foreground", children: userLabel }),
-          /* @__PURE__ */ jsx13(
+      (msg) => msg.role === "user" ? /* @__PURE__ */ jsxs13("div", { className: `mx-auto w-full max-w-3xl px-6 ${quiet ? "group pb-1 pt-3" : "py-3"}`, children: [
+        /* @__PURE__ */ jsxs13("div", { className: `ml-auto w-fit ${quiet ? "max-w-[72%]" : "max-w-[85%]"}`, children: [
+          !quiet && /* @__PURE__ */ jsx15("p", { className: "mb-1 text-right text-xs font-semibold uppercase tracking-[0.05em] text-muted-foreground", children: userLabel }),
+          /* @__PURE__ */ jsx15(
             "div",
             {
               className: quiet ? `rounded-2xl bg-[color-mix(in_srgb,hsl(var(--secondary))_65%,hsl(var(--background)))] px-4 py-2.5 ${messageClassName}` : `rounded-2xl rounded-tr-md bg-primary/10 px-4 py-2.5 ${messageClassName}`,
-              children: /* @__PURE__ */ jsx13("p", { className: "whitespace-pre-wrap", children: msg.content })
+              children: /* @__PURE__ */ jsx15("p", { className: "whitespace-pre-wrap", children: msg.content })
             }
           ),
-          resolveAttachmentUrl && attachmentPartsFromMessageParts(msg.parts).length > 0 && /* @__PURE__ */ jsx13("div", { className: "mt-1.5", children: /* @__PURE__ */ jsx13(
+          resolveAttachmentUrl && attachmentPartsFromMessageParts(msg.parts).length > 0 && /* @__PURE__ */ jsx15("div", { className: "mt-1.5", children: /* @__PURE__ */ jsx15(
             MessageAttachments,
             {
               parts: attachmentPartsFromMessageParts(msg.parts),
@@ -5987,8 +6579,8 @@ function ChatMessages({
             }
           ) })
         ] }),
-        quiet && /* @__PURE__ */ jsx13("div", { "data-testid": "message-meta-lane", className: `${QUIET_META_LANE_CLASS} justify-end`, children: /* @__PURE__ */ jsx13(CopyMessageButton, { text: msg.content }) })
-      ] }, msg.id) : /* @__PURE__ */ jsx13(
+        quiet && /* @__PURE__ */ jsx15("div", { "data-testid": "message-meta-lane", className: `${QUIET_META_LANE_CLASS} justify-end`, children: /* @__PURE__ */ jsx15(CopyMessageButton, { text: msg.content }) })
+      ] }, msg.id) : /* @__PURE__ */ jsx15(
         AssistantMessage,
         {
           msg,
@@ -6009,8 +6601,8 @@ function ChatMessages({
         msg.id
       )
     ),
-    loading && lastIsUser && /* @__PURE__ */ jsx13(ThinkingRow, { agentLabel, chrome }),
-    error && !loading && /* @__PURE__ */ jsx13(StreamErrorRow, { message: error, onRetry })
+    loading && lastIsUser && /* @__PURE__ */ jsx15(ThinkingRow, { agentLabel, chrome }),
+    error && !loading && /* @__PURE__ */ jsx15(StreamErrorRow, { message: error, onRetry })
   ] });
 }
 
@@ -6119,6 +6711,26 @@ export {
   withoutRecordGridRemoved,
   pruneRecordGridOverlay,
   RecordGrid,
+  DEFAULT_SPARKLINE_WIDTH,
+  DEFAULT_SPARKLINE_HEIGHT,
+  DEFAULT_SPARKLINE_LABEL,
+  DEFAULT_SPARKLINE_EMPTY_LABEL,
+  DEFAULT_SPARKLINE_UNAVAILABLE_LABEL,
+  formatSparklineValue,
+  sparklineReadings,
+  sparklineGeometry,
+  sparklinePointsAttribute,
+  sparklineLabel,
+  Sparkline,
+  insightDelta,
+  insightDeltaTone,
+  formatInsightDelta,
+  InsightCard,
+  DEFAULT_INSIGHT_PAGE_SIZE,
+  insightPageSize,
+  insightPageCount,
+  insightPageSlice,
+  InsightDeck,
   formatModelCost,
   formatTokensPerSecond,
   RunDrillIn,
@@ -6128,4 +6740,4 @@ export {
   useThinkingSeconds,
   ChatMessages
 };
-//# sourceMappingURL=chunk-C7AQW6US.js.map
+//# sourceMappingURL=chunk-7HY4LX7O.js.map