@ganakailabs/cloudeval-cli 0.20.3 → 0.21.1

package/dist/{App-7N7BOWNP.js → App-77Q76GI5.js}

@@ -8,7 +8,7 @@ import {
 } from "./chunk-RCRNSEQS.js";
 import {
   Onboarding
-} from "./chunk-2GTSKMHA.js";
+} from "./chunk-Q5D5HYWW.js";
 import {
   checkUserStatus,
   completeActiveAssistantMessage,
@@ -35,17 +35,17 @@ import {
   reduceChunk,
   runReports,
   streamChat
-} from "./chunk-2D4BE3OS.js";
+} from "./chunk-LDDHLUZH.js";
 import {
   Banner
-} from "./chunk-7B3KVSVK.js";
+} from "./chunk-6AHSCVTF.js";
 import {
   CLI_VERSION
-} from "./chunk-TCNIIMWL.js";
+} from "./chunk-74TONCUI.js";
 import {
   raisedButtonStyle,
   terminalTheme
-} from "./chunk-QKZCKI55.js";
+} from "./chunk-ZDKRIOMB.js";
 
 // src/ui/App.tsx
 import React8, { useEffect as useEffect4, useMemo, useState as useState4, startTransition } from "react";
@@ -53,14 +53,49 @@ import { Box as Box9, Text as Text10, useApp, useInput as useInput4 } from "ink"
 import { ScrollView } from "ink-scroll-view";
 import { randomUUID as randomUUID2 } from "crypto";
 import { spawn } from "child_process";
-import { mkdirSync, writeFileSync } from "fs";
-import { join, resolve } from "path";
+import { mkdirSync as mkdirSync2, writeFileSync as writeFileSync2 } from "fs";
+import { join as join2, resolve as resolve2 } from "path";
 
 // src/ui/components/Loader.tsx
 import { useEffect, useState } from "react";
-import { Box, Text } from "ink";
-import { jsx, jsxs } from "react/jsx-runtime";
-var asciiFrames = ["[. ]", "[..]", "[--]", "[  ]"];
+import { Box, Text as Text2 } from "ink";
+
+// src/ui/components/Spinner.tsx
+import React from "react";
+import { Text } from "ink";
+import { jsx } from "react/jsx-runtime";
+var spinnerFrames = ["\u25DC", "\u25E0", "\u25DD", "\u25DE", "\u25E1", "\u25DF"];
+var SPINNER_FRAME_INTERVAL_MS = 1e3;
+var shouldAnimateSpinner = (animate = true) => animate;
+var getSpinnerFrames = (_type = "line") => spinnerFrames;
+var getLoaderStepMarker = (state, frameIndex = 0) => {
+  if (state === "complete") {
+    return "\u2713";
+  }
+  if (state === "pending") {
+    return "\xB7";
+  }
+  const frames = getSpinnerFrames("line");
+  return frames[Math.abs(frameIndex) % frames.length] ?? frames[0];
+};
+var Spinner = ({ type = "dots", animate = true }) => {
+  const [frame, setFrame] = React.useState(0);
+  const frames = getSpinnerFrames(type);
+  React.useEffect(() => {
+    if (!shouldAnimateSpinner(animate)) {
+      setFrame(0);
+      return;
+    }
+    const id = setInterval(() => {
+      setFrame((f) => (f + 1) % frames.length);
+    }, SPINNER_FRAME_INTERVAL_MS);
+    return () => clearInterval(id);
+  }, [animate, frames.length]);
+  return /* @__PURE__ */ jsx(Text, { color: terminalTheme.brand, children: frames[frame] });
+};
+
+// src/ui/components/Loader.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
 var LOADER_FRAME_INTERVAL_MS = 1e3;
 var Loader = ({
   step,
@@ -68,7 +103,7 @@ var Loader = ({
   animate = true
 }) => {
   const [frame, setFrame] = useState(0);
-  const frames = asciiFrames;
+  const frames = getSpinnerFrames("line");
   useEffect(() => {
     if (!animate) return;
     const id = setInterval(() => {
@@ -76,13 +111,16 @@ var Loader = ({
     }, LOADER_FRAME_INTERVAL_MS);
     return () => clearInterval(id);
   }, [animate, frames.length]);
-  const spinner = animate ? frames[frame] : "[..]";
-  return /* @__PURE__ */ jsx(Box, { flexDirection: "column", gap: 1, children: steps.map((label, idx) => {
+  const activeFrame = animate ? frame : 0;
+  return /* @__PURE__ */ jsx2(Box, { flexDirection: "column", gap: 1, children: steps.map((label, idx) => {
     const isActive = idx === step;
     const isComplete = idx < step;
-    const prefix = isComplete ? "[ok]" : isActive ? spinner : "[  ]";
+    const prefix = getLoaderStepMarker(
+      isComplete ? "complete" : isActive ? "active" : "pending",
+      activeFrame
+    );
     const color = isComplete ? terminalTheme.success : isActive ? terminalTheme.brand : void 0;
-    return /* @__PURE__ */ jsxs(Text, { color, children: [
+    return /* @__PURE__ */ jsxs(Text2, { color, children: [
       prefix,
       " ",
       label
@@ -96,6 +134,162 @@ import { Box as Box3, Text as Text4 } from "ink";
 import { supportsLanguage } from "cli-highlight";
 import SyntaxHighlight from "ink-syntax-highlight";
 
+// src/ui/citationContent.ts
+var CITATION_TAG_RE = /\[S([A-Za-z0-9_.:-]+)\]/g;
+var CITATION_TAG_ALT_RE = /\[(tool_[A-Za-z0-9_.:-]+)\]/g;
+var DEFAULT_MAX_INLINE_CITATIONS_PER_SOURCE = 3;
+var normalizeCitationSourceId = (sourceId) => sourceId.startsWith("_tool_") ? sourceId.slice(1) : sourceId;
+var findCitationMatches = (value) => {
+  const matches = [];
+  let match;
+  CITATION_TAG_RE.lastIndex = 0;
+  while ((match = CITATION_TAG_RE.exec(value)) !== null) {
+    matches.push({
+      index: match.index,
+      end: match.index + match[0].length,
+      sourceId: normalizeCitationSourceId(match[1] ?? "")
+    });
+  }
+  CITATION_TAG_ALT_RE.lastIndex = 0;
+  while ((match = CITATION_TAG_ALT_RE.exec(value)) !== null) {
+    matches.push({
+      index: match.index,
+      end: match.index + match[0].length,
+      sourceId: normalizeCitationSourceId(match[1] ?? "")
+    });
+  }
+  matches.sort((a, b) => a.index - b.index);
+  const seenIndexes = /* @__PURE__ */ new Set();
+  return matches.filter((candidate) => {
+    if (seenIndexes.has(candidate.index)) {
+      return false;
+    }
+    seenIndexes.add(candidate.index);
+    return true;
+  });
+};
+var getCitationSourceOrder = (content) => {
+  const seen = /* @__PURE__ */ new Set();
+  const order = [];
+  for (const { sourceId } of findCitationMatches(content)) {
+    if (!sourceId || seen.has(sourceId)) {
+      continue;
+    }
+    seen.add(sourceId);
+    order.push(sourceId);
+  }
+  return order;
+};
+var citationNumberMap = (content) => {
+  const map = /* @__PURE__ */ new Map();
+  getCitationSourceOrder(content).forEach((sourceId, index) => {
+    map.set(sourceId, index + 1);
+  });
+  return map;
+};
+var toDisplayCitationContent = (content, options = {}) => {
+  if (!content) {
+    return content;
+  }
+  const matches = findCitationMatches(content);
+  if (!matches.length) {
+    return content;
+  }
+  const sourceIdToNumber = citationNumberMap(content);
+  const perSourceCount = /* @__PURE__ */ new Map();
+  const maxInlinePerSource = options.maxInlinePerSource ?? DEFAULT_MAX_INLINE_CITATIONS_PER_SOURCE;
+  let cursor = 0;
+  let result = "";
+  for (const match of matches) {
+    result += content.slice(cursor, match.index);
+    const count = (perSourceCount.get(match.sourceId) ?? 0) + 1;
+    perSourceCount.set(match.sourceId, count);
+    const number = sourceIdToNumber.get(match.sourceId);
+    if (number !== void 0 && count <= maxInlinePerSource) {
+      result += `[${number}]`;
+    }
+    cursor = match.end;
+  }
+  return result + content.slice(cursor);
+};
+var firstString = (...values) => {
+  for (const value of values) {
+    if (typeof value !== "string") {
+      continue;
+    }
+    const trimmed = value.trim();
+    if (trimmed) {
+      return trimmed;
+    }
+  }
+  return void 0;
+};
+var fallbackSourceLabel = (sourceId) => sourceId.replace(/^tool_/, "").replace(/[_:-]+/g, " ").trim() || sourceId;
+var buildCitationReferences = ({
+  content,
+  toolsUsed,
+  citations
+}) => {
+  const order = getCitationSourceOrder(content);
+  if (!order.length) {
+    return [];
+  }
+  const toolBySourceId = /* @__PURE__ */ new Map();
+  for (const tool of toolsUsed ?? []) {
+    const sourceId = typeof tool.source_id === "string" ? normalizeCitationSourceId(tool.source_id.trim()) : "";
+    if (sourceId && !toolBySourceId.has(sourceId)) {
+      toolBySourceId.set(sourceId, tool);
+    }
+  }
+  const citationBySourceId = /* @__PURE__ */ new Map();
+  for (const citation of citations ?? []) {
+    const sourceId = typeof citation.source_id === "string" ? normalizeCitationSourceId(citation.source_id.trim()) : "";
+    if (sourceId && !citationBySourceId.has(sourceId)) {
+      citationBySourceId.set(sourceId, citation);
+    }
+  }
+  return order.map((sourceId, index) => {
+    const tool = toolBySourceId.get(sourceId);
+    const citation = citationBySourceId.get(sourceId);
+    return {
+      number: index + 1,
+      sourceId,
+      label: firstString(
+        citation?.title,
+        tool?.title,
+        tool?.tool_friendly_name,
+        tool?.tool_name
+      ) ?? fallbackSourceLabel(sourceId),
+      url: firstString(citation?.url, tool?.source_url)
+    };
+  });
+};
+var buildReferencesSection = (references) => {
+  if (!references.length) {
+    return "";
+  }
+  return [
+    "---",
+    "## References",
+    ...references.map(
+      (reference) => `- [${reference.number}] ${reference.label}${reference.url ? ` - ${reference.url}` : ""}`
+    )
+  ].join("\n");
+};
+var toCitationExportContent = ({
+  content,
+  toolsUsed,
+  citations
+}) => {
+  const displayContent = toDisplayCitationContent(content);
+  const references = buildReferencesSection(
+    buildCitationReferences({ content, toolsUsed, citations })
+  );
+  return references ? `${displayContent.trim()}
+
+${references}` : displayContent;
+};
+
 // src/ui/transcriptModel.ts
 var hasRenderableTranscriptMessage = (message) => {
   const content = (message.content ?? "").trim();
@@ -105,31 +299,6 @@ var hasRenderableTranscriptMessages = (messages, excludeStreaming = false) => me
   (message) => excludeStreaming && message.role === "assistant" && message.pending ? false : hasRenderableTranscriptMessage(message)
 );
 
-// src/ui/components/Spinner.tsx
-import React2 from "react";
-import { Text as Text2 } from "ink";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var dotFrames = ["\xB7  ", "\xB7\xB7 ", "\xB7\xB7\xB7"];
-var lineFrames = ["\u280B", "\u2819", "\u2839", "\u2838", "\u283C", "\u2834", "\u2826", "\u2827", "\u2807", "\u280F"];
-var pulseFrames = ["\u25D0", "\u25D3", "\u25D1", "\u25D2"];
-var SPINNER_FRAME_INTERVAL_MS = 1e3;
-var shouldAnimateSpinner = (animate = true) => animate;
-var Spinner = ({ type = "dots", animate = true }) => {
-  const [frame, setFrame] = React2.useState(0);
-  const frames = type === "dots" ? dotFrames : type === "pulse" ? pulseFrames : lineFrames;
-  React2.useEffect(() => {
-    if (!shouldAnimateSpinner(animate)) {
-      setFrame(0);
-      return;
-    }
-    const id = setInterval(() => {
-      setFrame((f) => (f + 1) % frames.length);
-    }, SPINNER_FRAME_INTERVAL_MS);
-    return () => clearInterval(id);
-  }, [animate, frames.length]);
-  return /* @__PURE__ */ jsx2(Text2, { children: frames[frame] });
-};
-
 // src/ui/components/TitledBox.tsx
 import { Box as Box2, Text as Text3 } from "ink";
 import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
@@ -197,6 +366,7 @@ var TitledBox = ({
 // src/ui/components/Transcript.tsx
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 var AI_NAME = "Cloudeval AI";
+var getTranscriptRoleColor = (role) => role === "user" ? terminalTheme.userName : terminalTheme.aiName;
 var normalizeFenceLanguage = (language) => {
   const normalized = (language ?? "").replace(/^```/, "").trim().split(/\s+/)[0]?.toLowerCase();
   return normalized || "text";
@@ -227,17 +397,35 @@ var parseMarkdown = (text) => {
   }
   return blocks;
 };
+var tokenizeInlineMarkdown = (text) => {
+  const segments = text.split(/(`[^`\n]+`|\*\*[^*\n]+\*\*|\[[1-9][0-9]*\])/g).filter(Boolean);
+  return segments.map((segment) => {
+    if (segment.startsWith("`") && segment.endsWith("`")) {
+      return { type: "code", text: segment.slice(1, -1) };
+    }
+    if (segment.startsWith("**") && segment.endsWith("**")) {
+      return { type: "bold", text: segment.slice(2, -2) };
+    }
+    if (/^\[[1-9][0-9]*\]$/.test(segment)) {
+      return { type: "citation", text: segment };
+    }
+    return { type: "text", text: segment };
+  });
+};
 var renderInlineMarkdown = (text, keyPrefix) => {
-  const segments = text.split(/(`[^`\n]+`|\*\*[^*\n]+\*\*)/g).filter(Boolean);
+  const segments = tokenizeInlineMarkdown(text);
   return segments.map((segment, index) => {
     const key = `${keyPrefix}-${index}`;
-    if (segment.startsWith("`") && segment.endsWith("`")) {
-      return /* @__PURE__ */ jsx4(Text4, { color: terminalTheme.accent, children: segment.slice(1, -1) }, key);
+    if (segment.type === "code") {
+      return /* @__PURE__ */ jsx4(Text4, { color: terminalTheme.accent, children: segment.text }, key);
     }
-    if (segment.startsWith("**") && segment.endsWith("**")) {
-      return /* @__PURE__ */ jsx4(Text4, { bold: true, children: segment.slice(2, -2) }, key);
+    if (segment.type === "bold") {
+      return /* @__PURE__ */ jsx4(Text4, { bold: true, children: segment.text }, key);
     }
-    return /* @__PURE__ */ jsx4(Text4, { children: segment }, key);
+    if (segment.type === "citation") {
+      return /* @__PURE__ */ jsx4(Text4, { color: terminalTheme.citation, bold: true, children: segment.text }, key);
+    }
+    return /* @__PURE__ */ jsx4(Text4, { children: segment.text }, key);
   });
 };
 var MarkdownText = ({
@@ -266,31 +454,66 @@ var MarkdownText = ({
     return /* @__PURE__ */ jsx4(Text4, { dimColor: dim, wrap: "wrap", children: renderInlineMarkdown(line, key) }, key);
   }) });
 };
-var FormattedContent = ({ content, role }) => {
+var CitationReferences = ({
+  references
+}) => {
+  if (!references.length) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", marginTop: 1, children: [
+    /* @__PURE__ */ jsx4(Text4, { color: terminalTheme.brand, children: "Sources" }),
+    references.map((reference) => /* @__PURE__ */ jsxs3(Text4, { dimColor: true, wrap: "wrap", children: [
+      /* @__PURE__ */ jsxs3(Text4, { color: terminalTheme.brand, children: [
+        "[",
+        reference.number,
+        "]"
+      ] }),
+      " ",
+      reference.label,
+      reference.url ? ` - ${reference.url}` : ""
+    ] }, reference.sourceId))
+  ] });
+};
+var FormattedContent = ({ message, role }) => {
+  const content = message.content;
   if (role === "user") {
     return /* @__PURE__ */ jsx4(MarkdownText, { content });
   }
   const blocks = parseMarkdown(content);
-  return /* @__PURE__ */ jsx4(Box3, { flexDirection: "column", children: blocks.map((block, idx) => {
-    if (block.type === "code") {
-      const syntaxLanguage = getSyntaxHighlightLanguage(block.language);
-      const blockTitle = block.language ? normalizeFenceLanguage(block.language) : "Code";
+  const references = buildCitationReferences({
+    content,
+    toolsUsed: message.toolsUsed,
+    citations: message.citations
+  });
+  return /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", children: [
+    blocks.map((block, idx) => {
+      if (block.type === "code") {
+        const syntaxLanguage = getSyntaxHighlightLanguage(block.language);
+        const blockTitle = block.language ? normalizeFenceLanguage(block.language) : "Code";
+        return /* @__PURE__ */ jsx4(
+          TitledBox,
+          {
+            title: blockTitle,
+            borderStyle: "single",
+            borderColor: terminalTheme.muted,
+            padding: 0,
+            paddingX: 1,
+            marginY: 1,
+            children: /* @__PURE__ */ jsx4(SyntaxHighlight, { code: block.content, language: syntaxLanguage })
+          },
+          idx
+        );
+      }
       return /* @__PURE__ */ jsx4(
-        TitledBox,
+        MarkdownText,
         {
-          title: blockTitle,
-          borderStyle: "single",
-          borderColor: terminalTheme.muted,
-          padding: 0,
-          paddingX: 1,
-          marginY: 1,
-          children: /* @__PURE__ */ jsx4(SyntaxHighlight, { code: block.content, language: syntaxLanguage })
+          content: toDisplayCitationContent(block.content)
         },
         idx
       );
-    }
-    return /* @__PURE__ */ jsx4(MarkdownText, { content: block.content }, idx);
-  }) });
+    }),
+    /* @__PURE__ */ jsx4(CitationReferences, { references })
+  ] });
 };
 var formatDuration = (durationMs) => {
   if (durationMs < 1e3) {
@@ -329,6 +552,24 @@ var getStepStatusMeta = (status) => {
   }
   return { marker: "\u2022", label: status || "pending", color: terminalTheme.muted };
 };
+var summarizeThinkingLedger = (steps) => {
+  const completed = steps.filter((step) => step.status === "completed").length;
+  const failed = steps.filter(
+    (step) => step.status === "error" || step.status === "aborted" || step.status === "cancelled"
+  ).length;
+  const running = steps.filter((step) => step.status === "streaming").length;
+  return {
+    title: "Task Ledger",
+    completed,
+    failed,
+    running,
+    parts: [
+      `${completed}/${steps.length} done`,
+      failed ? `${failed} failed` : "",
+      running ? `${running} running` : ""
+    ].filter(Boolean)
+  };
+};
 var ProgressBar = ({
   completed,
   total,
@@ -347,7 +588,7 @@ var ProgressBar = ({
     (_, index) => active && index === pulsePosition ? "\u2501" : "\u2500"
   );
   return /* @__PURE__ */ jsxs3(Text4, { children: [
-    /* @__PURE__ */ jsx4(Text4, { color: terminalTheme.success, children: "\u2501".repeat(filled) }),
+    /* @__PURE__ */ jsx4(Text4, { color: terminalTheme.brand, children: "\u2501".repeat(filled) }),
     /* @__PURE__ */ jsx4(Text4, { color: terminalTheme.danger, children: "\u2501".repeat(failedWidth) }),
     openRail.map((character, index) => /* @__PURE__ */ jsx4(
       Text4,
@@ -374,37 +615,29 @@ var ThinkingSteps = ({ message, expanded, forceExpanded = false, animate = true
   if (!steps.length) {
     return null;
   }
-  const completedCount = steps.filter((step) => step.status === "completed").length;
-  const failedCount = steps.filter(
-    (step) => step.status === "error" || step.status === "aborted" || step.status === "cancelled"
-  ).length;
-  const runningCount = steps.filter((step) => step.status === "streaming").length;
-  const summaryParts = [
-    `${completedCount}/${steps.length} completed`,
-    failedCount ? `${failedCount} failed` : "",
-    runningCount ? `${runningCount} running` : ""
-  ].filter(Boolean);
+  const ledger = summarizeThinkingLedger(steps);
   const runningStep = [...steps].reverse().find((step) => step.status === "streaming");
   return /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", marginTop: 1, children: [
     /* @__PURE__ */ jsxs3(Box3, { flexDirection: "row", gap: 1, children: [
-      /* @__PURE__ */ jsxs3(Text4, { color: message.pending ? terminalTheme.brand : terminalTheme.muted, children: [
+      /* @__PURE__ */ jsxs3(Text4, { color: terminalTheme.brand, children: [
         isExpanded ? "\u25BE" : "\u25B8",
-        " Reasoning"
+        " ",
+        ledger.title
       ] }),
       message.pending ? /* @__PURE__ */ jsx4(Spinner, { type: "pulse", animate }) : null,
       /* @__PURE__ */ jsx4(
         ProgressBar,
         {
-          completed: completedCount,
-          failed: failedCount,
+          completed: ledger.completed,
+          failed: ledger.failed,
           total: steps.length,
-          active: message.pending || runningCount > 0,
+          active: message.pending || ledger.running > 0,
           pulseIndex: animate ? Math.floor(now / 1e3) : 0
         }
       ),
       /* @__PURE__ */ jsxs3(Text4, { dimColor: true, children: [
         "(",
-        summaryParts.join(", "),
+        ledger.parts.join(", "),
         ")"
       ] })
     ] }),
@@ -456,7 +689,7 @@ var Transcript = ({
       const hasThinkingSteps = Boolean(message.thinkingSteps?.length);
       if (!content && !hasThinkingSteps) return null;
       return /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", paddingY: 0, marginBottom: 1, children: [
-        /* @__PURE__ */ jsxs3(Text4, { bold: true, color: isUser ? terminalTheme.success : terminalTheme.brand, children: [
+        /* @__PURE__ */ jsxs3(Text4, { bold: true, color: getTranscriptRoleColor(isUser ? "user" : "assistant"), children: [
           isUser ? userName : AI_NAME,
           ":",
           isUser && message.queued ? " (queued)" : ""
@@ -469,7 +702,7 @@ var Transcript = ({
             animate
           }
         ) : null,
-        /* @__PURE__ */ jsx4(Box3, { paddingLeft: 0, children: content ? /* @__PURE__ */ jsx4(FormattedContent, { content, role: message.role }) : !hasThinkingSteps && !message.error ? /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: "No final response content." }) : null }),
+        /* @__PURE__ */ jsx4(Box3, { paddingLeft: 0, children: content ? /* @__PURE__ */ jsx4(FormattedContent, { message, role: message.role }) : !hasThinkingSteps && !message.error ? /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: "No final response content." }) : null }),
         !isUser && message.followUpQuestions?.length ? /* @__PURE__ */ jsx4(Box3, { flexDirection: "column", paddingLeft: 2, marginTop: 1, children: /* @__PURE__ */ jsx4(Text4, { dimColor: true, italic: true, children: "Follow-ups are available above the input." }) }) : null,
         !isUser && message.hitlQuestionsAnswered?.answers.length ? /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", paddingLeft: 2, marginTop: 1, children: [
           /* @__PURE__ */ jsx4(Text4, { dimColor: true, italic: true, children: "Human input:" }),
@@ -492,7 +725,7 @@ var Transcript = ({
       const hasThinkingSteps = Boolean(streamingMessage.thinkingSteps?.length);
       if (!hasContent && hasThinkingSteps) {
         return /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", paddingY: 0, children: [
-          /* @__PURE__ */ jsxs3(Text4, { bold: true, color: terminalTheme.brand, children: [
+          /* @__PURE__ */ jsxs3(Text4, { bold: true, color: getTranscriptRoleColor("assistant"), children: [
             AI_NAME,
             ":"
           ] }),
@@ -509,7 +742,7 @@ var Transcript = ({
       }
       if (hasContent) {
         return /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", paddingY: 0, children: [
-          /* @__PURE__ */ jsxs3(Text4, { bold: true, color: terminalTheme.brand, children: [
+          /* @__PURE__ */ jsxs3(Text4, { bold: true, color: getTranscriptRoleColor("assistant"), children: [
             AI_NAME,
             ":"
           ] }),
@@ -523,7 +756,7 @@ var Transcript = ({
             }
           ),
           /* @__PURE__ */ jsxs3(Box3, { paddingLeft: 0, children: [
-            /* @__PURE__ */ jsx4(FormattedContent, { content, role: "assistant" }),
+            /* @__PURE__ */ jsx4(FormattedContent, { message: streamingMessage, role: "assistant" }),
             /* @__PURE__ */ jsx4(Text4, { color: terminalTheme.cursor, children: "|" })
           ] })
         ] }, streamingMessage.id);
@@ -602,7 +835,7 @@ var getTuiKeyBindings = (platform = process.platform) => ({
   quit: "Ctrl+C quit",
   tabFocus: "Tab focus",
   tabSwitch: "Arrow keys move focus",
-  commandComplete: "Tab completes slash commands",
+  commandComplete: "Tab/\u2191\u2193 slash command menu",
   historySearch: "Ctrl+R history search",
   cancel: "Esc cancel response",
   scroll: "Ctrl+Up/Down scroll",
@@ -622,9 +855,9 @@ var getChatInputHelpText = ({
     return "Type to edit | Tab/Arrows controls | 1-8 tabs | /help";
   }
   if (promptCount <= 0) {
-    return "Enter send | Esc controls | Ctrl+J newline | /starter | /help";
+    return "Enter send | Esc controls | /copy | /download | /help";
   }
-  return "Enter send/choose | Esc controls | Tab focus | 1-8 tabs | /help";
+  return "Enter send/choose | Esc controls | /copy | Tab focus | /help";
 };
 
 // src/ui/workspaceTabs.ts
@@ -666,6 +899,16 @@ var workspaceTabFromPromptChange = (previousValue, nextValue) => {
   return nextValue.length === 1 ? workspaceTabFromShortcut(nextValue) : void 0;
 };
 var workspaceTabButtonLabel = (tab) => `${workspaceTabs.indexOf(tab) + 1} ${workspaceTabLabels[tab]}`;
+var workspaceTabButtonContent = (tab, active = false) => `${active ? raisedButtonStyle.activeMarker : raisedButtonStyle.inactiveMarker} ${workspaceTabButtonLabel(tab)}`;
+var workspaceTabButtonInterior = (tab, active = false) => ` ${workspaceTabButtonContent(tab, active)} `;
+var workspaceTabButtonStyle = (active = false) => ({
+  backgroundColor: active ? terminalTheme.selectedBackground : void 0,
+  borderColor: active ? terminalTheme.focus : terminalTheme.muted,
+  borderStyle: active ? "bold" : raisedButtonStyle.border,
+  color: active ? "black" : terminalTheme.muted,
+  bold: active,
+  underline: active
+});
 var getWorkspaceTabHitAreas = ({
   startColumn = 1,
   startRow = 1,
@@ -712,7 +955,7 @@ var shouldBlinkPromptCursor = ({
   busy = false,
   selectorOpen = false,
   searching = false
-}) => Boolean(animationsEnabled && inputActive && busy && !selectorOpen && !searching);
+}) => Boolean(animationsEnabled && inputActive && !selectorOpen && !searching);
 var getInputCursorColor = ({
   disabled,
   inputActive = true,
@@ -732,6 +975,20 @@ var getInputCursorGlyph = ({
   }
   return cursorVisible ? "\u258C" : "\u258F";
 };
+var getPromptDisplayRows = ({
+  visibleRows,
+  startRow,
+  inputRowCount
+}) => visibleRows.map((line, index) => {
+  const rowIndex = startRow + index;
+  const isFiller = rowIndex >= inputRowCount;
+  return {
+    line,
+    isFiller,
+    showPromptPrefix: !isFiller,
+    showCursor: !isFiller && rowIndex === inputRowCount - 1
+  };
+});
 var Scrollbar = ({
   totalRows,
   visibleRows,
@@ -833,8 +1090,49 @@ var getFollowUpRowViewport = ({
     rowCount: 1
   };
 };
+var getCommandCompletionViewport = ({
+  commands,
+  focusedIndex = 0,
+  terminalColumns
+}) => {
+  const availableWidth = Math.max(24, terminalColumns - 28);
+  const activeIndex = commands.length ? Math.min(Math.max(0, focusedIndex), commands.length - 1) : 0;
+  const items = commands.map((command, index) => {
+    const label = `${index === activeIndex ? raisedButtonStyle.activeMarker : raisedButtonStyle.inactiveMarker} ${command.name}`;
+    return { command, index, label, width: label.length };
+  });
+  if (!items.length) {
+    return { items: [], clippedStart: false, clippedEnd: false, rowCount: 0 };
+  }
+  let start = activeIndex;
+  let usedWidth = items[start]?.width ?? 0;
+  while (start > 0) {
+    const nextWidth = items[start - 1].width + 1;
+    if (usedWidth + nextWidth > availableWidth) {
+      break;
+    }
+    usedWidth += nextWidth;
+    start--;
+  }
+  let end = activeIndex + 1;
+  while (end < items.length) {
+    const nextWidth = items[end].width + (end > start ? 1 : 0);
+    if (usedWidth + nextWidth > availableWidth) {
+      break;
+    }
+    usedWidth += nextWidth;
+    end++;
+  }
+  return {
+    items: items.slice(start, end),
+    clippedStart: start > 0,
+    clippedEnd: end < items.length,
+    rowCount: 1
+  };
+};
 var InputBox = ({
   title = "Prompt",
+  variant = "panel",
   value,
   onChange,
   onSubmit,
@@ -857,7 +1155,11 @@ var InputBox = ({
   scrollOffset,
   onTabShortcut,
   blinkCursor = false,
-  ghostText
+  ghostText,
+  commandCompletions = [],
+  focusedCommandCompletionIndex,
+  commandCompletionsActive = false,
+  onCommandCompletionSubmit
 }) => {
   const [cursorVisible, setCursorVisible] = useState2(true);
   const keyBindings = getTuiKeyBindings();
@@ -869,7 +1171,22 @@ var InputBox = ({
     focusedFollowUpIndex,
     terminalColumns
   });
-  const inputWidth = Math.max(20, terminalColumns - 8);
+  const commandCompletionViewport = getCommandCompletionViewport({
+    commands: commandCompletions,
+    focusedIndex: focusedCommandCompletionIndex,
+    terminalColumns
+  });
+  const commandCompletionLine = [
+    commandCompletionViewport.clippedStart ? "<--" : void 0,
+    ...commandCompletionViewport.items.map((item) => item.label),
+    commandCompletionViewport.clippedEnd ? "-->" : void 0
+  ].filter(Boolean).join(" ");
+  const activeCommand = focusedCommandCompletionIndex === void 0 ? void 0 : commandCompletions[Math.min(
+    Math.max(0, focusedCommandCompletionIndex),
+    Math.max(0, commandCompletions.length - 1)
+  )];
+  const promptPrefix = ">";
+  const inputWidth = Math.max(20, terminalColumns - 10);
   const inputViewport = getInputViewport({
     value,
     width: inputWidth,
@@ -881,6 +1198,11 @@ var InputBox = ({
   const visibleRowCount = inputViewport.visibleRowCount;
   const startRow = inputViewport.startRow;
   const visibleRows = inputViewport.visibleRows;
+  const promptRows = getPromptDisplayRows({
+    visibleRows,
+    startRow,
+    inputRowCount: inputRows.length
+  });
   useEffect2(() => {
     if (!shouldAnimateInputCursor({ disabled, inputActive, blinkCursor })) {
       setCursorVisible(true);
@@ -920,6 +1242,10 @@ var InputBox = ({
           insertNewline();
           return;
         }
+        if (commandCompletionsActive && activeCommand && onCommandCompletionSubmit) {
+          onCommandCompletionSubmit(activeCommand);
+          return;
+        }
         if (!shouldSubmitInputOnReturn(value)) {
           return;
         }
@@ -952,7 +1278,98 @@ var InputBox = ({
   const cursorGlyph = getInputCursorGlyph({ inputActive, cursorVisible });
   const cursorColor = getInputCursorColor({ disabled, inputActive, cursorVisible });
   const inputBorderColor = disabled ? terminalTheme.muted : followUpsActive || inputActive ? terminalTheme.focus : terminalTheme.muted;
-  return /* @__PURE__ */ jsxs4(
+  const content = /* @__PURE__ */ jsxs4(Fragment, { children: [
+    followUps.length ? /* @__PURE__ */ jsxs4(Text5, { wrap: "truncate", children: [
+      /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: `${followUpsLabel}: ` }),
+      followUpViewport.clippedStart ? /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: "<-- " }) : null,
+      followUpViewport.items.map(({ question, index, label }) => {
+        const focused = followUpsActive && focusedFollowUpIndex === index;
+        return /* @__PURE__ */ jsxs4(
+          Text5,
+          {
+            color: focused ? terminalTheme.focus : void 0,
+            bold: focused,
+            children: [
+              focused ? raisedButtonStyle.activeMarker : raisedButtonStyle.inactiveMarker,
+              " ",
+              label,
+              " "
+            ]
+          },
+          `${index}-${question}`
+        );
+      }),
+      followUpViewport.clippedEnd ? /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: "-->" }) : null
+    ] }) : null,
+    /* @__PURE__ */ jsxs4(
+      Box4,
+      {
+        flexDirection: compact ? "column" : "row",
+        children: [
+          /* @__PURE__ */ jsx5(Box4, { flexDirection: "column", flexGrow: 1, children: !value ? /* @__PURE__ */ jsxs4(Text5, { wrap: "truncate", children: [
+            /* @__PURE__ */ jsxs4(Text5, { color: inputActive ? terminalTheme.brand : terminalTheme.muted, children: [
+              promptPrefix,
+              " "
+            ] }),
+            /* @__PURE__ */ jsx5(Text5, { color: cursorColor, children: cursorGlyph }),
+            /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: ` ${placeholder}` })
+          ] }) : promptRows.map((row, index) => {
+            return /* @__PURE__ */ jsxs4(Text5, { wrap: "truncate", children: [
+              row.showPromptPrefix ? /* @__PURE__ */ jsxs4(Text5, { color: inputActive ? terminalTheme.brand : terminalTheme.muted, children: [
+                promptPrefix,
+                " "
+              ] }) : /* @__PURE__ */ jsx5(Text5, { children: "  " }),
+              row.line,
+              row.showCursor ? /* @__PURE__ */ jsxs4(Fragment, { children: [
+                /* @__PURE__ */ jsx5(
+                  Text5,
+                  {
+                    dimColor: true,
+                    italic: true,
+                    color: terminalTheme.inputGhost,
+                    children: ghostText ?? ""
+                  }
+                ),
+                /* @__PURE__ */ jsx5(Text5, { color: cursorColor, children: cursorGlyph })
+              ] }) : null
+            ] }, `${startRow}-${index}`);
+          }) }),
+          /* @__PURE__ */ jsx5(
+            Scrollbar,
+            {
+              totalRows: inputRows.length,
+              visibleRows: visibleRowCount,
+              startRow
+            }
+          )
+        ]
+      }
+    ),
+    actionHint ? /* @__PURE__ */ jsx5(Text5, { dimColor: true, wrap: "truncate", children: actionHint }) : resolvedHelpText ? /* @__PURE__ */ jsx5(Text5, { dimColor: true, wrap: "truncate", children: resolvedHelpText }) : null,
+    commandCompletionViewport.items.length ? /* @__PURE__ */ jsx5(
+      Text5,
+      {
+        color: commandCompletionsActive ? terminalTheme.focus : terminalTheme.muted,
+        bold: commandCompletionsActive,
+        wrap: "truncate",
+        children: `/commands: ${commandCompletionLine} | Tab/\u2191\u2193 move | Enter choose`
+      }
+    ) : null,
+    footerControls ? /* @__PURE__ */ jsx5(Box4, { flexDirection: "column", marginTop: 1, children: footerControls }) : null
+  ] });
+  if (variant === "dock") {
+    return /* @__PURE__ */ jsx5(
+      Box4,
+      {
+        flexDirection: "column",
+        borderStyle: "single",
+        borderColor: inputBorderColor,
+        paddingX: 1,
+        children: content
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx5(
     TitledBox,
     {
       title,
@@ -960,69 +1377,7 @@ var InputBox = ({
       borderColor: inputBorderColor,
       padding: 0,
       paddingX: 1,
-      children: [
-        followUps.length ? /* @__PURE__ */ jsxs4(Text5, { wrap: "truncate", children: [
-          /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: `${followUpsLabel}: ` }),
-          followUpViewport.clippedStart ? /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: "<-- " }) : null,
-          followUpViewport.items.map(({ question, index, label }) => {
-            const focused = followUpsActive && focusedFollowUpIndex === index;
-            return /* @__PURE__ */ jsxs4(
-              Text5,
-              {
-                color: focused ? terminalTheme.focus : void 0,
-                bold: focused,
-                children: [
-                  focused ? raisedButtonStyle.activeMarker : raisedButtonStyle.inactiveMarker,
-                  " ",
-                  label,
-                  " "
-                ]
-              },
-              `${index}-${question}`
-            );
-          }),
-          followUpViewport.clippedEnd ? /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: "-->" }) : null
-        ] }) : null,
-        /* @__PURE__ */ jsxs4(
-          Box4,
-          {
-            flexDirection: compact ? "column" : "row",
-            children: [
-              /* @__PURE__ */ jsx5(Box4, { flexDirection: "column", flexGrow: 1, children: !value ? /* @__PURE__ */ jsxs4(Text5, { wrap: "truncate", children: [
-                /* @__PURE__ */ jsx5(Text5, { color: cursorColor, children: cursorGlyph }),
-                /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: ` ${placeholder}` })
-              ] }) : visibleRows.map((line, index) => {
-                const isLastValueRow = startRow + index === inputRows.length - 1;
-                return /* @__PURE__ */ jsxs4(Text5, { wrap: "truncate", children: [
-                  line,
-                  isLastValueRow ? /* @__PURE__ */ jsxs4(Fragment, { children: [
-                    /* @__PURE__ */ jsx5(
-                      Text5,
-                      {
-                        dimColor: true,
-                        italic: true,
-                        color: terminalTheme.inputGhost,
-                        children: ghostText ?? ""
-                      }
-                    ),
-                    /* @__PURE__ */ jsx5(Text5, { color: cursorColor, children: cursorGlyph })
-                  ] }) : null
-                ] }, `${startRow}-${index}`);
-              }) }),
-              /* @__PURE__ */ jsx5(
-                Scrollbar,
-                {
-                  totalRows: inputRows.length,
-                  visibleRows: visibleRowCount,
-                  startRow
-                }
-              )
-            ]
-          }
-        ),
-        actionHint ? /* @__PURE__ */ jsx5(Text5, { dimColor: true, wrap: "truncate", children: actionHint }) : resolvedHelpText ? /* @__PURE__ */ jsx5(Text5, { dimColor: true, wrap: "truncate", children: resolvedHelpText }) : null,
-        footerControls ? /* @__PURE__ */ jsx5(Box4, { flexDirection: "column", marginTop: 1, children: footerControls }) : null
-      ]
+      children: content
     }
   );
 };
@@ -1242,7 +1597,7 @@ var slashCommands = [
   {
     name: "/thread",
     aliases: ["/threads"],
-    description: "Open thread selector or use /thread <title-or-id>."
+    description: "Open session/thread selector or use /thread <title-or-id>."
   },
   {
     name: "/project",
@@ -1284,6 +1639,16 @@ var slashCommands = [
     aliases: ["/frontend"],
     description: "Open the current thread in the frontend."
   },
+  {
+    name: "/copy",
+    aliases: ["/copy-response"],
+    description: "Copy the latest assistant response with numbered citations."
+  },
+  {
+    name: "/download",
+    aliases: ["/export"],
+    description: "Download the current chat transcript as Markdown."
+  },
   {
     name: "/help",
     aliases: ["/?"],
@@ -1300,6 +1665,28 @@ var firstTokenAndRest = (input) => {
   };
 };
 var allCommandNames = () => slashCommands.flatMap((command) => [command.name, ...command.aliases]);
+var buildSlashCommandCompletionItems = (input) => {
+  const trimmed = input.trimStart();
+  if (!trimmed.startsWith("/") || /\s/.test(trimmed)) {
+    return [];
+  }
+  const query = normalize(trimmed);
+  return slashCommands.filter((command) => {
+    if (query === "/") {
+      return true;
+    }
+    return [command.name, ...command.aliases].some(
+      (name) => name.startsWith(query)
+    );
+  });
+};
+var slashCommandGhostSuffix = (input, command) => {
+  const trimmed = input.trimStart();
+  if (!command || !trimmed.startsWith("/") || /\s/.test(trimmed)) {
+    return void 0;
+  }
+  return toGhostSuffix(trimmed, command.name);
+};
 var completeFromCandidates = (input, values, previous) => {
   const candidates = [...new Set(values)].filter(Boolean);
   if (!candidates.length) {
@@ -1314,12 +1701,12 @@ var completeFromCandidates = (input, values, previous) => {
     index
   };
 };
-var toGhostSuffix = (input, suggestion) => {
+function toGhostSuffix(input, suggestion) {
   if (!suggestion.startsWith(input) || suggestion === input) {
     return void 0;
   }
   return suggestion.slice(input.length);
-};
+}
 var modelValue = (item) => item.value || "auto";
 var projectName = (project) => project.name || project.id;
 var completePromptInput = (input, context, previous) => {
@@ -1484,6 +1871,12 @@ var resolvePromptCommand = (input, context) => {
   if (command === "/open" || command === "/frontend") {
     return { type: "openFrontend" };
   }
+  if (command === "/copy" || command === "/copy-response") {
+    return { type: "copyLatestResponse" };
+  }
+  if (command === "/download" || command === "/export") {
+    return { type: "downloadTranscript" };
+  }
   if (command === "/help" || command === "/?") {
     return { type: "showHelp" };
   }
@@ -1503,11 +1896,18 @@ var creditProgressText = ({
   const filled = Math.round(ratio * safeWidth);
   return `[${"\u2588".repeat(filled)}${"\u2591".repeat(safeWidth - filled)}] ${Math.round(ratio * 100)}%`;
 };
-var billingSummaryText = (billing, progressWidth = 10) => billing ? `Plan: ${billing.plan} | Credits: ${formatCredits(billing.remaining)}/${formatCredits(billing.total)} ${creditProgressText({
-  remaining: billing.remaining,
-  total: billing.total,
-  width: progressWidth
-})}` : "Plan: loading | Credits: loading";
+var billingSummaryText = (billing, progressWidth = 10) => {
+  if (!billing) {
+    return "Plan: loading | Credits: loading";
+  }
+  const used = Math.max(Number(billing.reportedUsed ?? billing.used ?? 0), 0);
+  const creditLabel = used > 0 ? `${formatCredits(billing.remaining)} left | Used: ${formatCredits(used)}` : `${formatCredits(billing.remaining)}/${formatCredits(billing.total)}`;
+  return `Plan: ${billing.plan} | Credits: ${creditLabel} ${creditProgressText({
+    remaining: billing.remaining,
+    total: billing.total,
+    width: progressWidth
+  })}`;
+};
 
 // src/ui/interactionModel.ts
 var selectorControls = ["thread", "project", "model", "mode", "profile"];
@@ -1692,10 +2092,40 @@ var getPromptInputRowBudget = (size) => {
   const rows = normalizeDimension(size.rows, 32);
   return clamp2(Math.floor(rows * 0.13), 4, 8);
 };
-var shouldUseSplitChatLayout = (size) => {
+var getChatResponsiveMode = (size) => {
   const columns = normalizeDimension(size.columns, 100);
   const rows = normalizeDimension(size.rows, 32);
-  return columns >= 132 && rows >= 40;
+  if (columns >= 132 && rows >= 40) {
+    return "wide";
+  }
+  if (columns >= 112 && rows >= 34) {
+    return "medium";
+  }
+  return "narrow";
+};
+var shouldUseSplitChatLayout = (size) => getChatResponsiveMode(size) !== "narrow";
+var getContextRailWidth = (size) => {
+  const mode = getChatResponsiveMode(size);
+  const columns = normalizeDimension(size.columns, 100);
+  if (mode === "wide") {
+    return Math.min(40, Math.max(34, Math.ceil(columns * 0.25)));
+  }
+  if (mode === "medium") {
+    return Math.min(30, Math.max(28, Math.ceil(columns * 0.25)));
+  }
+  return 0;
+};
+var estimateComposerRows = ({
+  inputRows,
+  suggestionRows,
+  includeControls = true,
+  controlRows = 0,
+  variant = "panel"
+}) => {
+  const chromeRows = variant === "dock" ? 1 : 2;
+  const inputRowsWithHint = inputRows + 1;
+  const footerRows = includeControls ? controlRows : 0;
+  return chromeRows + Math.max(0, suggestionRows) + inputRowsWithHint + footerRows;
 };
 var truncateForTerminal = (value, maxLength) => {
   if (maxLength <= 0) {
@@ -1710,6 +2140,130 @@ var truncateForTerminal = (value, maxLength) => {
   return `${value.slice(0, maxLength - 3)}...`;
 };
 
+// src/ui/artifactChips.ts
+var buildChatArtifactChips = ({
+  projectName: projectName2,
+  reportsStatus = "idle",
+  coverageLabel,
+  topActionCount = 0,
+  frontendThreadUrl
+}) => {
+  const chips = [];
+  if (projectName2) {
+    chips.push({ label: "Project", value: projectName2, tone: "brand" });
+  }
+  if (coverageLabel) {
+    chips.push({ label: "Reports", value: coverageLabel, tone: "success" });
+  } else if (reportsStatus === "loading" || reportsStatus === "ready" || reportsStatus === "error") {
+    chips.push({
+      label: "Reports",
+      value: reportsStatus,
+      tone: reportsStatus === "error" ? "danger" : "normal"
+    });
+  }
+  if (topActionCount > 0) {
+    chips.push({
+      label: "Actions",
+      value: `${topActionCount} next`,
+      tone: "warning"
+    });
+  }
+  if (frontendThreadUrl) {
+    chips.push({ label: "Web", value: "open thread", tone: "normal" });
+  }
+  return chips;
+};
+
+// src/ui/chatResponseActions.ts
+import { spawnSync } from "child_process";
+import { mkdirSync, writeFileSync } from "fs";
+import { join, resolve } from "path";
+var getLatestAssistantMessage = (messages) => [...messages].reverse().find((message) => message.role === "assistant" && message.content.trim());
+var getClipboardCommand = (platform = process.platform) => {
+  if (platform === "darwin") {
+    return { command: "pbcopy", args: [] };
+  }
+  if (platform === "win32") {
+    return { command: "cmd", args: ["/c", "clip"] };
+  }
+  return {
+    command: "sh",
+    args: [
+      "-lc",
+      "if command -v wl-copy >/dev/null 2>&1; then wl-copy; elif command -v xclip >/dev/null 2>&1; then xclip -selection clipboard; elif command -v xsel >/dev/null 2>&1; then xsel --clipboard --input; else exit 127; fi"
+    ]
+  };
+};
+var copyTextToClipboard = (text, options = {}) => {
+  const clipboardCommand = getClipboardCommand(options.platform);
+  const result = (options.spawnSyncImpl ?? spawnSync)(
+    clipboardCommand.command,
+    clipboardCommand.args,
+    { input: text, encoding: "utf8" }
+  );
+  if (result.error) {
+    throw result.error;
+  }
+  if (result.status !== 0) {
+    throw new Error("No clipboard command is available for this terminal.");
+  }
+};
+var buildLatestAssistantResponseText = (messages) => {
+  const message = getLatestAssistantMessage(messages);
+  if (!message) {
+    return void 0;
+  }
+  return toCitationExportContent({
+    content: message.content,
+    toolsUsed: message.toolsUsed,
+    citations: message.citations
+  }).trim();
+};
+var roleLabel = (message, userName) => message.role === "user" ? userName : "Cloudeval AI";
+var buildChatTranscriptMarkdown = ({
+  messages,
+  userName,
+  threadId,
+  exportedAt = /* @__PURE__ */ new Date()
+}) => {
+  const renderedMessages = messages.filter((message) => message.content.trim()).map((message) => {
+    const content = message.role === "assistant" ? toCitationExportContent({
+      content: message.content,
+      toolsUsed: message.toolsUsed,
+      citations: message.citations
+    }) : message.content;
+    return `## ${roleLabel(message, userName)}
+
+${content.trim()}`;
+  });
+  return [
+    "# CloudEval chat transcript",
+    "",
+    `Exported: ${exportedAt.toISOString()}`,
+    threadId ? `Thread: ${threadId}` : void 0,
+    "",
+    ...renderedMessages,
+    ""
+  ].filter((line) => line !== void 0).join("\n");
+};
+var writeChatTranscriptDownload = ({
+  messages,
+  userName,
+  threadId,
+  cwd = process.cwd()
+}) => {
+  const dir = resolve(cwd, ".cloudeval-downloads");
+  mkdirSync(dir, { recursive: true });
+  const timestamp = (/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-");
+  const file = join(dir, `chat-transcript-${timestamp}.md`);
+  writeFileSync(
+    file,
+    buildChatTranscriptMarkdown({ messages, userName, threadId }),
+    "utf8"
+  );
+  return file;
+};
+
 // src/ui/scrollBehavior.ts
 var shouldAutoScrollToBottom = ({
   currentOffset,
@@ -2042,6 +2596,11 @@ var sessionDescription = (session, age) => {
   const messages = `${session.messageCount} message${session.messageCount === 1 ? "" : "s"}`;
   return [createdAgeDescription(age), project, messages].filter(Boolean).join(" \xB7 ");
 };
+var draftDescription = (draft, age) => {
+  const messages = `${draft.messageCount} message${draft.messageCount === 1 ? "" : "s"}`;
+  const status = draft.status && draft.status !== "idle" && draft.status !== "complete" ? draft.status.replace(/_/g, " ") : "active locally";
+  return ["Open session", status, createdAgeDescription(age), draft.projectName, messages].filter(Boolean).join(" \xB7 ");
+};
 var remoteTitle = (thread) => {
   const title = String(thread.title || "").trim();
   const preview = String(thread.last_message_preview || "").trim();
@@ -2133,12 +2692,48 @@ var localSessionMessagesToChatMessages = (session) => session.messages.map((mess
   content: message.content,
   createdAt: timestampFromIso(message.createdAt, index)
 }));
+var buildDraftThreadSummary = ({
+  key,
+  state,
+  projectName: projectName2,
+  updatedAt
+}) => {
+  const messages = state.messages.filter((message) => message.content.trim());
+  if (!messages.length && !state.threadId) {
+    return null;
+  }
+  const firstUserMessage = messages.find((message) => message.role === "user");
+  const fallbackTitle = state.threadId ?? "New local session";
+  const title = truncateForTerminal(
+    firstUserMessage?.content.trim() || messages[0]?.content.trim() || fallbackTitle,
+    72
+  );
+  const messageTimestamps = messages.map((message) => message.updatedAt ?? message.createdAt).filter((value) => Number.isFinite(value));
+  const lastUpdated = updatedAt ?? (messageTimestamps.length ? Math.max(...messageTimestamps) : Date.now());
+  return {
+    key,
+    title,
+    threadId: state.threadId,
+    updatedAt: lastUpdated,
+    projectName: projectName2,
+    messageCount: messages.length,
+    status: state.status
+  };
+};
 var buildThreadSelectItems = (sessions, activeThreadId, remoteThreads = [], options = {}) => [
   {
     label: "New thread",
     value: { kind: "new" },
     description: activeThreadId ? "Start a fresh CloudEval chat thread." : "Current selection."
   },
+  ...(options.drafts ?? []).map((draft) => {
+    const age = draft.updatedAt ? relativeThreadAge(new Date(draft.updatedAt).toISOString(), options.now) : void 0;
+    return {
+      label: titleWithAge(draft.title, age),
+      value: { kind: "draft", draft },
+      description: draftDescription(draft, age)
+    };
+  }),
   ...remoteThreads.map((thread) => {
     const age = relativeThreadAge(thread.created_at ?? thread.updated_at, options.now);
     return {
@@ -2440,7 +3035,7 @@ var firstNumber2 = (value, keys) => {
   }
   return void 0;
 };
-var firstString = (value, keys) => {
+var firstString2 = (value, keys) => {
   const record = toRecord2(value);
   if (!record) {
     return void 0;
@@ -2519,7 +3114,7 @@ var extractPillarScores = (report) => {
     const rows = pillarArray.map((item) => {
       const record = toRecord2(item);
       if (!record) return void 0;
-      const label = firstString(record, ["label", "id", "pillar"]);
+      const label = firstString2(record, ["label", "id", "pillar"]);
       const value = firstNumber2(record, ["score", "value"]);
       return label && value !== void 0 ? { [label]: value } : void 0;
     }).filter(Boolean).reduce((acc, row) => ({ ...acc, ...row }), {});
@@ -2558,7 +3153,7 @@ var extractMonthlySavings = (report) => firstNumber2(firstRecord2(report, ["pars
 ]) ?? firstNumber2(report, ["total_monthly_savings", "monthly_savings"]);
 var extractCurrency = (...values) => {
   for (const value of values) {
-    const currency = firstString(value, ["currency"]) ?? firstString(firstRecord2(value, ["parsed", "totalSpend"]), ["currency"]) ?? firstString(firstRecord2(value, ["dashboard"]), ["currency"]) ?? firstString(firstRecord2(value, ["processed"]), ["currency"]);
+    const currency = firstString2(value, ["currency"]) ?? firstString2(firstRecord2(value, ["parsed", "totalSpend"]), ["currency"]) ?? firstString2(firstRecord2(value, ["dashboard"]), ["currency"]) ?? firstString2(firstRecord2(value, ["processed"]), ["currency"]);
     if (currency) {
       return currency;
     }
@@ -2617,7 +3212,7 @@ var projectHealthRows = (reportsSummary, selectedProjectId) => firstArray(report
     architectureStatus: String(record.architecture_status ?? "not_started"),
     unitTestsStatus: String(record.unit_tests_status ?? "not_started"),
     freshness: String(record.freshness ?? "missing"),
-    lastReportAt: firstString(record, ["last_report_at"]),
+    lastReportAt: firstString2(record, ["last_report_at"]),
     criticalIssues: firstNumber2(record, ["critical_issues"]) ?? 0,
     coveragePercent: firstNumber2(record, ["coverage_percent"]) ?? 0,
     isSelected: Boolean(selectedProjectId && projectId === selectedProjectId)
@@ -2797,8 +3392,8 @@ var buildReportsDashboardModel = ({
       return {
         label: String(record.label ?? "Action"),
         issueCount: firstNumber2(record, ["issue_count"]),
-        priority: firstString(record, ["priority"]),
-        pillar: firstString(record, ["pillar"])
+        priority: firstString2(record, ["priority"]),
+        pillar: firstString2(record, ["pillar"])
       };
     }).filter((action) => action.label.trim()).slice(0, 20),
     topInsights: firstArray(reportsSummary, ["top_insights"]).map((insight) => String(insight)).filter(Boolean).slice(0, 20)
@@ -2906,7 +3501,7 @@ var directArray = (value) => {
   }
   return [];
 };
-var firstString2 = (value, keys, fallback = "") => {
+var firstString3 = (value, keys, fallback = "") => {
   const record = toRecord3(value);
   if (!record) {
     return fallback;
@@ -2972,11 +3567,11 @@ var buildReportsSummaryFromHistory = ({
   const statusBreakdown = {};
   const rowsByProject = /* @__PURE__ */ new Map();
   for (const item of rows) {
-    const reportType = normalizeReportType(firstString2(item, ["report_type", "kind"], "cost"));
-    const status = firstString2(item, ["status"], "completed").toLowerCase();
-    const projectId = firstString2(item, ["project_id", "projectId"], "unknown-project");
-    const projectName2 = firstString2(item, ["project_name", "projectName"]) || projects.find((project) => project.id === projectId)?.name || projectId;
-    const generatedAt = firstString2(item, ["generated_at", "generatedAt"]);
+    const reportType = normalizeReportType(firstString3(item, ["report_type", "kind"], "cost"));
+    const status = firstString3(item, ["status"], "completed").toLowerCase();
+    const projectId = firstString3(item, ["project_id", "projectId"], "unknown-project");
+    const projectName2 = firstString3(item, ["project_name", "projectName"]) || projects.find((project) => project.id === projectId)?.name || projectId;
+    const generatedAt = firstString3(item, ["generated_at", "generatedAt"]);
     const metrics = toRecord3((toRecord3(item) ?? {}).metrics) ?? {};
     const existing = rowsByProject.get(projectId) ?? {
       project_id: projectId,
@@ -3077,7 +3672,7 @@ var loadWorkspacePanelData = async ({
       return void 0;
     }
   };
-  if (tab === "overview" || tab === "connections") {
+  if (tab === "overview" || tab === "connections" || tab === "projects") {
     if (currentUserId) {
       await capture(
         "connections",
@@ -3211,7 +3806,8 @@ var loadWorkspacePanelData = async ({
 import React7 from "react";
 import { Box as Box8, Text as Text9 } from "ink";
 import { plot as plotAsciiChart } from "asciichart";
-import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+
+// src/ui/workspaceEntityDetails.ts
 var toRecord4 = (value) => value && typeof value === "object" && !Array.isArray(value) ? value : void 0;
 var directArray2 = (value) => {
   if (Array.isArray(value)) {
@@ -3221,6 +3817,199 @@ var directArray2 = (value) => {
   if (!record) {
     return [];
   }
+  for (const key of ["items", "data", "rows", "results", "connections", "projects"]) {
+    const candidate = record[key];
+    if (Array.isArray(candidate)) {
+      return candidate;
+    }
+  }
+  return [];
+};
+var firstString4 = (value, keys, fallback = "") => {
+  const record = toRecord4(value);
+  if (!record) {
+    return fallback;
+  }
+  for (const key of keys) {
+    const current = record[key];
+    if (typeof current === "string" && current.trim()) {
+      return current.trim();
+    }
+    if (typeof current === "number" && Number.isFinite(current)) {
+      return String(current);
+    }
+    if (typeof current === "boolean") {
+      return current ? "on" : "off";
+    }
+  }
+  return fallback;
+};
+var firstNumber4 = (value, keys) => {
+  const record = toRecord4(value);
+  if (!record) {
+    return void 0;
+  }
+  for (const key of keys) {
+    const current = record[key];
+    const numberValue = typeof current === "number" ? current : Number(current);
+    if (Number.isFinite(numberValue)) {
+      return numberValue;
+    }
+  }
+  return void 0;
+};
+var statusTone = (value) => {
+  const normalized = value.toLowerCase();
+  if (["completed", "ready", "fresh", "synced", "success", "active"].includes(normalized)) {
+    return "success";
+  }
+  if (["running", "partial", "pending", "stale"].includes(normalized)) {
+    return "warning";
+  }
+  if (["failed", "error", "missing", "outdated", "disabled"].includes(normalized)) {
+    return "danger";
+  }
+  return "muted";
+};
+var truncateDetail = (value, limit = 96) => value.length <= limit ? value : `${value.slice(0, limit - 3)}...`;
+var projectIdsForConnection = (connection) => {
+  const record = toRecord4(connection);
+  if (!record) {
+    return [];
+  }
+  const values = [
+    record.project_id,
+    record.projectId,
+    record.project,
+    record.project_name
+  ];
+  const arrayValues = [
+    record.project_ids,
+    record.projectIds,
+    record.projects,
+    record.linked_project_ids
+  ].flatMap((value) => directArray2(value));
+  return [...values, ...arrayValues].map((value) => firstString4({ value }, ["value"])).filter(Boolean);
+};
+var connectionMatchesProject = (connection, project) => {
+  const haystack = projectIdsForConnection(connection).map((value) => value.toLowerCase());
+  const id = String(project.id ?? "").toLowerCase();
+  const name = String(project.name ?? "").toLowerCase();
+  return Boolean(id && haystack.includes(id) || name && haystack.includes(name));
+};
+var projectHealthFor = (reportsSummary, project) => {
+  const rows = directArray2(toRecord4(reportsSummary)?.project_health);
+  return rows.map(toRecord4).find((row) => {
+    if (!row) {
+      return false;
+    }
+    return String(row.project_id ?? row.projectId ?? "").toLowerCase() === String(project.id ?? "").toLowerCase() || String(row.project_name ?? row.projectName ?? "").toLowerCase() === String(project.name ?? "").toLowerCase();
+  });
+};
+var buildProjectDetailModel = ({
+  project,
+  connections,
+  reportsSummary
+}) => {
+  if (!project) {
+    return null;
+  }
+  const linkedConnections = connections.filter(
+    (connection) => connectionMatchesProject(connection, project)
+  );
+  const status = firstString4(project, ["status", "sync_status", "last_sync_status"], "unknown");
+  const health = projectHealthFor(reportsSummary, project);
+  const coverage = firstNumber4(health, ["coverage_percent", "coveragePercent"]);
+  const critical = firstNumber4(health, ["critical_issues", "criticalIssues", "critical_count"]);
+  const lastReport = firstString4(health, ["last_report_at", "lastReportAt", "generated_at"]);
+  return {
+    title: firstString4(project, ["name"], "Project"),
+    subtitle: firstString4(project, ["id"]),
+    metrics: [
+      {
+        label: "Provider",
+        value: firstString4(project, ["cloud_provider", "provider"], "cloud"),
+        tone: "brand"
+      },
+      { label: "Type", value: firstString4(project, ["type", "source_type"], "project") },
+      { label: "Status", value: status, tone: statusTone(status) },
+      { label: "Connections", value: String(linkedConnections.length), tone: "brand" }
+    ],
+    detailRows: [
+      { label: "Created", value: firstString4(project, ["created_at", "createdAt"], "-") },
+      { label: "Updated", value: firstString4(project, ["updated_at", "updatedAt"], "-") },
+      ...coverage !== void 0 ? [{ label: "Report coverage", value: `${Math.round(coverage)}%`, tone: "brand" }] : [],
+      ...critical !== void 0 ? [{ label: "Critical issues", value: String(critical), tone: critical > 0 ? "danger" : "success" }] : [],
+      ...lastReport ? [{ label: "Last report", value: lastReport }] : []
+    ],
+    relatedItems: linkedConnections.map((connection) => ({
+      label: firstString4(connection, ["name"], "Connection"),
+      detail: firstString4(connection, ["last_sync_status", "status", "type"], ""),
+      tone: statusTone(firstString4(connection, ["last_sync_status", "status"], ""))
+    }))
+  };
+};
+var linkedProjectForConnection = (connection, projects) => {
+  const ids = projectIdsForConnection(connection).map((value) => value.toLowerCase());
+  return projects.find((project) => {
+    const id = String(project.id ?? "").toLowerCase();
+    const name = String(project.name ?? "").toLowerCase();
+    return id && ids.includes(id) || name && ids.includes(name);
+  });
+};
+var buildConnectionDetailModel = ({
+  connection,
+  projects
+}) => {
+  const record = toRecord4(connection);
+  if (!record) {
+    return null;
+  }
+  const linkedProject = linkedProjectForConnection(connection, projects);
+  const sync = firstString4(connection, ["last_sync_status", "sync_status", "status"], "unknown");
+  const autoSync = firstString4(connection, ["auto_sync", "autoSync"], "off");
+  const source = firstString4(connection, [
+    "template_url",
+    "source_url",
+    "repo_url",
+    "repository_url",
+    "visualization_source_path",
+    "workspace_file_paths"
+  ]);
+  return {
+    title: firstString4(connection, ["name"], "Connection"),
+    subtitle: firstString4(connection, ["id"]),
+    metrics: [
+      {
+        label: "Provider",
+        value: firstString4(connection, ["cloud_provider", "provider"], "cloud"),
+        tone: "brand"
+      },
+      { label: "Type", value: firstString4(connection, ["type", "connection_type"], "connection") },
+      { label: "Sync", value: sync, tone: statusTone(sync) },
+      { label: "Auto", value: autoSync, tone: autoSync === "on" ? "success" : "muted" }
+    ],
+    detailRows: [
+      { label: "Project", value: linkedProject?.name ?? firstString4(connection, ["project_name", "project_id"], "-") },
+      { label: "Last synced", value: firstString4(connection, ["last_synced", "lastSynced", "updated_at"], "-") },
+      ...source ? [{ label: "Source", value: truncateDetail(source), tone: "brand" }] : [],
+      { label: "Created", value: firstString4(connection, ["created_at", "createdAt"], "-") }
+    ],
+    relatedItems: linkedProject ? [{ label: linkedProject.name, detail: linkedProject.cloud_provider ?? "project", tone: "brand" }] : []
+  };
+};
+
+// src/ui/workspacePanel.tsx
+import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+var toRecord5 = (value) => value && typeof value === "object" && !Array.isArray(value) ? value : void 0;
+var directArray3 = (value) => {
+  if (Array.isArray(value)) {
+    return value;
+  }
+  const record = toRecord5(value);
+  if (!record) {
+    return [];
+  }
   for (const key of [
     "data",
     "items",
@@ -3240,9 +4029,9 @@ var directArray2 = (value) => {
     if (Array.isArray(candidate)) {
       return candidate;
     }
-    const nested = toRecord4(candidate);
+    const nested = toRecord5(candidate);
     if (nested) {
-      const nestedArray = directArray2(nested);
+      const nestedArray = directArray3(nested);
       if (nestedArray.length) {
         return nestedArray;
       }
@@ -3266,7 +4055,7 @@ var allNumbers = (value, limit = 36) => {
       }
       return;
     }
-    const record = toRecord4(current);
+    const record = toRecord5(current);
     if (!record) {
       return;
     }
@@ -3281,8 +4070,8 @@ var allNumbers = (value, limit = 36) => {
   visit(value);
   return output;
 };
-var firstString3 = (value, keys, fallback = "unknown") => {
-  const record = toRecord4(value);
+var firstString5 = (value, keys, fallback = "unknown") => {
+  const record = toRecord5(value);
   if (!record) {
     return fallback;
   }
@@ -3297,8 +4086,8 @@ var firstString3 = (value, keys, fallback = "unknown") => {
   }
   return fallback;
 };
-var firstNumber4 = (value, keys) => {
-  const record = toRecord4(value);
+var firstNumber5 = (value, keys) => {
+  const record = toRecord5(value);
   if (!record) {
     return void 0;
   }
@@ -3312,14 +4101,14 @@ var firstNumber4 = (value, keys) => {
   return void 0;
 };
 var billingUsageTrendValues = (usageSummary) => {
-  const record = toRecord4(usageSummary);
-  const buckets = directArray2(record?.buckets);
-  const bucketValues = buckets.map((bucket) => firstNumber4(bucket, ["credits_used", "total_credits", "credits"])).filter((value) => value !== void 0);
+  const record = toRecord5(usageSummary);
+  const buckets = directArray3(record?.buckets);
+  const bucketValues = buckets.map((bucket) => firstNumber5(bucket, ["credits_used", "total_credits", "credits"])).filter((value) => value !== void 0);
   if (bucketValues.length) {
     return bucketValues;
   }
-  const totals = toRecord4(record?.totals);
-  const total = firstNumber4(totals ?? usageSummary, ["credits_used", "total_credits", "credits"]);
+  const totals = toRecord5(record?.totals);
+  const total = firstNumber5(totals ?? usageSummary, ["credits_used", "total_credits", "credits"]);
   return total !== void 0 ? [total] : allNumbers(usageSummary);
 };
 var formatNumber3 = (value) => value === void 0 ? "-" : new Intl.NumberFormat("en-US", { maximumFractionDigits: 2 }).format(
@@ -3327,6 +4116,8 @@ var formatNumber3 = (value) => value === void 0 ? "-" : new Intl.NumberFormat("e
 );
 var formatPercent = (value) => value === void 0 ? "-" : `${Math.round(value * 100)}%`;
 var metricColor = (tone) => {
+  if (tone === "brand") return terminalTheme.brand;
+  if (tone === "muted") return terminalTheme.muted;
   if (tone === "success") return terminalTheme.success;
   if (tone === "warning") return terminalTheme.warning;
   if (tone === "danger") return terminalTheme.danger;
@@ -3407,7 +4198,7 @@ var AsciiLineChart = ({ values, width, height = 4, tone }) => {
   )) });
 };
 var keySummary = (value) => {
-  const record = toRecord4(value);
+  const record = toRecord5(value);
   if (!record) {
     return "no object payload";
   }
@@ -3415,11 +4206,11 @@ var keySummary = (value) => {
   return keys.length ? keys.join(", ") : "empty object";
 };
 var rowLabel = (value, fallback) => {
-  const record = toRecord4(value);
+  const record = toRecord5(value);
   if (!record) {
     return typeof value === "string" ? value : fallback;
   }
-  return firstString3(
+  return firstString5(
     record,
     [
       "name",
@@ -3435,21 +4226,21 @@ var rowLabel = (value, fallback) => {
   );
 };
 var rowDetail = (value) => {
-  const record = toRecord4(value);
+  const record = toRecord5(value);
   if (!record) {
     return "";
   }
   const parts = [
-    firstString3(record, ["cloud_provider", "provider"], ""),
+    firstString5(record, ["cloud_provider", "provider"], ""),
     (() => {
-      const status = firstString3(
+      const status = firstString5(
         record,
         ["effective_status", "status", "outcome"],
         ""
       );
       return status.toLowerCase().replace(/[\s-]+/g, "_") === "trial_active" ? "" : status;
     })(),
-    firstString3(
+    firstString5(
       record,
       ["created_at", "updated_at", "timestamp", "period"],
       ""
@@ -3543,11 +4334,9 @@ var BillingSummaryLine = ({
   /* @__PURE__ */ jsxs7(Text9, { dimColor: true, children: [
     "Credits:",
     " ",
-    /* @__PURE__ */ jsxs7(Text9, { color: billingToneColor(billing.tone), children: [
-      formatCredits(billing.remaining),
-      "/",
-      formatCredits(billing.total)
-    ] })
+    /* @__PURE__ */ jsx9(Text9, { color: billingToneColor(billing.tone), children: Math.max(Number(billing.reportedUsed ?? billing.used ?? 0), 0) > 0 ? `${formatCredits(billing.remaining)} left | Used ${formatCredits(
+      Math.max(Number(billing.reportedUsed ?? billing.used ?? 0), 0)
+    )}` : `${formatCredits(billing.remaining)}/${formatCredits(billing.total)}` })
   ] }),
   /* @__PURE__ */ jsx9(
     CreditProgress,
@@ -3712,7 +4501,7 @@ var HelpLegend = ({
   ] }, segment.key)) });
 };
 var ResourceSummary = ({ label, value, terminalColumns }) => {
-  const rows = directArray2(value);
+  const rows = directArray3(value);
   return /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", children: [
     /* @__PURE__ */ jsx9(Text9, { bold: true, children: label }),
     /* @__PURE__ */ jsx9(Text9, { dimColor: true, wrap: "wrap", children: rows.length ? `${rows.length} row(s) returned` : `keys: ${truncateForTerminal(keySummary(value), Math.max(32, terminalColumns - 14))}` }),
@@ -3723,86 +4512,185 @@ var ResourceSummary = ({ label, value, terminalColumns }) => {
       truncateForTerminal(rowLabel(row, `row ${index + 1}`), 36),
       rowDetail(row) ? ` - ${truncateForTerminal(rowDetail(row), 64)}` : ""
     ] }, `${label}-${index}`)),
-    !rows.length && !toRecord4(value) ? /* @__PURE__ */ jsx9(Text9, { dimColor: true, children: "No data returned." }) : null
+    !rows.length && !toRecord5(value) ? /* @__PURE__ */ jsx9(Text9, { dimColor: true, children: "No data returned." }) : null
+  ] });
+};
+var cleanBackendWarning = (warning, terminalColumns) => {
+  const compact = warning.replace(
+    /:\s*\{"detail":"Device token not authorized for this endpoint"\}/g,
+    " (backend denied CLI device-token access)"
+  ).replace(/\s+/g, " ").trim();
+  return truncateForTerminal(
+    compact,
+    Math.max(72, Math.min(180, terminalColumns - 8))
+  );
+};
+var entityToneColor = (tone) => {
+  if (tone === "brand") return terminalTheme.brand;
+  if (tone === "success") return terminalTheme.success;
+  if (tone === "warning") return terminalTheme.warning;
+  if (tone === "danger") return terminalTheme.danger;
+  return terminalTheme.muted;
+};
+var EntityDetailPanel = ({ model, emptyLabel, compact, terminalColumns }) => {
+  if (!model) {
+    return /* @__PURE__ */ jsx9(Text9, { dimColor: true, children: emptyLabel });
+  }
+  return /* @__PURE__ */ jsx9(SectionCard, { title: "Selected detail", borderColor: terminalTheme.focus, children: /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", gap: 1, children: [
+    /* @__PURE__ */ jsxs7(Box8, { flexDirection: compact ? "column" : "row", justifyContent: "space-between", gap: 1, children: [
+      /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", flexShrink: 1, children: [
+        /* @__PURE__ */ jsx9(Text9, { color: terminalTheme.focus, bold: true, wrap: "truncate", children: truncateForTerminal(model.title, Math.max(24, terminalColumns - 32)) }),
+        model.subtitle ? /* @__PURE__ */ jsx9(Text9, { dimColor: true, wrap: "truncate", children: model.subtitle }) : null
+      ] }),
+      /* @__PURE__ */ jsx9(MetricStrip, { metrics: model.metrics, compact })
+    ] }),
+    /* @__PURE__ */ jsx9(Box8, { flexDirection: "column", children: model.detailRows.map((row) => /* @__PURE__ */ jsxs7(Text9, { wrap: "truncate", children: [
+      /* @__PURE__ */ jsxs7(Text9, { dimColor: true, children: [
+        row.label.padEnd(16),
+        " "
+      ] }),
+      /* @__PURE__ */ jsx9(Text9, { color: entityToneColor(row.tone), children: truncateForTerminal(row.value || "-", Math.max(20, terminalColumns - 24)) })
+    ] }, `${row.label}-${row.value}`)) }),
+    model.relatedItems.length ? /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", children: [
+      /* @__PURE__ */ jsx9(Text9, { color: terminalTheme.brand, children: "Linked" }),
+      model.relatedItems.slice(0, 5).map((item, index) => /* @__PURE__ */ jsxs7(Text9, { wrap: "truncate", children: [
+        /* @__PURE__ */ jsx9(Text9, { color: entityToneColor(item.tone), children: "\u25CF " }),
+        truncateForTerminal(item.label, 36),
+        item.detail ? /* @__PURE__ */ jsxs7(Text9, { dimColor: true, children: [
+          " - ",
+          truncateForTerminal(item.detail, 36)
+        ] }) : null
+      ] }, `${item.label}-${index}`))
+    ] }) : null
+  ] }) });
+};
+var ProjectsView = ({ projects, selectedProject, connections, reportsSummary, compact, terminalColumns }) => {
+  const selectedModel = buildProjectDetailModel({
+    project: selectedProject ?? projects[0],
+    connections,
+    reportsSummary
+  });
+  return /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", gap: 1, children: [
+    /* @__PURE__ */ jsx9(
+      MetricStrip,
+      {
+        compact,
+        metrics: [
+          { label: "Projects", value: String(projects.length) },
+          { label: "Selected", value: selectedProject?.name ?? "none" }
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx9(Text9, { dimColor: true, children: "J/K or Up/Down selects project | Enter confirms | O opens frontend" }),
+    /* @__PURE__ */ jsxs7(Box8, { flexDirection: compact ? "column" : "row", gap: 2, children: [
+      /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", flexBasis: compact ? void 0 : 52, flexShrink: 0, children: [
+        /* @__PURE__ */ jsx9(Text9, { color: terminalTheme.brand, children: "Project list" }),
+        projects.length ? projects.slice(0, 12).map((project, index) => {
+          const active = project.id === (selectedProject ?? projects[0])?.id;
+          return /* @__PURE__ */ jsxs7(
+            Text9,
+            {
+              color: active ? terminalTheme.focus : void 0,
+              backgroundColor: active ? terminalTheme.selectedBackground : void 0,
+              bold: active,
+              wrap: "truncate",
+              children: [
+                active ? ">" : " ",
+                " ",
+                truncateForTerminal(project.name, 30),
+                " ",
+                /* @__PURE__ */ jsx9(Text9, { color: terminalTheme.brand, children: project.cloud_provider ?? "cloud" }),
+                " ",
+                /* @__PURE__ */ jsx9(Text9, { dimColor: true, children: project.id })
+              ]
+            },
+            project.id ?? index
+          );
+        }) : /* @__PURE__ */ jsx9(Text9, { dimColor: true, children: "No projects returned by the backend." })
+      ] }),
+      /* @__PURE__ */ jsx9(Box8, { flexGrow: 1, children: /* @__PURE__ */ jsx9(
+        EntityDetailPanel,
+        {
+          model: selectedModel,
+          emptyLabel: "Select a project to inspect backend details.",
+          compact,
+          terminalColumns: Math.max(32, terminalColumns - 56)
+        }
+      ) })
+    ] })
+  ] });
+};
+var ConnectionsView = ({ connections, projects, selectedIndex, compact, terminalColumns }) => {
+  const safeIndex = connections.length ? Math.min(Math.max(0, selectedIndex), connections.length - 1) : -1;
+  const selectedConnection = safeIndex >= 0 ? connections[safeIndex] : void 0;
+  const selectedModel = buildConnectionDetailModel({
+    connection: selectedConnection,
+    projects
+  });
+  return /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", gap: 1, children: [
+    /* @__PURE__ */ jsx9(
+      MetricStrip,
+      {
+        compact,
+        metrics: [{ label: "Connections", value: String(connections.length) }]
+      }
+    ),
+    /* @__PURE__ */ jsx9(Text9, { dimColor: true, children: "J/K or Up/Down selects connection | Enter confirms | O opens frontend | D downloads table data" }),
+    /* @__PURE__ */ jsxs7(Box8, { flexDirection: compact ? "column" : "row", gap: 2, children: [
+      /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", flexBasis: compact ? void 0 : 58, flexShrink: 0, children: [
+        /* @__PURE__ */ jsx9(Text9, { color: terminalTheme.brand, children: "Connection list" }),
+        connections.length ? connections.slice(0, 12).map((connection, index) => {
+          const active = index === safeIndex;
+          return /* @__PURE__ */ jsxs7(
+            Text9,
+            {
+              color: active ? terminalTheme.focus : void 0,
+              backgroundColor: active ? terminalTheme.selectedBackground : void 0,
+              bold: active,
+              wrap: "truncate",
+              children: [
+                active ? ">" : " ",
+                " ",
+                String(index + 1).padStart(2),
+                " ",
+                truncateForTerminal(rowLabel(connection, "connection"), 34),
+                rowDetail(connection) ? /* @__PURE__ */ jsxs7(Text9, { dimColor: true, children: [
+                  " - ",
+                  truncateForTerminal(rowDetail(connection), 28)
+                ] }) : ""
+              ]
+            },
+            String(firstString5(connection, ["id"], String(index)))
+          );
+        }) : /* @__PURE__ */ jsx9(Text9, { dimColor: true, children: "No connections returned by the backend." })
+      ] }),
+      /* @__PURE__ */ jsx9(Box8, { flexGrow: 1, children: /* @__PURE__ */ jsx9(
+        EntityDetailPanel,
+        {
+          model: selectedModel,
+          emptyLabel: "Select a connection to inspect backend details.",
+          compact,
+          terminalColumns: Math.max(32, terminalColumns - 62)
+        }
+      ) })
+    ] })
   ] });
 };
-var cleanBackendWarning = (warning, terminalColumns) => {
-  const compact = warning.replace(
-    /:\s*\{"detail":"Device token not authorized for this endpoint"\}/g,
-    " (backend denied CLI device-token access)"
-  ).replace(/\s+/g, " ").trim();
-  return truncateForTerminal(
-    compact,
-    Math.max(72, Math.min(180, terminalColumns - 8))
-  );
-};
-var ProjectsView = ({ projects, selectedProject }) => /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", gap: 1, children: [
-  /* @__PURE__ */ jsx9(
-    MetricStrip,
-    {
-      compact: false,
-      metrics: [
-        { label: "Projects", value: String(projects.length) },
-        { label: "Selected", value: selectedProject?.name ?? "none" }
-      ]
-    }
-  ),
-  projects.length ? projects.slice(0, 12).map((project, index) => /* @__PURE__ */ jsxs7(
-    Text9,
-    {
-      color: project.id === selectedProject?.id ? terminalTheme.brand : void 0,
-      wrap: "truncate",
-      children: [
-        project.id === selectedProject?.id ? ">" : " ",
-        " ",
-        project.name,
-        " |",
-        " ",
-        project.cloud_provider ?? "cloud",
-        " | ",
-        project.id
-      ]
-    },
-    project.id ?? index
-  )) : /* @__PURE__ */ jsx9(Text9, { dimColor: true, children: "No projects returned by the backend." })
-] });
-var ConnectionsView = ({ connections }) => /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", gap: 1, children: [
-  /* @__PURE__ */ jsx9(
-    MetricStrip,
-    {
-      compact: false,
-      metrics: [{ label: "Connections", value: String(connections.length) }]
-    }
-  ),
-  connections.length ? connections.slice(0, 12).map((connection, index) => /* @__PURE__ */ jsxs7(
-    Text9,
-    {
-      wrap: "truncate",
-      children: [
-        index + 1,
-        ".",
-        " ",
-        truncateForTerminal(rowLabel(connection, "connection"), 36),
-        rowDetail(connection) ? ` - ${truncateForTerminal(rowDetail(connection), 72)}` : ""
-      ]
-    },
-    String(firstString3(connection, ["id"], String(index)))
-  )) : /* @__PURE__ */ jsx9(Text9, { dimColor: true, children: "No connections returned by the backend." })
-] });
 var BillingView = ({ state, compact, terminalColumns, frontendUrl }) => {
-  const creditStatus = toRecord4(state.data.creditStatus);
-  const entitlement = toRecord4(state.data.entitlement);
-  const plan = toRecord4(entitlement?.plan);
+  const creditStatus = toRecord5(state.data.creditStatus);
+  const entitlement = toRecord5(state.data.entitlement);
+  const plan = toRecord5(entitlement?.plan);
   const usageValues = billingUsageTrendValues(state.data.usageSummary);
-  const ledger = directArray2(state.data.ledger);
-  const invoices = directArray2(state.data.billingInfo);
-  const topups = directArray2(state.data.topups);
-  const notifications = directArray2(state.data.notifications);
-  const remainingRatio = firstNumber4(creditStatus, ["remainingRatio"]);
-  const creditTone = firstString3(creditStatus, ["tone"], "normal");
+  const ledger = directArray3(state.data.ledger);
+  const invoices = directArray3(state.data.billingInfo);
+  const topups = directArray3(state.data.topups);
+  const notifications = directArray3(state.data.notifications);
+  const remainingRatio = firstNumber5(creditStatus, ["remainingRatio"]);
+  const creditTone = firstString5(creditStatus, ["tone"], "normal");
   const tone = metricToneFromBillingTone(creditTone);
-  const remaining = firstNumber4(creditStatus, ["remaining"]);
-  const total = firstNumber4(creditStatus, ["total"]);
+  const remaining = firstNumber5(creditStatus, ["remaining"]);
+  const total = firstNumber5(creditStatus, ["total"]);
+  const reportedUsed = firstNumber5(creditStatus, ["reportedUsed"]) ?? firstNumber5(creditStatus, ["used"]);
   const plansUrl = buildFrontendUrl({
     baseUrl: frontendUrl,
     target: "billing",
@@ -3816,17 +4704,18 @@ var BillingView = ({ state, compact, terminalColumns, frontendUrl }) => {
   const metrics = [
     {
       label: "Plan",
-      value: firstString3(
+      value: firstString5(
         creditStatus,
         ["planName"],
-        firstString3(plan, ["name"], "-")
+        firstString5(plan, ["name"], "-")
       )
     },
     { label: "Remaining", value: formatNumber3(remaining) },
-    { label: "Used", value: formatNumber3(firstNumber4(creditStatus, ["used"])) },
+    { label: "Included", value: formatNumber3(total) },
+    { label: "Used", value: formatNumber3(reportedUsed) },
     {
       label: "Top-up",
-      value: formatNumber3(firstNumber4(creditStatus, ["topUpBalance"]))
+      value: formatNumber3(firstNumber5(creditStatus, ["topUpBalance"]))
     }
   ];
   return /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", gap: 1, children: [
@@ -4058,7 +4947,7 @@ var ReportsView = ({
   const chartWidth = compact ? Math.max(24, terminalColumns - 28) : 42;
   const selectedSummary = model.selectedProjectSummary;
   const selectedStatuses = selectedSummary.reportStatuses;
-  const hasReportData = Boolean(toRecord4(state.data.reportsSummary));
+  const hasReportData = Boolean(toRecord5(state.data.reportsSummary));
   return /* @__PURE__ */ jsxs7(Box8, { flexDirection: "column", gap: 1, children: [
     /* @__PURE__ */ jsxs7(
       Box8,
@@ -4279,7 +5168,7 @@ var OverviewView = ({
   terminalColumns,
   tablePage
 }) => {
-  const connections = directArray2(state.data.connections);
+  const connections = directArray3(state.data.connections);
   const model = buildOverviewDashboardModel({
     dashboard: state.data.dashboard,
     reportsSummary: state.data.reportsSummary,
@@ -4518,23 +5407,21 @@ var WorkspaceTabBar = ({ activeTab, showBrand = false, billingSummary }) => {
     ) : null,
     /* @__PURE__ */ jsx9(Box8, { flexDirection: "row", gap: 0, flexWrap: "wrap", children: workspaceTabs.map((tab) => {
       const active = tab === activeTab;
+      const style = workspaceTabButtonStyle(active);
       return /* @__PURE__ */ jsx9(
         Box8,
         {
-          borderStyle: active ? "bold" : raisedButtonStyle.border,
-          borderColor: active ? terminalTheme.focus : terminalTheme.muted,
-          paddingX: 1,
+          borderStyle: style.borderStyle,
+          borderColor: style.borderColor,
           marginRight: 1,
-          children: /* @__PURE__ */ jsxs7(
+          children: /* @__PURE__ */ jsx9(
             Text9,
             {
-              bold: active,
-              color: active ? terminalTheme.focus : void 0,
-              children: [
-                active ? raisedButtonStyle.activeMarker : raisedButtonStyle.inactiveMarker,
-                " ",
-                workspaceTabButtonLabel(tab)
-              ]
+              bold: style.bold,
+              color: style.color,
+              backgroundColor: style.backgroundColor,
+              underline: style.underline,
+              children: workspaceTabButtonInterior(tab, active)
             }
           )
         },
@@ -4550,7 +5437,7 @@ var WorkspacePanel = (props) => {
   const state = props.state;
   const animate = props.animate ?? true;
   const framed = props.framed ?? true;
-  const connections = directArray2(state.data.connections);
+  const connections = directArray3(state.data.connections);
   const isInitialLoading = state.status === "loading";
   const isBackgroundRefreshing = Boolean(
     state.isRefreshing && !isInitialLoading
@@ -4562,7 +5449,7 @@ var WorkspacePanel = (props) => {
     ] }) }) : null,
     isInitialLoading ? /* @__PURE__ */ jsxs7(Box8, { flexDirection: "row", gap: 1, children: [
       /* @__PURE__ */ jsx9(Spinner, { type: "dots", animate }),
-      /* @__PURE__ */ jsx9(Text9, { color: terminalTheme.brand, children: "Loading real API data..." })
+      /* @__PURE__ */ jsx9(Text9, { color: terminalTheme.brand, children: "Loading workspace data..." })
     ] }) : null,
     isBackgroundRefreshing ? /* @__PURE__ */ jsxs7(Box8, { flexDirection: "row", gap: 1, children: [
       /* @__PURE__ */ jsx9(Spinner, { type: "dots", animate }),
@@ -4626,10 +5513,23 @@ var WorkspacePanel = (props) => {
       ProjectsView,
       {
         projects: props.projects,
-        selectedProject: props.selectedProject
+        selectedProject: props.selectedProject,
+        connections,
+        reportsSummary: state.data.reportsSummary,
+        compact,
+        terminalColumns: props.terminalColumns
+      }
+    ) : null,
+    props.tab === "connections" ? /* @__PURE__ */ jsx9(
+      ConnectionsView,
+      {
+        connections,
+        projects: props.projects,
+        selectedIndex: props.selectedConnectionIndex ?? 0,
+        compact,
+        terminalColumns: props.terminalColumns
       }
     ) : null,
-    props.tab === "connections" ? /* @__PURE__ */ jsx9(ConnectionsView, { connections }) : null,
     props.tab === "billing" ? /* @__PURE__ */ jsx9(
       BillingView,
       {
@@ -4658,6 +5558,20 @@ var WorkspacePanel = (props) => {
   );
 };
 
+// src/ui/workspaceSelection.ts
+var selectableWorkspaceTab = (tab) => tab === "projects" || tab === "connections";
+var nextWorkspaceSelectionIndex = ({
+  currentIndex,
+  itemCount,
+  direction
+}) => {
+  if (itemCount <= 0) {
+    return 0;
+  }
+  const normalizedCurrent = Math.min(Math.max(0, currentIndex), itemCount - 1);
+  return Math.min(Math.max(0, normalizedCurrent + direction), itemCount - 1);
+};
+
 // src/ui/animationPolicy.ts
 var truthyEnv = (value) => value !== void 0 && /^(1|true|yes|on)$/i.test(value);
 var shouldEnableTuiAnimations = ({
@@ -4671,7 +5585,7 @@ var shouldEnableTuiAnimations = ({
 };
 
 // src/ui/App.tsx
-import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
 var bootSteps = [
   "Loading config",
   "Validating auth",
@@ -4679,10 +5593,11 @@ var bootSteps = [
   "Ready"
 ];
 var defaultUser = { id: "cli-user", name: "CLI User" };
+var newDraftChatSessionKey = () => `draft-${randomUUID2()}`;
 var getUserNameFromToken = async (token) => {
   if (!token) return "You";
   try {
-    const { extractEmailFromToken } = await import("./dist-TBAQ5KOK.js");
+    const { extractEmailFromToken } = await import("./dist-AGQQPJUD.js");
     const email = extractEmailFromToken(token);
     return getFirstNameForDisplay({ email: email ?? void 0 });
   } catch {
@@ -4700,9 +5615,9 @@ var dropdownIndicator = "\u25BE";
 var bundledAgentProfiles = getBundledAgentProfiles();
 var agentProfileItems = [
   {
-    label: "Profile",
+    label: "General",
     value: "",
-    description: "Default CloudEval chat flow without an Agent Profile."
+    description: "Built-in CloudEval chat flow without a named Agent Profile."
   },
   ...bundledAgentProfiles.map((profile) => ({
     label: profile.display_name,
@@ -4790,11 +5705,27 @@ var billingHeaderFromEntitlement = (entitlement, usageSummary) => {
     plan: creditStatus.planName,
     remaining: creditStatus.remaining,
     total: creditStatus.total,
+    used: creditStatus.used,
+    reportedUsed: creditStatus.reportedUsed,
     tone: creditStatus.tone,
     status: entitlement?.effective_status
   };
 };
 var isBusyStatus = (status) => status === "connecting" || status === "thinking" || status === "streaming" || status === "tool_running" || status === "hitl_waiting";
+var buildTuiHeaderDetails = ({
+  apiBase,
+  frontendBaseUrl,
+  billingSummary,
+  userName
+}) => {
+  const displayName = truncateForTerminal(userName.trim() || "You", 64);
+  return [
+    `User: ${displayName}`,
+    `API: ${apiBase}`,
+    `Frontend: ${frontendBaseUrl}`,
+    billingSummary
+  ];
+};
 var isTerminalThinkingStatus = (status) => status === "completed" || status === "error" || status === "aborted" || status === "cancelled";
 var hasCancellableAssistantWork = (messages) => messages.some(
   (message) => message.role === "assistant" && (message.pending || message.thinkingSteps?.some((step) => !isTerminalThinkingStatus(step.status ?? "streaming")))
@@ -4890,6 +5821,35 @@ var openExternalUrl = (url) => {
   });
   child.unref();
 };
+var directArray4 = (value) => {
+  if (Array.isArray(value)) {
+    return value;
+  }
+  if (!value || typeof value !== "object") {
+    return [];
+  }
+  const record = value;
+  for (const key of ["data", "items", "rows", "results", "connections", "ledger", "invoices", "notifications", "topups"]) {
+    const candidate = record[key];
+    if (Array.isArray(candidate)) {
+      return candidate;
+    }
+  }
+  return [];
+};
+var recordLabel = (value, fallback) => {
+  if (!value || typeof value !== "object" || Array.isArray(value)) {
+    return fallback;
+  }
+  const record = value;
+  for (const key of ["name", "title", "id"]) {
+    const current = record[key];
+    if (typeof current === "string" && current.trim()) {
+      return current.trim();
+    }
+  }
+  return fallback;
+};
 var writeTableDownload = ({
   tab,
   data,
@@ -4897,27 +5857,11 @@ var writeTableDownload = ({
   selectedProject,
   tablePage
 }) => {
-  const directArray3 = (value) => {
-    if (Array.isArray(value)) {
-      return value;
-    }
-    if (!value || typeof value !== "object") {
-      return [];
-    }
-    const record = value;
-    for (const key of ["data", "items", "rows", "results", "connections", "ledger", "invoices", "notifications", "topups"]) {
-      const candidate = record[key];
-      if (Array.isArray(candidate)) {
-        return candidate;
-      }
-    }
-    return [];
-  };
   const derived = tab === "overview" ? buildOverviewDashboardModel({
     dashboard: data.dashboard,
     reportsSummary: data.reportsSummary,
     fallbackProjectCount: projects.length,
-    fallbackConnectionCount: directArray3(data.connections).length
+    fallbackConnectionCount: directArray4(data.connections).length
   }) : tab === "reports" ? buildReportsDashboardModel({
     dashboard: data.dashboard,
     reportsSummary: data.reportsSummary,
@@ -4926,18 +5870,18 @@ var writeTableDownload = ({
     wafReport: data.wafReport
   }) : {
     rows: {
-      connections: directArray3(data.connections),
-      ledger: directArray3(data.ledger),
-      invoices: directArray3(data.billingInfo),
-      topups: directArray3(data.topups),
-      notifications: directArray3(data.notifications)
+      connections: directArray4(data.connections),
+      ledger: directArray4(data.ledger),
+      invoices: directArray4(data.billingInfo),
+      topups: directArray4(data.topups),
+      notifications: directArray4(data.notifications)
     }
   };
-  const dir = resolve(process.cwd(), ".cloudeval-downloads");
-  mkdirSync(dir, { recursive: true });
+  const dir = resolve2(process.cwd(), ".cloudeval-downloads");
+  mkdirSync2(dir, { recursive: true });
   const timestamp = (/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-");
-  const file = join(dir, `${tab}-tables-${timestamp}.json`);
-  writeFileSync(
+  const file = join2(dir, `${tab}-tables-${timestamp}.json`);
+  writeFileSync2(
     file,
     `${JSON.stringify(
       {
@@ -4980,12 +5924,17 @@ var estimatePromptPanelRows = ({
   suggestionRows,
   compact,
   hasThinkingSteps,
-  includeControls = true
+  includeControls = true,
+  variant = "panel"
 }) => {
-  const outerChromeRows = 2;
-  const inputRowsWithHint = inputRows + 1;
-  const footerRows = includeControls ? 1 + estimatePromptControlRows({ compact, hasThinkingSteps }) : 0;
-  return outerChromeRows + suggestionRows + inputRowsWithHint + footerRows;
+  const controlRows = includeControls ? 1 + estimatePromptControlRows({ compact, hasThinkingSteps }) : 0;
+  return estimateComposerRows({
+    inputRows,
+    suggestionRows,
+    includeControls,
+    controlRows,
+    variant
+  });
 };
 var useTerminalSize = () => {
   const [size, setSize] = useState4(() => readTerminalSize());
@@ -5129,6 +6078,24 @@ var QueuePanel = ({ messages, compact, terminalColumns }) => {
     }
   );
 };
+var artifactToneColor = (tone) => {
+  if (tone === "brand") return terminalTheme.brand;
+  if (tone === "success") return terminalTheme.success;
+  if (tone === "warning") return terminalTheme.warning;
+  if (tone === "danger") return terminalTheme.danger;
+  return void 0;
+};
+var ArtifactStrip = ({ chips, compact = false, terminalColumns }) => {
+  if (!chips.length) {
+    return null;
+  }
+  const valueLimit = compact ? Math.max(10, terminalColumns - 15) : 24;
+  return /* @__PURE__ */ jsx10(Box9, { flexDirection: compact ? "column" : "row", gap: compact ? 0 : 1, flexWrap: "wrap", children: chips.map((chip) => /* @__PURE__ */ jsxs8(Text10, { children: [
+    /* @__PURE__ */ jsx10(Text10, { color: artifactToneColor(chip.tone), bold: true, children: chip.label }),
+    /* @__PURE__ */ jsx10(Text10, { dimColor: true, children: " " }),
+    /* @__PURE__ */ jsx10(Text10, { color: artifactToneColor(chip.tone), children: truncateForTerminal(chip.value, valueLimit) })
+  ] }, `${chip.label}-${chip.value}`)) });
+};
 var PromptControlBar = ({
   focused,
   selectedThreadTitle,
@@ -5178,7 +6145,8 @@ var PromptControlBar = ({
               return /* @__PURE__ */ jsxs8(
                 Text10,
                 {
-                  color: isFocused ? terminalTheme.focus : void 0,
+                  color: isFocused ? "white" : void 0,
+                  backgroundColor: isFocused ? terminalTheme.selectedBackground : void 0,
                   bold: isFocused,
                   wrap: "truncate",
                   children: [
@@ -5203,7 +6171,8 @@ var PromptControlBar = ({
         hasThinkingSteps ? /* @__PURE__ */ jsxs8(
           Text10,
           {
-            color: focused === "thinking" ? terminalTheme.focus : void 0,
+            color: focused === "thinking" ? "white" : void 0,
+            backgroundColor: focused === "thinking" ? terminalTheme.selectedBackground : void 0,
             bold: focused === "thinking",
             wrap: "truncate",
             children: [
@@ -5222,7 +6191,7 @@ var PromptControlBar = ({
     ] });
   }
   return /* @__PURE__ */ jsxs8(Box9, { flexDirection: "column", gap: 0, children: [
-    /* @__PURE__ */ jsx10(Text10, { dimColor: true, children: "Settings" }),
+    /* @__PURE__ */ jsx10(Text10, { dimColor: true, children: "Command context" }),
     /* @__PURE__ */ jsxs8(Box9, { flexDirection: compact ? "column" : "row", gap: controlGap, flexWrap: "wrap", children: [
       selectorOrder.map((kind) => {
         const isFocused = focused === kind;
@@ -5243,15 +6212,23 @@ var PromptControlBar = ({
             borderStyle: raisedButtonStyle.border,
             borderColor: isFocused ? terminalTheme.focus : terminalTheme.muted,
             paddingX: 1,
-            children: /* @__PURE__ */ jsxs8(Text10, { color: isFocused ? terminalTheme.focus : void 0, bold: isFocused, children: [
-              isFocused ? raisedButtonStyle.activeMarker : raisedButtonStyle.inactiveMarker,
-              " ",
-              label,
-              " [",
-              value,
-              "] ",
-              dropdownIndicator
-            ] })
+            children: /* @__PURE__ */ jsxs8(
+              Text10,
+              {
+                color: isFocused ? "white" : void 0,
+                backgroundColor: isFocused ? terminalTheme.selectedBackground : void 0,
+                bold: isFocused,
+                children: [
+                  isFocused ? raisedButtonStyle.activeMarker : raisedButtonStyle.inactiveMarker,
+                  " ",
+                  label,
+                  " [",
+                  value,
+                  "] ",
+                  dropdownIndicator
+                ]
+              }
+            )
           },
           kind
         );
@@ -5265,7 +6242,8 @@ var PromptControlBar = ({
           children: /* @__PURE__ */ jsxs8(
             Text10,
             {
-              color: focused === "thinking" ? terminalTheme.focus : void 0,
+              color: focused === "thinking" ? "white" : void 0,
+              backgroundColor: focused === "thinking" ? terminalTheme.selectedBackground : void 0,
               bold: focused === "thinking",
               children: [
                 focused === "thinking" ? raisedButtonStyle.activeMarker : raisedButtonStyle.inactiveMarker,
@@ -5287,8 +6265,10 @@ var PromptControlBar = ({
 var ChatContextPanel = ({
   width,
   height,
+  mode,
   active,
   focused,
+  artifactChips,
   selectedProject,
   selectedThreadTitle,
   selectedModel,
@@ -5302,50 +6282,82 @@ var ChatContextPanel = ({
   busy,
   animate
 }) => {
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsxs8(
     TitledBox,
     {
-      title: "Settings",
+      title: "Context",
       borderStyle: "round",
       borderColor: active ? terminalTheme.focus : terminalTheme.muted,
-      padding: 1,
+      padding: mode === "medium" ? 0 : 1,
+      paddingX: 1,
       width,
       height,
-      children: /* @__PURE__ */ jsx10(
-        PromptControlBar,
-        {
-          focused,
-          selectedThreadTitle,
-          selectedProject,
-          selectedModel,
-          selectedMode,
-          selectedAgentProfileLabel,
-          hasThinkingSteps,
-          thinkingExpanded,
-          thinkingSummary,
-          compact: true,
-          terminalColumns: Math.max(24, width - 4),
-          statusText,
-          statusColor,
-          busy,
-          animate
-        }
-      )
+      children: [
+        artifactChips.length ? /* @__PURE__ */ jsxs8(Box9, { flexDirection: "column", marginBottom: 1, children: [
+          /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.brand, children: "Artifacts" }),
+          /* @__PURE__ */ jsx10(
+            ArtifactStrip,
+            {
+              chips: artifactChips,
+              compact: true,
+              terminalColumns: Math.max(24, width - 4)
+            }
+          )
+        ] }) : null,
+        /* @__PURE__ */ jsx10(
+          PromptControlBar,
+          {
+            focused,
+            selectedThreadTitle,
+            selectedProject,
+            selectedModel,
+            selectedMode,
+            selectedAgentProfileLabel,
+            hasThinkingSteps,
+            thinkingExpanded,
+            thinkingSummary,
+            compact: true,
+            terminalColumns: Math.max(24, width - 4),
+            statusText,
+            statusColor,
+            busy,
+            animate
+          }
+        )
+      ]
     }
   );
 };
 var BottomControls = ({ tab }) => /* @__PURE__ */ jsxs8(Box9, { flexDirection: "row", justifyContent: "space-between", children: [
   /* @__PURE__ */ jsxs8(Text10, { dimColor: true, children: [
-    /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.brand, bold: true, children: "Keys" }),
-    /* @__PURE__ */ jsx10(Text10, { children: " \u2191/\u2193 move or scroll | PgUp/PgDn scroll | [/] table page | " }),
-    /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.brand, bold: true, children: "D" }),
-    /* @__PURE__ */ jsx10(Text10, { children: " download | " }),
-    /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.brand, bold: true, children: "R" }),
-    /* @__PURE__ */ jsx10(Text10, { children: " refresh | " }),
-    /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.brand, bold: true, children: "O" }),
-    /* @__PURE__ */ jsx10(Text10, { children: " open | " }),
-    /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.brand, bold: true, children: "C" }),
-    /* @__PURE__ */ jsx10(Text10, { children: " chat" })
+    /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "\u2303Q" }),
+    /* @__PURE__ */ jsx10(Text10, { children: " Quit  " }),
+    /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "\u2303T" }),
+    /* @__PURE__ */ jsx10(Text10, { children: " Tabs  " }),
+    tab === "chat" ? /* @__PURE__ */ jsxs8(Fragment3, { children: [
+      /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "Y" }),
+      /* @__PURE__ */ jsx10(Text10, { children: " Copy  " }),
+      /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "D" }),
+      /* @__PURE__ */ jsx10(Text10, { children: " Download  " }),
+      /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "O" }),
+      /* @__PURE__ */ jsx10(Text10, { children: " Open  " }),
+      /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.brand, children: "/ Commands" })
+    ] }) : /* @__PURE__ */ jsxs8(Fragment3, { children: [
+      /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "R" }),
+      /* @__PURE__ */ jsx10(Text10, { children: " Refresh  " }),
+      /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "O" }),
+      /* @__PURE__ */ jsx10(Text10, { children: " Open  " }),
+      /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "D" }),
+      /* @__PURE__ */ jsx10(Text10, { children: " Download  " }),
+      tab === "projects" || tab === "connections" ? /* @__PURE__ */ jsxs8(Fragment3, { children: [
+        /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "\u2191\u2193/J/K" }),
+        /* @__PURE__ */ jsx10(Text10, { children: " Select  " }),
+        /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "Enter" }),
+        /* @__PURE__ */ jsx10(Text10, { children: " Confirm  " })
+      ] }) : null,
+      /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.accent, bold: true, children: "[/]" }),
+      /* @__PURE__ */ jsx10(Text10, { children: " Page" })
+    ] })
   ] }),
   tab === "reports" ? /* @__PURE__ */ jsxs8(Text10, { dimColor: true, children: [
     /* @__PURE__ */ jsx10(Text10, { color: terminalTheme.brand, bold: true, children: "Reports" }),
@@ -5443,6 +6455,10 @@ var App = ({
     threadId: conversationId,
     debug
   });
+  const [activeDraftSessionKey, setActiveDraftSessionKey] = useState4(
+    () => conversationId ? void 0 : newDraftChatSessionKey()
+  );
+  const [draftChatSessions, setDraftChatSessions] = useState4({});
   const [projects, setProjects] = useState4([]);
   const [selectedProject, setSelectedProject] = useState4(null);
   const [selectedModel, setSelectedModel] = useState4(model ?? "");
@@ -5455,6 +6471,7 @@ var App = ({
     createWorkspacePanelStateMap
   );
   const [tablePageByTab, setTablePageByTab] = useState4({});
+  const [selectedConnectionIndex, setSelectedConnectionIndex] = useState4(0);
   const [workspaceRefreshKeys, setWorkspaceRefreshKeys] = useState4({});
   const [workspaceStaleTick, setWorkspaceStaleTick] = useState4(0);
   const [modelItems, setModelItems] = useState4(() => {
@@ -5485,6 +6502,7 @@ var App = ({
   const [scrollOffset, setScrollOffset] = useState4(0);
   const [contentHeight, setContentHeight] = useState4(0);
   const [viewportHeight, setViewportHeight] = useState4(20);
+  const [slashCommandCompletionIndex, setSlashCommandCompletionIndex] = useState4(0);
   const [workspaceScrollOffset, setWorkspaceScrollOffset] = useState4(0);
   const [workspaceContentHeight, setWorkspaceContentHeight] = useState4(0);
   const [workspaceViewportHeight, setWorkspaceViewportHeight] = useState4(14);
@@ -5500,7 +6518,7 @@ var App = ({
     () => bundledAgentProfiles.find((profile) => profile.id === selectedAgentProfileId),
     [selectedAgentProfileId]
   );
-  const selectedAgentProfileLabel = selectedAgentProfile?.display_name ?? "Profile";
+  const selectedAgentProfileLabel = selectedAgentProfile?.display_name ?? "General";
   const frontendThreadUrl = useMemo(
     () => buildFrontendThreadUrl(frontendBaseUrl, chatState.threadId),
     [frontendBaseUrl, chatState.threadId]
@@ -5555,6 +6573,17 @@ var App = ({
     () => remoteThreads.find((thread) => thread.thread_id === chatState.threadId),
     [chatState.threadId, remoteThreads]
   );
+  const draftThreadSummaries = useMemo(
+    () => Object.values(draftChatSessions).map(
+      (draft) => buildDraftThreadSummary({
+        key: draft.key,
+        state: draft.state,
+        projectName: draft.projectName,
+        updatedAt: draft.updatedAt
+      })
+    ).filter((draft) => Boolean(draft)),
+    [draftChatSessions]
+  );
   const selectedThreadTitle = useMemo(
     () => threadPanelTitle({
       session: selectedLocalSession,
@@ -5565,8 +6594,10 @@ var App = ({
     [chatState.messages.length, chatState.threadId, selectedLocalSession, selectedRemoteThread]
   );
   const threadSelectItems = useMemo(
-    () => buildThreadSelectItems(localSessions, chatState.threadId, remoteThreads),
-    [chatState.threadId, localSessions, remoteThreads]
+    () => buildThreadSelectItems(localSessions, chatState.threadId, remoteThreads, {
+      drafts: draftThreadSummaries
+    }),
+    [chatState.threadId, draftThreadSummaries, localSessions, remoteThreads]
   );
   const checkHealth = useMemo(() => {
     return async (token) => {
@@ -5602,7 +6633,7 @@ var App = ({
       modes: modeItems,
       threads: threadSelectItems.map((item) => ({
         label: item.label,
-        value: item.value.kind === "remote" ? item.value.thread.thread_id : item.value.kind === "session" ? item.value.session.threadId : "new",
+        value: item.value.kind === "remote" ? item.value.thread.thread_id : item.value.kind === "session" ? item.value.session.threadId : item.value.kind === "draft" ? item.value.draft.key : "new",
         description: item.description
       })),
       profiles: agentProfileItems
@@ -5691,6 +6722,7 @@ var App = ({
         threadId: session.threadId,
         messages
       }));
+      setActiveDraftSessionKey(void 0);
       if (session.model) {
         setSelectedModel(session.model);
       }
@@ -5738,6 +6770,7 @@ var App = ({
         threadId,
         messages
       }));
+      setActiveDraftSessionKey(void 0);
       const nextModel = history.model || history.thread_head?.model || thread.model;
       if (nextModel) {
         setSelectedModel(nextModel);
@@ -5764,11 +6797,33 @@ var App = ({
     },
     [loadRemoteThreadHistory, projects]
   );
+  const restoreDraftThread = React8.useCallback((key) => {
+    const draft = draftChatSessions[key];
+    if (!draft) {
+      setNotice("Open session was not found.");
+      return;
+    }
+    if (isBusyStatus(chatState.status) || controllerRef.current) {
+      setNotice("Stop the running response before switching sessions.");
+      return;
+    }
+    setActiveDraftSessionKey(key);
+    setChatState((prev) => ({
+      ...draft.state,
+      debug: prev.debug
+    }));
+    setActiveSelector(null);
+    autoExpandedThinkingMessageIdsRef.current.clear();
+    setExpandedThinkingMessageIds(/* @__PURE__ */ new Set());
+    setNotice(`Loaded open session: ${truncateForTerminal(draft.state.threadId ?? key, 90)}`);
+    setTimeout(() => scrollViewRef.current?.scrollToBottom(), 0);
+  }, [chatState.status, draftChatSessions]);
   const startNewThread = React8.useCallback(() => {
     if (isBusyStatus(chatState.status) || controllerRef.current) {
-      setNotice("Stop the running response before switching threads.");
+      setNotice("Stop the running response before starting another session.");
       return;
     }
+    setActiveDraftSessionKey(newDraftChatSessionKey());
     queueRef.current = [];
     setQueuedMessages([]);
     setChatState((prev) => ({
@@ -5792,7 +6847,11 @@ var App = ({
         return;
       }
       if (isBusyStatus(chatState.status) || controllerRef.current) {
-        setNotice("Stop the running response before switching threads.");
+        setNotice("Stop the running response before switching sessions.");
+        return;
+      }
+      if (choice.kind === "draft") {
+        restoreDraftThread(choice.draft.key);
         return;
       }
       if (choice.kind === "remote") {
@@ -5803,7 +6862,7 @@ var App = ({
       }
       restoreLocalSession(choice.session);
     },
-    [chatState.status, restoreLocalSession, restoreRemoteThread, startNewThread]
+    [chatState.status, restoreDraftThread, restoreLocalSession, restoreRemoteThread, startNewThread]
   );
   const selectProjectForUser = async (token, user) => {
     setLoadingProjects(true);
@@ -5844,6 +6903,24 @@ var App = ({
       controllerRef.current?.abort("App unmounted");
     };
   }, []);
+  useEffect4(() => {
+    if (!activeDraftSessionKey) {
+      return;
+    }
+    const hasLocalContent = Boolean(chatState.threadId) || chatState.messages.some((message) => message.content.trim());
+    if (!hasLocalContent) {
+      return;
+    }
+    setDraftChatSessions((current) => ({
+      ...current,
+      [activeDraftSessionKey]: {
+        key: activeDraftSessionKey,
+        state: chatState,
+        projectName: selectedProject?.name,
+        updatedAt: Date.now()
+      }
+    }));
+  }, [activeDraftSessionKey, chatState, selectedProject?.name]);
   useEffect4(() => {
     if (phase !== "ready") {
       return;
@@ -5964,7 +7041,7 @@ var App = ({
             setIsLoggingIn(true);
             setLoaderStep(1);
             try {
-              const { login } = await import("./dist-TBAQ5KOK.js");
+              const { login } = await import("./dist-AGQQPJUD.js");
               const newToken = await login(baseUrl, {
                 headless: Boolean(process.env.SSH_TTY || process.env.CI)
               });
@@ -6095,7 +7172,7 @@ var App = ({
     if (!loadReason) {
       return;
     }
-    if (tab === "chat" || tab === "projects" || tab === "options" || tab === "help") {
+    if (tab === "chat" || tab === "options" || tab === "help") {
       const now = Date.now();
       setWorkspacePanelTabState(tab, (previous) => ({
         ...previous,
@@ -6470,7 +7547,36 @@ var App = ({
       setNotice(`Profile selected: ${label}. Mode set to Agent.`);
       return;
     }
-    setNotice("Agent Profile cleared. Default chat flow active.");
+    setNotice("Agent Profile cleared. General chat flow active.");
+  };
+  const copyLatestAssistantResponse = () => {
+    const text = buildLatestAssistantResponseText(chatState.messages);
+    if (!text) {
+      setNotice("No assistant response to copy yet.");
+      return;
+    }
+    try {
+      copyTextToClipboard(text);
+      setNotice("Copied latest response with numbered citations.");
+    } catch (error) {
+      setNotice(`Copy failed: ${error?.message ?? "clipboard unavailable"}`);
+    }
+  };
+  const downloadChatTranscript = () => {
+    if (!chatState.messages.some((message) => message.content.trim())) {
+      setNotice("No chat transcript to download yet.");
+      return;
+    }
+    try {
+      const file = writeChatTranscriptDownload({
+        messages: chatState.messages,
+        userName,
+        threadId: chatState.threadId
+      });
+      setNotice(`Downloaded chat transcript: ${file}`);
+    } catch (error) {
+      setNotice(`Failed to download chat transcript: ${error?.message ?? "Unknown error"}`);
+    }
   };
   const handlePromptSubmit = (value) => {
     const cleanedValue = sanitizeTerminalMultilineInput(value);
@@ -6498,6 +7604,13 @@ var App = ({
             selectThread({ kind: "remote", thread: remoteThread });
             return;
           }
+          const draftThread = draftThreadSummaries.find(
+            (candidate) => candidate.key === promptCommand.threadId
+          );
+          if (draftThread) {
+            selectThread({ kind: "draft", draft: draftThread });
+            return;
+          }
           const session = localSessions.find(
             (candidate) => candidate.threadId === promptCommand.threadId
           );
@@ -6533,6 +7646,12 @@ var App = ({
         case "openFrontend":
           handleOpenFrontend();
           return;
+        case "copyLatestResponse":
+          copyLatestAssistantResponse();
+          return;
+        case "downloadTranscript":
+          downloadChatTranscript();
+          return;
         case "showHelp":
           setActiveWorkspaceTab("help");
           setNotice(void 0);
@@ -6608,6 +7727,7 @@ var App = ({
         return;
       }
     }
+    const draftKeyAtStart = activeDraftSessionKey;
     const threadId = chatState.threadId ?? randomUUID2();
     const now = Date.now();
     const userMessage = options.hitlResume || options.queuedMessageId ? void 0 : {
@@ -6765,6 +7885,16 @@ var App = ({
               model: selectedModel,
               profile: configProfile
             });
+            if (draftKeyAtStart) {
+              setDraftChatSessions((current) => {
+                const next = { ...current };
+                delete next[draftKeyAtStart];
+                return next;
+              });
+              setActiveDraftSessionKey(
+                (current) => current === draftKeyAtStart ? void 0 : current
+              );
+            }
             void refreshLocalSessions().catch(() => void 0);
             void refreshRemoteThreads().catch(() => void 0);
           } catch (error) {
@@ -6830,9 +7960,20 @@ var App = ({
     0,
     terminalSize.columns < 110 ? 3 : 4
   );
+  const slashCommandCompletions = useMemo(
+    () => buildSlashCommandCompletionItems(input),
+    [input]
+  );
+  const activeSlashCommandCompletionIndex = slashCommandCompletions.length ? Math.min(slashCommandCompletionIndex, slashCommandCompletions.length - 1) : void 0;
+  const activeSlashCommandCompletion = activeSlashCommandCompletionIndex === void 0 ? void 0 : slashCommandCompletions[activeSlashCommandCompletionIndex];
+  const slashCommandCompletionsActive = promptInputActive && activeWorkspaceTab === "chat" && !activeSelector && !isSearching && slashCommandCompletions.length > 0;
   const promptGhostSuffix = useMemo(() => {
     const trimmedStart = input.trimStart();
     if (trimmedStart.startsWith("/")) {
+      const commandGhost = slashCommandGhostSuffix(input, activeSlashCommandCompletion);
+      if (commandGhost) {
+        return commandGhost;
+      }
       return completePromptInput(input, promptCompletionContext)?.ghostSuffix;
     }
     for (const suggestion of visiblePromptSuggestions) {
@@ -6844,7 +7985,7 @@ var App = ({
       return visiblePromptSuggestions[0];
     }
     return void 0;
-  }, [input, promptCompletionContext, visiblePromptSuggestions]);
+  }, [activeSlashCommandCompletion, input, promptCompletionContext, visiblePromptSuggestions]);
   const promptInputWidth = Math.max(20, terminalSize.columns - 14);
   const promptInputRowBudget = getPromptInputRowBudget(terminalSize);
   const promptInputViewport = getInputViewport({
@@ -6855,11 +7996,12 @@ var App = ({
     scrollOffset: promptInputScrollOffset
   });
   const promptInputRows = promptInputViewport.visibleRowCount;
-  const promptSuggestionRows = estimatePromptSuggestionRows(
-    visiblePromptSuggestions.length
-  );
+  const promptCommandCompletionRows = slashCommandCompletions.length ? 1 : 0;
+  const promptSuggestionRows = estimatePromptSuggestionRows(visiblePromptSuggestions.length) + promptCommandCompletionRows;
+  const chatResponsiveMode = getChatResponsiveMode(terminalSize);
   const splitChatLayout = shouldUseSplitChatLayout(terminalSize);
   const promptControlsCompact = terminalSize.columns < 96;
+  const promptFooterControlsVisible = !slashCommandCompletionsActive;
   const focusedFollowUpIndex = focusFollowUpIndex(focusedControl);
   const activeChatPanel = chatPanelFocusForControl(focusedControl);
   const controlFocusOrder = buildControlFocusOrder({
@@ -6883,18 +8025,19 @@ var App = ({
   const bannerDisabled = bannerDisabledByConfig || !tuiLayout.showBanner;
   const bannerContentColumns = Math.max(1, terminalSize.columns - tuiLayout.paddingX * 2);
   const billingSummary = billingHeaderError ? `Plan: unavailable | Credits: unavailable` : billingSummaryText(billingHeader);
-  const headerDetails = [
-    `API: ${apiBase}`,
-    `Frontend: ${frontendBaseUrl}`,
-    billingSummary
-  ];
+  const headerDetails = buildTuiHeaderDetails({
+    apiBase,
+    frontendBaseUrl,
+    billingSummary,
+    userName
+  });
   const keyBindings = getTuiKeyBindings();
   const scrollHelp = mouseTrackingEnabled ? `${keyBindings.mouse} | wheel scroll` : keyBindings.scroll;
   const chatAvailableWidth = Math.max(
     24,
     terminalSize.columns - tuiLayout.paddingX * 2
   );
-  const chatContextPanelWidth = splitChatLayout ? Math.min(44, Math.max(34, Math.floor(chatAvailableWidth * 0.24))) : 0;
+  const chatContextPanelWidth = splitChatLayout ? getContextRailWidth(terminalSize) : 0;
   const chatSplitGap = splitChatLayout ? 1 : 0;
   const chatThreadPanelWidth = splitChatLayout ? Math.max(60, chatAvailableWidth - chatContextPanelWidth - chatSplitGap) : void 0;
   const threadContentWidth = Math.max(
@@ -6902,6 +8045,92 @@ var App = ({
     splitChatLayout ? (chatThreadPanelWidth ?? chatAvailableWidth) - 8 : chatAvailableWidth - 8
   );
   const activeWorkspacePanelState = workspacePanelStore[activeWorkspaceTab] ?? createWorkspacePanelState(activeWorkspaceTab, "loading");
+  const activeConnections = directArray4(activeWorkspacePanelState.data.connections);
+  const activeProjectList = projects.length ? projects : [selectedProject ?? defaultProject];
+  const selectedProjectIndex = Math.max(
+    0,
+    activeProjectList.findIndex(
+      (project) => project.id === (selectedProject ?? activeProjectList[0])?.id
+    )
+  );
+  const moveSelectedProject = React8.useCallback(
+    (direction) => {
+      const nextIndex = nextWorkspaceSelectionIndex({
+        currentIndex: selectedProjectIndex,
+        itemCount: activeProjectList.length,
+        direction
+      });
+      const project = activeProjectList[nextIndex];
+      if (!project) {
+        setNotice("No project rows are available to select.");
+        return;
+      }
+      setSelectedProject(project);
+      setNotice(`Project selected: ${truncateForTerminal(project.name, 80)}`);
+    },
+    [activeProjectList, selectedProjectIndex]
+  );
+  const moveSelectedConnection = React8.useCallback(
+    (direction) => {
+      setSelectedConnectionIndex((current) => {
+        const next = nextWorkspaceSelectionIndex({
+          currentIndex: current,
+          itemCount: activeConnections.length,
+          direction
+        });
+        const selected = activeConnections[next];
+        if (selected) {
+          setNotice(
+            `Connection selected: ${truncateForTerminal(recordLabel(selected, "connection"), 80)}`
+          );
+        } else {
+          setNotice("No connection rows are available to select.");
+        }
+        return next;
+      });
+    },
+    [activeConnections]
+  );
+  useEffect4(() => {
+    setSelectedConnectionIndex(
+      (current) => activeConnections.length ? Math.min(Math.max(0, current), activeConnections.length - 1) : 0
+    );
+  }, [activeConnections.length]);
+  useEffect4(() => {
+    setSlashCommandCompletionIndex(0);
+  }, [input]);
+  useEffect4(() => {
+    setSlashCommandCompletionIndex(
+      (current) => slashCommandCompletions.length ? Math.min(current, slashCommandCompletions.length - 1) : 0
+    );
+  }, [slashCommandCompletions.length]);
+  const reportsPanelState = workspacePanelStore.reports ?? createWorkspacePanelState("reports", "idle");
+  const reportsDashboardModel = useMemo(
+    () => reportsPanelState.status === "ready" ? buildReportsDashboardModel({
+      dashboard: reportsPanelState.data.dashboard,
+      reportsSummary: reportsPanelState.data.reportsSummary,
+      selectedProject,
+      costReport: reportsPanelState.data.costReport,
+      wafReport: reportsPanelState.data.wafReport
+    }) : void 0,
+    [reportsPanelState.data, reportsPanelState.status, selectedProject]
+  );
+  const chatArtifactChips = useMemo(
+    () => buildChatArtifactChips({
+      projectName: selectedProject?.name ?? defaultProject.name,
+      reportsStatus: reportsPanelState.status,
+      coverageLabel: reportsDashboardModel?.coverageLabel,
+      topActionCount: reportsDashboardModel?.topActions.length ?? 0,
+      frontendThreadUrl
+    }),
+    [
+      frontendThreadUrl,
+      reportsDashboardModel?.coverageLabel,
+      reportsDashboardModel?.topActions.length,
+      reportsPanelState.status,
+      selectedProject?.name
+    ]
+  );
   const activeTablePage = tablePageByTab[activeWorkspaceTab] ?? 0;
   const bannerRenderedRows = bannerDisabled ? 0 : estimateBannerRows({ detailsCount: headerDetails.length, columns: bannerContentColumns });
   const workspaceContentWidth = Math.max(24, terminalSize.columns - tuiLayout.paddingX * 2 - 3);
@@ -6943,7 +8172,8 @@ var App = ({
     suggestionRows: promptSuggestionRows,
     compact: promptControlsCompact,
     hasThinkingSteps,
-    includeControls: !splitChatLayout
+    includeControls: !splitChatLayout && promptFooterControlsVisible,
+    variant: "dock"
   });
   const searchPromptPanelRows = estimatePromptPanelRows({
     inputRows: promptInputRows,
@@ -6971,6 +8201,7 @@ var App = ({
     footerRows: chatFooterRows
   });
   const chatMiddleAuxiliaryRows = (isSearching ? 3 : 0) + (queuedMessages.length > 0 ? 4 : 0) + (notice ? 1 : 0) + (errorText ? 5 : 0) + (chatState.status === "hitl_waiting" && chatState.hitl?.waiting ? 7 : 0) + (activeSelector ? tuiLayout.selectorLimit + 4 : 0);
+  const contextRailArtifactRows = splitChatLayout && chatArtifactChips.length ? chatArtifactChips.length + 2 : 0;
   const chatMainPanelRows = Math.max(4, chatMiddleViewportRows - chatMiddleAuxiliaryRows);
   const chatThreadHeight = getFramedBodyRows(chatMainPanelRows);
   const chatMiddleOverflowing = chatMiddleContentHeight > chatMiddleViewportHeight;
@@ -6980,9 +8211,10 @@ var App = ({
         return Math.max(1, terminalSize.rows - (promptControlsCompact ? 7 : 5));
       }
       const auxiliaryRows = (isSearching ? 3 : 0) + (queuedMessages.length > 0 ? 4 : 0) + (notice ? 1 : 0) + (errorText ? 5 : 0);
-      return workspaceTabStartRow + 9 + auxiliaryRows;
+      return workspaceTabStartRow + 9 + auxiliaryRows + contextRailArtifactRows;
     },
     [
+      contextRailArtifactRows,
       errorText,
       isSearching,
       notice,
@@ -7019,7 +8251,8 @@ var App = ({
         suggestionRows: promptSuggestionRows,
         compact: promptControlsCompact,
         hasThinkingSteps,
-        includeControls: !splitChatLayout
+        includeControls: !splitChatLayout && promptFooterControlsVisible,
+        variant: "dock"
       }) + 1
     ),
     [
@@ -7028,6 +8261,7 @@ var App = ({
       promptSuggestionRows,
       terminalSize.rows,
       promptControlsCompact,
+      promptFooterControlsVisible,
       splitChatLayout
     ]
   );
@@ -7069,6 +8303,20 @@ var App = ({
     }
     void sendMessage(question);
   };
+  const chooseSlashCommandCompletion = (command) => {
+    completionCycleRef.current = void 0;
+    setSlashCommandCompletionIndex(0);
+    handlePromptSubmit(command.name);
+  };
+  const moveSlashCommandCompletion = (direction) => {
+    if (!slashCommandCompletions.length) {
+      return;
+    }
+    completionCycleRef.current = void 0;
+    setSlashCommandCompletionIndex(
+      (current) => (current + direction + slashCommandCompletions.length) % slashCommandCompletions.length
+    );
+  };
   const handleFocusedControlEnter = () => {
     if (isSelectorControlFocus(focusedControl)) {
       setActiveSelector(focusedControl);
@@ -7216,6 +8464,29 @@ var App = ({
           exit();
           return;
         }
+        const selectionDirection = key.downArrow || lowerInput === "j" ? 1 : key.upArrow || lowerInput === "k" ? -1 : void 0;
+        if (selectionDirection && selectableWorkspaceTab(activeWorkspaceTab) && !key.ctrl && !key.meta) {
+          if (activeWorkspaceTab === "projects") {
+            moveSelectedProject(selectionDirection);
+          } else {
+            moveSelectedConnection(selectionDirection);
+          }
+          return;
+        }
+        if (key.return && selectableWorkspaceTab(activeWorkspaceTab)) {
+          if (activeWorkspaceTab === "projects") {
+            const project = activeProjectList[selectedProjectIndex];
+            setNotice(
+              project ? `Project selected for chat context: ${truncateForTerminal(project.name, 80)}` : "No project rows are available to select."
+            );
+          } else {
+            const connection = activeConnections[selectedConnectionIndex];
+            setNotice(
+              connection ? `Connection selected: ${truncateForTerminal(recordLabel(connection, "connection"), 80)}` : "No connection rows are available to select."
+            );
+          }
+          return;
+        }
         if (key.upArrow && !key.ctrl && !key.meta) {
           workspaceScrollViewRef.current?.scrollBy(-1);
           return;
@@ -7325,7 +8596,15 @@ var App = ({
         }
         return;
       }
-      if (promptInputActive && (key.tab || inputKey === "	") && input.trimStart().startsWith("/")) {
+      if (slashCommandCompletionsActive && (key.tab || inputKey === "	" || key.downArrow) && !key.ctrl && !key.meta) {
+        moveSlashCommandCompletion(1);
+        return;
+      }
+      if (slashCommandCompletionsActive && key.upArrow && !key.ctrl && !key.meta) {
+        moveSlashCommandCompletion(-1);
+        return;
+      }
+      if (promptInputActive && (key.tab || inputKey === "	") && input.trimStart().startsWith("/") && !slashCommandCompletionsActive) {
         const completion = completePromptInput(
           input,
           promptCompletionContext,
@@ -7399,6 +8678,20 @@ var App = ({
           return;
         }
       }
+      if (phase === "ready" && activeWorkspaceTab === "chat" && !promptInputActive && !activeSelector && !isSearching) {
+        if (lowerInput === "y") {
+          copyLatestAssistantResponse();
+          return;
+        }
+        if (lowerInput === "d") {
+          downloadChatTranscript();
+          return;
+        }
+        if (lowerInput === "o") {
+          handleOpenFrontend();
+          return;
+        }
+      }
       if (phase === "ready" && (!input.trim() || !promptInputActive)) {
         if (key.tab || inputKey === "	") {
           setFocusedControl((current) => nextControlFocus(current, controlFocusOrder));
@@ -7527,6 +8820,7 @@ var App = ({
         stopActiveChat();
       }
       if (key.ctrl && inputKey.toLowerCase() === "l") {
+        setActiveDraftSessionKey(newDraftChatSessionKey());
         setChatState((prev) => ({
           ...initialChatState,
           status: "idle",
@@ -7740,6 +9034,7 @@ var App = ({
                     state: activeWorkspacePanelState,
                     projects,
                     selectedProject,
+                    selectedConnectionIndex,
                     currentUserId,
                     selectedModel,
                     selectedMode,
@@ -7856,14 +9151,23 @@ var App = ({
                     ]
                   }
                 ) : null,
+                !splitChatLayout && chatArtifactChips.length ? /* @__PURE__ */ jsx10(Box9, { marginTop: 1, children: /* @__PURE__ */ jsx10(
+                  ArtifactStrip,
+                  {
+                    chips: chatArtifactChips,
+                    terminalColumns: chatAvailableWidth
+                  }
+                ) }) : null,
                 splitChatLayout ? /* @__PURE__ */ jsxs8(Box9, { flexDirection: "row", columnGap: chatSplitGap, children: [
                   /* @__PURE__ */ jsx10(
                     ChatContextPanel,
                     {
                       width: chatContextPanelWidth,
                       height: chatMainPanelRows,
+                      mode: chatResponsiveMode,
                       active: activeChatPanel === "settings",
                       focused: focusedControl,
+                      artifactChips: chatArtifactChips,
                       selectedThreadTitle,
                       selectedProject,
                       selectedModel,
@@ -7904,7 +9208,7 @@ var App = ({
                     selectedIndex: Math.max(
                       0,
                       threadSelectItems.findIndex(
-                        (item) => item.value.kind === "remote" && item.value.thread.thread_id === chatState.threadId || item.value.kind === "session" && item.value.session.threadId === chatState.threadId
+                        (item) => item.value.kind === "remote" && item.value.thread.thread_id === chatState.threadId || item.value.kind === "session" && item.value.session.threadId === chatState.threadId || item.value.kind === "draft" && item.value.draft.key === activeDraftSessionKey
                       )
                     ),
                     onSubmit: (item) => selectThread(item.value),
@@ -8023,6 +9327,7 @@ var App = ({
     ) : activeSelector ? null : /* @__PURE__ */ jsx10(
       InputBox,
       {
+        variant: "dock",
         value: input,
         onChange: handlePromptChange,
         onSubmit: handlePromptSubmit,
@@ -8044,6 +9349,10 @@ var App = ({
         followUpsLabel: promptSuggestions.label,
         focusedFollowUpIndex,
         followUpsActive: focusedFollowUpIndex !== void 0,
+        commandCompletions: slashCommandCompletions,
+        focusedCommandCompletionIndex: activeSlashCommandCompletionIndex,
+        commandCompletionsActive: slashCommandCompletionsActive,
+        onCommandCompletionSubmit: chooseSlashCommandCompletion,
         terminalColumns: terminalSize.columns,
         scrollOffset: promptInputViewport.startRow,
         minInputRows: promptInputRowBudget,
@@ -8055,7 +9364,7 @@ var App = ({
           selectorOpen: Boolean(activeSelector),
           searching: isSearching
         }),
-        footerControls: promptFooterControls,
+        footerControls: slashCommandCompletionsActive ? void 0 : promptFooterControls,
         helpText: "",
         actionLabel: promptActionIsCancel ? "ESC to cancel" : void 0,
         actionHint: getChatInputHelpText({
@@ -8077,5 +9386,6 @@ var App = ({
   ] });
 };
 export {
-  App
+  App,
+  buildTuiHeaderDetails
 };