@tangle-network/agent-app 0.43.41 → 0.43.42

package/dist/{chunk-KM766NN3.js → chunk-ZLHK25C3.js}

@@ -6,16 +6,22 @@ import {
   fieldAcceptsFreeText,
   interactionFromWireRequest,
   isTerminalInteractionStatus,
+  parseInteractionCancel,
   parseInteractionRequest,
+  persistedPartToInteraction,
   questionInteractionContentSignature
-} from "./chunk-4TXDD6P2.js";
+} from "./chunk-XAWFPMAR.js";
+import {
+  parsePlanSubmittedEvent,
+  persistedPartToPlan
+} from "./chunk-SIXYZ2FB.js";
 import {
   snapHarnessToModel,
   snapModelToHarness
 } from "./chunk-E7QYOOON.js";
 
 // src/web-react/index.tsx
-import { useEffect as useEffect5, useMemo as useMemo7, useRef as useRef7, useState as useState10, memo } from "react";
+import { useEffect as useEffect8, useMemo as useMemo7, useRef as useRef8, useState as useState12, memo } from "react";
 
 // src/web-react/smooth-text.ts
 import { useEffect, useRef, useState } from "react";
@@ -372,1003 +378,1484 @@ function BrandMark({ size = 24, className }) {
   return /* @__PURE__ */ jsx3(Suspense, { fallback: /* @__PURE__ */ jsx3(MarkSpacer, { size, className }), children: /* @__PURE__ */ jsx3(LazyKnot, { size, className }) });
 }
 
-// src/web-react/chat-stream.ts
-function dispatchChatStreamLine(line, cb) {
-  let receivedContent = false;
-  let turnId;
-  if (!line.trim()) return { receivedContent };
-  let parsed;
-  try {
-    parsed = JSON.parse(line);
-  } catch {
-    return { receivedContent };
-  }
-  if (parsed.kind === "tool_result") {
-    cb.onToolResult?.({
-      toolCallId: parsed.toolCallId,
-      toolName: parsed.toolName,
-      label: parsed.label,
-      outcome: parsed.outcome ?? parsed.result
-    });
-    return { receivedContent: true };
-  }
-  const evt = parsed.kind === "event" ? parsed.event : parsed;
-  if (!evt || typeof evt !== "object") return { receivedContent };
-  switch (evt.type) {
-    case "turn":
-      if (typeof evt.turnId === "string") turnId = evt.turnId;
-      break;
-    case "text":
-      if (typeof evt.text === "string") {
-        cb.onText?.(evt.text);
-        receivedContent = true;
-      }
-      break;
-    case "reasoning":
-      if (typeof evt.text === "string") {
-        cb.onReasoning?.(evt.text);
-        receivedContent = true;
-      }
-      break;
-    case "tool_call": {
-      const call = evt.call ?? evt;
-      cb.onToolCall?.({
-        toolCallId: call.toolCallId ?? call.id,
-        toolName: String(call.toolName ?? call.name ?? "unknown"),
-        args: call.args ?? {}
-      });
-      receivedContent = true;
-      break;
-    }
-    case "tool_result":
-      cb.onToolResult?.({
-        toolCallId: evt.toolCallId,
-        toolName: evt.toolName,
-        label: evt.label,
-        outcome: evt.outcome ?? evt.result
-      });
-      receivedContent = true;
-      break;
-    case "usage": {
-      const u = evt.usage;
-      if (u) cb.onUsage?.({ promptTokens: u.promptTokens ?? 0, completionTokens: u.completionTokens ?? 0 });
-      break;
-    }
-    case "metadata":
-      cb.onMetadata?.(evt.data ?? {});
-      break;
-    case "interaction": {
-      const parsed2 = parseInteractionRequest(evt.data);
-      if (parsed2.succeeded) {
-        cb.onInteraction?.(interactionFromWireRequest(parsed2.value));
-        receivedContent = true;
-      } else {
-        console.error("[chat-stream] dropping malformed interaction line:", parsed2.error);
-      }
-      break;
-    }
-    case "error": {
-      const data = evt.data;
-      const message = String(data?.message ?? evt.details ?? evt.error ?? "Unknown stream error");
-      if (cb.onErrorEvent) {
-        cb.onErrorEvent(message);
-      } else {
-        console.error("[chat-stream] unhandled stream error event:", message);
-        cb.onText?.(`
+// src/web-react/durable-plan-card.tsx
+import { useEffect as useEffect4, useState as useState4 } from "react";
 
-The agent hit an error and this turn stopped: ${message}`);
-        receivedContent = true;
-      }
-      break;
-    }
-    default:
-      break;
-  }
-  return { turnId, receivedContent };
+// src/web-react/interaction-question-card.tsx
+import { useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
+
+// src/web-react/interaction-card-support.ts
+function interactionStatusLabels(labels) {
+  return { cancelled: "Withdrawn", expired: "Expired", ...labels };
 }
-async function consumeChatStream(body, cb) {
-  const reader = body.getReader();
-  const decoder = new TextDecoder();
-  let buffer = "";
-  let turnId = null;
-  let receivedContent = false;
-  const handle = (line) => {
-    const r = dispatchChatStreamLine(line, cb);
-    if (r.turnId) {
-      turnId = r.turnId;
-      cb.onTurnId?.(r.turnId);
-    }
-    if (r.receivedContent) receivedContent = true;
+function interactionTerminalNotes(noun, extra) {
+  return {
+    expired: `This ${noun} expired \u2014 send a new message to continue.`,
+    cancelled: `The agent withdrew this ${noun}.`,
+    ...extra
   };
-  for (; ; ) {
-    const { done, value } = await reader.read();
-    if (done) {
-      if (buffer.trim()) handle(buffer);
-      break;
+}
+function fieldValuesFromAnswers(fields, answers) {
+  if (!answers) return {};
+  const values = {};
+  for (const field of fields) {
+    const answer = answers[field.name];
+    if (answer === void 0) continue;
+    if (field.type === "select") {
+      values[field.name] = { selected: Array.isArray(answer) ? [...answer] : [String(answer)] };
+    } else if (field.type === "boolean") {
+      values[field.name] = { selected: [String(answer)] };
+    } else {
+      values[field.name] = { text: String(answer) };
     }
-    buffer += decoder.decode(value, { stream: true });
-    const lines = buffer.split("\n");
-    buffer = lines.pop() ?? "";
-    for (const line of lines) handle(line);
   }
-  return { turnId, receivedContent };
+  return values;
 }
-async function streamChatTurn(opts) {
-  const res = await opts.start();
-  if (!res.ok || !res.body) {
-    const err = await res.json().catch(() => ({ error: `HTTP ${res.status}` }));
-    throw new Error(err.error ?? `HTTP ${res.status}`);
+function fieldAnswer(field, values) {
+  const value = values[field.name] ?? {};
+  if (field.type === "select") {
+    const custom = field.allowCustom === true ? value.custom?.trim() : void 0;
+    const chosen = [...value.selected ?? [], ...custom ? [custom] : []];
+    if (field.multi !== true && custom) return [custom];
+    return chosen.length > 0 ? chosen : null;
   }
-  let turnId = null;
-  const cb = {
-    ...opts.callbacks,
-    onTurnId: (id) => {
-      turnId = id;
-      opts.callbacks.onTurnId?.(id);
+  if (field.type === "number") {
+    const parsed = Number(value.text);
+    return value.text?.trim() && Number.isFinite(parsed) ? parsed : null;
+  }
+  if (field.type === "boolean") return value.selected ? value.selected[0] === "true" : null;
+  const text = value.text?.trim();
+  return text ? text : null;
+}
+function buildAnswerData(fields, values) {
+  const data = {};
+  for (const field of fields) {
+    const answer = fieldAnswer(field, values);
+    if (answer === null) {
+      if (field.required === false) continue;
+      return null;
     }
-  };
-  try {
-    return await consumeChatStream(res.body, cb);
-  } catch (transportErr) {
-    if (!turnId || !opts.resume) throw transportErr;
-    opts.onResetForResume?.();
-    const resumed = await opts.resume(turnId, 0);
-    if (!resumed.ok || !resumed.body) throw transportErr;
-    return await consumeChatStream(resumed.body, cb);
+    data[field.name] = answer;
   }
+  return data;
 }
-
-// src/web-react/chat-composer.tsx
-import {
-  useCallback,
-  useEffect as useEffect3,
-  useRef as useRef3,
-  useState as useState3
-} from "react";
-import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-function SendGlyph({ className }) {
-  return /* @__PURE__ */ jsx4("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx4("path", { d: "M22 2 11 13M22 2l-7 20-4-9-9-4 20-7z" }) });
+function isLateAnswerableStatus(status) {
+  return status === "expired" || status === "cancelled";
 }
-function StopGlyph({ className }) {
-  return /* @__PURE__ */ jsx4("svg", { className, viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": true, children: /* @__PURE__ */ jsx4("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2" }) });
+function hasSecretField(fields) {
+  return fields.some((field) => field.type === "secret");
 }
-function PaperclipGlyph({ className }) {
-  return /* @__PURE__ */ jsx4("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx4("path", { d: "m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
+function optionLabel(field, value) {
+  return field.options.find((option) => option.value === value)?.label ?? value;
 }
-function FolderGlyph({ className }) {
-  return /* @__PURE__ */ jsxs3("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-    /* @__PURE__ */ jsx4("path", { d: "M4 20h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.93a2 2 0 0 1-1.66-.9l-.82-1.2A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13c0 1.1.9 2 2 2Z" }),
-    /* @__PURE__ */ jsx4("path", { d: "M12 10v6m-3-3h6" })
-  ] });
+function answerText(field, answer) {
+  if (field.type === "select" && Array.isArray(answer)) {
+    return answer.map((value) => optionLabel(field, value)).join(", ");
+  }
+  if (field.type === "boolean") return answer === true ? "Yes" : "No";
+  if (field.type === "secret") return "[secret omitted]";
+  return String(answer);
 }
-function CloseGlyph({ className }) {
-  return /* @__PURE__ */ jsx4("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx4("path", { d: "M18 6 6 18M6 6l12 12" }) });
+function lateAnswerMessage(interaction, data) {
+  const title = interaction.title.trim() || "the earlier question";
+  const body = interaction.body?.trim();
+  const answers = interaction.fields.map((field) => {
+    const answer = data[field.name];
+    if (answer === void 0) return null;
+    return { label: field.label.trim(), text: answerText(field, answer).trim() };
+  }).filter((item) => !!item && item.text.length > 0);
+  const only = answers.length === 1 ? answers[0] : void 0;
+  const answerSummary = only ? only.text : answers.map((item) => `${item.label || "Answer"}: ${item.text}`).join("\n");
+  return [
+    `Regarding your earlier question: "${title}"`,
+    body ? `Context: ${body}` : null,
+    `My answer: ${answerSummary}`
+  ].filter((line) => !!line).join("\n");
 }
-function UploadGlyph({ className }) {
-  return /* @__PURE__ */ jsx4("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx4("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M17 8l-5-5-5 5M12 3v12" }) });
+var INTERACTION_SUBMIT_TIMEOUT_MS = 3e4;
+var INTERACTION_SUBMIT_TIMEOUT_MESSAGE = "Could not reach the agent. Try again.";
+async function responseErrorMessage(res) {
+  const text = await res.text().catch(() => "");
+  if (text) {
+    try {
+      const parsed = JSON.parse(text);
+      const message = typeof parsed.error === "string" && parsed.error.trim() ? parsed.error : typeof parsed.message === "string" && parsed.message.trim() ? parsed.message : null;
+      if (message) return { ...typeof parsed.code === "string" ? { code: parsed.code } : {}, message };
+    } catch {
+    }
+  }
+  return { message: `Answer failed (${res.status})` };
 }
-var MAX_HEIGHT = 168;
-function ChatComposer({
-  onSend,
-  onSendParts,
-  onCancel,
-  isStreaming = false,
-  disabled = false,
-  placeholder = "Message the agent\u2026",
-  value,
-  onValueChange,
-  initialValue,
-  seed,
-  onSeedApplied,
-  controls,
-  controlsPlacement = "above",
-  onAttach,
-  onAttachFolder,
-  pendingFiles = [],
-  onRemoveFile,
-  accept,
-  dropTitle = "Drop files to add context",
-  dropDescription = "They attach to your next message.",
-  focusShortcut = true,
-  sendLabel = "Send",
-  className
-}) {
-  const isControlled = value !== void 0;
-  const [internal, setInternal] = useState3(initialValue ?? "");
-  const text = isControlled ? value : internal;
-  const textareaRef = useRef3(null);
-  const fileInputRef = useRef3(null);
-  const folderInputRef = useRef3(null);
-  const [dragOver, setDragOver] = useState3(false);
-  const dragDepth = useRef3(0);
-  const setText = useCallback(
-    (next) => {
-      if (!isControlled) setInternal(next);
-      onValueChange?.(next);
-    },
-    [isControlled, onValueChange]
-  );
-  useEffect3(() => {
-    const el = textareaRef.current;
-    if (!el) return;
-    el.style.height = "auto";
-    el.style.height = `${Math.min(el.scrollHeight, MAX_HEIGHT)}px`;
-  }, [text]);
-  const prevSeedRef = useRef3(null);
-  const pendingCaretRef = useRef3(null);
-  useEffect3(() => {
-    const prev = prevSeedRef.current;
-    prevSeedRef.current = seed ?? null;
-    if (seed == null || seed === prev || isControlled) return;
-    setText(seed);
-    onSeedApplied?.();
-    const el = textareaRef.current;
-    if (el && el.value === seed) {
-      el.focus();
-      el.setSelectionRange(seed.length, seed.length);
-    } else {
-      pendingCaretRef.current = seed;
-    }
-  }, [seed, setText, onSeedApplied, isControlled]);
-  useEffect3(() => {
-    if (pendingCaretRef.current == null || pendingCaretRef.current !== text)
-      return;
-    pendingCaretRef.current = null;
-    const el = textareaRef.current;
-    if (!el) return;
-    el.focus();
-    el.setSelectionRange(text.length, text.length);
-  }, [text]);
-  useEffect3(() => {
-    if (!focusShortcut || disabled) return;
-    function onKeyDown(e) {
-      if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "l") {
-        e.preventDefault();
-        textareaRef.current?.focus();
+function createInteractionAnswerSubmitter(options) {
+  const timeoutMs = options.timeoutMs ?? INTERACTION_SUBMIT_TIMEOUT_MS;
+  return async (submission) => {
+    const doFetch = options.fetchImpl ?? fetch;
+    const url = typeof options.url === "function" ? options.url(submission) : options.url;
+    const extra = typeof options.body === "function" ? options.body(submission) : options.body ?? {};
+    const controller = new AbortController();
+    const timer = setTimeout(() => controller.abort(INTERACTION_SUBMIT_TIMEOUT_MESSAGE), timeoutMs);
+    try {
+      const res = await doFetch(url, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        signal: controller.signal,
+        body: JSON.stringify({
+          ...extra,
+          id: submission.id,
+          outcome: submission.outcome,
+          ...submission.data ? { data: submission.data } : {}
+        })
+      });
+      if (res.ok) return { ok: true };
+      const failure = await responseErrorMessage(res);
+      return { ok: false, expired: res.status === 410, message: failure.message };
+    } catch (err) {
+      if (controller.signal.aborted) {
+        return { ok: false, expired: false, message: INTERACTION_SUBMIT_TIMEOUT_MESSAGE };
       }
-    }
-    document.addEventListener("keydown", onKeyDown);
-    return () => document.removeEventListener("keydown", onKeyDown);
-  }, [focusShortcut, disabled]);
-  const readyParts = pendingFiles.filter((f) => f.status === "ready" && f.part).map((f) => f.part);
-  const hasSendable = onSendParts ? text.trim().length > 0 || readyParts.length > 0 : text.trim().length > 0;
-  const canSend = hasSendable && !isStreaming && !disabled;
-  const send = useCallback(() => {
-    const trimmed = text.trim();
-    if (isStreaming || disabled) return;
-    if (onSendParts) {
-      const parts = pendingFiles.filter((f) => f.status === "ready" && f.part).map((f) => f.part);
-      if (!trimmed && parts.length === 0) return;
-      onSendParts(trimmed, parts);
-      setText("");
-      return;
-    }
-    if (!trimmed) return;
-    onSend?.(trimmed);
-    setText("");
-  }, [text, isStreaming, disabled, onSend, onSendParts, pendingFiles, setText]);
-  const handleKeyDown = (e) => {
-    if (e.nativeEvent.isComposing) return;
-    if (e.key === "Enter" && !e.shiftKey) {
-      e.preventDefault();
-      send();
+      return { ok: false, expired: false, message: err instanceof Error ? err.message : "Failed to submit the answer" };
+    } finally {
+      clearTimeout(timer);
     }
   };
-  const handleFileChange = (e) => {
-    if (e.target.files?.length) onAttach?.(e.target.files);
-    e.target.value = "";
-  };
-  const handleFolderChange = (e) => {
-    if (e.target.files?.length) (onAttachFolder ?? onAttach)?.(e.target.files);
-    e.target.value = "";
-  };
-  const handleDragEnter = useCallback((e) => {
-    e.preventDefault();
-    e.stopPropagation();
-    dragDepth.current++;
-    if (e.dataTransfer?.types.includes("Files")) setDragOver(true);
-  }, []);
-  const handleDragLeave = useCallback((e) => {
-    e.preventDefault();
-    e.stopPropagation();
-    dragDepth.current--;
-    if (dragDepth.current <= 0) {
-      dragDepth.current = 0;
-      setDragOver(false);
+}
+
+// src/web-react/interaction-question-card.tsx
+import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+function CheckGlyph({ className }) {
+  return /* @__PURE__ */ jsx4("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx4("path", { d: "M20 6 9 17l-5-5" }) });
+}
+var BADGE_VARIANT_CLASSES = {
+  outline: "border-border text-foreground",
+  default: "border-transparent bg-primary text-primary-foreground",
+  destructive: "border-transparent bg-destructive/15 text-destructive"
+};
+function InteractionBadge({ variant, children }) {
+  return /* @__PURE__ */ jsx4("span", { className: `inline-flex items-center rounded-md border px-2 py-0.5 text-xs font-medium ${BADGE_VARIANT_CLASSES[variant]}`, children });
+}
+function InteractionActionButton({
+  variant = "primary",
+  onClick,
+  disabled,
+  children
+}) {
+  const variantClasses = variant === "primary" ? "bg-primary text-primary-foreground shadow-sm hover:bg-primary/90" : "border border-border bg-transparent text-foreground hover:bg-accent/40";
+  return /* @__PURE__ */ jsx4(
+    "button",
+    {
+      type: "button",
+      onClick,
+      disabled,
+      className: `inline-flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-sm font-medium transition disabled:cursor-not-allowed disabled:opacity-40 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring ${variantClasses}`,
+      children
     }
-  }, []);
-  const handleDragOver = useCallback((e) => {
-    e.preventDefault();
-    e.stopPropagation();
-    if (e.dataTransfer) e.dataTransfer.dropEffect = "copy";
-  }, []);
-  const handleDrop = useCallback(
-    (e) => {
-      e.preventDefault();
-      e.stopPropagation();
-      dragDepth.current = 0;
-      setDragOver(false);
-      const files = e.dataTransfer?.files;
-      if (files?.length) onAttach?.(files);
-    },
-    [onAttach]
   );
-  const folderChips = pendingFiles.filter((f) => f.kind === "folder");
-  const fileChips = pendingFiles.filter((f) => f.kind !== "folder");
-  const showFooter = controls != null && controlsPlacement === "footer";
-  const showAbove = controls != null && controlsPlacement === "above";
-  return /* @__PURE__ */ jsxs3(
-    "div",
-    {
-      className: `relative ${className ?? ""}`,
-      onDragEnter: onAttach ? handleDragEnter : void 0,
-      onDragLeave: onAttach ? handleDragLeave : void 0,
-      onDragOver: onAttach ? handleDragOver : void 0,
-      onDrop: onAttach ? handleDrop : void 0,
-      children: [
-        dragOver && /* @__PURE__ */ jsx4("div", { className: "pointer-events-none absolute inset-0 z-10 flex items-center justify-center rounded-2xl border-2 border-dashed border-primary/50 bg-card/95", children: /* @__PURE__ */ jsxs3("div", { className: "text-center", children: [
-          /* @__PURE__ */ jsx4("span", { className: "mx-auto mb-2 flex h-11 w-11 items-center justify-center rounded-xl bg-primary/10 text-primary", children: /* @__PURE__ */ jsx4(UploadGlyph, { className: "h-5 w-5" }) }),
-          /* @__PURE__ */ jsx4("p", { className: "text-sm font-semibold text-foreground", children: dropTitle }),
-          /* @__PURE__ */ jsx4("p", { className: "mt-0.5 text-xs text-muted-foreground", children: dropDescription })
-        ] }) }),
-        showAbove && /* @__PURE__ */ jsx4("div", { className: "mb-1.5 flex flex-wrap items-center gap-1.5 px-1", children: controls }),
-        pendingFiles.length > 0 && /* @__PURE__ */ jsx4("div", { className: "mb-2 flex flex-wrap gap-1.5", children: [...folderChips, ...fileChips].map((f) => /* @__PURE__ */ jsxs3(
-          "span",
-          {
-            className: `inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-xs ${f.status === "error" ? "border-destructive/40 text-destructive" : "border-border bg-muted/50 text-foreground"}`,
-            children: [
-              f.kind === "folder" ? /* @__PURE__ */ jsx4(FolderGlyph, { className: "h-3 w-3 shrink-0" }) : /* @__PURE__ */ jsx4(PaperclipGlyph, { className: "h-3 w-3 shrink-0" }),
-              /* @__PURE__ */ jsx4("span", { className: "max-w-[150px] truncate", children: f.name }),
-              f.fileCount !== void 0 && /* @__PURE__ */ jsxs3("span", { className: "text-muted-foreground", children: [
-                "(",
-                f.fileCount,
-                ")"
-              ] }),
-              f.status === "uploading" && /* @__PURE__ */ jsx4("span", { className: "h-3 w-3 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
-              onRemoveFile && /* @__PURE__ */ jsx4(
-                "button",
-                {
-                  type: "button",
-                  "aria-label": `Remove ${f.name}`,
-                  onClick: () => onRemoveFile(f.id),
-                  className: "rounded p-0.5 text-muted-foreground transition hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-                  children: /* @__PURE__ */ jsx4(CloseGlyph, { className: "h-3 w-3" })
-                }
-              )
-            ]
-          },
-          f.id
-        )) }),
-        /* @__PURE__ */ jsxs3("div", { className: "flex items-end gap-2 rounded-2xl border border-border bg-card px-2.5 py-2 transition focus-within:border-primary/40 focus-within:ring-2 focus-within:ring-primary/15", children: [
-          onAttach && /* @__PURE__ */ jsxs3(Fragment2, { children: [
-            /* @__PURE__ */ jsx4(
-              "button",
-              {
-                type: "button",
-                onClick: () => fileInputRef.current?.click(),
-                disabled,
-                "aria-label": "Attach files",
-                title: "Attach files",
-                className: "mb-0.5 shrink-0 rounded-lg p-2 text-muted-foreground transition hover:bg-accent/40 hover:text-foreground disabled:opacity-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-                children: /* @__PURE__ */ jsx4(PaperclipGlyph, { className: "h-4 w-4" })
-              }
-            ),
-            /* @__PURE__ */ jsx4("input", { ref: fileInputRef, type: "file", multiple: true, className: "hidden", accept, onChange: handleFileChange })
-          ] }),
-          onAttachFolder && /* @__PURE__ */ jsxs3(Fragment2, { children: [
-            /* @__PURE__ */ jsx4(
-              "button",
-              {
-                type: "button",
-                onClick: () => folderInputRef.current?.click(),
-                disabled,
-                "aria-label": "Attach folder",
-                title: "Attach folder",
-                className: "mb-0.5 shrink-0 rounded-lg p-2 text-muted-foreground transition hover:bg-accent/40 hover:text-foreground disabled:opacity-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-                children: /* @__PURE__ */ jsx4(FolderGlyph, { className: "h-4 w-4" })
-              }
-            ),
-            /* @__PURE__ */ jsx4(
-              "input",
-              {
-                ref: folderInputRef,
-                type: "file",
-                multiple: true,
-                className: "hidden",
-                onChange: handleFolderChange,
-                ...{ webkitdirectory: "" }
-              }
-            )
-          ] }),
+}
+var FIELD_INPUT_CLASSES = "w-full rounded-lg border border-border bg-background px-3 py-2 text-sm text-foreground outline-none focus:border-primary disabled:opacity-50";
+function QuestionOptionList({
+  groupName,
+  idPrefix,
+  options,
+  multi,
+  selectedValues,
+  disabled,
+  onToggle
+}) {
+  return /* @__PURE__ */ jsx4(Fragment2, { children: options.map((option, optionIndex) => {
+    const inputId = `${idPrefix}-${optionIndex}`;
+    const checked = selectedValues.includes(option.value);
+    return /* @__PURE__ */ jsxs3("label", { htmlFor: inputId, className: "flex cursor-pointer gap-2 rounded-lg border border-border/70 p-3 transition-colors hover:bg-muted/50", children: [
+      /* @__PURE__ */ jsx4(
+        "input",
+        {
+          id: inputId,
+          type: multi ? "checkbox" : "radio",
+          name: groupName,
+          value: option.value,
+          checked,
+          disabled,
+          onChange: () => onToggle(option.value),
+          "aria-labelledby": `${inputId}-label`,
+          "aria-describedby": option.description ? `${inputId}-description` : void 0,
+          className: "mt-0.5 h-4 w-4 shrink-0 accent-primary"
+        }
+      ),
+      /* @__PURE__ */ jsxs3("span", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsx4("span", { id: `${inputId}-label`, className: "block text-sm font-medium leading-5 text-foreground", children: option.label }),
+        option.description && /* @__PURE__ */ jsx4("span", { id: `${inputId}-description`, className: "mt-0.5 block text-xs leading-5 text-muted-foreground", children: option.description })
+      ] })
+    ] }, `${option.value}-${optionIndex}`);
+  }) });
+}
+function selectField(field) {
+  return field.type === "select" ? field : null;
+}
+function valuesWithSelected(values, field, optionValue) {
+  const current = values[field.name]?.selected ?? [];
+  let selected = [optionValue];
+  if (field.multi === true) {
+    selected = current.includes(optionValue) ? current.filter((item) => item !== optionValue) : [...current, optionValue];
+  }
+  return { ...values, [field.name]: { ...values[field.name], selected } };
+}
+var STATUS_LABELS = interactionStatusLabels({
+  pending: "Waiting for your answer",
+  answered: "Answered",
+  declined: "Declined"
+});
+var TERMINAL_NOTES = interactionTerminalNotes("question", {
+  expired: "The original run ended. Answer now to send a new message with this context.",
+  cancelled: "The agent withdrew this question. Answer now to send a new message with this context."
+});
+function InteractionQuestionCard({
+  interaction,
+  canWrite,
+  submitAnswer,
+  onResolved,
+  onLateAnswer,
+  className
+}) {
+  const [values, setValues] = useState3(() => fieldValuesFromAnswers(interaction.fields, interaction.answers));
+  const [submitting, setSubmitting] = useState3(false);
+  const [localStatus, setLocalStatus] = useState3(null);
+  const [lateAnswerSent, setLateAnswerSent] = useState3(false);
+  const [error, setError] = useState3(null);
+  const submitInFlightRef = useRef3(false);
+  useEffect3(() => {
+    if (!interaction.answers) return;
+    setValues(fieldValuesFromAnswers(interaction.fields, interaction.answers));
+  }, [interaction.answers, interaction.fields]);
+  const status = isTerminalInteractionStatus(interaction.status) ? interaction.status : localStatus ?? interaction.status;
+  const answered = status === "answered";
+  const lateAnswerable = isLateAnswerableStatus(status) && onLateAnswer !== void 0;
+  const secretLateAnswerBlocked = lateAnswerable && hasSecretField(interaction.fields);
+  const canLateAnswer = canWrite && lateAnswerable && !lateAnswerSent && !secretLateAnswerBlocked;
+  const disabled = !canWrite || status !== "pending" && !canLateAnswer || submitting;
+  const answerData = useMemo2(() => buildAnswerData(interaction.fields, values), [interaction.fields, values]);
+  const setFieldValue = (name, patch) => {
+    setValues((prev) => ({ ...prev, [name]: { ...prev[name], ...patch } }));
+  };
+  const toggleSelected = (field, optionValue) => {
+    setValues((prev) => valuesWithSelected(prev, field, optionValue));
+  };
+  async function submitLateAnswer() {
+    if (submitInFlightRef.current || !canLateAnswer || !onLateAnswer) return;
+    const data = buildAnswerData(interaction.fields, values);
+    if (!data) return;
+    submitInFlightRef.current = true;
+    setSubmitting(true);
+    setError(null);
+    let accepted;
+    try {
+      accepted = await onLateAnswer(lateAnswerMessage(interaction, data));
+    } catch {
+      accepted = false;
+    } finally {
+      submitInFlightRef.current = false;
+      setSubmitting(false);
+    }
+    if (accepted === false) {
+      setError("The new message was not sent. Try again from this card.");
+      return;
+    }
+    setLateAnswerSent(true);
+  }
+  async function submit() {
+    if (lateAnswerable) {
+      await submitLateAnswer();
+      return;
+    }
+    if (submitInFlightRef.current || disabled || !answerData) return;
+    submitInFlightRef.current = true;
+    setSubmitting(true);
+    setError(null);
+    try {
+      const result = await submitAnswer({ id: interaction.id, outcome: "accepted", data: answerData });
+      if (result.ok) {
+        setLocalStatus("answered");
+        onResolved?.(interaction.id, "answered", answerData);
+        return;
+      }
+      if (result.expired) {
+        setLocalStatus("expired");
+        onResolved?.(interaction.id, "expired");
+        return;
+      }
+      setError(result.message);
+    } finally {
+      submitInFlightRef.current = false;
+      setSubmitting(false);
+    }
+  }
+  const terminalNote = secretLateAnswerBlocked ? "This question asked for a secret, so it cannot be sent as a new chat message. Ask the agent to request it again." : TERMINAL_NOTES[status];
+  const showSubmitButton = status === "pending" || canWrite && lateAnswerable && !lateAnswerSent;
+  let submitLabel = "Submit answer";
+  if (lateAnswerable) {
+    submitLabel = submitting ? "Sending\u2026" : "Send as new message";
+  } else if (submitting) {
+    submitLabel = "Submitting\u2026";
+  }
+  return /* @__PURE__ */ jsxs3("div", { className: `rounded-xl border border-border bg-card p-4 shadow-sm ${className ?? ""}`, children: [
+    /* @__PURE__ */ jsxs3("div", { className: "mb-3 flex flex-wrap items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsxs3("div", { className: "flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ jsx4(InteractionBadge, { variant: "outline", children: "Question" }),
+        /* @__PURE__ */ jsx4(InteractionBadge, { variant: answered ? "default" : status === "expired" || status === "declined" ? "destructive" : "outline", children: STATUS_LABELS[status] })
+      ] }),
+      /* @__PURE__ */ jsx4("span", { className: "text-xs text-muted-foreground", children: "The agent asked for input" })
+    ] }),
+    interaction.title.trim() && interaction.fields.every((field) => field.label !== interaction.title) && /* @__PURE__ */ jsx4("p", { className: "mb-3 text-sm font-medium leading-5 text-foreground", children: interaction.title }),
+    interaction.body && /* @__PURE__ */ jsx4("p", { className: "mb-3 text-sm leading-5 text-muted-foreground", children: interaction.body }),
+    /* @__PURE__ */ jsx4("div", { className: "space-y-4", children: interaction.fields.map((field) => {
+      const value = values[field.name] ?? {};
+      const select = selectField(field);
+      return /* @__PURE__ */ jsxs3("fieldset", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx4("p", { className: "text-sm font-medium leading-5 text-foreground", children: field.label }),
+        select ? /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
           /* @__PURE__ */ jsx4(
-            "textarea",
+            QuestionOptionList,
             {
-              ref: textareaRef,
-              value: text,
-              onChange: (e) => setText(e.target.value),
-              onKeyDown: handleKeyDown,
-              placeholder,
+              groupName: `${interaction.id}-${field.name}`,
+              idPrefix: `${interaction.id}-${field.name}`,
+              options: select.options,
+              multi: select.multi === true,
+              selectedValues: value.selected ?? [],
               disabled,
-              rows: 1,
-              "aria-label": "Message input",
-              className: "max-h-[168px] min-h-[40px] flex-1 resize-none bg-transparent px-1.5 py-2 text-[15px] leading-6 text-foreground outline-none placeholder:text-muted-foreground disabled:opacity-50"
+              onToggle: (optionValue) => toggleSelected(select, optionValue)
             }
           ),
-          showFooter && /* @__PURE__ */ jsx4("div", { className: "mb-0.5 flex shrink-0 items-center gap-1.5", children: controls }),
-          isStreaming ? /* @__PURE__ */ jsxs3(
-            "button",
+          select.allowCustom === true && /* @__PURE__ */ jsx4(
+            "input",
             {
-              type: "button",
-              onClick: onCancel,
-              "aria-label": "Stop response",
-              className: "mb-0.5 inline-flex shrink-0 items-center gap-1.5 rounded-full bg-destructive/15 px-3.5 py-2 text-sm font-medium text-destructive transition hover:bg-destructive/25 focus:outline-none focus-visible:ring-2 focus-visible:ring-destructive/50",
-              children: [
-                /* @__PURE__ */ jsx4(StopGlyph, { className: "h-3.5 w-3.5" }),
-                /* @__PURE__ */ jsx4("span", { children: "Stop" })
-              ]
+              type: "text",
+              value: value.custom ?? "",
+              disabled,
+              onChange: (event) => setFieldValue(field.name, { custom: event.target.value }),
+              placeholder: "Other \u2014 type your own answer",
+              "aria-label": `Custom answer for ${field.label}`,
+              className: FIELD_INPUT_CLASSES
             }
-          ) : /* @__PURE__ */ jsxs3(
-            "button",
+          )
+        ] }) : field.type === "boolean" ? /* @__PURE__ */ jsx4("div", { className: "flex gap-4", children: ["true", "false"].map((boolValue) => /* @__PURE__ */ jsxs3("label", { className: "flex cursor-pointer items-center gap-2 text-sm text-foreground", children: [
+          /* @__PURE__ */ jsx4(
+            "input",
             {
-              type: "button",
-              onClick: send,
-              disabled: !canSend,
-              "aria-label": sendLabel,
-              className: "mb-0.5 inline-flex shrink-0 items-center gap-1.5 rounded-full bg-primary px-3.5 py-2 text-sm font-medium text-primary-foreground shadow-sm transition hover:bg-primary/90 disabled:cursor-not-allowed disabled:opacity-40 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-card",
-              children: [
-                /* @__PURE__ */ jsx4(SendGlyph, { className: "h-3.5 w-3.5" }),
-                /* @__PURE__ */ jsx4("span", { children: sendLabel })
-              ]
+              type: "radio",
+              name: `${interaction.id}-${field.name}`,
+              value: boolValue,
+              checked: (value.selected ?? [])[0] === boolValue,
+              disabled,
+              onChange: () => setFieldValue(field.name, { selected: [boolValue] }),
+              className: "h-4 w-4 accent-primary"
             }
-          )
-        ] }),
-        focusShortcut && /* @__PURE__ */ jsx4("div", { className: "mt-1.5 flex justify-end px-1", children: /* @__PURE__ */ jsxs3("span", { className: "text-xs text-muted-foreground", children: [
-          /* @__PURE__ */ jsx4("kbd", { className: "rounded border border-border bg-background px-1 py-0.5 text-[10px]", children: "Cmd" }),
-          /* @__PURE__ */ jsx4("kbd", { className: "ml-0.5 rounded border border-border bg-background px-1 py-0.5 text-[10px]", children: "L" }),
-          /* @__PURE__ */ jsx4("span", { className: "ml-1", children: "to focus" })
-        ] }) })
-      ]
+          ),
+          boolValue === "true" ? "Yes" : "No"
+        ] }, boolValue)) }) : field.type === "number" ? /* @__PURE__ */ jsx4(
+          "input",
+          {
+            type: "number",
+            value: value.text ?? "",
+            disabled,
+            "aria-label": field.label,
+            onChange: (event) => setFieldValue(field.name, { text: event.target.value }),
+            className: FIELD_INPUT_CLASSES
+          }
+        ) : field.type === "secret" ? /* @__PURE__ */ jsx4(
+          "input",
+          {
+            type: "password",
+            value: value.text ?? "",
+            disabled,
+            "aria-label": field.label,
+            onChange: (event) => setFieldValue(field.name, { text: event.target.value }),
+            placeholder: field.placeholder,
+            className: FIELD_INPUT_CLASSES
+          }
+        ) : /* @__PURE__ */ jsx4(
+          "textarea",
+          {
+            value: value.text ?? "",
+            disabled,
+            "aria-label": field.label,
+            onChange: (event) => setFieldValue(field.name, { text: event.target.value }),
+            rows: 3,
+            placeholder: field.type === "text" ? field.placeholder : void 0,
+            className: FIELD_INPUT_CLASSES
+          }
+        )
+      ] }, field.name);
+    }) }),
+    error && /* @__PURE__ */ jsx4("p", { className: "mt-3 text-xs text-destructive", children: error }),
+    terminalNote && /* @__PURE__ */ jsx4("p", { className: "mt-3 text-xs text-muted-foreground", children: terminalNote }),
+    showSubmitButton && /* @__PURE__ */ jsx4("div", { className: "mt-4 flex items-center justify-end gap-2", children: /* @__PURE__ */ jsx4(InteractionActionButton, { onClick: () => void submit(), disabled: disabled || !answerData, children: submitLabel }) }),
+    answered && /* @__PURE__ */ jsx4("div", { className: "mt-4 flex items-center justify-end", children: /* @__PURE__ */ jsxs3("span", { className: "inline-flex items-center gap-1 text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ jsx4(CheckGlyph, { className: "h-3 w-3" }),
+      "Answered"
+    ] }) }),
+    lateAnswerSent && /* @__PURE__ */ jsx4("div", { className: "mt-4 flex items-center justify-end", children: /* @__PURE__ */ jsxs3("span", { className: "inline-flex items-center gap-1 text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ jsx4(CheckGlyph, { className: "h-3 w-3" }),
+      "Sent as new message"
+    ] }) })
+  ] });
+}
+
+// src/web-react/durable-plan-card.tsx
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+function statusLabel(plan) {
+  switch (plan.status) {
+    case "pending":
+      return "Waiting for your decision";
+    case "approved":
+      return "Approved";
+    case "rejected":
+      return "Changes requested";
+    case "superseded":
+      return "Superseded";
+    case "withdrawn":
+      return "Withdrawn";
+    default:
+      return "Preparing";
+  }
+}
+function DurablePlanCard({
+  plan,
+  canWrite,
+  decide,
+  deciding = null,
+  error,
+  renderMarkdown,
+  className
+}) {
+  const [feedback, setFeedback] = useState4("");
+  const [expanded, setExpanded] = useState4(false);
+  const [localError, setLocalError] = useState4(null);
+  useEffect4(() => setLocalError(null), [plan.planId, plan.revision, plan.status]);
+  const actionable = plan.status === "pending";
+  const disabled = !canWrite || !actionable || deciding !== null;
+  async function submit(decision) {
+    const trimmed = feedback.trim();
+    if (decision === "rejected" && !trimmed) {
+      setLocalError("Describe what you want changed before requesting a revision.");
+      return;
     }
-  );
+    setLocalError(null);
+    await decide(decision, decision === "rejected" ? trimmed : void 0);
+  }
+  return /* @__PURE__ */ jsxs4("div", { className: `rounded-xl border border-primary/40 bg-card p-4 shadow-sm ${className ?? ""}`, children: [
+    /* @__PURE__ */ jsxs4("div", { className: "mb-3 flex flex-wrap items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsxs4("div", { className: "flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ jsx5(InteractionBadge, { variant: "outline", children: "Plan decision" }),
+        /* @__PURE__ */ jsx5(InteractionBadge, { variant: plan.status === "approved" ? "default" : plan.status === "rejected" || plan.status === "withdrawn" ? "destructive" : "outline", children: statusLabel(plan) })
+      ] }),
+      /* @__PURE__ */ jsxs4("span", { className: "text-xs text-muted-foreground", children: [
+        "Revision ",
+        plan.revision
+      ] })
+    ] }),
+    plan.title && /* @__PURE__ */ jsx5("p", { className: "mb-3 text-sm font-medium leading-5 text-foreground", children: plan.title }),
+    /* @__PURE__ */ jsxs4("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx5("div", { className: "overflow-hidden text-sm", style: expanded ? void 0 : { maxHeight: 320 }, children: renderMarkdown ? renderMarkdown(plan.body) : /* @__PURE__ */ jsx5("p", { className: "whitespace-pre-wrap leading-5", children: plan.body }) }),
+      !expanded && /* @__PURE__ */ jsx5("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 h-12 bg-gradient-to-t from-card to-transparent" }),
+      /* @__PURE__ */ jsx5(
+        "button",
+        {
+          type: "button",
+          onClick: () => setExpanded((value) => !value),
+          className: "mt-1 text-xs text-muted-foreground hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          children: expanded ? "Collapse plan" : "Show full plan"
+        }
+      )
+    ] }),
+    actionable && /* @__PURE__ */ jsxs4("div", { className: "mt-3 space-y-2", children: [
+      /* @__PURE__ */ jsx5("label", { className: "block text-sm font-medium leading-5 text-foreground", htmlFor: `durable-plan-feedback-${plan.planId}-${plan.revision}`, children: "Feedback for requested changes" }),
+      /* @__PURE__ */ jsx5(
+        "textarea",
+        {
+          id: `durable-plan-feedback-${plan.planId}-${plan.revision}`,
+          value: feedback,
+          disabled,
+          onChange: (event) => setFeedback(event.target.value),
+          rows: 2,
+          placeholder: "Describe what you want changed in the plan",
+          className: "w-full rounded-lg border border-border bg-background px-3 py-2 text-sm outline-none focus:border-primary disabled:opacity-50"
+        }
+      )
+    ] }),
+    (localError ?? error) && /* @__PURE__ */ jsx5("p", { className: "mt-3 text-xs text-destructive", children: localError ?? error }),
+    actionable && /* @__PURE__ */ jsxs4("div", { className: "mt-4 flex items-center justify-end gap-2", children: [
+      /* @__PURE__ */ jsx5(InteractionActionButton, { variant: "outline", onClick: () => void submit("rejected"), disabled, children: deciding === "rejected" ? "Sending\u2026" : "Request changes" }),
+      /* @__PURE__ */ jsx5(InteractionActionButton, { onClick: () => void submit("approved"), disabled, children: deciding === "approved" ? "Approving\u2026" : "Approve plan" })
+    ] })
+  ] });
+}
+
+// src/web-react/interaction-plan-card.tsx
+import { useMemo as useMemo3, useRef as useRef4, useState as useState5 } from "react";
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+function CheckGlyph2({ className }) {
+  return /* @__PURE__ */ jsx6("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx6("path", { d: "M20 6 9 17l-5-5" }) });
+}
+function ChevronDownGlyph({ className }) {
+  return /* @__PURE__ */ jsx6("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx6("path", { d: "m6 9 6 6 6-6" }) });
+}
+var STATUS_LABELS2 = interactionStatusLabels({
+  pending: "Waiting for your approval",
+  answered: "Approved",
+  declined: "Rejected"
+});
+var TERMINAL_NOTES2 = interactionTerminalNotes("plan", {
+  declined: "The agent was asked to revise the plan."
+});
+var COLLAPSED_MAX_HEIGHT = 320;
+function InteractionPlanCard({
+  interaction,
+  canWrite,
+  submitAnswer,
+  onResolved,
+  renderMarkdown,
+  className
+}) {
+  const [values, setValues] = useState5({});
+  const [expanded, setExpanded] = useState5(false);
+  const [submitting, setSubmitting] = useState5(null);
+  const [localStatus, setLocalStatus] = useState5(null);
+  const [error, setError] = useState5(null);
+  const submitInFlightRef = useRef4(false);
+  const status = isTerminalInteractionStatus(interaction.status) ? interaction.status : localStatus ?? interaction.status;
+  const disabled = !canWrite || status !== "pending" || submitting !== null;
+  const approveData = useMemo3(() => buildAnswerData(interaction.fields, values), [interaction.fields, values]);
+  const rejectData = useMemo3(() => {
+    const data = {};
+    for (const field of interaction.fields) {
+      const answer = fieldAnswer(field, values);
+      if (answer !== null) data[field.name] = answer;
+    }
+    return data;
+  }, [interaction.fields, values]);
+  async function submit(outcome) {
+    const data = outcome === "accepted" ? approveData : rejectData;
+    if (submitInFlightRef.current || disabled || data === null) return;
+    submitInFlightRef.current = true;
+    setSubmitting(outcome === "accepted" ? "approve" : "reject");
+    setError(null);
+    try {
+      const result = await submitAnswer({ id: interaction.id, outcome, data });
+      if (result.ok) {
+        const resolved = outcome === "accepted" ? "answered" : "declined";
+        setLocalStatus(resolved);
+        onResolved?.(interaction.id, resolved);
+        return;
+      }
+      if (result.expired) {
+        setLocalStatus("expired");
+        onResolved?.(interaction.id, "expired");
+        return;
+      }
+      setError(result.message);
+    } finally {
+      submitInFlightRef.current = false;
+      setSubmitting(null);
+    }
+  }
+  const terminalNote = TERMINAL_NOTES2[status];
+  const approved = status === "answered";
+  return /* @__PURE__ */ jsxs5("div", { className: `rounded-xl border border-border bg-card p-4 shadow-sm ${className ?? ""}`, children: [
+    /* @__PURE__ */ jsxs5("div", { className: "mb-3 flex flex-wrap items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsxs5("div", { className: "flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ jsx6(InteractionBadge, { variant: "outline", children: "Plan" }),
+        /* @__PURE__ */ jsx6(InteractionBadge, { variant: approved ? "default" : status === "expired" || status === "declined" ? "destructive" : "outline", children: STATUS_LABELS2[status] })
+      ] }),
+      /* @__PURE__ */ jsx6("span", { className: "text-xs text-muted-foreground", children: "The agent proposed a plan" })
+    ] }),
+    interaction.title.trim() && /* @__PURE__ */ jsx6("p", { className: "mb-3 text-sm font-medium leading-5 text-foreground", children: interaction.title }),
+    interaction.body && /* @__PURE__ */ jsxs5("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx6(
+        "div",
+        {
+          className: "overflow-hidden text-sm text-foreground",
+          style: expanded ? void 0 : { maxHeight: COLLAPSED_MAX_HEIGHT },
+          children: renderMarkdown ? renderMarkdown(interaction.body) : /* @__PURE__ */ jsx6("p", { className: "whitespace-pre-wrap leading-5", children: interaction.body })
+        }
+      ),
+      !expanded && /* @__PURE__ */ jsx6("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 h-12 bg-gradient-to-t from-card to-transparent" }),
+      /* @__PURE__ */ jsxs5(
+        "button",
+        {
+          type: "button",
+          onClick: () => setExpanded((prev) => !prev),
+          className: "mt-1 inline-flex items-center gap-1 text-xs text-muted-foreground transition hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          children: [
+            /* @__PURE__ */ jsx6(ChevronDownGlyph, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` }),
+            expanded ? "Collapse plan" : "Show full plan"
+          ]
+        }
+      )
+    ] }),
+    interaction.fields.length > 0 && /* @__PURE__ */ jsx6("div", { className: "mt-3 space-y-4", children: interaction.fields.map((field) => /* @__PURE__ */ jsxs5("fieldset", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx6("p", { className: "text-sm font-medium leading-5 text-foreground", children: field.label }),
+      fieldAcceptsFreeText(field) ? /* @__PURE__ */ jsx6(
+        "textarea",
+        {
+          value: values[field.name]?.text ?? "",
+          disabled,
+          "aria-label": field.label,
+          onChange: (event) => setValues((prev) => ({ ...prev, [field.name]: { ...prev[field.name], text: event.target.value } })),
+          rows: 2,
+          placeholder: field.type === "text" ? field.placeholder ?? "Optional feedback for the agent" : void 0,
+          className: "w-full rounded-lg border border-border bg-background px-3 py-2 text-sm text-foreground outline-none focus:border-primary disabled:opacity-50"
+        }
+      ) : /* @__PURE__ */ jsx6(
+        "input",
+        {
+          type: "text",
+          value: values[field.name]?.text ?? "",
+          disabled,
+          "aria-label": field.label,
+          onChange: (event) => setValues((prev) => ({ ...prev, [field.name]: { ...prev[field.name], text: event.target.value } })),
+          className: "w-full rounded-lg border border-border bg-background px-3 py-2 text-sm text-foreground outline-none focus:border-primary disabled:opacity-50"
+        }
+      )
+    ] }, field.name)) }),
+    error && /* @__PURE__ */ jsx6("p", { className: "mt-3 text-xs text-destructive", children: error }),
+    terminalNote && /* @__PURE__ */ jsx6("p", { className: "mt-3 text-xs text-muted-foreground", children: terminalNote }),
+    status === "pending" && /* @__PURE__ */ jsxs5("div", { className: "mt-4 flex items-center justify-end gap-2", children: [
+      /* @__PURE__ */ jsx6(InteractionActionButton, { variant: "outline", onClick: () => void submit("declined"), disabled, children: submitting === "reject" ? "Sending\u2026" : "Request changes" }),
+      /* @__PURE__ */ jsx6(InteractionActionButton, { onClick: () => void submit("accepted"), disabled: disabled || approveData === null, children: submitting === "approve" ? "Approving\u2026" : "Approve plan" })
+    ] }),
+    approved && /* @__PURE__ */ jsx6("div", { className: "mt-4 flex items-center justify-end", children: /* @__PURE__ */ jsxs5("span", { className: "inline-flex items-center gap-1 text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ jsx6(CheckGlyph2, { className: "h-3 w-3" }),
+      "Approved"
+    ] }) })
+  ] });
 }
 
-// src/web-react/interaction-card-support.ts
-function interactionStatusLabels(labels) {
-  return { cancelled: "Withdrawn", expired: "Expired", ...labels };
-}
-function interactionTerminalNotes(noun, extra) {
-  return {
-    expired: `This ${noun} expired \u2014 send a new message to continue.`,
-    cancelled: `The agent withdrew this ${noun}.`,
-    ...extra
-  };
-}
-function fieldAnswer(field, values) {
-  const value = values[field.name] ?? {};
-  if (field.type === "select") {
-    const custom = field.allowCustom === true ? value.custom?.trim() : void 0;
-    const chosen = [...value.selected ?? [], ...custom ? [custom] : []];
-    if (field.multi !== true && custom) return [custom];
-    return chosen.length > 0 ? chosen : null;
-  }
-  if (field.type === "number") {
-    const parsed = Number(value.text);
-    return value.text?.trim() && Number.isFinite(parsed) ? parsed : null;
+// src/web-react/durable-chat-cards.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+function planIdentity(planId, revision) {
+  return `${planId}:${revision}`;
+}
+function durableChatCardsFromParts(parts) {
+  const durablePlans = /* @__PURE__ */ new Set();
+  for (const part of parts) {
+    const plan = persistedPartToPlan(part);
+    if (plan) durablePlans.add(planIdentity(plan.planId, plan.revision));
   }
-  if (field.type === "boolean") return value.selected ? value.selected[0] === "true" : null;
-  const text = value.text?.trim();
-  return text ? text : null;
-}
-function buildAnswerData(fields, values) {
-  const data = {};
-  for (const field of fields) {
-    const answer = fieldAnswer(field, values);
-    if (answer === null) {
-      if (field.required === false) continue;
-      return null;
+  const cards = [];
+  for (const part of parts) {
+    const plan = persistedPartToPlan(part);
+    if (plan) {
+      cards.push({ kind: "plan", key: `plan:${planIdentity(plan.planId, plan.revision)}`, plan });
+      continue;
     }
-    data[field.name] = answer;
+    const interaction = persistedPartToInteraction(part);
+    if (!interaction) continue;
+    const correlatedPlan = interaction.kind === "plan" && typeof part.planId === "string" && typeof part.revision === "number" && durablePlans.has(planIdentity(part.planId, part.revision));
+    if (correlatedPlan) continue;
+    cards.push({ kind: "interaction", key: `interaction:${interaction.id}`, interaction });
   }
-  return data;
-}
-function isLateAnswerableStatus(status) {
-  return status === "expired" || status === "cancelled";
-}
-function hasSecretField(fields) {
-  return fields.some((field) => field.type === "secret");
+  return cards;
 }
-function optionLabel(field, value) {
-  return field.options.find((option) => option.value === value)?.label ?? value;
+function DurableChatCards({
+  parts,
+  canWrite,
+  submitInteraction,
+  decidePlan,
+  decidingPlan,
+  planError,
+  onInteractionResolved,
+  onLateAnswer,
+  renderMarkdown,
+  className
+}) {
+  const cards = durableChatCardsFromParts(parts);
+  if (cards.length === 0) return null;
+  return /* @__PURE__ */ jsx7("div", { className: `space-y-3 ${className ?? ""}`, children: cards.map((card) => {
+    if (card.kind === "plan") {
+      return /* @__PURE__ */ jsx7(
+        DurablePlanCard,
+        {
+          plan: card.plan,
+          canWrite,
+          decide: (decision, feedback) => decidePlan(card.plan, decision, feedback),
+          deciding: decidingPlan?.(card.plan),
+          error: planError?.(card.plan),
+          renderMarkdown
+        },
+        card.key
+      );
+    }
+    if (card.interaction.kind === "plan") {
+      return /* @__PURE__ */ jsx7(
+        InteractionPlanCard,
+        {
+          interaction: card.interaction,
+          canWrite,
+          submitAnswer: submitInteraction,
+          onResolved: onInteractionResolved,
+          renderMarkdown
+        },
+        card.key
+      );
+    }
+    return /* @__PURE__ */ jsx7(
+      InteractionQuestionCard,
+      {
+        interaction: card.interaction,
+        canWrite,
+        submitAnswer: submitInteraction,
+        onResolved: onInteractionResolved,
+        onLateAnswer
+      },
+      card.key
+    );
+  }) });
 }
-function answerText(field, answer) {
-  if (field.type === "select" && Array.isArray(answer)) {
-    return answer.map((value) => optionLabel(field, value)).join(", ");
+
+// src/web-react/chat-stream.ts
+function dispatchChatStreamLine(line, cb) {
+  let receivedContent = false;
+  let turnId;
+  if (!line.trim()) return { receivedContent };
+  let parsed;
+  try {
+    parsed = JSON.parse(line);
+  } catch {
+    return { receivedContent };
   }
-  if (field.type === "boolean") return answer === true ? "Yes" : "No";
-  if (field.type === "secret") return "[secret omitted]";
-  return String(answer);
-}
-function lateAnswerMessage(interaction, data) {
-  const title = interaction.title.trim() || "the earlier question";
-  const body = interaction.body?.trim();
-  const answers = interaction.fields.map((field) => {
-    const answer = data[field.name];
-    if (answer === void 0) return null;
-    return { label: field.label.trim(), text: answerText(field, answer).trim() };
-  }).filter((item) => !!item && item.text.length > 0);
-  const only = answers.length === 1 ? answers[0] : void 0;
-  const answerSummary = only ? only.text : answers.map((item) => `${item.label || "Answer"}: ${item.text}`).join("\n");
-  return [
-    `Regarding your earlier question: "${title}"`,
-    body ? `Context: ${body}` : null,
-    `My answer: ${answerSummary}`
-  ].filter((line) => !!line).join("\n");
-}
-var INTERACTION_SUBMIT_TIMEOUT_MS = 3e4;
-var INTERACTION_SUBMIT_TIMEOUT_MESSAGE = "Could not reach the agent. Try again.";
-async function responseErrorMessage(res) {
-  const text = await res.text().catch(() => "");
-  if (text) {
-    try {
-      const parsed = JSON.parse(text);
-      const message = typeof parsed.error === "string" && parsed.error.trim() ? parsed.error : typeof parsed.message === "string" && parsed.message.trim() ? parsed.message : null;
-      if (message) return { ...typeof parsed.code === "string" ? { code: parsed.code } : {}, message };
-    } catch {
+  if (parsed.kind === "tool_result") {
+    cb.onToolResult?.({
+      toolCallId: parsed.toolCallId,
+      toolName: parsed.toolName,
+      label: parsed.label,
+      outcome: parsed.outcome ?? parsed.result
+    });
+    return { receivedContent: true };
+  }
+  const evt = parsed.kind === "event" ? parsed.event : parsed;
+  if (!evt || typeof evt !== "object") return { receivedContent };
+  switch (evt.type) {
+    case "turn":
+      if (typeof evt.turnId === "string") turnId = evt.turnId;
+      break;
+    case "text":
+      if (typeof evt.text === "string") {
+        cb.onText?.(evt.text);
+        receivedContent = true;
+      }
+      break;
+    case "reasoning":
+      if (typeof evt.text === "string") {
+        cb.onReasoning?.(evt.text);
+        receivedContent = true;
+      }
+      break;
+    case "tool_call": {
+      const call = evt.call ?? evt;
+      cb.onToolCall?.({
+        toolCallId: call.toolCallId ?? call.id,
+        toolName: String(call.toolName ?? call.name ?? "unknown"),
+        args: call.args ?? {}
+      });
+      receivedContent = true;
+      break;
+    }
+    case "tool_result":
+      cb.onToolResult?.({
+        toolCallId: evt.toolCallId,
+        toolName: evt.toolName,
+        label: evt.label,
+        outcome: evt.outcome ?? evt.result
+      });
+      receivedContent = true;
+      break;
+    case "usage": {
+      const u = evt.usage;
+      if (u) cb.onUsage?.({ promptTokens: u.promptTokens ?? 0, completionTokens: u.completionTokens ?? 0 });
+      break;
+    }
+    case "metadata":
+      cb.onMetadata?.(evt.data ?? {});
+      break;
+    case "interaction": {
+      const parsed2 = parseInteractionRequest(evt.data);
+      if (parsed2.succeeded) {
+        cb.onInteraction?.(interactionFromWireRequest(parsed2.value));
+        receivedContent = true;
+      } else {
+        console.error("[chat-stream] dropping malformed interaction line:", parsed2.error);
+      }
+      break;
+    }
+    case "interaction.cancel": {
+      const cancelled = parseInteractionCancel(evt.data);
+      if (cancelled.succeeded) {
+        cb.onInteractionCancel?.(cancelled.value);
+        receivedContent = true;
+      } else {
+        console.error("[chat-stream] dropping malformed interaction.cancel line:", cancelled.error);
+      }
+      break;
+    }
+    case "error": {
+      const data = evt.data;
+      const message = String(data?.message ?? evt.details ?? evt.error ?? "Unknown stream error");
+      if (cb.onErrorEvent) {
+        cb.onErrorEvent(message);
+      } else {
+        console.error("[chat-stream] unhandled stream error event:", message);
+        cb.onText?.(`
+
+The agent hit an error and this turn stopped: ${message}`);
+        receivedContent = true;
+      }
+      break;
+    }
+    default: {
+      if (typeof evt.type === "string" && evt.type.startsWith("plan.")) {
+        const submitted = parsePlanSubmittedEvent(evt);
+        const planRecord = evt.data?.plan ?? evt.properties?.plan;
+        const plan = submitted.succeeded ? submitted.value : planRecord ? persistedPartToPlan({ type: "plan", ...planRecord }) : null;
+        if (plan) {
+          cb.onPlan?.(plan);
+          receivedContent = true;
+        } else {
+          console.error("[chat-stream] dropping malformed durable plan line:", evt.type);
+        }
+      }
+      break;
+    }
+  }
+  return { turnId, receivedContent };
+}
+async function consumeChatStream(body, cb) {
+  const reader = body.getReader();
+  const decoder = new TextDecoder();
+  let buffer = "";
+  let turnId = null;
+  let receivedContent = false;
+  const handle = (line) => {
+    const r = dispatchChatStreamLine(line, cb);
+    if (r.turnId) {
+      turnId = r.turnId;
+      cb.onTurnId?.(r.turnId);
+    }
+    if (r.receivedContent) receivedContent = true;
+  };
+  for (; ; ) {
+    const { done, value } = await reader.read();
+    if (done) {
+      if (buffer.trim()) handle(buffer);
+      break;
     }
+    buffer += decoder.decode(value, { stream: true });
+    const lines = buffer.split("\n");
+    buffer = lines.pop() ?? "";
+    for (const line of lines) handle(line);
   }
-  return { message: `Answer failed (${res.status})` };
+  return { turnId, receivedContent };
 }
-function createInteractionAnswerSubmitter(options) {
-  const timeoutMs = options.timeoutMs ?? INTERACTION_SUBMIT_TIMEOUT_MS;
-  return async (submission) => {
-    const doFetch = options.fetchImpl ?? fetch;
-    const url = typeof options.url === "function" ? options.url(submission) : options.url;
-    const extra = typeof options.body === "function" ? options.body(submission) : options.body ?? {};
-    const controller = new AbortController();
-    const timer = setTimeout(() => controller.abort(INTERACTION_SUBMIT_TIMEOUT_MESSAGE), timeoutMs);
-    try {
-      const res = await doFetch(url, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        signal: controller.signal,
-        body: JSON.stringify({
-          ...extra,
-          id: submission.id,
-          outcome: submission.outcome,
-          ...submission.data ? { data: submission.data } : {}
-        })
-      });
-      if (res.ok) return { ok: true };
-      const failure = await responseErrorMessage(res);
-      return { ok: false, expired: res.status === 410, message: failure.message };
-    } catch (err) {
-      if (controller.signal.aborted) {
-        return { ok: false, expired: false, message: INTERACTION_SUBMIT_TIMEOUT_MESSAGE };
-      }
-      return { ok: false, expired: false, message: err instanceof Error ? err.message : "Failed to submit the answer" };
-    } finally {
-      clearTimeout(timer);
+async function streamChatTurn(opts) {
+  const res = await opts.start();
+  if (!res.ok || !res.body) {
+    const err = await res.json().catch(() => ({ error: `HTTP ${res.status}` }));
+    throw new Error(err.error ?? `HTTP ${res.status}`);
+  }
+  let turnId = null;
+  const cb = {
+    ...opts.callbacks,
+    onTurnId: (id) => {
+      turnId = id;
+      opts.callbacks.onTurnId?.(id);
     }
   };
+  try {
+    return await consumeChatStream(res.body, cb);
+  } catch (transportErr) {
+    if (!turnId || !opts.resume) throw transportErr;
+    opts.onResetForResume?.();
+    const resumed = await opts.resume(turnId, 0);
+    if (!resumed.ok || !resumed.body) throw transportErr;
+    return await consumeChatStream(resumed.body, cb);
+  }
 }
 
-// src/web-react/interaction-question-card.tsx
-import { useMemo as useMemo2, useRef as useRef4, useState as useState4 } from "react";
-import { Fragment as Fragment3, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-function CheckGlyph({ className }) {
-  return /* @__PURE__ */ jsx5("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx5("path", { d: "M20 6 9 17l-5-5" }) });
+// src/web-react/chat-composer.tsx
+import {
+  useCallback,
+  useEffect as useEffect5,
+  useRef as useRef5,
+  useState as useState6
+} from "react";
+import { Fragment as Fragment3, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+function SendGlyph({ className }) {
+  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx8("path", { d: "M22 2 11 13M22 2l-7 20-4-9-9-4 20-7z" }) });
 }
-var BADGE_VARIANT_CLASSES = {
-  outline: "border-border text-foreground",
-  default: "border-transparent bg-primary text-primary-foreground",
-  destructive: "border-transparent bg-destructive/15 text-destructive"
-};
-function InteractionBadge({ variant, children }) {
-  return /* @__PURE__ */ jsx5("span", { className: `inline-flex items-center rounded-md border px-2 py-0.5 text-xs font-medium ${BADGE_VARIANT_CLASSES[variant]}`, children });
+function StopGlyph({ className }) {
+  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": true, children: /* @__PURE__ */ jsx8("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2" }) });
 }
-function InteractionActionButton({
-  variant = "primary",
-  onClick,
-  disabled,
-  children
-}) {
-  const variantClasses = variant === "primary" ? "bg-primary text-primary-foreground shadow-sm hover:bg-primary/90" : "border border-border bg-transparent text-foreground hover:bg-accent/40";
-  return /* @__PURE__ */ jsx5(
-    "button",
-    {
-      type: "button",
-      onClick,
-      disabled,
-      className: `inline-flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-sm font-medium transition disabled:cursor-not-allowed disabled:opacity-40 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring ${variantClasses}`,
-      children
-    }
-  );
+function PaperclipGlyph({ className }) {
+  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx8("path", { d: "m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
 }
-var FIELD_INPUT_CLASSES = "w-full rounded-lg border border-border bg-background px-3 py-2 text-sm text-foreground outline-none focus:border-primary disabled:opacity-50";
-function QuestionOptionList({
-  groupName,
-  idPrefix,
-  options,
-  multi,
-  selectedValues,
-  disabled,
-  onToggle
-}) {
-  return /* @__PURE__ */ jsx5(Fragment3, { children: options.map((option, optionIndex) => {
-    const inputId = `${idPrefix}-${optionIndex}`;
-    const checked = selectedValues.includes(option.value);
-    return /* @__PURE__ */ jsxs4("label", { htmlFor: inputId, className: "flex cursor-pointer gap-2 rounded-lg border border-border/70 p-3 transition-colors hover:bg-muted/50", children: [
-      /* @__PURE__ */ jsx5(
-        "input",
-        {
-          id: inputId,
-          type: multi ? "checkbox" : "radio",
-          name: groupName,
-          value: option.value,
-          checked,
-          disabled,
-          onChange: () => onToggle(option.value),
-          "aria-labelledby": `${inputId}-label`,
-          "aria-describedby": option.description ? `${inputId}-description` : void 0,
-          className: "mt-0.5 h-4 w-4 shrink-0 accent-primary"
-        }
-      ),
-      /* @__PURE__ */ jsxs4("span", { className: "min-w-0", children: [
-        /* @__PURE__ */ jsx5("span", { id: `${inputId}-label`, className: "block text-sm font-medium leading-5 text-foreground", children: option.label }),
-        option.description && /* @__PURE__ */ jsx5("span", { id: `${inputId}-description`, className: "mt-0.5 block text-xs leading-5 text-muted-foreground", children: option.description })
-      ] })
-    ] }, `${option.value}-${optionIndex}`);
-  }) });
+function FolderGlyph({ className }) {
+  return /* @__PURE__ */ jsxs6("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx8("path", { d: "M4 20h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.93a2 2 0 0 1-1.66-.9l-.82-1.2A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13c0 1.1.9 2 2 2Z" }),
+    /* @__PURE__ */ jsx8("path", { d: "M12 10v6m-3-3h6" })
+  ] });
 }
-function selectField(field) {
-  return field.type === "select" ? field : null;
+function CloseGlyph({ className }) {
+  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx8("path", { d: "M18 6 6 18M6 6l12 12" }) });
 }
-function valuesWithSelected(values, field, optionValue) {
-  const current = values[field.name]?.selected ?? [];
-  let selected = [optionValue];
-  if (field.multi === true) {
-    selected = current.includes(optionValue) ? current.filter((item) => item !== optionValue) : [...current, optionValue];
-  }
-  return { ...values, [field.name]: { ...values[field.name], selected } };
+function UploadGlyph({ className }) {
+  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx8("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M17 8l-5-5-5 5M12 3v12" }) });
 }
-var STATUS_LABELS = interactionStatusLabels({
-  pending: "Waiting for your answer",
-  answered: "Answered",
-  declined: "Declined"
-});
-var TERMINAL_NOTES = interactionTerminalNotes("question", {
-  expired: "The original run ended. Answer now to send a new message with this context.",
-  cancelled: "The agent withdrew this question. Answer now to send a new message with this context."
-});
-function InteractionQuestionCard({
-  interaction,
-  canWrite,
-  submitAnswer,
-  onResolved,
-  onLateAnswer,
+var MAX_HEIGHT = 168;
+function ChatComposer({
+  onSend,
+  onSendParts,
+  onCancel,
+  isStreaming = false,
+  disabled = false,
+  placeholder = "Message the agent\u2026",
+  value,
+  onValueChange,
+  initialValue,
+  seed,
+  onSeedApplied,
+  controls,
+  controlsPlacement = "above",
+  onAttach,
+  onAttachFolder,
+  pendingFiles = [],
+  onRemoveFile,
+  accept,
+  dropTitle = "Drop files to add context",
+  dropDescription = "They attach to your next message.",
+  focusShortcut = true,
+  sendLabel = "Send",
   className
 }) {
-  const [values, setValues] = useState4({});
-  const [submitting, setSubmitting] = useState4(false);
-  const [localStatus, setLocalStatus] = useState4(null);
-  const [lateAnswerSent, setLateAnswerSent] = useState4(false);
-  const [error, setError] = useState4(null);
-  const submitInFlightRef = useRef4(false);
-  const status = isTerminalInteractionStatus(interaction.status) ? interaction.status : localStatus ?? interaction.status;
-  const answered = status === "answered";
-  const lateAnswerable = isLateAnswerableStatus(status) && onLateAnswer !== void 0;
-  const secretLateAnswerBlocked = lateAnswerable && hasSecretField(interaction.fields);
-  const canLateAnswer = canWrite && lateAnswerable && !lateAnswerSent && !secretLateAnswerBlocked;
-  const disabled = !canWrite || status !== "pending" && !canLateAnswer || submitting;
-  const answerData = useMemo2(() => buildAnswerData(interaction.fields, values), [interaction.fields, values]);
-  const setFieldValue = (name, patch) => {
-    setValues((prev) => ({ ...prev, [name]: { ...prev[name], ...patch } }));
-  };
-  const toggleSelected = (field, optionValue) => {
-    setValues((prev) => valuesWithSelected(prev, field, optionValue));
-  };
-  async function submitLateAnswer() {
-    if (submitInFlightRef.current || !canLateAnswer || !onLateAnswer) return;
-    const data = buildAnswerData(interaction.fields, values);
-    if (!data) return;
-    submitInFlightRef.current = true;
-    setSubmitting(true);
-    setError(null);
-    let accepted;
-    try {
-      accepted = await onLateAnswer(lateAnswerMessage(interaction, data));
-    } catch {
-      accepted = false;
-    } finally {
-      submitInFlightRef.current = false;
-      setSubmitting(false);
+  const isControlled = value !== void 0;
+  const [internal, setInternal] = useState6(initialValue ?? "");
+  const text = isControlled ? value : internal;
+  const textareaRef = useRef5(null);
+  const fileInputRef = useRef5(null);
+  const folderInputRef = useRef5(null);
+  const [dragOver, setDragOver] = useState6(false);
+  const dragDepth = useRef5(0);
+  const setText = useCallback(
+    (next) => {
+      if (!isControlled) setInternal(next);
+      onValueChange?.(next);
+    },
+    [isControlled, onValueChange]
+  );
+  useEffect5(() => {
+    const el = textareaRef.current;
+    if (!el) return;
+    el.style.height = "auto";
+    el.style.height = `${Math.min(el.scrollHeight, MAX_HEIGHT)}px`;
+  }, [text]);
+  const prevSeedRef = useRef5(null);
+  const pendingCaretRef = useRef5(null);
+  useEffect5(() => {
+    const prev = prevSeedRef.current;
+    prevSeedRef.current = seed ?? null;
+    if (seed == null || seed === prev || isControlled) return;
+    setText(seed);
+    onSeedApplied?.();
+    const el = textareaRef.current;
+    if (el && el.value === seed) {
+      el.focus();
+      el.setSelectionRange(seed.length, seed.length);
+    } else {
+      pendingCaretRef.current = seed;
+    }
+  }, [seed, setText, onSeedApplied, isControlled]);
+  useEffect5(() => {
+    if (pendingCaretRef.current == null || pendingCaretRef.current !== text)
+      return;
+    pendingCaretRef.current = null;
+    const el = textareaRef.current;
+    if (!el) return;
+    el.focus();
+    el.setSelectionRange(text.length, text.length);
+  }, [text]);
+  useEffect5(() => {
+    if (!focusShortcut || disabled) return;
+    function onKeyDown(e) {
+      if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "l") {
+        e.preventDefault();
+        textareaRef.current?.focus();
+      }
     }
-    if (accepted === false) {
-      setError("The new message was not sent. Try again from this card.");
+    document.addEventListener("keydown", onKeyDown);
+    return () => document.removeEventListener("keydown", onKeyDown);
+  }, [focusShortcut, disabled]);
+  const readyParts = pendingFiles.filter((f) => f.status === "ready" && f.part).map((f) => f.part);
+  const hasSendable = onSendParts ? text.trim().length > 0 || readyParts.length > 0 : text.trim().length > 0;
+  const canSend = hasSendable && !isStreaming && !disabled;
+  const send = useCallback(() => {
+    const trimmed = text.trim();
+    if (isStreaming || disabled) return;
+    if (onSendParts) {
+      const parts = pendingFiles.filter((f) => f.status === "ready" && f.part).map((f) => f.part);
+      if (!trimmed && parts.length === 0) return;
+      onSendParts(trimmed, parts);
+      setText("");
       return;
     }
-    setLateAnswerSent(true);
-  }
-  async function submit() {
-    if (lateAnswerable) {
-      await submitLateAnswer();
-      return;
+    if (!trimmed) return;
+    onSend?.(trimmed);
+    setText("");
+  }, [text, isStreaming, disabled, onSend, onSendParts, pendingFiles, setText]);
+  const handleKeyDown = (e) => {
+    if (e.nativeEvent.isComposing) return;
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      send();
     }
-    if (submitInFlightRef.current || disabled || !answerData) return;
-    submitInFlightRef.current = true;
-    setSubmitting(true);
-    setError(null);
-    try {
-      const result = await submitAnswer({ id: interaction.id, outcome: "accepted", data: answerData });
-      if (result.ok) {
-        setLocalStatus("answered");
-        onResolved?.(interaction.id, "answered");
-        return;
-      }
-      if (result.expired) {
-        setLocalStatus("expired");
-        onResolved?.(interaction.id, "expired");
-        return;
-      }
-      setError(result.message);
-    } finally {
-      submitInFlightRef.current = false;
-      setSubmitting(false);
+  };
+  const handleFileChange = (e) => {
+    if (e.target.files?.length) onAttach?.(e.target.files);
+    e.target.value = "";
+  };
+  const handleFolderChange = (e) => {
+    if (e.target.files?.length) (onAttachFolder ?? onAttach)?.(e.target.files);
+    e.target.value = "";
+  };
+  const handleDragEnter = useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    dragDepth.current++;
+    if (e.dataTransfer?.types.includes("Files")) setDragOver(true);
+  }, []);
+  const handleDragLeave = useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    dragDepth.current--;
+    if (dragDepth.current <= 0) {
+      dragDepth.current = 0;
+      setDragOver(false);
     }
-  }
-  const terminalNote = secretLateAnswerBlocked ? "This question asked for a secret, so it cannot be sent as a new chat message. Ask the agent to request it again." : TERMINAL_NOTES[status];
-  const showSubmitButton = status === "pending" || canWrite && lateAnswerable && !lateAnswerSent;
-  let submitLabel = "Submit answer";
-  if (lateAnswerable) {
-    submitLabel = submitting ? "Sending\u2026" : "Send as new message";
-  } else if (submitting) {
-    submitLabel = "Submitting\u2026";
-  }
-  return /* @__PURE__ */ jsxs4("div", { className: `rounded-xl border border-border bg-card p-4 shadow-sm ${className ?? ""}`, children: [
-    /* @__PURE__ */ jsxs4("div", { className: "mb-3 flex flex-wrap items-center justify-between gap-2", children: [
-      /* @__PURE__ */ jsxs4("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsx5(InteractionBadge, { variant: "outline", children: "Question" }),
-        /* @__PURE__ */ jsx5(InteractionBadge, { variant: answered ? "default" : status === "expired" || status === "declined" ? "destructive" : "outline", children: STATUS_LABELS[status] })
-      ] }),
-      /* @__PURE__ */ jsx5("span", { className: "text-xs text-muted-foreground", children: "The agent asked for input" })
-    ] }),
-    interaction.title.trim() && interaction.fields.every((field) => field.label !== interaction.title) && /* @__PURE__ */ jsx5("p", { className: "mb-3 text-sm font-medium leading-5 text-foreground", children: interaction.title }),
-    interaction.body && /* @__PURE__ */ jsx5("p", { className: "mb-3 text-sm leading-5 text-muted-foreground", children: interaction.body }),
-    /* @__PURE__ */ jsx5("div", { className: "space-y-4", children: interaction.fields.map((field) => {
-      const value = values[field.name] ?? {};
-      const select = selectField(field);
-      return /* @__PURE__ */ jsxs4("fieldset", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsx5("p", { className: "text-sm font-medium leading-5 text-foreground", children: field.label }),
-        select ? /* @__PURE__ */ jsxs4("div", { className: "space-y-2", children: [
-          /* @__PURE__ */ jsx5(
-            QuestionOptionList,
-            {
-              groupName: `${interaction.id}-${field.name}`,
-              idPrefix: `${interaction.id}-${field.name}`,
-              options: select.options,
-              multi: select.multi === true,
-              selectedValues: value.selected ?? [],
-              disabled,
-              onToggle: (optionValue) => toggleSelected(select, optionValue)
-            }
-          ),
-          select.allowCustom === true && /* @__PURE__ */ jsx5(
-            "input",
-            {
-              type: "text",
-              value: value.custom ?? "",
-              disabled,
-              onChange: (event) => setFieldValue(field.name, { custom: event.target.value }),
-              placeholder: "Other \u2014 type your own answer",
-              "aria-label": `Custom answer for ${field.label}`,
-              className: FIELD_INPUT_CLASSES
-            }
-          )
-        ] }) : field.type === "boolean" ? /* @__PURE__ */ jsx5("div", { className: "flex gap-4", children: ["true", "false"].map((boolValue) => /* @__PURE__ */ jsxs4("label", { className: "flex cursor-pointer items-center gap-2 text-sm text-foreground", children: [
-          /* @__PURE__ */ jsx5(
-            "input",
+  }, []);
+  const handleDragOver = useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (e.dataTransfer) e.dataTransfer.dropEffect = "copy";
+  }, []);
+  const handleDrop = useCallback(
+    (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      dragDepth.current = 0;
+      setDragOver(false);
+      const files = e.dataTransfer?.files;
+      if (files?.length) onAttach?.(files);
+    },
+    [onAttach]
+  );
+  const folderChips = pendingFiles.filter((f) => f.kind === "folder");
+  const fileChips = pendingFiles.filter((f) => f.kind !== "folder");
+  const showFooter = controls != null && controlsPlacement === "footer";
+  const showAbove = controls != null && controlsPlacement === "above";
+  return /* @__PURE__ */ jsxs6(
+    "div",
+    {
+      className: `relative ${className ?? ""}`,
+      onDragEnter: onAttach ? handleDragEnter : void 0,
+      onDragLeave: onAttach ? handleDragLeave : void 0,
+      onDragOver: onAttach ? handleDragOver : void 0,
+      onDrop: onAttach ? handleDrop : void 0,
+      children: [
+        dragOver && /* @__PURE__ */ jsx8("div", { className: "pointer-events-none absolute inset-0 z-10 flex items-center justify-center rounded-2xl border-2 border-dashed border-primary/50 bg-card/95", children: /* @__PURE__ */ jsxs6("div", { className: "text-center", children: [
+          /* @__PURE__ */ jsx8("span", { className: "mx-auto mb-2 flex h-11 w-11 items-center justify-center rounded-xl bg-primary/10 text-primary", children: /* @__PURE__ */ jsx8(UploadGlyph, { className: "h-5 w-5" }) }),
+          /* @__PURE__ */ jsx8("p", { className: "text-sm font-semibold text-foreground", children: dropTitle }),
+          /* @__PURE__ */ jsx8("p", { className: "mt-0.5 text-xs text-muted-foreground", children: dropDescription })
+        ] }) }),
+        showAbove && /* @__PURE__ */ jsx8("div", { className: "mb-1.5 flex flex-wrap items-center gap-1.5 px-1", children: controls }),
+        pendingFiles.length > 0 && /* @__PURE__ */ jsx8("div", { className: "mb-2 flex flex-wrap gap-1.5", children: [...folderChips, ...fileChips].map((f) => /* @__PURE__ */ jsxs6(
+          "span",
+          {
+            className: `inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-xs ${f.status === "error" ? "border-destructive/40 text-destructive" : "border-border bg-muted/50 text-foreground"}`,
+            children: [
+              f.kind === "folder" ? /* @__PURE__ */ jsx8(FolderGlyph, { className: "h-3 w-3 shrink-0" }) : /* @__PURE__ */ jsx8(PaperclipGlyph, { className: "h-3 w-3 shrink-0" }),
+              /* @__PURE__ */ jsx8("span", { className: "max-w-[150px] truncate", children: f.name }),
+              f.fileCount !== void 0 && /* @__PURE__ */ jsxs6("span", { className: "text-muted-foreground", children: [
+                "(",
+                f.fileCount,
+                ")"
+              ] }),
+              f.status === "uploading" && /* @__PURE__ */ jsx8("span", { className: "h-3 w-3 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
+              onRemoveFile && /* @__PURE__ */ jsx8(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": `Remove ${f.name}`,
+                  onClick: () => onRemoveFile(f.id),
+                  className: "rounded p-0.5 text-muted-foreground transition hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                  children: /* @__PURE__ */ jsx8(CloseGlyph, { className: "h-3 w-3" })
+                }
+              )
+            ]
+          },
+          f.id
+        )) }),
+        /* @__PURE__ */ jsxs6("div", { className: "flex items-end gap-2 rounded-2xl border border-border bg-card px-2.5 py-2 transition focus-within:border-primary/40 focus-within:ring-2 focus-within:ring-primary/15", children: [
+          onAttach && /* @__PURE__ */ jsxs6(Fragment3, { children: [
+            /* @__PURE__ */ jsx8(
+              "button",
+              {
+                type: "button",
+                onClick: () => fileInputRef.current?.click(),
+                disabled,
+                "aria-label": "Attach files",
+                title: "Attach files",
+                className: "mb-0.5 shrink-0 rounded-lg p-2 text-muted-foreground transition hover:bg-accent/40 hover:text-foreground disabled:opacity-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                children: /* @__PURE__ */ jsx8(PaperclipGlyph, { className: "h-4 w-4" })
+              }
+            ),
+            /* @__PURE__ */ jsx8("input", { ref: fileInputRef, type: "file", multiple: true, className: "hidden", accept, onChange: handleFileChange })
+          ] }),
+          onAttachFolder && /* @__PURE__ */ jsxs6(Fragment3, { children: [
+            /* @__PURE__ */ jsx8(
+              "button",
+              {
+                type: "button",
+                onClick: () => folderInputRef.current?.click(),
+                disabled,
+                "aria-label": "Attach folder",
+                title: "Attach folder",
+                className: "mb-0.5 shrink-0 rounded-lg p-2 text-muted-foreground transition hover:bg-accent/40 hover:text-foreground disabled:opacity-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                children: /* @__PURE__ */ jsx8(FolderGlyph, { className: "h-4 w-4" })
+              }
+            ),
+            /* @__PURE__ */ jsx8(
+              "input",
+              {
+                ref: folderInputRef,
+                type: "file",
+                multiple: true,
+                className: "hidden",
+                onChange: handleFolderChange,
+                ...{ webkitdirectory: "" }
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx8(
+            "textarea",
             {
-              type: "radio",
-              name: `${interaction.id}-${field.name}`,
-              value: boolValue,
-              checked: (value.selected ?? [])[0] === boolValue,
+              ref: textareaRef,
+              value: text,
+              onChange: (e) => setText(e.target.value),
+              onKeyDown: handleKeyDown,
+              placeholder,
               disabled,
-              onChange: () => setFieldValue(field.name, { selected: [boolValue] }),
-              className: "h-4 w-4 accent-primary"
+              rows: 1,
+              "aria-label": "Message input",
+              className: "max-h-[168px] min-h-[40px] flex-1 resize-none bg-transparent px-1.5 py-2 text-[15px] leading-6 text-foreground outline-none placeholder:text-muted-foreground disabled:opacity-50"
             }
           ),
-          boolValue === "true" ? "Yes" : "No"
-        ] }, boolValue)) }) : field.type === "number" ? /* @__PURE__ */ jsx5(
-          "input",
-          {
-            type: "number",
-            value: value.text ?? "",
-            disabled,
-            "aria-label": field.label,
-            onChange: (event) => setFieldValue(field.name, { text: event.target.value }),
-            className: FIELD_INPUT_CLASSES
-          }
-        ) : field.type === "secret" ? /* @__PURE__ */ jsx5(
-          "input",
-          {
-            type: "password",
-            value: value.text ?? "",
-            disabled,
-            "aria-label": field.label,
-            onChange: (event) => setFieldValue(field.name, { text: event.target.value }),
-            placeholder: field.placeholder,
-            className: FIELD_INPUT_CLASSES
-          }
-        ) : /* @__PURE__ */ jsx5(
-          "textarea",
-          {
-            value: value.text ?? "",
-            disabled,
-            "aria-label": field.label,
-            onChange: (event) => setFieldValue(field.name, { text: event.target.value }),
-            rows: 3,
-            placeholder: field.type === "text" ? field.placeholder : void 0,
-            className: FIELD_INPUT_CLASSES
-          }
-        )
-      ] }, field.name);
-    }) }),
-    error && /* @__PURE__ */ jsx5("p", { className: "mt-3 text-xs text-destructive", children: error }),
-    terminalNote && /* @__PURE__ */ jsx5("p", { className: "mt-3 text-xs text-muted-foreground", children: terminalNote }),
-    showSubmitButton && /* @__PURE__ */ jsx5("div", { className: "mt-4 flex items-center justify-end gap-2", children: /* @__PURE__ */ jsx5(InteractionActionButton, { onClick: () => void submit(), disabled: disabled || !answerData, children: submitLabel }) }),
-    answered && /* @__PURE__ */ jsx5("div", { className: "mt-4 flex items-center justify-end", children: /* @__PURE__ */ jsxs4("span", { className: "inline-flex items-center gap-1 text-xs text-muted-foreground", children: [
-      /* @__PURE__ */ jsx5(CheckGlyph, { className: "h-3 w-3" }),
-      "Answered"
-    ] }) }),
-    lateAnswerSent && /* @__PURE__ */ jsx5("div", { className: "mt-4 flex items-center justify-end", children: /* @__PURE__ */ jsxs4("span", { className: "inline-flex items-center gap-1 text-xs text-muted-foreground", children: [
-      /* @__PURE__ */ jsx5(CheckGlyph, { className: "h-3 w-3" }),
-      "Sent as new message"
-    ] }) })
-  ] });
+          showFooter && /* @__PURE__ */ jsx8("div", { className: "mb-0.5 flex shrink-0 items-center gap-1.5", children: controls }),
+          isStreaming ? /* @__PURE__ */ jsxs6(
+            "button",
+            {
+              type: "button",
+              onClick: onCancel,
+              "aria-label": "Stop response",
+              className: "mb-0.5 inline-flex shrink-0 items-center gap-1.5 rounded-full bg-destructive/15 px-3.5 py-2 text-sm font-medium text-destructive transition hover:bg-destructive/25 focus:outline-none focus-visible:ring-2 focus-visible:ring-destructive/50",
+              children: [
+                /* @__PURE__ */ jsx8(StopGlyph, { className: "h-3.5 w-3.5" }),
+                /* @__PURE__ */ jsx8("span", { children: "Stop" })
+              ]
+            }
+          ) : /* @__PURE__ */ jsxs6(
+            "button",
+            {
+              type: "button",
+              onClick: send,
+              disabled: !canSend,
+              "aria-label": sendLabel,
+              className: "mb-0.5 inline-flex shrink-0 items-center gap-1.5 rounded-full bg-primary px-3.5 py-2 text-sm font-medium text-primary-foreground shadow-sm transition hover:bg-primary/90 disabled:cursor-not-allowed disabled:opacity-40 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-card",
+              children: [
+                /* @__PURE__ */ jsx8(SendGlyph, { className: "h-3.5 w-3.5" }),
+                /* @__PURE__ */ jsx8("span", { children: sendLabel })
+              ]
+            }
+          )
+        ] }),
+        focusShortcut && /* @__PURE__ */ jsx8("div", { className: "mt-1.5 flex justify-end px-1", children: /* @__PURE__ */ jsxs6("span", { className: "text-xs text-muted-foreground", children: [
+          /* @__PURE__ */ jsx8("kbd", { className: "rounded border border-border bg-background px-1 py-0.5 text-[10px]", children: "Cmd" }),
+          /* @__PURE__ */ jsx8("kbd", { className: "ml-0.5 rounded border border-border bg-background px-1 py-0.5 text-[10px]", children: "L" }),
+          /* @__PURE__ */ jsx8("span", { className: "ml-1", children: "to focus" })
+        ] }) })
+      ]
+    }
+  );
 }
 
-// src/web-react/interaction-plan-card.tsx
-import { useMemo as useMemo3, useRef as useRef5, useState as useState5 } from "react";
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
-function CheckGlyph2({ className }) {
-  return /* @__PURE__ */ jsx6("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx6("path", { d: "M20 6 9 17l-5-5" }) });
+// src/web-react/durable-plan-flow.ts
+import { useCallback as useCallback2, useEffect as useEffect6, useRef as useRef6, useState as useState7 } from "react";
+var DurablePlanClientError = class extends Error {
+  constructor(message, status, code, currentPlan) {
+    super(message);
+    this.status = status;
+    this.code = code;
+    this.currentPlan = currentPlan;
+    this.name = "DurablePlanClientError";
+  }
+  status;
+  code;
+  currentPlan;
+};
+function recordOf(value) {
+  return value && typeof value === "object" && !Array.isArray(value) ? value : null;
+}
+function readPlan(value) {
+  const plan = recordOf(value);
+  if (!plan) return null;
+  const planId = typeof plan.planId === "string" ? plan.planId : typeof plan.id === "string" ? plan.id : null;
+  if (!planId || typeof plan.revision !== "number" || typeof plan.body !== "string" || typeof plan.submittedAt !== "string" || typeof plan.status !== "string") return null;
+  return { ...plan, planId };
+}
+function receiptIdentity(plan, followUp) {
+  if (typeof followUp.receiptId === "string" && followUp.receiptId) return followUp.receiptId;
+  const turnId = typeof followUp.turnId === "string" ? followUp.turnId : "";
+  return `${plan.planId}:${plan.revision}:${turnId}`;
+}
+function parseDecisionResult(value) {
+  const body = recordOf(value);
+  const plan = readPlan(body?.plan);
+  if (!body || !plan) return null;
+  const rawFollowUp = recordOf(body.followUp) ?? recordOf(body.receipt);
+  const followUp = rawFollowUp && typeof rawFollowUp.turnId === "string" ? {
+    receiptId: receiptIdentity(plan, rawFollowUp),
+    planId: plan.planId,
+    revision: plan.revision,
+    turnId: rawFollowUp.turnId,
+    state: typeof rawFollowUp.state === "string" ? rawFollowUp.state : "unknown"
+  } : void 0;
+  return {
+    plan,
+    ...followUp ? { followUp } : {},
+    idempotent: body.idempotent === true || body.replayed === true,
+    ...body.projectionPending === true ? { projectionPending: true } : {},
+    ...body.effectPending === true ? { effectPending: true } : {}
+  };
 }
-function ChevronDownGlyph({ className }) {
-  return /* @__PURE__ */ jsx6("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx6("path", { d: "m6 9 6 6 6-6" }) });
+async function responseBody(response) {
+  return recordOf(await response.json().catch(() => null)) ?? {};
 }
-var STATUS_LABELS2 = interactionStatusLabels({
-  pending: "Waiting for your approval",
-  answered: "Approved",
-  declined: "Rejected"
-});
-var TERMINAL_NOTES2 = interactionTerminalNotes("plan", {
-  declined: "The agent was asked to revise the plan."
-});
-var COLLAPSED_MAX_HEIGHT = 320;
-function InteractionPlanCard({
-  interaction,
-  canWrite,
-  submitAnswer,
-  onResolved,
-  renderMarkdown,
-  className
-}) {
-  const [values, setValues] = useState5({});
-  const [expanded, setExpanded] = useState5(false);
-  const [submitting, setSubmitting] = useState5(null);
-  const [localStatus, setLocalStatus] = useState5(null);
-  const [error, setError] = useState5(null);
-  const submitInFlightRef = useRef5(false);
-  const status = isTerminalInteractionStatus(interaction.status) ? interaction.status : localStatus ?? interaction.status;
-  const disabled = !canWrite || status !== "pending" || submitting !== null;
-  const approveData = useMemo3(() => buildAnswerData(interaction.fields, values), [interaction.fields, values]);
-  const rejectData = useMemo3(() => {
-    const data = {};
-    for (const field of interaction.fields) {
-      const answer = fieldAnswer(field, values);
-      if (answer !== null) data[field.name] = answer;
+function createDurablePlanDecisionClient(options) {
+  const fetchImpl = options.fetchImpl ?? fetch;
+  const urlFor = (input) => typeof options.url === "function" ? options.url(input) : options.url;
+  const read = async (response) => {
+    const body = await responseBody(response);
+    const result = parseDecisionResult(body);
+    if (response.ok && result) return result;
+    const currentPlan = readPlan(body.plan) ?? void 0;
+    const message = typeof body.error === "string" ? body.error : typeof body.message === "string" ? body.message : `Plan request failed (${response.status})`;
+    throw new DurablePlanClientError(
+      message,
+      response.status,
+      typeof body.code === "string" ? body.code : void 0,
+      currentPlan
+    );
+  };
+  return {
+    async current(input) {
+      const rawUrl = urlFor(input);
+      const url = new URL(rawUrl, globalThis.location?.origin ?? "http://localhost");
+      url.searchParams.set("planId", input.planId);
+      if (input.revision !== void 0) url.searchParams.set("revision", String(input.revision));
+      const target = /^https?:/.test(rawUrl) ? url.toString() : `${url.pathname}${url.search}`;
+      return read(await fetchImpl(target, { method: "GET" }));
+    },
+    async decide(input) {
+      const extra = typeof options.body === "function" ? options.body(input) : options.body ?? {};
+      return read(await fetchImpl(urlFor(input), {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ ...extra, ...input })
+      }));
     }
-    return data;
-  }, [interaction.fields, values]);
-  async function submit(outcome) {
-    const data = outcome === "accepted" ? approveData : rejectData;
-    if (submitInFlightRef.current || disabled || data === null) return;
-    submitInFlightRef.current = true;
-    setSubmitting(outcome === "accepted" ? "approve" : "reject");
+  };
+}
+function useDurablePlanFlow(options) {
+  const [plan, setPlan] = useState7(options.plan);
+  const [deciding, setDeciding] = useState7(null);
+  const [restoring, setRestoring] = useState7(false);
+  const [error, setError] = useState7(null);
+  const attachments = useRef6(/* @__PURE__ */ new Map());
+  const decisionInFlight = useRef6(false);
+  useEffect6(() => setPlan(options.plan), [options.plan]);
+  const apply = useCallback2(async (result) => {
+    setPlan(result.plan);
+    options.onUpdated?.(result.plan);
+    const receipt = result.followUp;
+    if (!receipt || !options.attachFollowUp) return;
+    let pending = attachments.current.get(receipt.receiptId);
+    if (!pending) {
+      pending = Promise.resolve(options.attachFollowUp(receipt));
+      attachments.current.set(receipt.receiptId, pending);
+      void pending.finally(() => attachments.current.delete(receipt.receiptId));
+    }
+    await pending;
+  }, [options.attachFollowUp, options.onUpdated]);
+  const decide = useCallback2(async (decision, feedback) => {
+    if (decisionInFlight.current) return null;
+    decisionInFlight.current = true;
+    setDeciding(decision);
     setError(null);
     try {
-      const result = await submitAnswer({ id: interaction.id, outcome, data });
-      if (result.ok) {
-        const resolved = outcome === "accepted" ? "answered" : "declined";
-        setLocalStatus(resolved);
-        onResolved?.(interaction.id, resolved);
-        return;
-      }
-      if (result.expired) {
-        setLocalStatus("expired");
-        onResolved?.(interaction.id, "expired");
-        return;
+      const result = await options.client.decide({
+        planId: plan.planId,
+        revision: plan.revision,
+        decision,
+        ...feedback?.trim() ? { feedback: feedback.trim() } : {}
+      });
+      await apply(result);
+      return result;
+    } catch (cause) {
+      if (cause instanceof DurablePlanClientError && cause.currentPlan) {
+        setPlan(cause.currentPlan);
+        options.onUpdated?.(cause.currentPlan);
       }
-      setError(result.message);
+      setError(cause instanceof Error ? cause.message : "Could not decide the plan.");
+      return null;
     } finally {
-      submitInFlightRef.current = false;
-      setSubmitting(null);
+      decisionInFlight.current = false;
+      setDeciding(null);
+    }
+  }, [apply, options.client, options.onUpdated, plan.planId, plan.revision]);
+  const restore = useCallback2(async () => {
+    setRestoring(true);
+    setError(null);
+    try {
+      const result = await options.client.current({ planId: plan.planId, revision: plan.revision });
+      await apply(result);
+      return result;
+    } catch (cause) {
+      setError(cause instanceof Error ? cause.message : "Could not restore the plan.");
+      return null;
+    } finally {
+      setRestoring(false);
     }
+  }, [apply, options.client, plan.planId, plan.revision]);
+  return { plan, deciding, restoring, error, decide, restore, clearError: () => setError(null) };
+}
+
+// src/web-react/durable-interaction-submit.ts
+function attemptStorageKey(namespace, interactionId) {
+  return `${namespace}:${encodeURIComponent(interactionId)}`;
+}
+function storedAttempts(storage, key) {
+  try {
+    const value = JSON.parse(storage.getItem(key) ?? "{}");
+    return value && typeof value === "object" && !Array.isArray(value) ? value : {};
+  } catch {
+    return {};
   }
-  const terminalNote = TERMINAL_NOTES2[status];
-  const approved = status === "answered";
-  return /* @__PURE__ */ jsxs5("div", { className: `rounded-xl border border-border bg-card p-4 shadow-sm ${className ?? ""}`, children: [
-    /* @__PURE__ */ jsxs5("div", { className: "mb-3 flex flex-wrap items-center justify-between gap-2", children: [
-      /* @__PURE__ */ jsxs5("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsx6(InteractionBadge, { variant: "outline", children: "Plan" }),
-        /* @__PURE__ */ jsx6(InteractionBadge, { variant: approved ? "default" : status === "expired" || status === "declined" ? "destructive" : "outline", children: STATUS_LABELS2[status] })
-      ] }),
-      /* @__PURE__ */ jsx6("span", { className: "text-xs text-muted-foreground", children: "The agent proposed a plan" })
-    ] }),
-    interaction.title.trim() && /* @__PURE__ */ jsx6("p", { className: "mb-3 text-sm font-medium leading-5 text-foreground", children: interaction.title }),
-    interaction.body && /* @__PURE__ */ jsxs5("div", { className: "relative", children: [
-      /* @__PURE__ */ jsx6(
-        "div",
-        {
-          className: "overflow-hidden text-sm text-foreground",
-          style: expanded ? void 0 : { maxHeight: COLLAPSED_MAX_HEIGHT },
-          children: renderMarkdown ? renderMarkdown(interaction.body) : /* @__PURE__ */ jsx6("p", { className: "whitespace-pre-wrap leading-5", children: interaction.body })
-        }
-      ),
-      !expanded && /* @__PURE__ */ jsx6("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 h-12 bg-gradient-to-t from-card to-transparent" }),
-      /* @__PURE__ */ jsxs5(
-        "button",
-        {
-          type: "button",
-          onClick: () => setExpanded((prev) => !prev),
-          className: "mt-1 inline-flex items-center gap-1 text-xs text-muted-foreground transition hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-          children: [
-            /* @__PURE__ */ jsx6(ChevronDownGlyph, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` }),
-            expanded ? "Collapse plan" : "Show full plan"
-          ]
-        }
-      )
-    ] }),
-    interaction.fields.length > 0 && /* @__PURE__ */ jsx6("div", { className: "mt-3 space-y-4", children: interaction.fields.map((field) => /* @__PURE__ */ jsxs5("fieldset", { className: "space-y-2", children: [
-      /* @__PURE__ */ jsx6("p", { className: "text-sm font-medium leading-5 text-foreground", children: field.label }),
-      fieldAcceptsFreeText(field) ? /* @__PURE__ */ jsx6(
-        "textarea",
-        {
-          value: values[field.name]?.text ?? "",
-          disabled,
-          "aria-label": field.label,
-          onChange: (event) => setValues((prev) => ({ ...prev, [field.name]: { ...prev[field.name], text: event.target.value } })),
-          rows: 2,
-          placeholder: field.type === "text" ? field.placeholder ?? "Optional feedback for the agent" : void 0,
-          className: "w-full rounded-lg border border-border bg-background px-3 py-2 text-sm text-foreground outline-none focus:border-primary disabled:opacity-50"
-        }
-      ) : /* @__PURE__ */ jsx6(
-        "input",
-        {
-          type: "text",
-          value: values[field.name]?.text ?? "",
-          disabled,
-          "aria-label": field.label,
-          onChange: (event) => setValues((prev) => ({ ...prev, [field.name]: { ...prev[field.name], text: event.target.value } })),
-          className: "w-full rounded-lg border border-border bg-background px-3 py-2 text-sm text-foreground outline-none focus:border-primary disabled:opacity-50"
-        }
-      )
-    ] }, field.name)) }),
-    error && /* @__PURE__ */ jsx6("p", { className: "mt-3 text-xs text-destructive", children: error }),
-    terminalNote && /* @__PURE__ */ jsx6("p", { className: "mt-3 text-xs text-muted-foreground", children: terminalNote }),
-    status === "pending" && /* @__PURE__ */ jsxs5("div", { className: "mt-4 flex items-center justify-end gap-2", children: [
-      /* @__PURE__ */ jsx6(InteractionActionButton, { variant: "outline", onClick: () => void submit("declined"), disabled, children: submitting === "reject" ? "Sending\u2026" : "Request changes" }),
-      /* @__PURE__ */ jsx6(InteractionActionButton, { onClick: () => void submit("accepted"), disabled: disabled || approveData === null, children: submitting === "approve" ? "Approving\u2026" : "Approve plan" })
-    ] }),
-    approved && /* @__PURE__ */ jsx6("div", { className: "mt-4 flex items-center justify-end", children: /* @__PURE__ */ jsxs5("span", { className: "inline-flex items-center gap-1 text-xs text-muted-foreground", children: [
-      /* @__PURE__ */ jsx6(CheckGlyph2, { className: "h-3 w-3" }),
-      "Approved"
-    ] }) })
-  ] });
+}
+function createSessionInteractionAttemptStore(storage, namespace = "agent-app:interaction-attempt") {
+  return {
+    get(id, signature) {
+      return storedAttempts(storage, attemptStorageKey(namespace, id))[signature] ?? null;
+    },
+    set(id, signature, attemptKey) {
+      const key = attemptStorageKey(namespace, id);
+      storage.setItem(key, JSON.stringify({ ...storedAttempts(storage, key), [signature]: attemptKey }));
+    },
+    delete(id, signature) {
+      const key = attemptStorageKey(namespace, id);
+      const attempts = storedAttempts(storage, key);
+      delete attempts[signature];
+      if (Object.keys(attempts).length === 0) storage.removeItem(key);
+      else storage.setItem(key, JSON.stringify(attempts));
+    }
+  };
+}
+function createMemoryInteractionAttemptStore() {
+  const attempts = /* @__PURE__ */ new Map();
+  const key = (id, signature) => `${id}\0${signature}`;
+  return {
+    get: (id, signature) => attempts.get(key(id, signature)) ?? null,
+    set: (id, signature, attemptKey) => attempts.set(key(id, signature), attemptKey),
+    delete: (id, signature) => {
+      attempts.delete(key(id, signature));
+    }
+  };
+}
+function stableValue(value) {
+  if (Array.isArray(value)) return value.map(stableValue);
+  if (!value || typeof value !== "object") return value;
+  return Object.fromEntries(Object.entries(value).sort(([left], [right]) => left.localeCompare(right)).map(([key, nested]) => [key, stableValue(nested)]));
+}
+function interactionSubmissionSignature(submission) {
+  return JSON.stringify(stableValue(submission));
+}
+function defaultAttemptKey() {
+  if (globalThis.crypto?.randomUUID) return globalThis.crypto.randomUUID();
+  return `attempt-${Date.now()}-${Math.random().toString(36).slice(2)}`;
+}
+function createDurableInteractionAnswerSubmitter(options) {
+  const timeoutMs = options.timeoutMs ?? INTERACTION_SUBMIT_TIMEOUT_MS;
+  const fetchImpl = options.fetchImpl ?? fetch;
+  return async (submission) => {
+    const signature = interactionSubmissionSignature(submission);
+    let attemptKey;
+    try {
+      attemptKey = options.attempts.get(submission.id, signature) ?? "";
+      if (!attemptKey) {
+        attemptKey = (options.createAttemptKey ?? defaultAttemptKey)();
+        options.attempts.set(submission.id, signature, attemptKey);
+      }
+    } catch (cause) {
+      return {
+        ok: false,
+        expired: false,
+        message: cause instanceof Error ? cause.message : "Failed to submit the answer"
+      };
+    }
+    const url = typeof options.url === "function" ? options.url(submission) : options.url;
+    const extra = typeof options.body === "function" ? options.body(submission) : options.body ?? {};
+    const controller = new AbortController();
+    const timer = setTimeout(() => controller.abort(INTERACTION_SUBMIT_TIMEOUT_MESSAGE), timeoutMs);
+    try {
+      const response = await fetchImpl(url, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        signal: controller.signal,
+        body: JSON.stringify({
+          ...extra,
+          id: submission.id,
+          outcome: submission.outcome,
+          attemptKey,
+          ...submission.data ? { data: submission.data } : {}
+        })
+      });
+      if (response.ok) {
+        options.attempts.delete(submission.id, signature);
+        return { ok: true };
+      }
+      const failure = await responseErrorMessage(response);
+      if (response.status < 500) options.attempts.delete(submission.id, signature);
+      return { ok: false, expired: response.status === 410, message: failure.message };
+    } catch (cause) {
+      if (controller.signal.aborted) {
+        return { ok: false, expired: false, message: INTERACTION_SUBMIT_TIMEOUT_MESSAGE };
+      }
+      return {
+        ok: false,
+        expired: false,
+        message: cause instanceof Error ? cause.message : "Failed to submit the answer"
+      };
+    } finally {
+      clearTimeout(timer);
+    }
+  };
 }
 
 // src/web-react/use-chat-interactions.ts
-import { useCallback as useCallback2, useMemo as useMemo4, useState as useState6 } from "react";
+import { useCallback as useCallback3, useMemo as useMemo4, useState as useState8 } from "react";
 function hasPendingContentDuplicate(list, interaction) {
   if (interaction.status !== "pending") return false;
   const signature = questionInteractionContentSignature(interaction);
@@ -1382,7 +1869,15 @@ function upsertChatInteraction(list, interaction) {
     return [...list, interaction];
   }
   const existing = list[index];
-  if (!existing || isTerminalInteractionStatus(existing.status)) return list;
+  if (!existing) return list;
+  if (isTerminalInteractionStatus(existing.status)) {
+    if (existing.status === interaction.status && (!existing.answers && interaction.answers || !existing.cancelReason && interaction.cancelReason)) {
+      const next2 = [...list];
+      next2[index] = { ...existing, ...interaction };
+      return next2;
+    }
+    return list;
+  }
   const next = [...list];
   next[index] = interaction;
   return next;
@@ -1399,50 +1894,74 @@ function cancelChatInteraction(list, cancel) {
   };
   return next;
 }
-function resolveChatInteraction(list, id, status) {
+function resolveChatInteraction(list, id, status, answers) {
   const index = list.findIndex((item) => item.id === id);
   const existing = list[index];
   if (!existing || existing.status !== "pending") return list;
   const next = [...list];
-  next[index] = { ...existing, status };
+  next[index] = { ...existing, status, ...answers ? { answers } : {} };
   return next;
 }
 function terminalizePendingChatInteractions(list, status) {
   if (!list.some((item) => item.status === "pending")) return list;
   return list.map((item) => item.status === "pending" ? { ...item, status } : item);
 }
-function restoreChatInteractions(list, outstanding) {
-  const outstandingIds = new Set(outstanding.map((request) => request.id));
-  let next = list.map((item) => item.status === "pending" && !outstandingIds.has(item.id) ? { ...item, status: "answered" } : item);
+function restoreChatInteractions(list, outstanding, options = {}) {
+  let next = list;
   for (const request of outstanding) {
-    next = upsertChatInteraction(next, interactionFromWireRequest(request));
+    const interaction = interactionFromWireRequest(request);
+    const exact = next.findIndex((item) => item.id === interaction.id);
+    if (exact !== -1) {
+      next = upsertChatInteraction(next, interaction);
+      continue;
+    }
+    const signature = questionInteractionContentSignature(interaction);
+    const obsolete = signature ? next.findIndex((item) => item.status === "pending" && questionInteractionContentSignature(item) === signature) : -1;
+    if (obsolete === -1) {
+      next = [...next, interaction];
+      continue;
+    }
+    next = [...next];
+    next[obsolete] = interaction;
+  }
+  if (options.mode !== "durable") {
+    const outstandingIds = new Set(outstanding.map((request) => request.id));
+    next = next.map((item) => item.status === "pending" && !outstandingIds.has(item.id) ? { ...item, status: "answered" } : item);
   }
   return next;
 }
-function useChatInteractions() {
-  const [interactions, setInteractions] = useState6([]);
-  const upsert = useCallback2((interaction) => {
+function hydrateChatInteractions(list, persisted) {
+  return persisted.reduce(upsertChatInteraction, list);
+}
+function useChatInteractions(options = {}) {
+  const [interactions, setInteractions] = useState8([]);
+  const upsert = useCallback3((interaction) => {
     setInteractions((prev) => upsertChatInteraction(prev, interaction));
   }, []);
-  const applyCancel = useCallback2((cancel) => {
+  const applyCancel = useCallback3((cancel) => {
     setInteractions((prev) => cancelChatInteraction(prev, cancel));
   }, []);
-  const markResolved = useCallback2((id, status) => {
-    setInteractions((prev) => resolveChatInteraction(prev, id, status));
+  const markResolved = useCallback3((id, status, answers) => {
+    setInteractions((prev) => resolveChatInteraction(prev, id, status, answers));
   }, []);
-  const restore = useCallback2((outstanding) => {
-    setInteractions((prev) => restoreChatInteractions(prev, outstanding));
+  const restore = useCallback3((outstanding, restoreOptions) => {
+    setInteractions((prev) => restoreChatInteractions(prev, outstanding, {
+      mode: restoreOptions?.mode ?? options.mode
+    }));
+  }, [options.mode]);
+  const hydrate = useCallback3((persisted) => {
+    setInteractions((prev) => hydrateChatInteractions(prev, persisted));
   }, []);
-  const terminalizePending = useCallback2((status) => {
+  const terminalizePending = useCallback3((status) => {
     setInteractions((prev) => terminalizePendingChatInteractions(prev, status));
   }, []);
-  const reset = useCallback2(() => setInteractions([]), []);
+  const reset = useCallback3(() => setInteractions([]), []);
   const pending = useMemo4(() => interactions.filter((item) => item.status === "pending"), [interactions]);
-  return { interactions, pending, upsert, applyCancel, markResolved, restore, terminalizePending, reset };
+  return { interactions, pending, upsert, applyCancel, markResolved, restore, hydrate, terminalizePending, reset };
 }
 
 // src/web-react/use-file-mentions.ts
-import { useCallback as useCallback3, useMemo as useMemo5, useRef as useRef6, useState as useState7 } from "react";
+import { useCallback as useCallback4, useMemo as useMemo5, useRef as useRef7, useState as useState9 } from "react";
 var FILE_MENTION_KIND = "file";
 function toMentionItem(file) {
   return { id: file.path, label: file.name, detail: file.path, kind: FILE_MENTION_KIND };
@@ -1500,12 +2019,12 @@ function useFileMentions(options) {
     emptyText = DEFAULT_MENTION_EMPTY_TEXT
   } = options;
   const fetchImpl = options.fetchImpl ?? fetch;
-  const [state, setState] = useState7({ kind: "idle" });
-  const stateRef = useRef6(state);
+  const [state, setState] = useState9({ kind: "idle" });
+  const stateRef = useRef7(state);
   stateRef.current = state;
-  const inFlightRef = useRef6(null);
-  const [mentions, setMentions] = useState7([]);
-  const load = useCallback3(() => {
+  const inFlightRef = useRef7(null);
+  const [mentions, setMentions] = useState9([]);
+  const load = useCallback4(() => {
     if (inFlightRef.current) return inFlightRef.current;
     if (stateRef.current.kind === "idle") {
       stateRef.current = { kind: "loading" };
@@ -1537,10 +2056,10 @@ function useFileMentions(options) {
     inFlightRef.current = attempt;
     return attempt;
   }, [fetchImpl, indexUrl]);
-  const refresh = useCallback3(async () => {
+  const refresh = useCallback4(async () => {
     await load();
   }, [load]);
-  const fetchItems = useCallback3(
+  const fetchItems = useCallback4(
     async (query) => {
       let current = stateRef.current;
       if (current.kind === "idle" || current.kind === "loading") {
@@ -1555,10 +2074,10 @@ function useFileMentions(options) {
     },
     [load, limit, refreshAfterMs]
   );
-  const onMentionsChange = useCallback3((items) => {
+  const onMentionsChange = useCallback4((items) => {
     setMentions(items.filter((item) => item.kind === void 0 || item.kind === FILE_MENTION_KIND).map(toFileMention));
   }, []);
-  const clearMentions = useCallback3(() => setMentions([]), []);
+  const clearMentions = useCallback4(() => setMentions([]), []);
   const mention = useMemo5(
     () => ({
       fetchItems,
@@ -1571,8 +2090,8 @@ function useFileMentions(options) {
 }
 
 // src/web-react/mission-activity.tsx
-import { useCallback as useCallback4, useEffect as useEffect4, useState as useState8 } from "react";
-import { Fragment as Fragment4, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { useCallback as useCallback5, useEffect as useEffect7, useState as useState10 } from "react";
+import { Fragment as Fragment4, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
 var LIVE_STATUSES = /* @__PURE__ */ new Set(["pending", "running"]);
 var OK_STATUSES = /* @__PURE__ */ new Set(["completed", "done", "succeeded"]);
 var ERROR_STATUSES = /* @__PURE__ */ new Set(["failed", "error", "cancelled", "aborted"]);
@@ -1619,20 +2138,20 @@ function waterfallLayout(trace) {
   });
 }
 function ChevronGlyph({ className }) {
-  return /* @__PURE__ */ jsx7("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx7("path", { d: "m6 9 6 6 6-6" }) });
+  return /* @__PURE__ */ jsx9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx9("path", { d: "m6 9 6 6 6-6" }) });
 }
 function RefreshGlyph({ className }) {
-  return /* @__PURE__ */ jsx7("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx7("path", { d: "M21 12a9 9 0 1 1-2.64-6.36M21 3v6h-6" }) });
+  return /* @__PURE__ */ jsx9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx9("path", { d: "M21 12a9 9 0 1 1-2.64-6.36M21 3v6h-6" }) });
 }
 function CopyGlyph({ className }) {
-  return /* @__PURE__ */ jsxs6("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-    /* @__PURE__ */ jsx7("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2" }),
-    /* @__PURE__ */ jsx7("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
+  return /* @__PURE__ */ jsxs7("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx9("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2" }),
+    /* @__PURE__ */ jsx9("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
   ] });
 }
 function TraceIdCopy({ traceId }) {
-  const [copied, setCopied] = useState8(false);
-  const copy = useCallback4(() => {
+  const [copied, setCopied] = useState10(false);
+  const copy = useCallback5(() => {
     void navigator.clipboard?.writeText(traceId).then(
       () => {
         setCopied(true);
@@ -1642,7 +2161,7 @@ function TraceIdCopy({ traceId }) {
       }
     );
   }, [traceId]);
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     "button",
     {
       type: "button",
@@ -1651,23 +2170,23 @@ function TraceIdCopy({ traceId }) {
       "aria-label": "Copy trace id",
       className: "inline-flex min-w-0 items-center gap-1.5 rounded text-left font-mono text-muted-foreground transition hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-card",
       children: [
-        /* @__PURE__ */ jsx7("span", { className: "truncate", children: traceId }),
-        /* @__PURE__ */ jsx7(CopyGlyph, { className: "h-3 w-3 shrink-0" }),
-        copied && /* @__PURE__ */ jsx7("span", { className: "shrink-0 not-italic text-success", children: "copied" })
+        /* @__PURE__ */ jsx9("span", { className: "truncate", children: traceId }),
+        /* @__PURE__ */ jsx9(CopyGlyph, { className: "h-3 w-3 shrink-0" }),
+        copied && /* @__PURE__ */ jsx9("span", { className: "shrink-0 not-italic text-success", children: "copied" })
       ]
     }
   );
 }
 function StatusDot({ tone }) {
-  return /* @__PURE__ */ jsxs6("span", { className: "inline-flex items-center", children: [
-    /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsxs7("span", { className: "inline-flex items-center", children: [
+    /* @__PURE__ */ jsx9(
       "span",
       {
         "aria-hidden": true,
         className: `h-2 w-2 shrink-0 rounded-full ${tone === "live" ? "animate-pulse bg-warning" : tone === "ok" ? "bg-success" : tone === "error" ? "bg-destructive" : "bg-muted-foreground/40"}`
       }
     ),
-    /* @__PURE__ */ jsx7("span", { className: "sr-only", children: tone })
+    /* @__PURE__ */ jsx9("span", { className: "sr-only", children: tone })
   ] });
 }
 var BAR_CLASS = {
@@ -1679,19 +2198,19 @@ function FlowWaterfall({ trace }) {
   const rows = waterfallLayout(trace);
   if (rows.length === 0) return null;
   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__ */ jsx7("span", { className: "truncate font-mono text-[11px] text-muted-foreground", title: row.name, children: row.name }),
-      /* @__PURE__ */ jsx7("div", { className: "relative h-2 rounded-sm bg-muted/40", children: /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsxs7("div", { className: "space-y-1", children: [
+    rows.map((row, i) => /* @__PURE__ */ jsxs7("div", { className: "grid grid-cols-[minmax(0,2fr)_minmax(0,3fr)_auto] items-center gap-2", children: [
+      /* @__PURE__ */ jsx9("span", { className: "truncate font-mono text-[11px] text-muted-foreground", title: row.name, children: row.name }),
+      /* @__PURE__ */ jsx9("div", { className: "relative h-2 rounded-sm bg-muted/40", children: /* @__PURE__ */ jsx9(
         "div",
         {
           className: `absolute inset-y-0 rounded-sm ${row.ok ? BAR_CLASS[row.kind] : "bg-destructive/80"} ${row.approx ? "opacity-70" : ""}`,
           style: { left: `${row.offsetPct}%`, width: `${row.widthPct}%` }
         }
       ) }),
-      /* @__PURE__ */ jsx7("span", { className: "shrink-0 font-mono text-[10px] tabular-nums text-muted-foreground/70", children: row.durationLabel })
+      /* @__PURE__ */ jsx9("span", { className: "shrink-0 font-mono text-[10px] tabular-nums text-muted-foreground/70", children: row.durationLabel })
     ] }, i)),
-    /* @__PURE__ */ jsxs6("p", { className: "pt-0.5 text-right font-mono text-[10px] tabular-nums text-muted-foreground/60", children: [
+    /* @__PURE__ */ jsxs7("p", { className: "pt-0.5 text-right font-mono text-[10px] tabular-nums text-muted-foreground/60", children: [
       (trace.totalMs / 1e3).toFixed(1),
       "s",
       cost ? ` \xB7 ${cost}` : ""
@@ -1699,43 +2218,43 @@ function FlowWaterfall({ trace }) {
   ] });
 }
 function MissionActivityLane({ activity, startedAt, nowMs }) {
-  const [expanded, setExpanded] = useState8(false);
+  const [expanded, setExpanded] = useState10(false);
   if (activity.length === 0) return null;
-  return /* @__PURE__ */ jsxs6("div", { className: "mt-1 border-l border-border/50 pl-3", children: [
+  return /* @__PURE__ */ jsxs7("div", { className: "mt-1 border-l border-border/50 pl-3", children: [
     activity.map((run) => {
       const tone = activityTone(run.status);
       const cost = formatActivityCost(run.costUsd);
       const duration = formatActivityDuration(run.durationMs);
-      return /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2 py-1 text-xs", children: [
-        /* @__PURE__ */ jsx7(StatusDot, { tone }),
-        /* @__PURE__ */ jsxs6("span", { className: "min-w-0 flex-1 truncate", children: [
-          /* @__PURE__ */ jsx7("span", { className: "font-medium", children: run.tool }),
-          /* @__PURE__ */ jsxs6("span", { className: "text-muted-foreground", children: [
+      return /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2 py-1 text-xs", children: [
+        /* @__PURE__ */ jsx9(StatusDot, { tone }),
+        /* @__PURE__ */ jsxs7("span", { className: "min-w-0 flex-1 truncate", children: [
+          /* @__PURE__ */ jsx9("span", { className: "font-medium", children: run.tool }),
+          /* @__PURE__ */ jsxs7("span", { className: "text-muted-foreground", children: [
             " \u2014 ",
             run.detail
           ] })
         ] }),
-        tone === "live" && (run.iteration !== void 0 || run.phase !== void 0) && /* @__PURE__ */ jsx7("span", { className: "shrink-0 rounded-full bg-warning/10 px-1.5 py-0.5 font-mono text-[10px] 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-[10px] tabular-nums text-muted-foreground/70", children: [
-          tone !== "live" && tone !== "ok" && /* @__PURE__ */ jsx7("span", { children: run.status }),
-          cost && /* @__PURE__ */ jsx7("span", { children: cost }),
-          duration && /* @__PURE__ */ jsx7("span", { children: duration })
+        tone === "live" && (run.iteration !== void 0 || run.phase !== void 0) && /* @__PURE__ */ jsx9("span", { className: "shrink-0 rounded-full bg-warning/10 px-1.5 py-0.5 font-mono text-[10px] text-warning", children: [run.iteration !== void 0 ? `iter ${run.iteration}` : null, run.phase ?? null].filter(Boolean).join(" \xB7 ") }),
+        /* @__PURE__ */ jsxs7("span", { className: "flex shrink-0 items-center gap-1.5 font-mono text-[10px] tabular-nums text-muted-foreground/70", children: [
+          tone !== "live" && tone !== "ok" && /* @__PURE__ */ jsx9("span", { children: run.status }),
+          cost && /* @__PURE__ */ jsx9("span", { children: cost }),
+          duration && /* @__PURE__ */ jsx9("span", { children: duration })
         ] })
       ] }, run.taskId);
     }),
-    /* @__PURE__ */ jsxs6(
+    /* @__PURE__ */ jsxs7(
       "button",
       {
         type: "button",
         onClick: () => setExpanded((v) => !v),
         className: "flex items-center gap-1 py-0.5 text-[10px] font-medium text-muted-foreground/70 transition hover:text-foreground",
         children: [
-          /* @__PURE__ */ jsx7(ChevronGlyph, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` }),
+          /* @__PURE__ */ jsx9(ChevronGlyph, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` }),
           "timeline"
         ]
       }
     ),
-    expanded && /* @__PURE__ */ jsx7("div", { className: "rounded-md border border-border/50 bg-muted/10 p-2", children: /* @__PURE__ */ jsx7(
+    expanded && /* @__PURE__ */ jsx9("div", { className: "rounded-md border border-border/50 bg-muted/10 p-2", children: /* @__PURE__ */ jsx9(
       FlowWaterfall,
       {
         trace: stepActivityFlowTrace(activity, {
@@ -1750,45 +2269,45 @@ function ActivityRow({
   record,
   renderMissionRef
 }) {
-  const [open, setOpen] = useState8(false);
+  const [open, setOpen] = useState10(false);
   const tone = activityTone(record.status);
   const cost = formatActivityCost(record.costUsd);
   const duration = formatActivityDuration(record.durationMs);
-  return /* @__PURE__ */ jsxs6("div", { className: "rounded-lg border border-border/60 bg-card", children: [
-    /* @__PURE__ */ jsxs6("button", { type: "button", onClick: () => setOpen((v) => !v), className: "flex w-full items-center gap-2.5 px-3 py-2 text-left text-sm", children: [
-      /* @__PURE__ */ jsx7(StatusDot, { tone }),
-      /* @__PURE__ */ jsxs6("span", { className: "min-w-0 flex-1 truncate", children: [
-        /* @__PURE__ */ jsx7("span", { className: "font-medium", children: record.tool }),
-        /* @__PURE__ */ jsxs6("span", { className: "text-muted-foreground", children: [
+  return /* @__PURE__ */ jsxs7("div", { className: "rounded-lg border border-border/60 bg-card", children: [
+    /* @__PURE__ */ jsxs7("button", { type: "button", onClick: () => setOpen((v) => !v), className: "flex w-full items-center gap-2.5 px-3 py-2 text-left text-sm", children: [
+      /* @__PURE__ */ jsx9(StatusDot, { tone }),
+      /* @__PURE__ */ jsxs7("span", { className: "min-w-0 flex-1 truncate", children: [
+        /* @__PURE__ */ jsx9("span", { className: "font-medium", children: record.tool }),
+        /* @__PURE__ */ jsxs7("span", { className: "text-muted-foreground", children: [
           " \u2014 ",
           record.detail
         ] })
       ] }),
-      tone === "live" && (record.iteration !== void 0 || record.phase !== void 0) && /* @__PURE__ */ jsx7("span", { className: "shrink-0 rounded-full bg-warning/10 px-2 py-0.5 font-mono text-[10px] text-warning", children: [record.iteration !== void 0 ? `iter ${record.iteration}` : null, record.phase ?? null].filter(Boolean).join(" \xB7 ") }),
-      /* @__PURE__ */ jsx7(
+      tone === "live" && (record.iteration !== void 0 || record.phase !== void 0) && /* @__PURE__ */ jsx9("span", { className: "shrink-0 rounded-full bg-warning/10 px-2 py-0.5 font-mono text-[10px] text-warning", children: [record.iteration !== void 0 ? `iter ${record.iteration}` : null, record.phase ?? null].filter(Boolean).join(" \xB7 ") }),
+      /* @__PURE__ */ jsx9(
         "span",
         {
           className: `shrink-0 rounded-full px-2 py-0.5 text-[10px] font-medium ${tone === "ok" ? "bg-success/10 text-success" : tone === "error" ? "bg-destructive/10 text-destructive" : tone === "live" ? "bg-warning/10 text-warning" : "bg-muted/60 text-muted-foreground"}`,
           children: record.status
         }
       ),
-      cost && /* @__PURE__ */ jsx7("span", { className: "shrink-0 font-mono text-[11px] tabular-nums text-muted-foreground", children: cost }),
-      /* @__PURE__ */ jsx7(ChevronGlyph, { className: `h-3 w-3 shrink-0 text-muted-foreground transition-transform ${open ? "rotate-180" : ""}` })
+      cost && /* @__PURE__ */ jsx9("span", { className: "shrink-0 font-mono text-[11px] tabular-nums text-muted-foreground", children: cost }),
+      /* @__PURE__ */ jsx9(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/40 px-3 py-2.5", children: [
-      record.durationMs !== void 0 && /* @__PURE__ */ jsx7("div", { className: "rounded-md border border-border/50 bg-muted/10 p-2", children: /* @__PURE__ */ jsx7(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__ */ jsx7("dt", { className: "text-muted-foreground/60", children: "task" }),
-        /* @__PURE__ */ jsx7("dd", { className: "truncate text-muted-foreground", children: record.taskId }),
-        /* @__PURE__ */ jsx7("dt", { className: "text-muted-foreground/60", children: "started" }),
-        /* @__PURE__ */ jsx7("dd", { className: "text-muted-foreground", children: new Date(record.startedAt).toLocaleString() }),
-        duration && /* @__PURE__ */ jsxs6(Fragment4, { children: [
-          /* @__PURE__ */ jsx7("dt", { className: "text-muted-foreground/60", children: "duration" }),
-          /* @__PURE__ */ jsx7("dd", { className: "text-muted-foreground", children: duration })
+    open && /* @__PURE__ */ jsxs7("div", { className: "space-y-2.5 border-t border-border/40 px-3 py-2.5", children: [
+      record.durationMs !== void 0 && /* @__PURE__ */ jsx9("div", { className: "rounded-md border border-border/50 bg-muted/10 p-2", children: /* @__PURE__ */ jsx9(FlowWaterfall, { trace: stepActivityFlowTrace([record]) }) }),
+      /* @__PURE__ */ jsxs7("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1 font-mono text-[11px]", children: [
+        /* @__PURE__ */ jsx9("dt", { className: "text-muted-foreground/60", children: "task" }),
+        /* @__PURE__ */ jsx9("dd", { className: "truncate text-muted-foreground", children: record.taskId }),
+        /* @__PURE__ */ jsx9("dt", { className: "text-muted-foreground/60", children: "started" }),
+        /* @__PURE__ */ jsx9("dd", { className: "text-muted-foreground", children: new Date(record.startedAt).toLocaleString() }),
+        duration && /* @__PURE__ */ jsxs7(Fragment4, { children: [
+          /* @__PURE__ */ jsx9("dt", { className: "text-muted-foreground/60", children: "duration" }),
+          /* @__PURE__ */ jsx9("dd", { className: "text-muted-foreground", children: duration })
         ] }),
-        record.traceId && /* @__PURE__ */ jsxs6(Fragment4, { children: [
-          /* @__PURE__ */ jsx7("dt", { className: "text-muted-foreground/60", children: "trace" }),
-          /* @__PURE__ */ jsx7("dd", { className: "min-w-0", children: /* @__PURE__ */ jsx7(TraceIdCopy, { traceId: record.traceId }) })
+        record.traceId && /* @__PURE__ */ jsxs7(Fragment4, { children: [
+          /* @__PURE__ */ jsx9("dt", { className: "text-muted-foreground/60", children: "trace" }),
+          /* @__PURE__ */ jsx9("dd", { className: "min-w-0", children: /* @__PURE__ */ jsx9(TraceIdCopy, { traceId: record.traceId }) })
         ] })
       ] }),
       record.missionRef && renderMissionRef?.(record.missionRef, record)
@@ -1796,11 +2315,11 @@ function ActivityRow({
   ] });
 }
 function AgentActivityPanel({ fetchActivity, renderMissionRef, title = "Agent activity", emptyLabel = "No agent runs yet." }) {
-  const [rows, setRows] = useState8([]);
-  const [cursor, setCursor] = useState8(void 0);
-  const [loading, setLoading] = useState8(false);
-  const [error, setError] = useState8(null);
-  const load = useCallback4(
+  const [rows, setRows] = useState10([]);
+  const [cursor, setCursor] = useState10(void 0);
+  const [loading, setLoading] = useState10(false);
+  const [error, setError] = useState10(null);
+  const load = useCallback5(
     async (from) => {
       setLoading(true);
       setError(null);
@@ -1816,13 +2335,13 @@ function AgentActivityPanel({ fetchActivity, renderMissionRef, title = "Agent ac
     },
     [fetchActivity]
   );
-  useEffect4(() => {
+  useEffect7(() => {
     void load();
   }, [load]);
-  return /* @__PURE__ */ jsxs6("div", { className: "space-y-2", children: [
-    /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx7("h2", { className: "flex-1 text-sm font-semibold", children: title }),
-      /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsxs7("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx9("h2", { className: "flex-1 text-sm font-semibold", children: title }),
+      /* @__PURE__ */ jsx9(
         "button",
         {
           type: "button",
@@ -1830,14 +2349,14 @@ function AgentActivityPanel({ fetchActivity, renderMissionRef, title = "Agent ac
           disabled: loading,
           "aria-label": "Refresh",
           className: "rounded-md p-1.5 text-muted-foreground transition hover:bg-accent/30 hover:text-foreground disabled:opacity-50",
-          children: /* @__PURE__ */ jsx7(RefreshGlyph, { className: `h-3.5 w-3.5 ${loading ? "animate-spin" : ""}` })
+          children: /* @__PURE__ */ jsx9(RefreshGlyph, { className: `h-3.5 w-3.5 ${loading ? "animate-spin" : ""}` })
         }
       )
     ] }),
-    error && /* @__PURE__ */ jsx7("p", { role: "alert", className: "rounded-md border border-destructive/40 bg-destructive/5 px-3 py-2 text-xs text-destructive", children: error }),
-    !error && rows.length === 0 && !loading && /* @__PURE__ */ jsx7("p", { className: "px-1 text-sm text-muted-foreground", children: emptyLabel }),
-    /* @__PURE__ */ jsx7("div", { className: "space-y-1.5", children: rows.map((record) => /* @__PURE__ */ jsx7(ActivityRow, { record, renderMissionRef }, record.taskId)) }),
-    cursor && /* @__PURE__ */ jsx7(
+    error && /* @__PURE__ */ jsx9("p", { role: "alert", className: "rounded-md border border-destructive/40 bg-destructive/5 px-3 py-2 text-xs text-destructive", children: error }),
+    !error && rows.length === 0 && !loading && /* @__PURE__ */ jsx9("p", { className: "px-1 text-sm text-muted-foreground", children: emptyLabel }),
+    /* @__PURE__ */ jsx9("div", { className: "space-y-1.5", children: rows.map((record) => /* @__PURE__ */ jsx9(ActivityRow, { record, renderMissionRef }, record.taskId)) }),
+    cursor && /* @__PURE__ */ jsx9(
       "button",
       {
         type: "button",
@@ -1851,9 +2370,9 @@ function AgentActivityPanel({ fetchActivity, renderMissionRef, title = "Agent ac
 }
 
 // src/web-react/seat-paywall.tsx
-import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
 function CheckGlyph3() {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx10(
     "svg",
     {
       className: "h-4 w-4 shrink-0 text-primary",
@@ -1864,14 +2383,14 @@ function CheckGlyph3() {
       strokeLinecap: "round",
       strokeLinejoin: "round",
       "aria-hidden": true,
-      children: /* @__PURE__ */ jsx8("path", { d: "M20 6 9 17l-5-5" })
+      children: /* @__PURE__ */ jsx10("path", { d: "M20 6 9 17l-5-5" })
     }
   );
 }
 function Benefit({ children }) {
-  return /* @__PURE__ */ jsxs7("li", { className: "flex items-start gap-2.5 text-sm text-foreground", children: [
-    /* @__PURE__ */ jsx8("span", { className: "mt-0.5", children: /* @__PURE__ */ jsx8(CheckGlyph3, {}) }),
-    /* @__PURE__ */ jsx8("span", { children })
+  return /* @__PURE__ */ jsxs8("li", { className: "flex items-start gap-2.5 text-sm text-foreground", children: [
+    /* @__PURE__ */ jsx10("span", { className: "mt-0.5", children: /* @__PURE__ */ jsx10(CheckGlyph3, {}) }),
+    /* @__PURE__ */ jsx10("span", { children })
   ] });
 }
 function SeatPaywall({
@@ -1885,30 +2404,30 @@ function SeatPaywall({
   footnote
 }) {
   const { pending, run } = usePending();
-  return /* @__PURE__ */ jsx8("div", { className: "flex min-h-[60vh] w-full items-center justify-center p-6", children: /* @__PURE__ */ jsxs7("div", { className: "w-full max-w-md rounded-2xl border border-border bg-card p-8 shadow-sm", children: [
-    /* @__PURE__ */ jsx8("p", { className: "text-xs font-medium uppercase tracking-wide text-muted-foreground", children: product }),
-    /* @__PURE__ */ jsxs7("h1", { className: "mt-2 text-2xl font-semibold tracking-tight text-foreground", children: [
+  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-border bg-card p-8 shadow-sm", children: [
+    /* @__PURE__ */ jsx10("p", { className: "text-xs font-medium uppercase tracking-wide text-muted-foreground", children: product }),
+    /* @__PURE__ */ jsxs8("h1", { className: "mt-2 text-2xl font-semibold tracking-tight text-foreground", children: [
       "Unlock ",
       product
     ] }),
-    tagline && /* @__PURE__ */ jsx8("p", { className: "mt-2 text-sm text-muted-foreground", children: tagline }),
-    /* @__PURE__ */ jsxs7("div", { className: "mt-6 flex items-baseline gap-1.5", children: [
-      /* @__PURE__ */ jsxs7("span", { className: "text-3xl font-semibold text-foreground", children: [
+    tagline && /* @__PURE__ */ jsx10("p", { className: "mt-2 text-sm text-muted-foreground", children: tagline }),
+    /* @__PURE__ */ jsxs8("div", { className: "mt-6 flex items-baseline gap-1.5", children: [
+      /* @__PURE__ */ jsxs8("span", { className: "text-3xl font-semibold text-foreground", children: [
         "$",
         priceUsd
       ] }),
-      /* @__PURE__ */ jsx8("span", { className: "text-sm text-muted-foreground", children: "/mo" })
+      /* @__PURE__ */ jsx10("span", { className: "text-sm text-muted-foreground", children: "/mo" })
     ] }),
-    /* @__PURE__ */ jsxs7("p", { className: "mt-1 text-sm text-muted-foreground", children: [
+    /* @__PURE__ */ jsxs8("p", { className: "mt-1 text-sm text-muted-foreground", children: [
       "Includes $",
       includedUsageUsd,
       "/mo of AI usage"
     ] }),
-    /* @__PURE__ */ jsx8("ul", { className: "mt-6 space-y-2.5", children: (benefits ?? [
+    /* @__PURE__ */ jsx10("ul", { className: "mt-6 space-y-2.5", children: (benefits ?? [
       `Full access to ${product}`,
       `$${includedUsageUsd}/mo of AI usage included, every month`
-    ]).map((benefit, i) => /* @__PURE__ */ jsx8(Benefit, { children: benefit }, i)) }),
-    /* @__PURE__ */ jsx8(
+    ]).map((benefit, i) => /* @__PURE__ */ jsx10(Benefit, { children: benefit }, i)) }),
+    /* @__PURE__ */ jsx10(
       "button",
       {
         type: "button",
@@ -1918,13 +2437,13 @@ function SeatPaywall({
         children: pending ? "Opening checkout\u2026" : ctaLabel ?? `Unlock ${product}`
       }
     ),
-    footnote && /* @__PURE__ */ jsx8("p", { className: "mt-3 text-center text-xs text-muted-foreground/70", children: footnote })
+    footnote && /* @__PURE__ */ jsx10("p", { className: "mt-3 text-center text-xs text-muted-foreground/70", children: footnote })
   ] }) });
 }
 
 // src/web-react/agent-session-controls.tsx
-import { useMemo as useMemo6, useState as useState9 } from "react";
-import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { useMemo as useMemo6, useState as useState11 } from "react";
+import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
 var HARNESS_LABELS = {
   opencode: "OpenCode (any model)",
   "claude-code": "Claude Code (Anthropic)",
@@ -1944,12 +2463,12 @@ function harnessLabel(h) {
   return HARNESS_LABELS[h] ?? h;
 }
 function ChevronDown2({ className }) {
-  return /* @__PURE__ */ jsx9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx9("path", { d: "m6 9 6 6 6-6" }) });
+  return /* @__PURE__ */ jsx11("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx11("path", { d: "m6 9 6 6 6-6" }) });
 }
 function GearGlyph({ className }) {
-  return /* @__PURE__ */ jsxs8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-    /* @__PURE__ */ jsx9("circle", { cx: "12", cy: "12", r: "3" }),
-    /* @__PURE__ */ jsx9("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1Z" })
+  return /* @__PURE__ */ jsxs9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx11("circle", { cx: "12", cy: "12", r: "3" }),
+    /* @__PURE__ */ jsx11("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1Z" })
   ] });
 }
 var FOCUS_RING = "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-background";
@@ -1958,11 +2477,11 @@ function HarnessPicker({
   onChange,
   available
 }) {
-  const [open, setOpen] = useState9(false);
+  const [open, setOpen] = useState11(false);
   const { containerRef, triggerProps } = usePopover(open, setOpen);
   const options = available ?? Object.keys(HARNESS_LABELS);
-  return /* @__PURE__ */ jsxs8("div", { ref: containerRef, className: "relative inline-flex", children: [
-    /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9("div", { ref: containerRef, className: "relative inline-flex", children: [
+    /* @__PURE__ */ jsxs9(
       "button",
       {
         type: "button",
@@ -1971,12 +2490,12 @@ function HarnessPicker({
         title: "Agent backend",
         className: `inline-flex w-full items-center justify-between gap-1.5 rounded-lg border border-border bg-card px-3 py-1.5 text-sm font-medium text-foreground transition hover:bg-accent/30 ${FOCUS_RING}`,
         children: [
-          /* @__PURE__ */ jsx9("span", { className: "truncate", children: harnessLabel(value) }),
-          /* @__PURE__ */ jsx9(ChevronDown2, { className: "h-3.5 w-3.5 text-muted-foreground" })
+          /* @__PURE__ */ jsx11("span", { className: "truncate", children: harnessLabel(value) }),
+          /* @__PURE__ */ jsx11(ChevronDown2, { className: "h-3.5 w-3.5 text-muted-foreground" })
         ]
       }
     ),
-    open && /* @__PURE__ */ jsx9("div", { role: "menu", className: "absolute bottom-full left-0 z-50 mb-2 max-h-64 w-full min-w-[220px] overflow-y-auto rounded-xl border border-border bg-card p-1 shadow-lg", children: options.map((h) => /* @__PURE__ */ jsx9(
+    open && /* @__PURE__ */ jsx11("div", { role: "menu", className: "absolute bottom-full left-0 z-50 mb-2 max-h-64 w-full min-w-[220px] overflow-y-auto rounded-xl border border-border bg-card p-1 shadow-lg", children: options.map((h) => /* @__PURE__ */ jsx11(
       "button",
       {
         type: "button",
@@ -2023,11 +2542,11 @@ function AgentSessionControls(props) {
     className
   } = props;
   const { onModel, onHarness } = useCoherentHandlers(props);
-  const [open, setOpen] = useState9(false);
+  const [open, setOpen] = useState11(false);
   const { containerRef: popoverRef, triggerProps } = usePopover(open, setOpen);
   const selectedModel = models.find((m) => m.id === model);
   const showEffort = selectedModel?.supportsReasoning ?? true;
-  const modelPicker = /* @__PURE__ */ jsx9(
+  const modelPicker = /* @__PURE__ */ jsx11(
     ModelPicker,
     {
       value: model,
@@ -2038,17 +2557,17 @@ function AgentSessionControls(props) {
     }
   );
   if (layout === "inline") {
-    return /* @__PURE__ */ jsxs8("div", { className: `flex items-center gap-1.5 ${className ?? ""}`, children: [
+    return /* @__PURE__ */ jsxs9("div", { className: `flex items-center gap-1.5 ${className ?? ""}`, children: [
       modelPicker,
-      showHarness && /* @__PURE__ */ jsx9(HarnessPicker, { value: harness, onChange: onHarness, available: availableHarnesses }),
-      showEffort && /* @__PURE__ */ jsx9(EffortPicker, { value: effort, onChange: onEffortChange })
+      showHarness && /* @__PURE__ */ jsx11(HarnessPicker, { value: harness, onChange: onHarness, available: availableHarnesses }),
+      showEffort && /* @__PURE__ */ jsx11(EffortPicker, { value: effort, onChange: onEffortChange })
     ] });
   }
   const hasAdvanced = showHarness || showEffort;
-  return /* @__PURE__ */ jsxs8("div", { className: `flex items-center gap-1.5 ${className ?? ""}`, children: [
+  return /* @__PURE__ */ jsxs9("div", { className: `flex items-center gap-1.5 ${className ?? ""}`, children: [
     modelPicker,
-    hasAdvanced && /* @__PURE__ */ jsxs8("div", { ref: popoverRef, className: "relative inline-flex", children: [
-      /* @__PURE__ */ jsx9(
+    hasAdvanced && /* @__PURE__ */ jsxs9("div", { ref: popoverRef, className: "relative inline-flex", children: [
+      /* @__PURE__ */ jsx11(
         "button",
         {
           type: "button",
@@ -2057,19 +2576,19 @@ function AgentSessionControls(props) {
           title: "Model settings \u2014 pick the agent backend and how hard it thinks",
           className: `flex h-8 w-8 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-muted hover:text-foreground data-[state=open]:bg-muted ${FOCUS_RING}`,
           "data-state": open ? "open" : "closed",
-          children: /* @__PURE__ */ jsx9(GearGlyph, { className: "h-4 w-4" })
+          children: /* @__PURE__ */ jsx11(GearGlyph, { className: "h-4 w-4" })
         }
       ),
-      open && /* @__PURE__ */ jsxs8("div", { className: "absolute bottom-full left-0 z-50 mb-2 w-72 space-y-3 rounded-xl border border-border bg-card p-3 shadow-lg", children: [
-        showHarness && /* @__PURE__ */ jsxs8("div", { className: "space-y-1.5", children: [
-          /* @__PURE__ */ jsx9("p", { className: "text-xs font-medium text-foreground", children: "Agent backend" }),
-          /* @__PURE__ */ jsx9(HarnessPicker, { value: harness, onChange: onHarness, available: availableHarnesses }),
-          /* @__PURE__ */ jsx9("p", { className: "text-[11px] leading-snug text-muted-foreground", children: "The engine that runs the agent. Switching it keeps your model choice compatible." })
+      open && /* @__PURE__ */ jsxs9("div", { className: "absolute bottom-full left-0 z-50 mb-2 w-72 space-y-3 rounded-xl border border-border bg-card p-3 shadow-lg", children: [
+        showHarness && /* @__PURE__ */ jsxs9("div", { className: "space-y-1.5", children: [
+          /* @__PURE__ */ jsx11("p", { className: "text-xs font-medium text-foreground", children: "Agent backend" }),
+          /* @__PURE__ */ jsx11(HarnessPicker, { value: harness, onChange: onHarness, available: availableHarnesses }),
+          /* @__PURE__ */ jsx11("p", { className: "text-[11px] leading-snug text-muted-foreground", children: "The engine that runs the agent. Switching it keeps your model choice compatible." })
         ] }),
-        showEffort && /* @__PURE__ */ jsxs8("div", { className: "space-y-1.5", children: [
-          /* @__PURE__ */ jsx9("p", { className: "text-xs font-medium text-foreground", children: "Thinking" }),
-          /* @__PURE__ */ jsx9(EffortPicker, { value: effort, onChange: onEffortChange, label: "" }),
-          /* @__PURE__ */ jsx9("p", { className: "text-[11px] leading-snug text-muted-foreground", children: "How hard the agent thinks before answering. Higher is slower but more thorough." })
+        showEffort && /* @__PURE__ */ jsxs9("div", { className: "space-y-1.5", children: [
+          /* @__PURE__ */ jsx11("p", { className: "text-xs font-medium text-foreground", children: "Thinking" }),
+          /* @__PURE__ */ jsx11(EffortPicker, { value: effort, onChange: onEffortChange, label: "" }),
+          /* @__PURE__ */ jsx11("p", { className: "text-[11px] leading-snug text-muted-foreground", children: "How hard the agent thinks before answering. Higher is slower but more thorough." })
         ] })
       ] })
     ] })
@@ -2077,7 +2596,7 @@ function AgentSessionControls(props) {
 }
 
 // src/web-react/index.tsx
-import { Fragment as Fragment5, jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx12, jsxs as jsxs10 } 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;
@@ -2091,41 +2610,41 @@ function formatTokensPerSecond(msg) {
   return `${Math.round(msg.completionTokens / (msg.durationMs / 1e3))} tok/s`;
 }
 function RunDrillIn({ run, onClose }) {
-  return /* @__PURE__ */ jsxs9("div", { className: "fixed inset-y-0 right-0 z-50 flex w-[480px] max-w-full flex-col border-l border-border bg-card shadow-xl", children: [
-    /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2 border-b border-border px-4 py-3", children: [
-      /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsxs10("div", { className: "fixed inset-y-0 right-0 z-50 flex w-[480px] max-w-full flex-col border-l border-border bg-card shadow-xl", children: [
+    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2 border-b border-border px-4 py-3", children: [
+      /* @__PURE__ */ jsx12(
         "span",
         {
           className: `h-2 w-2 shrink-0 rounded-full ${run.status === "running" ? "bg-warning" : run.status === "error" ? "bg-destructive" : "bg-success"}`
         }
       ),
-      /* @__PURE__ */ jsxs9("div", { className: "min-w-0 flex-1", children: [
-        /* @__PURE__ */ jsx10("p", { className: "truncate text-sm font-semibold", children: run.title }),
-        /* @__PURE__ */ jsx10("p", { className: "truncate font-mono text-[11px] text-muted-foreground", children: run.toolName })
+      /* @__PURE__ */ jsxs10("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx12("p", { className: "truncate text-sm font-semibold", children: run.title }),
+        /* @__PURE__ */ jsx12("p", { className: "truncate font-mono text-[11px] text-muted-foreground", children: run.toolName })
       ] }),
-      /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsx12(
         "button",
         {
           type: "button",
           onClick: onClose,
           "aria-label": "Close",
           className: "rounded-md p-1.5 text-muted-foreground transition hover:bg-accent/30 hover:text-foreground",
-          children: /* @__PURE__ */ jsx10("svg", { className: "h-4 w-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx10("path", { d: "M18 6 6 18M6 6l12 12" }) })
+          children: /* @__PURE__ */ jsx12("svg", { className: "h-4 w-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx12("path", { d: "M18 6 6 18M6 6l12 12" }) })
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs9("div", { className: "flex-1 space-y-3 overflow-y-auto p-4", children: [
-      run.steps.length === 0 && /* @__PURE__ */ jsx10("p", { className: "text-sm text-muted-foreground", children: "No steps recorded yet." }),
-      run.steps.map((step, i) => /* @__PURE__ */ jsxs9("div", { className: "rounded-lg border border-border/60 bg-background", children: [
-        /* @__PURE__ */ jsxs9("div", { className: "flex items-baseline gap-2 border-b border-border/40 px-3 py-1.5", children: [
-          /* @__PURE__ */ jsx10("span", { className: `font-mono text-[11px] ${step.status === "error" ? "text-destructive" : "text-muted-foreground"}`, children: step.status === "error" ? "\u2717" : "$" }),
-          /* @__PURE__ */ jsx10("code", { className: "min-w-0 flex-1 truncate font-mono text-xs", children: step.label }),
-          /* @__PURE__ */ jsx10("span", { className: "shrink-0 text-[10px] text-muted-foreground", children: new Date(step.at).toLocaleTimeString() })
+    /* @__PURE__ */ jsxs10("div", { className: "flex-1 space-y-3 overflow-y-auto p-4", children: [
+      run.steps.length === 0 && /* @__PURE__ */ jsx12("p", { className: "text-sm text-muted-foreground", children: "No steps recorded yet." }),
+      run.steps.map((step, i) => /* @__PURE__ */ jsxs10("div", { className: "rounded-lg border border-border/60 bg-background", children: [
+        /* @__PURE__ */ jsxs10("div", { className: "flex items-baseline gap-2 border-b border-border/40 px-3 py-1.5", children: [
+          /* @__PURE__ */ jsx12("span", { className: `font-mono text-[11px] ${step.status === "error" ? "text-destructive" : "text-muted-foreground"}`, children: step.status === "error" ? "\u2717" : "$" }),
+          /* @__PURE__ */ jsx12("code", { className: "min-w-0 flex-1 truncate font-mono text-xs", children: step.label }),
+          /* @__PURE__ */ jsx12("span", { className: "shrink-0 text-[10px] text-muted-foreground", children: new Date(step.at).toLocaleTimeString() })
         ] }),
-        step.detail && /* @__PURE__ */ jsx10("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__ */ jsx12("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 })
       ] }, i))
     ] }),
-    /* @__PURE__ */ jsx10("p", { className: "border-t border-border px-4 py-2 text-[11px] text-muted-foreground", children: "Readonly drill-in. Follow up in the main chat." })
+    /* @__PURE__ */ jsx12("p", { className: "border-t border-border px-4 py-2 text-[11px] text-muted-foreground", children: "Readonly drill-in. Follow up in the main chat." })
   ] });
 }
 function pendingApprovalOf(call) {
@@ -2139,20 +2658,20 @@ function ChatEmptyState({
   subline = "Describe the outcome you want. The agent works through it step by step, and pauses for your approval before anything irreversible.",
   doors
 }) {
-  return /* @__PURE__ */ jsxs9("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__ */ jsx10("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__ */ jsx10(BrandMark, { size: 32, className: "shrink-0" }) }),
-    /* @__PURE__ */ jsx10("p", { className: "text-[11px] font-semibold uppercase tracking-[0.18em] text-muted-foreground", children: productName }),
-    /* @__PURE__ */ jsx10("h2", { className: "mt-1.5 text-balance text-2xl font-semibold leading-tight text-foreground sm:text-[28px]", children: headline }),
-    subline && /* @__PURE__ */ jsx10("p", { className: "mt-3 max-w-md text-[15px] leading-relaxed text-muted-foreground", children: subline }),
-    doors && doors.length > 0 && /* @__PURE__ */ jsx10("div", { className: "mt-7 grid w-full gap-2.5 sm:grid-cols-3", children: doors.slice(0, 3).map((door, i) => /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs10("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__ */ jsx12("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__ */ jsx12(BrandMark, { size: 32, className: "shrink-0" }) }),
+    /* @__PURE__ */ jsx12("p", { className: "text-[11px] font-semibold uppercase tracking-[0.18em] text-muted-foreground", children: productName }),
+    /* @__PURE__ */ jsx12("h2", { className: "mt-1.5 text-balance text-2xl font-semibold leading-tight text-foreground sm:text-[28px]", children: headline }),
+    subline && /* @__PURE__ */ jsx12("p", { className: "mt-3 max-w-md text-[15px] leading-relaxed text-muted-foreground", children: subline }),
+    doors && doors.length > 0 && /* @__PURE__ */ jsx12("div", { className: "mt-7 grid w-full gap-2.5 sm:grid-cols-3", children: doors.slice(0, 3).map((door, i) => /* @__PURE__ */ jsxs10(
       "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/30 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
         children: [
-          /* @__PURE__ */ jsx10("span", { className: "text-sm font-semibold text-foreground", children: door.label }),
-          door.description && /* @__PURE__ */ jsx10("span", { className: "mt-0.5 text-[12px] leading-snug text-muted-foreground", children: door.description })
+          /* @__PURE__ */ jsx12("span", { className: "text-sm font-semibold text-foreground", children: door.label }),
+          door.description && /* @__PURE__ */ jsx12("span", { className: "mt-0.5 text-[12px] leading-snug text-muted-foreground", children: door.description })
         ]
       },
       i
@@ -2161,26 +2680,26 @@ function ChatEmptyState({
 }
 function ToolGlyph({ name, className }) {
   if (name.startsWith("sandbox_")) {
-    return /* @__PURE__ */ jsxs9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx10("polyline", { points: "4 17 10 11 4 5" }),
-      /* @__PURE__ */ jsx10("line", { x1: "12", y1: "19", x2: "20", y2: "19" })
+    return /* @__PURE__ */ jsxs10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx12("polyline", { points: "4 17 10 11 4 5" }),
+      /* @__PURE__ */ jsx12("line", { x1: "12", y1: "19", x2: "20", y2: "19" })
     ] });
   }
   if (name === "submit_proposal") {
-    return /* @__PURE__ */ jsxs9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx10("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
-      /* @__PURE__ */ jsx10("path", { d: "M14 2v6h6M9 15l2 2 4-4" })
+    return /* @__PURE__ */ jsxs10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx12("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
+      /* @__PURE__ */ jsx12("path", { d: "M14 2v6h6M9 15l2 2 4-4" })
     ] });
   }
   if (name === "schedule_followup") {
-    return /* @__PURE__ */ jsxs9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx10("circle", { cx: "12", cy: "12", r: "9" }),
-      /* @__PURE__ */ jsx10("path", { d: "M12 7v5l3 3" })
+    return /* @__PURE__ */ jsxs10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx12("circle", { cx: "12", cy: "12", r: "9" }),
+      /* @__PURE__ */ jsx12("path", { d: "M12 7v5l3 3" })
     ] });
   }
-  return /* @__PURE__ */ jsxs9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-    /* @__PURE__ */ jsx10("path", { d: "M12 3v3m0 12v3M3 12h3m12 0h3" }),
-    /* @__PURE__ */ jsx10("circle", { cx: "12", cy: "12", r: "4" })
+  return /* @__PURE__ */ jsxs10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx12("path", { d: "M12 3v3m0 12v3M3 12h3m12 0h3" }),
+    /* @__PURE__ */ jsx12("circle", { cx: "12", cy: "12", r: "4" })
   ] });
 }
 function toolOutcomeOf(call) {
@@ -2247,36 +2766,36 @@ 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__ */ jsx10("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1", children: entries.map(([k, v]) => /* @__PURE__ */ jsxs9("div", { className: "contents", children: [
-    /* @__PURE__ */ jsx10("dt", { className: "font-mono text-[11px] text-muted-foreground", children: k }),
-    /* @__PURE__ */ jsx10("dd", { className: "min-w-0 whitespace-pre-wrap break-words font-mono text-[11px] text-muted-foreground", children: truncate(v) })
+  return /* @__PURE__ */ jsx12("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1", children: entries.map(([k, v]) => /* @__PURE__ */ jsxs10("div", { className: "contents", children: [
+    /* @__PURE__ */ jsx12("dt", { className: "font-mono text-[11px] text-muted-foreground", children: k }),
+    /* @__PURE__ */ jsx12("dd", { className: "min-w-0 whitespace-pre-wrap break-words font-mono text-[11px] text-muted-foreground", children: truncate(v) })
   ] }, k)) });
 }
 function ShellDetail({ call }) {
   const outcome = toolOutcomeOf(call);
   const r = outcome?.result ?? {};
-  return /* @__PURE__ */ jsxs9("div", { className: "overflow-hidden rounded-md bg-zinc-900 font-mono text-[11px] leading-relaxed", children: [
-    /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2 px-3 pt-2 text-zinc-400", children: [
-      /* @__PURE__ */ jsx10("span", { className: "select-none text-zinc-500", children: "$" }),
-      /* @__PURE__ */ jsx10("span", { className: "min-w-0 flex-1 truncate text-zinc-200", children: String(call.args?.command ?? "") }),
-      r.exitCode != null && /* @__PURE__ */ jsxs9("span", { className: r.exitCode === 0 ? "text-success" : "text-destructive", children: [
+  return /* @__PURE__ */ jsxs10("div", { className: "overflow-hidden rounded-md bg-zinc-900 font-mono text-[11px] leading-relaxed", children: [
+    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2 px-3 pt-2 text-zinc-400", children: [
+      /* @__PURE__ */ jsx12("span", { className: "select-none text-zinc-500", children: "$" }),
+      /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate text-zinc-200", children: String(call.args?.command ?? "") }),
+      r.exitCode != null && /* @__PURE__ */ jsxs10("span", { className: r.exitCode === 0 ? "text-success" : "text-destructive", children: [
         "exit ",
         r.exitCode
       ] })
     ] }),
-    /* @__PURE__ */ jsx10("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__ */ jsx12("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 outcome = toolOutcomeOf(call);
-  return /* @__PURE__ */ jsxs9("div", { className: "space-y-2", children: [
-    call.args && Object.keys(call.args).length > 0 && /* @__PURE__ */ jsxs9("div", { children: [
-      /* @__PURE__ */ jsx10("p", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Called with" }),
-      /* @__PURE__ */ jsx10(KvRows, { data: call.args })
+  return /* @__PURE__ */ jsxs10("div", { className: "space-y-2", children: [
+    call.args && Object.keys(call.args).length > 0 && /* @__PURE__ */ jsxs10("div", { children: [
+      /* @__PURE__ */ jsx12("p", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Called with" }),
+      /* @__PURE__ */ jsx12(KvRows, { data: call.args })
     ] }),
-    outcome && /* @__PURE__ */ jsxs9("div", { children: [
-      /* @__PURE__ */ jsx10("p", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: outcome.ok === false ? "Failed" : "Result" }),
-      outcome.ok === false ? /* @__PURE__ */ jsx10("p", { className: "text-xs text-destructive", children: outcome.message ?? "Tool failed" }) : outcome.result && typeof outcome.result === "object" ? /* @__PURE__ */ jsx10(KvRows, { data: outcome.result }) : /* @__PURE__ */ jsx10("p", { className: "font-mono text-[11px] text-muted-foreground", children: truncate(outcome.result) })
+    outcome && /* @__PURE__ */ jsxs10("div", { children: [
+      /* @__PURE__ */ jsx12("p", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: outcome.ok === false ? "Failed" : "Result" }),
+      outcome.ok === false ? /* @__PURE__ */ jsx12("p", { className: "text-xs text-destructive", children: outcome.message ?? "Tool failed" }) : outcome.result && typeof outcome.result === "object" ? /* @__PURE__ */ jsx12(KvRows, { data: outcome.result }) : /* @__PURE__ */ jsx12("p", { className: "font-mono text-[11px] text-muted-foreground", children: truncate(outcome.result) })
     ] })
   ] });
 }
@@ -2287,23 +2806,23 @@ function ProposalCard({
   approval,
   renderers
 }) {
-  const [expanded, setExpanded] = useState10(false);
+  const [expanded, setExpanded] = useState12(false);
   const { summary, meta } = proposalPreview(call);
   const custom = renderers?.[call.name]?.(call, message);
   const { pending: deciding, run: decide } = usePending();
-  return /* @__PURE__ */ jsxs9("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__ */ jsxs9("div", { className: "flex items-start gap-2.5 px-4 pt-3.5", children: [
-      /* @__PURE__ */ jsx10("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__ */ jsx10(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5" }) }),
-      /* @__PURE__ */ jsxs9("div", { className: "min-w-0 flex-1", children: [
-        /* @__PURE__ */ jsx10("p", { className: "text-[10px] font-semibold uppercase tracking-wider text-warning-foreground", children: "Needs your approval" }),
-        /* @__PURE__ */ jsx10("p", { className: "mt-0.5 text-[15px] font-semibold leading-snug text-foreground", children: friendlyToolTitle(call) }),
-        summary && /* @__PURE__ */ jsx10("p", { className: "mt-1 text-[13px] leading-relaxed text-muted-foreground", children: summary }),
-        meta.length > 0 && /* @__PURE__ */ jsx10("div", { className: "mt-1.5 flex flex-wrap items-center gap-1.5", children: meta.map((m, i) => /* @__PURE__ */ jsx10("span", { className: "rounded-full bg-muted/60 px-2 py-0.5 text-[11px] font-medium text-muted-foreground", children: m }, i)) })
+  return /* @__PURE__ */ jsxs10("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__ */ jsxs10("div", { className: "flex items-start gap-2.5 px-4 pt-3.5", children: [
+      /* @__PURE__ */ jsx12("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__ */ jsx12(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5" }) }),
+      /* @__PURE__ */ jsxs10("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx12("p", { className: "text-[10px] font-semibold uppercase tracking-wider text-warning-foreground", children: "Needs your approval" }),
+        /* @__PURE__ */ jsx12("p", { className: "mt-0.5 text-[15px] font-semibold leading-snug text-foreground", children: friendlyToolTitle(call) }),
+        summary && /* @__PURE__ */ jsx12("p", { className: "mt-1 text-[13px] leading-relaxed text-muted-foreground", children: summary }),
+        meta.length > 0 && /* @__PURE__ */ jsx12("div", { className: "mt-1.5 flex flex-wrap items-center gap-1.5", children: meta.map((m, i) => /* @__PURE__ */ jsx12("span", { className: "rounded-full bg-muted/60 px-2 py-0.5 text-[11px] font-medium text-muted-foreground", children: m }, i)) })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs9("div", { className: "flex flex-wrap items-center gap-2 px-4 pb-3.5 pt-3", children: [
-      approval ? /* @__PURE__ */ jsxs9(Fragment5, { children: [
-        /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsxs10("div", { className: "flex flex-wrap items-center gap-2 px-4 pb-3.5 pt-3", children: [
+      approval ? /* @__PURE__ */ jsxs10(Fragment5, { children: [
+        /* @__PURE__ */ jsx12(
           "button",
           {
             type: "button",
@@ -2313,7 +2832,7 @@ function ProposalCard({
             children: "Approve & run"
           }
         ),
-        /* @__PURE__ */ jsx10(
+        /* @__PURE__ */ jsx12(
           "button",
           {
             type: "button",
@@ -2323,8 +2842,8 @@ function ProposalCard({
             children: "Reject"
           }
         )
-      ] }) : /* @__PURE__ */ jsx10("span", { className: "text-[12px] font-medium text-muted-foreground", children: "Awaiting approval\u2026" }),
-      /* @__PURE__ */ jsxs9(
+      ] }) : /* @__PURE__ */ jsx12("span", { className: "text-[12px] font-medium text-muted-foreground", children: "Awaiting approval\u2026" }),
+      /* @__PURE__ */ jsxs10(
         "button",
         {
           type: "button",
@@ -2333,23 +2852,23 @@ function ProposalCard({
           className: "ml-auto inline-flex items-center gap-1 rounded text-[12px] font-medium text-muted-foreground transition hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
           children: [
             expanded ? "Hide details" : "View details",
-            /* @__PURE__ */ jsx10(ChevronDown, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` })
+            /* @__PURE__ */ jsx12(ChevronDown, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` })
           ]
         }
       )
     ] }),
-    expanded && /* @__PURE__ */ jsx10("div", { className: "border-t border-warning/20 px-4 py-3 text-xs", children: custom ?? /* @__PURE__ */ jsx10(DefaultToolDetail, { call }) })
+    expanded && /* @__PURE__ */ jsx12("div", { className: "border-t border-warning/20 px-4 py-3 text-xs", children: custom ?? /* @__PURE__ */ jsx12(DefaultToolDetail, { call }) })
   ] });
 }
 function FollowupCard({ call }) {
   const a = call.args ?? {};
   const when = typeof a.when === "string" ? a.when : typeof a.at === "string" ? a.at : typeof a.schedule === "string" ? a.schedule : null;
-  return /* @__PURE__ */ jsxs9("div", { className: "w-fit min-w-[260px] max-w-full rounded-lg border border-border/60 border-l-2 border-l-primary/60 bg-muted/20 px-3 py-2 text-sm", children: [
-    /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx10(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5 shrink-0 text-primary/80" }),
-      /* @__PURE__ */ jsx10("span", { className: "min-w-0 flex-1 truncate font-medium text-foreground", children: friendlyToolTitle(call) })
+  return /* @__PURE__ */ jsxs10("div", { className: "w-fit min-w-[260px] max-w-full rounded-lg border border-border/60 border-l-2 border-l-primary/60 bg-muted/20 px-3 py-2 text-sm", children: [
+    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx12(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5 shrink-0 text-primary/80" }),
+      /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate font-medium text-foreground", children: friendlyToolTitle(call) })
     ] }),
-    when && /* @__PURE__ */ jsx10("p", { className: "mt-0.5 pl-[22px] text-[12px] text-muted-foreground", children: when })
+    when && /* @__PURE__ */ jsx12("p", { className: "mt-0.5 pl-[22px] text-[12px] text-muted-foreground", children: when })
   ] });
 }
 function ToolCallCard({
@@ -2359,13 +2878,13 @@ function ToolCallCard({
   onOpenRun,
   renderers
 }) {
-  const [expanded, setExpanded] = useState10(false);
+  const [expanded, setExpanded] = useState12(false);
   const pending = call.status === "done" ? pendingApprovalOf(call) : null;
   const kind = blockKindOf(call);
   const failed = call.status === "error" || toolOutcomeOf(call)?.ok === false;
   const custom = renderers?.[call.name]?.(call, message);
   if (pending) {
-    return /* @__PURE__ */ jsx10(
+    return /* @__PURE__ */ jsx12(
       ProposalCard,
       {
         call,
@@ -2377,16 +2896,16 @@ function ToolCallCard({
     );
   }
   if (kind === "followup" && !failed) {
-    return /* @__PURE__ */ jsx10(FollowupCard, { call });
+    return /* @__PURE__ */ jsx12(FollowupCard, { call });
   }
   const isCommand = kind === "command";
-  return /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs10(
     "div",
     {
       className: `w-fit min-w-[280px] max-w-full rounded-lg border text-xs transition ${failed ? "border-destructive/40 bg-destructive/5" : "border-border/60 bg-muted/20"}`,
       children: [
-        /* @__PURE__ */ jsxs9("div", { className: "flex w-full items-center gap-2 px-3 py-2", children: [
-          /* @__PURE__ */ jsxs9(
+        /* @__PURE__ */ jsxs10("div", { className: "flex w-full items-center gap-2 px-3 py-2", children: [
+          /* @__PURE__ */ jsxs10(
             "button",
             {
               type: "button",
@@ -2394,14 +2913,14 @@ function ToolCallCard({
               "aria-expanded": expanded,
               className: "flex min-w-0 flex-1 items-center gap-2 rounded text-left focus:outline-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
               children: [
-                /* @__PURE__ */ jsx10(
+                /* @__PURE__ */ jsx12(
                   "span",
                   {
                     className: `h-2 w-2 shrink-0 rounded-full ${call.status === "running" ? "animate-pulse bg-warning" : failed ? "bg-destructive" : "bg-success"}`
                   }
                 ),
-                /* @__PURE__ */ jsx10(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
-                /* @__PURE__ */ jsx10(
+                /* @__PURE__ */ jsx12(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
+                /* @__PURE__ */ jsx12(
                   "span",
                   {
                     className: `min-w-0 flex-1 truncate ${isCommand ? "font-mono text-[12px] tracking-tight text-foreground/90" : "font-medium"}`,
@@ -2411,8 +2930,8 @@ function ToolCallCard({
               ]
             }
           ),
-          /* @__PURE__ */ jsx10("span", { className: "shrink-0 text-[11px] text-muted-foreground", children: call.status === "running" ? "running\u2026" : failed ? "failed" : "done" }),
-          /* @__PURE__ */ jsx10(
+          /* @__PURE__ */ jsx12("span", { className: "shrink-0 text-[11px] text-muted-foreground", children: call.status === "running" ? "running\u2026" : failed ? "failed" : "done" }),
+          /* @__PURE__ */ jsx12(
             "button",
             {
               type: "button",
@@ -2420,13 +2939,13 @@ function ToolCallCard({
               "aria-label": expanded ? "Collapse details" : "Expand details",
               "aria-expanded": expanded,
               className: "shrink-0 rounded p-0.5 focus:outline-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-              children: /* @__PURE__ */ jsx10(ChevronDown, { className: `h-3 w-3 text-muted-foreground transition-transform ${expanded ? "rotate-180" : ""}` })
+              children: /* @__PURE__ */ jsx12(ChevronDown, { className: `h-3 w-3 text-muted-foreground transition-transform ${expanded ? "rotate-180" : ""}` })
             }
           )
         ] }),
-        expanded && /* @__PURE__ */ jsxs9("div", { className: "border-t border-border/40 px-3 py-2.5", children: [
-          custom ?? (call.name === "sandbox_run_command" ? /* @__PURE__ */ jsx10(ShellDetail, { call }) : /* @__PURE__ */ jsx10(DefaultToolDetail, { call })),
-          onOpenRun && call.name.startsWith("sandbox_") && /* @__PURE__ */ jsx10(
+        expanded && /* @__PURE__ */ jsxs10("div", { className: "border-t border-border/40 px-3 py-2.5", children: [
+          custom ?? (call.name === "sandbox_run_command" ? /* @__PURE__ */ jsx12(ShellDetail, { call }) : /* @__PURE__ */ jsx12(DefaultToolDetail, { call })),
+          onOpenRun && call.name.startsWith("sandbox_") && /* @__PURE__ */ jsx12(
             "button",
             {
               type: "button",
@@ -2441,7 +2960,7 @@ function ToolCallCard({
   );
 }
 function StreamingCaret() {
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx12(
     "span",
     {
       className: "ml-0.5 inline-block h-[1.1em] w-[3px] translate-y-[2px] animate-pulse rounded-sm bg-foreground/70",
@@ -2458,9 +2977,9 @@ function SegmentText({
   const text = useSmoothText(content, streaming);
   const body = useMemo7(() => renderBody(text), [renderBody, text]);
   if (!content.trim() && !showCaret) return null;
-  return /* @__PURE__ */ jsxs9("div", { className: "text-base leading-[1.75]", children: [
+  return /* @__PURE__ */ jsxs10("div", { className: "text-base leading-[1.75]", children: [
     body,
-    showCaret && /* @__PURE__ */ jsx10(StreamingCaret, {})
+    showCaret && /* @__PURE__ */ jsx12(StreamingCaret, {})
   ] });
 }
 var COLLAPSE_TOOL_RUN_AT = 3;
@@ -2483,7 +3002,7 @@ function SegmentedBody({
   const leftoverToolCalls = (msg.toolCalls ?? []).filter(
     (tc) => !segmentToolIds.has(tc.id)
   );
-  const renderToolCard = (call) => /* @__PURE__ */ jsx10(
+  const renderToolCard = (call) => /* @__PURE__ */ jsx12(
     ToolCallCard,
     {
       call,
@@ -2506,9 +3025,9 @@ function SegmentedBody({
       else groups.push({ kind: "tools", index: i, calls: [seg.call] });
     }
   }
-  return /* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-2", children: [
+  return /* @__PURE__ */ jsxs10("div", { className: "flex flex-col gap-2", children: [
     groups.map(
-      (g) => g.kind === "text" ? /* @__PURE__ */ jsx10(
+      (g) => g.kind === "text" ? /* @__PURE__ */ jsx12(
         SegmentText,
         {
           content: g.content,
@@ -2517,24 +3036,24 @@ function SegmentedBody({
           renderBody
         },
         `text-${g.index}`
-      ) : !streaming && g.calls.length >= COLLAPSE_TOOL_RUN_AT && !g.calls.some(isImportantTool) ? /* @__PURE__ */ jsxs9(
+      ) : !streaming && g.calls.length >= COLLAPSE_TOOL_RUN_AT && !g.calls.some(isImportantTool) ? /* @__PURE__ */ jsxs10(
         "details",
         {
           className: "rounded-lg border-l-2 border-border/70 bg-muted/20 px-3 py-2",
           children: [
-            /* @__PURE__ */ jsxs9("summary", { className: "cursor-pointer select-none text-xs font-medium text-muted-foreground", children: [
+            /* @__PURE__ */ jsxs10("summary", { className: "cursor-pointer select-none text-xs font-medium text-muted-foreground", children: [
               "Worked through ",
               g.calls.length,
               " steps"
             ] }),
-            /* @__PURE__ */ jsx10("div", { className: "mt-2 flex flex-col gap-2", children: g.calls.map(renderToolCard) })
+            /* @__PURE__ */ jsx12("div", { className: "mt-2 flex flex-col gap-2", children: g.calls.map(renderToolCard) })
           ]
         },
         `tools-${g.index}`
-      ) : /* @__PURE__ */ jsx10("div", { className: "flex flex-col gap-2", children: g.calls.map(renderToolCard) }, `tools-${g.index}`)
+      ) : /* @__PURE__ */ jsx12("div", { className: "flex flex-col gap-2", children: g.calls.map(renderToolCard) }, `tools-${g.index}`)
     ),
     leftoverToolCalls.map(renderToolCard),
-    streaming && segments[lastIndex]?.kind === "tool" && /* @__PURE__ */ jsx10(StreamingCaret, {})
+    streaming && segments[lastIndex]?.kind === "tool" && /* @__PURE__ */ jsx12(StreamingCaret, {})
   ] });
 }
 function AssistantMessageImpl({
@@ -2546,44 +3065,45 @@ function AssistantMessageImpl({
   approval,
   onToolCallClick,
   toolRenderers,
-  renderExtras
+  renderExtras,
+  durableCards
 }) {
   const content = useSmoothText(msg.content, streaming);
   const reasoning = useSmoothText(msg.reasoning ?? "", streaming);
   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 = useRef7(null);
-  const thinkStartRef = useRef7(null);
-  const thinkMsRef = useRef7(null);
+  const reasoningScrollRef = useRef8(null);
+  const thinkStartRef = useRef8(null);
+  const thinkMsRef = useRef8(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;
   }
-  useEffect5(() => {
+  useEffect8(() => {
     const el = reasoningScrollRef.current;
     if (el && streaming && !hasAnswerText) el.scrollTop = el.scrollHeight;
   }, [reasoning, streaming, hasAnswerText]);
   const thinkingSeconds = useThinkingSeconds(
     streaming && !!reasoning && !hasAnswerText
   );
-  return /* @__PURE__ */ jsxs9("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: [
-    /* @__PURE__ */ jsxs9("div", { className: "mb-1 flex items-baseline gap-2 text-[11px] tracking-wide text-muted-foreground", children: [
-      /* @__PURE__ */ jsx10("span", { className: "font-semibold uppercase", children: agentLabel }),
-      msg.modelUsed && /* @__PURE__ */ jsx10("span", { className: "font-mono normal-case", children: msg.modelUsed }),
-      formatTokensPerSecond(msg) && /* @__PURE__ */ jsx10("span", { children: formatTokensPerSecond(msg) }),
-      formatModelCost(msg, models) && /* @__PURE__ */ jsx10("span", { children: formatModelCost(msg, models) })
+  return /* @__PURE__ */ jsxs10("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: [
+    /* @__PURE__ */ jsxs10("div", { className: "mb-1 flex items-baseline gap-2 text-[11px] tracking-wide text-muted-foreground", children: [
+      /* @__PURE__ */ jsx12("span", { className: "font-semibold uppercase", children: agentLabel }),
+      msg.modelUsed && /* @__PURE__ */ jsx12("span", { className: "font-mono normal-case", children: msg.modelUsed }),
+      formatTokensPerSecond(msg) && /* @__PURE__ */ jsx12("span", { children: formatTokensPerSecond(msg) }),
+      formatModelCost(msg, models) && /* @__PURE__ */ jsx12("span", { children: formatModelCost(msg, models) })
     ] }),
-    reasoning && /* @__PURE__ */ jsxs9("details", { className: "mb-2 rounded-lg border-l-2 border-border/70 bg-muted/20 px-3 py-2", open: !hasAnswerText, children: [
-      /* @__PURE__ */ jsx10("summary", { className: "cursor-pointer select-none text-xs font-medium text-muted-foreground", children: !hasAnswerText ? /* @__PURE__ */ jsxs9("span", { className: "animate-pulse", children: [
+    reasoning && /* @__PURE__ */ jsxs10("details", { className: "mb-2 rounded-lg border-l-2 border-border/70 bg-muted/20 px-3 py-2", open: !hasAnswerText, children: [
+      /* @__PURE__ */ jsx12("summary", { className: "cursor-pointer select-none text-xs font-medium text-muted-foreground", children: !hasAnswerText ? /* @__PURE__ */ jsxs10("span", { className: "animate-pulse", children: [
         "Thinking",
         thinkingSeconds >= 3 ? ` \xB7 ${thinkingSeconds}s` : "\u2026"
       ] }) : thinkMsRef.current != null ? `Thought for ${Math.max(1, Math.round(thinkMsRef.current / 1e3))}s` : "Thought process" }),
-      /* @__PURE__ */ jsx10("div", { ref: reasoningScrollRef, className: "mt-2 max-h-48 overflow-y-auto whitespace-pre-wrap text-[13px] leading-relaxed text-muted-foreground", children: reasoning })
+      /* @__PURE__ */ jsx12("div", { ref: reasoningScrollRef, className: "mt-2 max-h-48 overflow-y-auto whitespace-pre-wrap text-[13px] leading-relaxed text-muted-foreground", children: reasoning })
     ] }),
-    segments && segments.length > 0 ? /* @__PURE__ */ jsx10(
+    segments && segments.length > 0 ? /* @__PURE__ */ jsx12(
       SegmentedBody,
       {
         segments,
@@ -2594,12 +3114,12 @@ function AssistantMessageImpl({
         onToolCallClick,
         toolRenderers
       }
-    ) : /* @__PURE__ */ jsxs9(Fragment5, { children: [
-      /* @__PURE__ */ jsxs9("div", { className: "text-base leading-[1.75]", children: [
+    ) : /* @__PURE__ */ jsxs10(Fragment5, { children: [
+      /* @__PURE__ */ jsxs10("div", { className: "text-base leading-[1.75]", children: [
         body,
-        streaming && content && !msg.toolCalls?.length && /* @__PURE__ */ jsx10(StreamingCaret, {})
+        streaming && content && !msg.toolCalls?.length && /* @__PURE__ */ jsx12(StreamingCaret, {})
       ] }),
-      msg.toolCalls && msg.toolCalls.length > 0 && /* @__PURE__ */ jsx10("div", { className: "mt-2 flex flex-col gap-1.5", children: msg.toolCalls.map((tc) => /* @__PURE__ */ jsx10(
+      msg.toolCalls && msg.toolCalls.length > 0 && /* @__PURE__ */ jsx12("div", { className: "mt-2 flex flex-col gap-1.5", children: msg.toolCalls.map((tc) => /* @__PURE__ */ jsx12(
         ToolCallCard,
         {
           call: tc,
@@ -2611,13 +3131,22 @@ function AssistantMessageImpl({
         tc.id
       )) })
     ] }),
+    durableCards && msg.parts && /* @__PURE__ */ jsx12(
+      DurableChatCards,
+      {
+        ...durableCards,
+        parts: msg.parts,
+        renderMarkdown: renderBody,
+        className: "mt-3"
+      }
+    ),
     renderExtras?.(msg)
   ] });
 }
 var AssistantMessage = memo(AssistantMessageImpl);
 function useThinkingSeconds(active) {
-  const [seconds, setSeconds] = useState10(0);
-  useEffect5(() => {
+  const [seconds, setSeconds] = useState12(0);
+  useEffect8(() => {
     if (!active) return;
     setSeconds(0);
     const id = setInterval(() => setSeconds((s) => s + 1), 1e3);
@@ -2627,23 +3156,23 @@ function useThinkingSeconds(active) {
 }
 function ThinkingRow({ agentLabel }) {
   const seconds = useThinkingSeconds(true);
-  return /* @__PURE__ */ jsxs9("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: [
-    /* @__PURE__ */ jsx10("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: agentLabel }),
-    /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2 text-base text-muted-foreground", children: [
-      /* @__PURE__ */ jsx10("svg", { className: "h-4 w-4 animate-spin", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": true, children: /* @__PURE__ */ jsx10("path", { d: "M21 12a9 9 0 1 1-6.219-8.56", strokeLinecap: "round" }) }),
+  return /* @__PURE__ */ jsxs10("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: [
+    /* @__PURE__ */ jsx12("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: agentLabel }),
+    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2 text-base text-muted-foreground", children: [
+      /* @__PURE__ */ jsx12("svg", { className: "h-4 w-4 animate-spin", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": true, children: /* @__PURE__ */ jsx12("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__ */ jsx10("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: /* @__PURE__ */ jsxs9("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__ */ jsxs9("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__ */ jsx10("circle", { cx: "12", cy: "12", r: "9" }),
-      /* @__PURE__ */ jsx10("path", { d: "M12 8v4m0 4h.01" })
+  return /* @__PURE__ */ jsx12("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: /* @__PURE__ */ jsxs10("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__ */ jsxs10("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__ */ jsx12("circle", { cx: "12", cy: "12", r: "9" }),
+      /* @__PURE__ */ jsx12("path", { d: "M12 8v4m0 4h.01" })
     ] }),
-    /* @__PURE__ */ jsx10("span", { className: "min-w-0 flex-1 break-words", children: message }),
-    onRetry && /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 break-words", children: message }),
+    onRetry && /* @__PURE__ */ jsx12(
       "button",
       {
         type: "button",
@@ -2659,6 +3188,7 @@ function ChatMessages({
   models = [],
   renderMarkdown,
   renderExtras,
+  durableCards,
   userLabel = "User",
   agentLabel = "Agent",
   loading,
@@ -2672,24 +3202,24 @@ function ChatMessages({
   header
 }) {
   const renderBody = useMemo7(
-    () => renderMarkdown ?? ((content) => /* @__PURE__ */ jsx10("p", { className: "whitespace-pre-wrap", children: content })),
+    () => renderMarkdown ?? ((content) => /* @__PURE__ */ jsx12("p", { className: "whitespace-pre-wrap", children: content })),
     [renderMarkdown]
   );
   const lastIsUser = messages[messages.length - 1]?.role === "user";
   if (messages.length === 0 && !loading && !error) {
-    const empty = renderEmpty ? renderEmpty() : /* @__PURE__ */ jsx10(ChatEmptyState, { ...emptyState });
-    return /* @__PURE__ */ jsxs9(Fragment5, { children: [
+    const empty = renderEmpty ? renderEmpty() : /* @__PURE__ */ jsx12(ChatEmptyState, { ...emptyState });
+    return /* @__PURE__ */ jsxs10(Fragment5, { children: [
       header,
       empty
     ] });
   }
-  return /* @__PURE__ */ jsxs9(Fragment5, { children: [
+  return /* @__PURE__ */ jsxs10(Fragment5, { children: [
     header,
     messages.map(
-      (msg) => msg.role === "user" ? /* @__PURE__ */ jsx10("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: /* @__PURE__ */ jsxs9("div", { className: "ml-auto w-fit max-w-[85%]", children: [
-        /* @__PURE__ */ jsx10("p", { className: "mb-1 text-right text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: userLabel }),
-        /* @__PURE__ */ jsx10("div", { className: "rounded-2xl rounded-tr-md bg-primary/10 px-4 py-2.5 text-base leading-relaxed", children: /* @__PURE__ */ jsx10("p", { className: "whitespace-pre-wrap", children: msg.content }) })
-      ] }) }, msg.id) : /* @__PURE__ */ jsx10(
+      (msg) => msg.role === "user" ? /* @__PURE__ */ jsx12("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: /* @__PURE__ */ jsxs10("div", { className: "ml-auto w-fit max-w-[85%]", children: [
+        /* @__PURE__ */ jsx12("p", { className: "mb-1 text-right text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: userLabel }),
+        /* @__PURE__ */ jsx12("div", { className: "rounded-2xl rounded-tr-md bg-primary/10 px-4 py-2.5 text-base leading-relaxed", children: /* @__PURE__ */ jsx12("p", { className: "whitespace-pre-wrap", children: msg.content }) })
+      ] }) }, msg.id) : /* @__PURE__ */ jsx12(
         AssistantMessage,
         {
           msg,
@@ -2700,13 +3230,14 @@ function ChatMessages({
           approval,
           onToolCallClick,
           toolRenderers,
-          renderExtras
+          renderExtras,
+          durableCards
         },
         msg.id
       )
     ),
-    loading && lastIsUser && /* @__PURE__ */ jsx10(ThinkingRow, { agentLabel }),
-    error && !loading && /* @__PURE__ */ jsx10(StreamErrorRow, { message: error, onRetry })
+    loading && lastIsUser && /* @__PURE__ */ jsx12(ThinkingRow, { agentLabel }),
+    error && !loading && /* @__PURE__ */ jsx12(StreamErrorRow, { message: error, onRetry })
   ] });
 }
 
@@ -2719,12 +3250,9 @@ export {
   ModelPicker,
   DEFAULT_EFFORT_LEVELS,
   EffortPicker,
-  dispatchChatStreamLine,
-  consumeChatStream,
-  streamChatTurn,
-  ChatComposer,
   interactionStatusLabels,
   interactionTerminalNotes,
+  fieldValuesFromAnswers,
   fieldAnswer,
   buildAnswerData,
   isLateAnswerableStatus,
@@ -2738,12 +3266,27 @@ export {
   InteractionActionButton,
   QuestionOptionList,
   InteractionQuestionCard,
+  DurablePlanCard,
   InteractionPlanCard,
+  durableChatCardsFromParts,
+  DurableChatCards,
+  dispatchChatStreamLine,
+  consumeChatStream,
+  streamChatTurn,
+  ChatComposer,
+  DurablePlanClientError,
+  createDurablePlanDecisionClient,
+  useDurablePlanFlow,
+  createSessionInteractionAttemptStore,
+  createMemoryInteractionAttemptStore,
+  interactionSubmissionSignature,
+  createDurableInteractionAnswerSubmitter,
   upsertChatInteraction,
   cancelChatInteraction,
   resolveChatInteraction,
   terminalizePendingChatInteractions,
   restoreChatInteractions,
+  hydrateChatInteractions,
   useChatInteractions,
   rankFileMentions,
   DEFAULT_MENTION_LIMIT,
@@ -2768,4 +3311,4 @@ export {
   useThinkingSeconds,
   ChatMessages
 };
-//# sourceMappingURL=chunk-KM766NN3.js.map
+//# sourceMappingURL=chunk-ZLHK25C3.js.map