negotium 0.22.8 → 0.23.1

package/dist/main.js

@@ -6559,7 +6559,7 @@ var exports_version = {};
 __export(exports_version, {
   NEGOTIUM_VERSION: () => NEGOTIUM_VERSION
 });
-var NEGOTIUM_VERSION = "0.22.8";
+var NEGOTIUM_VERSION = "0.23.1";
 
 // ../../packages/core/src/agents/codex-native-multi-agent.ts
 import { spawn as spawn2 } from "child_process";
@@ -41575,6 +41575,15 @@ function commandSuggestions(input) {
   const normalized = token.toLowerCase();
   return TERMINAL_COMMANDS.filter((command) => command.name.startsWith(normalized));
 }
+function isKnownTerminalCommand(text3) {
+  if (!text3.startsWith("/"))
+    return false;
+  const firstLine = text3.split(`
+`, 1)[0] ?? "";
+  const [token = ""] = firstLine.slice(1).trim().split(/\s+/);
+  const normalized = token.toLowerCase();
+  return TERMINAL_COMMANDS.some((command) => command.name === normalized);
+}
 function completeCommand(input, index) {
   const suggestions = commandSuggestions(input);
   if (suggestions.length === 0)
@@ -41929,7 +41938,14 @@ function createInitialState(userId) {
     decisionGraphOffset: { x: 0, y: 0 },
     decisionGraphSpacing: DEFAULT_DECISION_GRAPH_SPACING,
     askChoiceIndex: 0,
-    taskSidebarEnabled: true,
+    taskPanelScrollOffset: 0,
+    topicsPanelEnabled: true,
+    topicsPanelScrollOffset: 0,
+    sidePanelWidth: SIDE_PANEL_WIDTH_DEFAULT,
+    terminalPaneOpen: false,
+    terminalPaneFocused: false,
+    terminalPaneWidth: null,
+    topicsPanelSort: "activity",
     overlay: null,
     topicPickerRoot: false,
     vaultEntries: [],
@@ -41941,8 +41957,45 @@ function createInitialState(userId) {
     vaultRequestSubmitting: false
   };
 }
-function toggleTaskSidebar(state) {
-  return { ...state, taskSidebarEnabled: !state.taskSidebarEnabled };
+function toggleTopicsPanel(state) {
+  return { ...state, topicsPanelEnabled: !state.topicsPanelEnabled };
+}
+function cycleTopicsPanelSort(state) {
+  return { ...state, topicsPanelSort: state.topicsPanelSort === "activity" ? "name" : "activity" };
+}
+function openTerminalPane(state) {
+  return { ...state, terminalPaneOpen: true, terminalPaneFocused: true };
+}
+function closeTerminalPane(state) {
+  return { ...state, terminalPaneOpen: false, terminalPaneFocused: false };
+}
+function focusTerminalPane(state, focused) {
+  const next = focused && state.terminalPaneOpen;
+  return next === state.terminalPaneFocused ? state : { ...state, terminalPaneFocused: next };
+}
+function setTerminalPaneWidth(state, width, maxWidth) {
+  const next = Math.max(TERMINAL_PANE_WIDTH_MIN, Math.min(Math.round(width), maxWidth));
+  return next === state.terminalPaneWidth ? state : { ...state, terminalPaneWidth: next };
+}
+function setSidePanelWidth(state, width, maxWidth) {
+  const next = Math.min(SIDE_PANEL_WIDTH_MAX, Math.max(SIDE_PANEL_WIDTH_MIN, Math.min(Math.round(width), maxWidth)));
+  return next === state.sidePanelWidth ? state : { ...state, sidePanelWidth: next };
+}
+function scrollTopicsPanel(state, delta, maxOffset) {
+  const next = Math.min(maxOffset, Math.max(0, state.topicsPanelScrollOffset + delta));
+  return next === state.topicsPanelScrollOffset ? state : { ...state, topicsPanelScrollOffset: next };
+}
+function scrollTaskPanel(state, delta, maxOffset) {
+  const next = Math.min(maxOffset, Math.max(0, state.taskPanelScrollOffset + delta));
+  return next === state.taskPanelScrollOffset ? state : { ...state, taskPanelScrollOffset: next };
+}
+function setTopicsPanelScrollOffset(state, offset, maxOffset) {
+  const next = Math.min(maxOffset, Math.max(0, offset));
+  return next === state.topicsPanelScrollOffset ? state : { ...state, topicsPanelScrollOffset: next };
+}
+function setTaskPanelScrollOffset(state, offset, maxOffset) {
+  const next = Math.min(maxOffset, Math.max(0, offset));
+  return next === state.taskPanelScrollOffset ? state : { ...state, taskPanelScrollOffset: next };
 }
 function activeTopic(state) {
   return state.topics.find((topic) => topic.id === state.activeTopicId) ?? null;
@@ -41959,6 +42012,16 @@ function setTopicUsage(state, usage) {
 function activeQuestion(state) {
   return activeMessages(state).slice().reverse().find((message2) => message2.kind === "ask_user_question" && message2.askUserQuestion && !message2.askUserQuestion.expired && !message2.askUserQuestion.selectedLabel) ?? null;
 }
+function blockedQuestionText(state, topicId) {
+  const messages = state.messages[topicId] ?? [];
+  for (let index = messages.length - 1;index >= 0; index -= 1) {
+    const message2 = messages[index];
+    if (message2.kind === "ask_user_question" && message2.askUserQuestion && !message2.askUserQuestion.expired && !message2.askUserQuestion.selectedLabel) {
+      return message2.askUserQuestion.question;
+    }
+  }
+  return;
+}
 function activeVaultRequest(state) {
   return activeMessages(state).find((message2) => message2.kind === "vault_secret_request" && message2.vaultSecretRequest?.status === "pending") ?? null;
 }
@@ -42062,12 +42125,43 @@ function visibleTopicPickerIds(state) {
 function visibleBackgroundSessions(state) {
   return state.backgroundSessions.filter((session) => topicPickerQueryMatches(session.title, state.topicFilter));
 }
+function topicRank(state, topic) {
+  if (blockedQuestionText(state, topic.id) !== undefined)
+    return 0;
+  if (state.activity[topic.id]?.running)
+    return 1;
+  return 2;
+}
+function groupTopicsIntoUnits(entries) {
+  const units = [];
+  for (const entry of entries) {
+    const last = units.at(-1);
+    if (entry.topic.isSubagent && last)
+      last.push(entry);
+    else
+      units.push([entry]);
+  }
+  return units;
+}
+function sortedTopicEntries(state, entries) {
+  const units = groupTopicsIntoUnits(entries);
+  if (state.topicsPanelSort === "name") {
+    return units.slice().sort((a, b) => (a[0]?.topic.title ?? "").localeCompare(b[0]?.topic.title ?? "")).flat();
+  }
+  return units.map((unit, order) => ({
+    unit,
+    order,
+    rank: Math.min(...unit.map(({ topic }) => topicRank(state, topic)))
+  })).sort((a, b) => a.rank - b.rank || a.order - b.order).flatMap(({ unit }) => unit);
+}
 function topicPickerItems(state) {
   const visible = visibleTopicPickerIds(state);
   const indexedTopics = state.topics.map((topic, index) => ({ topic, index })).filter(({ topic }) => visible.has(topic.id));
+  const managerEntries = sortedTopicEntries(state, indexedTopics.filter(({ topic }) => topic.kind === "manager"));
+  const regularEntries = sortedTopicEntries(state, indexedTopics.filter(({ topic }) => topic.kind !== "manager"));
   return [
-    ...indexedTopics.filter(({ topic }) => topic.kind === "manager").map(({ topic, index }) => ({ kind: "topic", id: topic.id, index })),
-    ...indexedTopics.filter(({ topic }) => topic.kind !== "manager").map(({ topic, index }) => ({ kind: "topic", id: topic.id, index })),
+    ...managerEntries.map(({ topic, index }) => ({ kind: "topic", id: topic.id, index })),
+    ...regularEntries.map(({ topic, index }) => ({ kind: "topic", id: topic.id, index })),
     ...visibleBackgroundSessions(state).map((session) => ({
       kind: "background",
       id: session.id
@@ -42359,6 +42453,22 @@ function failedToolText(text3) {
   return [title, ...mapped].join(`
 `);
 }
+function appendToolOutput(text3, content) {
+  if (!content.trim())
+    return text3;
+  const [title = "Tool"] = text3.split(`
+`);
+  if (TOOL_OUTPUT_EXCLUDED_PREFIXES.some((prefix) => title.startsWith(prefix)))
+    return text3;
+  if (text3.includes(`
+`))
+    return text3;
+  const lines = content.replace(/\r\n?/g, `
+`).replace(/\n+$/, "").split(`
+`);
+  return [title, ...lines].join(`
+`);
+}
 function toolMessageId(status, toolUseId) {
   return `terminal-tool:${String(status.queryId ?? "query")}:${toolUseId}`;
 }
@@ -42458,14 +42568,17 @@ function applyAiStatus(state, topicId, raw, createdAt) {
       return state;
     const id = String(status.toolUseId ?? "");
     const failed = status.isError === true;
-    const tools = current3.tools.map((tool) => tool.id === id ? { ...tool, output: String(status.content ?? ""), status: failed ? "error" : "done" } : tool);
+    const content = String(status.content ?? "");
+    const tools = current3.tools.map((tool) => tool.id === id ? { ...tool, output: content, status: failed ? "error" : "done" } : tool);
     const withActivity = setActivity(state, topicId, { ...liveCurrent, tools });
     const messageId = toolMessageId(status, id);
     const existing = (withActivity.messages[topicId] ?? []).find((message2) => message2.id === messageId);
+    const withOutput = existing ? appendToolOutput(existing.text, content) : undefined;
+    const nextText = failed && (!existing || withOutput === existing.text) ? failedToolText(existing?.text ?? "") : withOutput;
     return patchMessage(withActivity, topicId, messageId, {
       editedAt: createdAt ?? new Date().toISOString(),
       toolResult: failed ? "error" : "ok",
-      ...failed && existing ? { text: failedToolText(existing.text) } : {}
+      ...nextText !== undefined ? { text: nextText } : {}
     });
   }
   if (kind === "tool_status") {
@@ -42498,11 +42611,18 @@ function applyRuntimeEvent(state, event) {
   }
   return state;
 }
-var NO_TOPIC_PICKER_SELECTION = -1;
+var SIDE_PANEL_WIDTH_DEFAULT = 36, SIDE_PANEL_WIDTH_MIN = 22, SIDE_PANEL_WIDTH_MAX = 64, TERMINAL_PANE_WIDTH_MIN = 30, NO_TOPIC_PICKER_SELECTION = -1, TOOL_OUTPUT_EXCLUDED_PREFIXES;
 var init_state2 = __esm(async () => {
   init_decision_graph();
   init_subagent_graph();
   await init_src();
+  TOOL_OUTPUT_EXCLUDED_PREFIXES = [
+    "Edit \xB7 ",
+    "Write \xB7 ",
+    "Delete \xB7 ",
+    "Ask session \xB7 ",
+    "Tell session \xB7 "
+  ];
 });
 
 // ../../adapters/terminal/src/context-usage.ts
@@ -43615,7 +43735,6 @@ function toolMessageLines(message2, width) {
 `);
   const failed = message2.toolResult === "error";
   const done = failed || Boolean(message2.editedAt);
-  const fileMutation = /^(?:Edit|Write|Delete) \u00B7 /.test(title);
   const wrapWidth = Math.max(4, width - 6);
   const marker = failed ? "!" : done ? "\u2713" : "\u25CF";
   const headerText = `  ${marker} ${title}`;
@@ -43631,14 +43750,8 @@ function toolMessageLines(message2, width) {
       { text: ")" }
     ] : [{ text: headerText, fg: headerColor }]
   });
-  if (!fileMutation) {
-    return [
-      header,
-      ...details.slice(0, 2).flatMap((detail) => wrapText(detail, wrapWidth).slice(0, 1).map((text3) => line(`    ${text3}`, { fg: toolDetailColor(detail), dim: !failed })))
-    ];
-  }
   const wrapped = details.flatMap((detail) => wrapText(detail, wrapWidth).map((text3) => ({ detail, text: text3 })));
-  const visible = wrapped.slice(0, FILE_PREVIEW_MAX_LINES);
+  const visible = wrapped.slice(0, TOOL_PREVIEW_MAX_LINES);
   const hidden = wrapped.length - visible.length;
   return [
     header,
@@ -43743,50 +43856,269 @@ function taskLines(state, width) {
   const visibleTasks = tasks3.slice(0, INLINE_TASK_LIMIT);
   const hidden = tasks3.length - visibleTasks.length;
   return [
-    line("  \u25EB Tasks \xB7 Ctrl-T sidebar", { fg: theme.amber, bold: true }),
+    line("  \u25EB Tasks \xB7 Ctrl-P sidebar", { fg: theme.amber, bold: true }),
     ...visibleTasks.flatMap((task) => wrapText(task.trimStart(), Math.max(4, width - 6)).map((text3) => line(`    ${text3}`, { fg: theme.muted }))),
     ...hidden > 0 ? [line(`    +${hidden} more`, { fg: theme.muted, dim: true })] : [],
     line("")
   ];
 }
+function maxSidePanelWidth(columns) {
+  return Math.max(SIDE_PANEL_WIDTH_MIN, columns - SIDE_PANEL_GAP - CONVERSATION_MIN_WIDTH);
+}
 function terminalBodyLayout(state, width) {
-  const showTaskSidebar = width >= TASK_SIDEBAR_MIN_WIDTH && state.taskSidebarEnabled && !state.overlay && !state.creatingTopic && taskItems(state).length > 0;
+  const terminalReserve = state.terminalPaneOpen ? TERMINAL_PANE_WIDTH_MIN + TERMINAL_PANE_GAP : 0;
+  const wideEnough = width - terminalReserve >= SIDE_PANEL_MIN_WIDTH && state.topicsPanelEnabled && (!state.overlay || state.overlay === "background-session") && !state.creatingTopic;
+  const showTaskPanel = wideEnough && taskItems(state).length > 0;
+  const showTopicsPanel = wideEnough && (state.topics.length > 1 || visibleBackgroundSessions(state).length > 0);
+  const showSide = showTaskPanel || showTopicsPanel;
+  const maxSideWidth = maxSidePanelWidth(width) - terminalReserve;
+  const sideWidth = showSide ? Math.min(SIDE_PANEL_WIDTH_MAX, Math.max(SIDE_PANEL_WIDTH_MIN, state.sidePanelWidth), maxSideWidth) : 0;
+  const afterSide = showSide ? width - sideWidth - SIDE_PANEL_GAP : width;
+  const maxTerminalWidth = afterSide - TERMINAL_PANE_GAP - CONVERSATION_MIN_WIDTH;
+  const terminalWidth = state.terminalPaneOpen && maxTerminalWidth >= TERMINAL_PANE_WIDTH_MIN ? Math.min(maxTerminalWidth, Math.max(TERMINAL_PANE_WIDTH_MIN, state.terminalPaneWidth ?? Math.floor(afterSide * 0.32))) : 0;
   return {
-    conversationWidth: showTaskSidebar ? width - TASK_SIDEBAR_WIDTH - TASK_SIDEBAR_GAP : width,
-    taskWidth: showTaskSidebar ? TASK_SIDEBAR_WIDTH : 0,
-    showTaskSidebar
-  };
+    conversationWidth: terminalWidth > 0 ? afterSide - terminalWidth - TERMINAL_PANE_GAP : afterSide,
+    sideWidth,
+    showTaskPanel,
+    showTopicsPanel,
+    terminalWidth,
+    maxTerminalWidth: Math.max(TERMINAL_PANE_WIDTH_MIN, maxTerminalWidth)
+  };
+}
+function maxTerminalPaneWidth(state, columns) {
+  return terminalBodyLayout(state, Math.max(1, columns)).maxTerminalWidth;
+}
+function topicStatusIndicator(state, topic, animationFrame) {
+  const blockedText = blockedQuestionText(state, topic.id);
+  if (blockedText !== undefined)
+    return { icon: "?", fg: theme.amber, blockedText };
+  if (state.activity[topic.id]?.running) {
+    return { icon: workingFrame(animationFrame), fg: theme.green };
+  }
+  return { icon: "\u25CB", fg: theme.muted };
+}
+function topicPanelRowLines(state, topic, topicIndex, animationFrame) {
+  const selected = topic.id === state.activeTopicId;
+  const hovered = !selected && topic.id === state.sidePanelHoverTopicId;
+  const status = topicStatusIndicator(state, topic, animationFrame);
+  const childPrefix = subagentTreePrefix(topic, state.topics);
+  const bg2 = selected || hovered ? theme.selected : theme.canvas;
+  const header = line(` ${selected ? "\u203A" : " "} ${childPrefix}${status.icon} ${topic.title}`, {
+    fg: selected ? theme.text : status.fg,
+    bg: bg2,
+    bold: selected,
+    pickerTarget: { topicIndex }
+  });
+  if (status.blockedText === undefined)
+    return [header];
+  return [
+    header,
+    line(`   ${status.blockedText}`, {
+      fg: theme.amber,
+      bg: bg2,
+      pickerTarget: { topicIndex }
+    })
+  ];
 }
-function taskSidebarLines(state, width, height) {
+function topicPanelGroupLines(state, label, entries, animationFrame) {
+  if (entries.length === 0)
+    return [];
+  return [
+    line(` ${label}`, { fg: theme.cyan, dim: true, bold: true, bg: theme.canvas }),
+    ...sortedTopicEntries(state, entries).flatMap(({ topic, topicIndex }) => topicPanelRowLines(state, topic, topicIndex, animationFrame))
+  ];
+}
+function topicsPanelRows(state, animationFrame) {
+  const indexed = state.topics.map((topic, topicIndex) => ({ topic, topicIndex }));
+  const managerEntries = indexed.filter(({ topic }) => topic.kind === "manager");
+  const regularEntries = indexed.filter(({ topic }) => topic.kind !== "manager");
+  const topicRows = [
+    ...topicPanelGroupLines(state, "manager", managerEntries, animationFrame),
+    ...topicPanelGroupLines(state, "topics", regularEntries, animationFrame)
+  ];
+  const sessionRows = ["cron", "memory", "compact"].flatMap((kind) => {
+    const matching = visibleBackgroundSessions(state).filter((session) => session.kind === kind);
+    if (matching.length === 0)
+      return [];
+    return [
+      line(` ${kind}`, { fg: theme.cyan, dim: true, bold: true, bg: theme.canvas }),
+      ...matching.map((session) => {
+        const hovered = session.id === state.sidePanelHoverBackgroundSessionId;
+        return line(` ${session.active ? workingFrame(animationFrame) : "\u25CB"} ${session.title}`, {
+          fg: hovered ? theme.text : session.active ? theme.green : theme.muted,
+          bg: hovered ? theme.selected : theme.canvas,
+          pickerTarget: { backgroundSessionId: session.id }
+        });
+      })
+    ];
+  });
+  return [...topicRows, ...sessionRows];
+}
+function taskPanelRows(state, width) {
   const items = taskItems(state);
-  const groups = items.map((task) => {
+  return items.flatMap((task) => {
     const completed = /^\s*(?:\[x\]|\u2612|\u2713|\u2705)/i.test(task);
-    return wrapText(task.trimStart(), Math.max(4, width - 4)).map((text3) => line(` ${text3}`, {
+    return wrapText(task.trimStart(), Math.max(4, width - 2)).map((text3) => line(` ${text3}`, {
       fg: completed ? theme.muted : theme.text,
-      dim: completed
+      dim: completed,
+      bg: theme.canvas
     }));
   });
-  const capacity = Math.max(1, height);
-  const total = groups.reduce((sum, group) => sum + group.length, 0);
-  if (total <= capacity)
-    return groups.flat();
-  if (capacity === 1)
-    return groups[0]?.slice(0, 1) ?? [];
-  const rows = [];
-  let shown = 0;
-  for (const group of groups) {
-    if (rows.length + group.length > capacity - 1) {
-      if (shown === 0) {
-        rows.push(...group.slice(0, capacity - 1));
-        shown = 1;
-      }
-      break;
+}
+function panelHeaderHeight(sectionHeight) {
+  return Math.min(2, sectionHeight);
+}
+function panelContentHeight(sectionHeight) {
+  return Math.max(0, sectionHeight - panelHeaderHeight(sectionHeight));
+}
+function scrollbarThumb(totalRows, viewportRows, offset) {
+  if (viewportRows <= 0 || totalRows <= 0)
+    return { top: 0, len: 0 };
+  const len = Math.max(1, Math.min(viewportRows, Math.round(viewportRows * viewportRows / totalRows)));
+  const maxThumbTop = Math.max(0, viewportRows - len);
+  const maxOffset = Math.max(1, totalRows - viewportRows);
+  const top = maxThumbTop === 0 ? 0 : Math.round(Math.min(offset, maxOffset) * maxThumbTop / maxOffset);
+  return { top, len };
+}
+function scrollOffsetFromDragRow(totalRows, viewportRows, trackRow, grabRowOffset) {
+  if (viewportRows <= 0 || totalRows <= 0)
+    return 0;
+  const { len } = scrollbarThumb(totalRows, viewportRows, 0);
+  const maxThumbTop = Math.max(0, viewportRows - len);
+  if (maxThumbTop === 0)
+    return 0;
+  const clampedRow = Math.max(0, Math.min(trackRow, viewportRows - 1));
+  const desiredTop = Math.min(maxThumbTop, Math.max(0, clampedRow - grabRowOffset));
+  const maxOffset = Math.max(0, totalRows - viewportRows);
+  return Math.round(desiredTop * maxOffset / maxThumbTop);
+}
+function scrollbarCell(totalRows, viewportRows, offset, rowIndex, accent) {
+  const thumb = scrollbarThumb(totalRows, viewportRows, offset);
+  const isThumb = rowIndex >= thumb.top && rowIndex < thumb.top + thumb.len;
+  return paint(isThumb ? "\u2590" : "\u2595", { fg: isThumb ? accent : theme.muted, bg: theme.canvas });
+}
+function renderPanelSection(label, rows, width, height, scrollOffset, accent) {
+  if (height <= 0 || width <= 0)
+    return { lines: [], rowTargets: [] };
+  const headerHeight = panelHeaderHeight(height);
+  const contentHeight = panelContentHeight(height);
+  const overflow = rows.length > contentHeight;
+  const textWidth = overflow ? Math.max(1, width - 1) : width;
+  const clampedOffset = Math.max(0, Math.min(scrollOffset, Math.max(0, rows.length - contentHeight)));
+  const visible = rows.slice(clampedOffset, clampedOffset + contentHeight);
+  const lines = [];
+  if (headerHeight >= 1)
+    lines.push(paint("\u2500".repeat(width), { fg: theme.border, bg: theme.canvas }));
+  if (headerHeight >= 2) {
+    lines.push(paint(fit(` ${label}`, width), { fg: accent, bg: theme.canvas, bold: true }));
+  }
+  const rowTargets = [];
+  for (let index = 0;index < contentHeight; index += 1) {
+    const item = visible[index];
+    const text3 = paint(fit(item?.text ?? "", textWidth), {
+      fg: item?.fg ?? theme.text,
+      bg: item?.bg ?? theme.canvas,
+      bold: item?.bold,
+      dim: item?.dim
+    });
+    const scrollCell = overflow ? scrollbarCell(rows.length, contentHeight, clampedOffset, index, accent) : "";
+    lines.push(`${text3}${scrollCell}`);
+    if (item?.pickerTarget)
+      rowTargets.push({ y: headerHeight + index, pickerTarget: item.pickerTarget });
+  }
+  return {
+    lines,
+    rowTargets,
+    track: overflow ? { x: width - 1, viewportRows: contentHeight, rowCount: rows.length } : undefined
+  };
+}
+function sidePanelSectionHeights(layout, bodyHeight) {
+  if (layout.showTopicsPanel && layout.showTaskPanel) {
+    const topicsHeight = Math.max(3, Math.floor(bodyHeight / 2));
+    return { topicsHeight, taskHeight: Math.max(0, bodyHeight - topicsHeight) };
+  }
+  if (layout.showTopicsPanel)
+    return { topicsHeight: bodyHeight, taskHeight: 0 };
+  if (layout.showTaskPanel)
+    return { topicsHeight: 0, taskHeight: bodyHeight };
+  return { topicsHeight: 0, taskHeight: 0 };
+}
+function renderSideColumn(state, layout, bodyHeight, animationFrame) {
+  const { showTaskPanel, showTopicsPanel, sideWidth } = layout;
+  if (!showTaskPanel && !showTopicsPanel)
+    return { lines: [], targets: [], tracks: [] };
+  const { topicsHeight, taskHeight } = sidePanelSectionHeights(layout, bodyHeight);
+  const sections = [];
+  if (showTopicsPanel) {
+    sections.push({
+      panel: "topics",
+      label: state.topicsPanelSort === "activity" ? "ACTIVITY \xB7 name" : "activity \xB7 NAME",
+      rows: topicsPanelRows(state, animationFrame),
+      accent: theme.accent,
+      height: topicsHeight,
+      offset: 0,
+      scrollOffset: state.topicsPanelScrollOffset
+    });
+  }
+  if (showTaskPanel) {
+    sections.push({
+      panel: "tasks",
+      label: "tasks",
+      rows: taskPanelRows(state, sideWidth),
+      accent: theme.taskBorder,
+      height: taskHeight,
+      offset: showTopicsPanel ? topicsHeight : 0,
+      scrollOffset: state.taskPanelScrollOffset
+    });
+  }
+  const lines = [];
+  const targets = [];
+  const tracks = [];
+  for (const section of sections) {
+    const result = renderPanelSection(section.label, section.rows, sideWidth, section.height, section.scrollOffset, section.accent);
+    lines.push(...result.lines);
+    for (const target of result.rowTargets) {
+      targets.push({ y: section.offset + target.y, pickerTarget: target.pickerTarget });
+    }
+    if (result.track) {
+      tracks.push({
+        panel: section.panel,
+        x: result.track.x,
+        yStart: section.offset + panelHeaderHeight(section.height),
+        viewportRows: result.track.viewportRows,
+        rowCount: result.track.rowCount
+      });
     }
-    rows.push(...group);
-    shown += 1;
   }
-  rows.push(line(` +${items.length - shown} more`, { fg: theme.muted, dim: true }));
-  return rows;
+  while (lines.length < bodyHeight)
+    lines.push(paint(" ".repeat(sideWidth), { bg: theme.canvas }));
+  return { lines: lines.slice(0, bodyHeight), targets, tracks };
+}
+function maxTopicsPanelScrollOffset(state, columns, rows) {
+  const width = Math.max(1, columns);
+  const height = Math.max(14, rows);
+  if (state.overlay)
+    return 0;
+  const layout = terminalBodyLayout(state, width);
+  if (!layout.showTopicsPanel)
+    return 0;
+  const bodyHeight = Math.max(3, height - footerLines(state, width).length - decisionPane(state, width).length - vaultRequestPane(state, width).length - composerPane(state, layout.conversationWidth).lines.length);
+  const { topicsHeight } = sidePanelSectionHeights(layout, bodyHeight);
+  const viewport = panelContentHeight(topicsHeight);
+  return Math.max(0, topicsPanelRows(state, 0).length - viewport);
+}
+function maxTaskPanelScrollOffset(state, columns, rows) {
+  const width = Math.max(1, columns);
+  const height = Math.max(14, rows);
+  if (state.overlay)
+    return 0;
+  const layout = terminalBodyLayout(state, width);
+  if (!layout.showTaskPanel)
+    return 0;
+  const bodyHeight = Math.max(3, height - footerLines(state, width).length - decisionPane(state, width).length - vaultRequestPane(state, width).length - composerPane(state, layout.conversationWidth).lines.length);
+  const { taskHeight } = sidePanelSectionHeights(layout, bodyHeight);
+  const viewport = panelContentHeight(taskHeight);
+  return Math.max(0, taskPanelRows(state, layout.sideWidth).length - viewport);
 }
 function helpLines() {
   return [
@@ -43796,7 +44128,10 @@ function helpLines() {
     line("  \u2190 \u2192 move \xB7 Ctrl/Alt-\u2190 \u2192 move by word \xB7 \u2191 \u2193 history"),
     line("  Alt-Backspace delete word \xB7 Ctrl-U clear before cursor"),
     line("  Cmd-Backspace works when forwarded \xB7 Ctrl-W/K aliases"),
-    line("  Mouse wheel / PgUp/PgDn scroll \xB7 Ctrl-E load older \xB7 Ctrl-T tasks"),
+    line("  Mouse wheel / PgUp/PgDn scroll \xB7 Ctrl-E load older"),
+    line("  Ctrl-P topics + tasks panel \xB7 click/hover a row to switch \xB7 drag scrollbar"),
+    line("  Ctrl-R sort topics panel (activity / name) \xB7 drag a \u2502 divider to resize"),
+    line("  Ctrl-T open/close a shell on the right (closing ends it) \xB7 click it to type"),
     line("  Ctrl-O topics \xB7 Ctrl-G subagents \xB7 Ctrl-D decisions \xB7 Ctrl-X abort"),
     line("  In topics: type to filter \xB7 Ctrl-N new \xB7 Ctrl-D delete"),
     line("  Esc/Ctrl-C stop active turn \xB7 Ctrl-C twice when idle to quit"),
@@ -43948,8 +44283,8 @@ function topicOverlayCursor(state, width, bodyHeight) {
 function topicOverlayLines(state, width, height, animationFrame = 0) {
   const visibleIds = visibleTopicPickerIds(state);
   const indexedTopics = state.topics.map((topic, topicIndex) => ({ topic, topicIndex })).filter(({ topic }) => visibleIds.has(topic.id));
-  const managerTopics = indexedTopics.filter(({ topic }) => topic.kind === "manager");
-  const regularTopics = indexedTopics.filter(({ topic }) => topic.kind !== "manager");
+  const managerTopics = sortedTopicEntries(state, indexedTopics.filter(({ topic }) => topic.kind === "manager"));
+  const regularTopics = sortedTopicEntries(state, indexedTopics.filter(({ topic }) => topic.kind !== "manager"));
   const entries = [];
   for (const [label, topics] of [
     ["Manager", managerTopics],
@@ -43997,30 +44332,48 @@ function topicOverlayLines(state, width, height, animationFrame = 0) {
     query2.length > 0 ? line(`${TOPIC_FILTER_LABEL}${safeText(query2)}`, { fg: theme.cyan, bold: true }) : line(""),
     ...entries.length === 0 ? [
       line(query2.length > 0 ? `  No topics match \u201C${safeText(query2)}\u201D \xB7 Esc clears the filter` : "  No topics yet \xB7 Press Ctrl-N to create one", { fg: theme.muted })
-    ] : entries.slice(start, start + visibleCount).map((entry) => {
+    ] : entries.slice(start, start + visibleCount).flatMap((entry) => {
       if (entry.kind === "heading") {
-        return line(`  ${entry.label}`, { fg: theme.cyan, bold: true });
+        return [line(`  ${entry.label}`, { fg: theme.cyan, bold: true })];
       }
       if (entry.kind === "separator") {
-        return line(`  ${"\u2500".repeat(Math.max(1, width - 4))}`, { fg: theme.border });
+        return [line(`  ${"\u2500".repeat(Math.max(1, width - 4))}`, { fg: theme.border })];
       }
       if (entry.kind === "background") {
         const selected2 = entry.sessionId === state.topicPickerBackgroundId;
-        return line(`  ${selected2 ? "\u203A" : " "} ${entry.active ? workingFrame(animationFrame) : "\u25CB"} ${entry.label}  \xB7  ${entry.status}`, {
-          fg: selected2 ? theme.text : entry.active ? theme.green : theme.muted,
-          bg: selected2 ? theme.selected : theme.canvas,
-          bold: selected2
-        });
+        return [
+          line(`  ${selected2 ? "\u203A" : " "} ${entry.active ? workingFrame(animationFrame) : "\u25CB"} ${entry.label}  \xB7  ${entry.status}`, {
+            fg: selected2 ? theme.text : entry.active ? theme.green : theme.muted,
+            bg: selected2 ? theme.selected : theme.canvas,
+            bold: selected2,
+            pickerTarget: { backgroundSessionId: entry.sessionId }
+          })
+        ];
       }
       const { topic, topicIndex } = entry;
       const selected = topicIndex === state.topicPickerIndex;
-      const running = state.activity[topic.id]?.running;
+      const status = topicStatusIndicator(state, topic, animationFrame);
       const childPrefix = subagentTreePrefix(topic, state.topics);
-      return line(`  ${selected ? "\u203A" : " "} ${childPrefix}${running ? workingFrame(animationFrame) : "\u25CB"} ${topic.title}  \xB7  ${topic.agent ?? "no agent"}  \xB7  ${effectiveTopicModel(topic)}  \xB7  ${effectiveTopicEffort(topic)}`, {
-        fg: selected ? theme.text : running ? theme.green : theme.muted,
-        bg: selected ? theme.selected : theme.canvas,
-        bold: selected
+      const bg2 = selected ? theme.selected : theme.canvas;
+      const header = line(`  ${selected ? "\u203A" : " "} ${childPrefix}${status.icon} ${topic.title}  \xB7  ${topic.agent ?? "no agent"}  \xB7  ${effectiveTopicModel(topic)}  \xB7  ${effectiveTopicEffort(topic)}`, {
+        fg: selected ? theme.text : status.fg,
+        bg: bg2,
+        bold: selected,
+        pickerTarget: { topicIndex }
       });
+      const running = state.activity[topic.id]?.running;
+      const subtitle = status.blockedText ?? (running ? activityDetail(state.activity[topic.id]?.status) : undefined);
+      if (!subtitle)
+        return [header];
+      return [
+        header,
+        line(`      ${subtitle}`, {
+          fg: status.blockedText !== undefined ? theme.amber : theme.muted,
+          dim: status.blockedText === undefined,
+          bg: bg2,
+          pickerTarget: { topicIndex }
+        })
+      ];
     })
   ];
 }
@@ -44366,6 +44719,16 @@ function conversationViewport(lineCount, height, requestedOffset) {
     offset: Math.min(maxOffset, Math.max(0, requestedOffset))
   };
 }
+function popupPaneWidth(width) {
+  return Math.max(0, Math.min(POPUP_PANE_MAX_WIDTH, width - 4));
+}
+function centerPaneRows(rows, boxWidth, totalWidth) {
+  const left = Math.max(0, Math.floor((totalWidth - boxWidth) / 2));
+  const right = Math.max(0, totalWidth - boxWidth - left);
+  const leftPad = left > 0 ? paint(" ".repeat(left), { bg: theme.canvas }) : "";
+  const rightPad = right > 0 ? paint(" ".repeat(right), { bg: theme.canvas }) : "";
+  return rows.map((row) => `${leftPad}${row}${rightPad}`);
+}
 function decisionPane(state, width) {
   if (state.overlay)
     return [];
@@ -44376,6 +44739,7 @@ function decisionPane(state, width) {
   if (!ask || !question?.choices.length)
     return [];
   const selected = Math.min(state.askChoiceIndex, question.choices.length - 1);
+  const boxWidth = popupPaneWidth(width);
   const content = [
     line(`  ${question.question}`, { bold: true }),
     ...question.choices.map((choice, index) => line(`  ${index === selected ? "\u25CF" : "\u25CB"} ${choice.label}${choice.description ? ` \u2014 ${choice.description}` : ""}`, {
@@ -44384,7 +44748,8 @@ function decisionPane(state, width) {
       bold: index === selected
     }))
   ];
-  return framePane("decision required \xB7 \u2191\u2193 select \xB7 Enter confirm", content, width, Math.min(8, Math.max(4, content.length + 2)), { active: true, accent: theme.amber });
+  const rows = framePane("decision required \xB7 \u2191\u2193 select \xB7 Enter confirm", content, boxWidth, Math.min(8, Math.max(4, content.length + 2)), { active: true, accent: theme.amber });
+  return centerPaneRows(rows, boxWidth, width);
 }
 function vaultRequestPane(state, width) {
   if (state.overlay)
@@ -44393,15 +44758,17 @@ function vaultRequestPane(state, width) {
   if (!request)
     return [];
   const declining = state.vaultRequestMode === "confirm-decline";
+  const boxWidth = popupPaneWidth(width);
   const content = [
     line(`  ${request.key}`, { bold: true }),
-    ...request.description ? wrapText(request.description, Math.max(4, width - 6)).map((text3) => line(`  ${text3}`, { fg: theme.muted })) : [],
+    ...request.description ? wrapText(request.description, Math.max(4, boxWidth - 6)).map((text3) => line(`  ${text3}`, { fg: theme.muted })) : [],
     declining ? line("  Decline this request? y / n", { fg: theme.red, bold: true }) : line("  Enter save to Vault \xB7 Esc clear / decline \xB7 Alt-Enter newline", {
       fg: theme.subtle
     }),
     ...state.vaultRequestNotice ? [line(`  ! ${state.vaultRequestNotice}`, { fg: theme.amber })] : []
   ];
-  return framePane(`secret requested by ${state.aiName} \xB7 never shown to the agent${state.vaultRequestSubmitting ? ` \xB7 ${workingFrame(0)} saving` : ""}`, content, width, Math.min(8, Math.max(4, content.length + 2)), { active: true, accent: theme.accent });
+  const rows = framePane(`secret requested by ${state.aiName} \xB7 never shown to the agent${state.vaultRequestSubmitting ? ` \xB7 ${workingFrame(0)} saving` : ""}`, content, boxWidth, Math.min(8, Math.max(4, content.length + 2)), { active: true, accent: theme.accent });
+  return centerPaneRows(rows, boxWidth, width);
 }
 function wrapLineWithCursor(value, codePointColumn, width) {
   const chars = Array.from(safeText(value));
@@ -44475,8 +44842,25 @@ function inputVisualLines(state, width) {
   }
   return { lines: result, cursorLine, cursorColumn };
 }
+function shiftLines(lines, marginWidth) {
+  if (marginWidth <= 0)
+    return lines;
+  const margin = paint(" ".repeat(marginWidth), { bg: theme.canvas });
+  return lines.map((row) => `${margin}${row}`);
+}
+function shiftComposerPane(pane, marginWidth) {
+  if (marginWidth <= 0)
+    return pane;
+  return {
+    lines: shiftLines(pane.lines, marginWidth),
+    cursor: { x: pane.cursor.x + marginWidth, y: pane.cursor.y }
+  };
+}
+function shortcutHint(width) {
+  return SHORTCUT_HINTS.find((hint) => displayWidth(hint) + 2 <= width) ?? SHORTCUT_HINTS[2];
+}
 function composerPane(state, width) {
-  const title = state.creatingTopic ? "new topic \xB7 type a name \xB7 Enter create" : state.overlay === "vault" ? state.vaultMode === "list" ? "Vault command \xB7 Enter run \xB7 Esc close" : `${state.vaultMode === "key" ? "key" : state.vaultMode === "value" ? "secret value" : "description"} \xB7 Enter continue \xB7 Esc cancel` : "Ctrl-O topics \xB7 Ctrl-G subagents \xB7 Ctrl-D decisions";
+  const title = state.creatingTopic ? "new topic \xB7 type a name \xB7 Enter create" : state.overlay === "vault" ? state.vaultMode === "list" ? "Vault command \xB7 Enter run \xB7 Esc close" : `${state.vaultMode === "key" ? "key" : state.vaultMode === "value" ? "secret value" : "description"} \xB7 Enter continue \xB7 Esc cancel` : shortcutHint(width);
   const visual = inputVisualLines(state, width);
   let inputStart = Math.max(0, visual.lines.length - 5);
   if (visual.cursorLine < inputStart)
@@ -44715,43 +45099,173 @@ function renderBody(lines, width, height) {
 function renderApp(state, columns, rows, animationFrame = 0, nowMs = terminalNowMs()) {
   return renderAppFrame(state, columns, rows, animationFrame, nowMs).frame;
 }
-function renderAppFrame(state, columns, rows, animationFrame = 0, nowMs = terminalNowMs()) {
+function renderAppFrame(state, columns, rows, animationFrame = 0, nowMs = terminalNowMs(), extras = {}) {
   const width = Math.max(1, columns);
   const height = Math.max(14, rows);
-  const footer = footerLines(state, width);
-  const decision = [...decisionPane(state, width), ...vaultRequestPane(state, width)];
+  const layout = terminalBodyLayout(state, width);
+  const conversationXStart = layout.sideWidth > 0 ? layout.sideWidth + SIDE_PANEL_GAP + 1 : 1;
+  const footer = shiftLines(footerLines(state, layout.conversationWidth), conversationXStart - 1);
+  const decision = shiftLines([
+    ...decisionPane(state, layout.conversationWidth),
+    ...vaultRequestPane(state, layout.conversationWidth)
+  ], conversationXStart - 1);
   const hideComposer = state.overlay === "background-session" || state.overlay === "topics" || state.overlay === "subagents" || state.overlay === "decisions" || state.overlay === "vault" && state.vaultMode === "confirm-delete";
-  const composer = hideComposer ? { lines: [], cursor: null } : composerPane(state, width);
+  const composer = hideComposer ? { lines: [], cursor: null } : shiftComposerPane(composerPane(state, layout.conversationWidth), conversationXStart - 1);
   const bodyHeight = Math.max(3, height - footer.length - decision.length - composer.lines.length);
-  const layout = terminalBodyLayout(state, width);
-  const conversation = conversationLines(state, layout.conversationWidth, bodyHeight, animationFrame, nowMs, !layout.showTaskSidebar);
+  const conversation = conversationLines(state, layout.conversationWidth, bodyHeight, animationFrame, nowMs, !layout.showTaskPanel);
   const conversationBody = renderBody(conversation, layout.conversationWidth, bodyHeight);
-  const body = layout.showTaskSidebar ? (() => {
-    const taskPane = framePane("Tasks \xB7 Ctrl-T", taskSidebarLines(state, layout.taskWidth, Math.max(0, bodyHeight - 2)), layout.taskWidth, bodyHeight, { active: true, accent: theme.taskBorder });
-    if (taskPane.length === 0)
-      return renderBody(conversation, width, bodyHeight);
-    const gap = paint(" ".repeat(TASK_SIDEBAR_GAP), { bg: theme.canvas });
-    return conversationBody.map((row, index) => `${row}${gap}${taskPane[index] ?? ""}`);
+  const sideColumn = layout.showTaskPanel || layout.showTopicsPanel ? renderSideColumn(state, layout, bodyHeight, animationFrame) : null;
+  const body = sideColumn?.lines.length ? (() => {
+    const gap = paint("\u2502".repeat(SIDE_PANEL_GAP), { fg: theme.border, bg: theme.canvas });
+    return sideColumn.lines.map((row, index) => `${row}${gap}${conversationBody[index] ?? ""}`);
   })() : conversationBody;
   const codeCopyTargets = conversation.flatMap((item, index) => {
     if (item.codeCopy === undefined || index >= bodyHeight)
       return [];
     const trimmed = item.text.trimEnd();
     const leading = trimmed.length - trimmed.trimStart().length;
-    const xStart = displayWidth(trimmed.slice(0, leading)) + 1;
-    const xEnd = Math.min(displayWidth(trimmed), layout.conversationWidth);
+    const xStart = conversationXStart + displayWidth(trimmed.slice(0, leading));
+    const xEnd = Math.min(conversationXStart - 1 + displayWidth(trimmed), width);
     return xEnd >= xStart ? [{ xStart, xEnd, y: index + 1, text: item.codeCopy }] : [];
   });
+  const overlayTargets = conversation.flatMap((item, index) => {
+    if (!item.pickerTarget || index >= bodyHeight)
+      return [];
+    return [{ xStart: 1, xEnd: layout.conversationWidth, y: index + 1, ...item.pickerTarget }];
+  });
+  const sidePanelTargets = (sideColumn?.targets ?? []).map((target) => ({
+    xStart: 1,
+    xEnd: layout.sideWidth,
+    y: target.y + 1,
+    ...target.pickerTarget
+  }));
+  const topicPickerTargets = [...overlayTargets, ...sidePanelTargets];
+  const sidePanelTracks = (sideColumn?.tracks ?? []).map((track) => ({
+    ...track,
+    x: 1 + track.x,
+    yStart: track.yStart + 1
+  }));
+  const sideColumnBounds = sideColumn ? (() => {
+    const { topicsHeight, taskHeight } = sidePanelSectionHeights(layout, bodyHeight);
+    const sections = [];
+    let offset = 0;
+    if (layout.showTopicsPanel) {
+      sections.push({ panel: "topics", yStart: offset + 1, yEnd: offset + topicsHeight });
+      offset += topicsHeight;
+    }
+    if (layout.showTaskPanel) {
+      sections.push({ panel: "tasks", yStart: offset + 1, yEnd: offset + taskHeight });
+    }
+    return { xStart: 1, xEnd: layout.sideWidth, sections };
+  })() : null;
+  const sidePanelResizeHandle = sideColumn ? {
+    xStart: Math.max(1, layout.sideWidth),
+    xEnd: layout.sideWidth + SIDE_PANEL_GAP,
+    yStart: 1,
+    yEnd: bodyHeight
+  } : null;
   const cursorY = composer.cursor ? body.length + decision.length + composer.cursor.y : Number.POSITIVE_INFINITY;
   const overlayCursor = topicOverlayCursor(state, layout.conversationWidth, body.length);
-  const cursor = composer.cursor && cursorY <= height ? { x: Math.min(composer.cursor.x, width), y: cursorY } : overlayCursor && overlayCursor.y <= height ? overlayCursor : null;
+  const leftRows = [...body, ...decision, ...composer.lines, ...footer].slice(0, height);
+  let terminalPane = null;
+  let frameRows = leftRows;
+  if (layout.terminalWidth > 0) {
+    const leftWidth = width - layout.terminalWidth - TERMINAL_PANE_GAP;
+    const shellRows = shellPaneRows(extras.shell ?? null, layout.terminalWidth, leftRows.length);
+    const divider = paint("\u2502".repeat(TERMINAL_PANE_GAP), {
+      fg: state.terminalPaneFocused ? theme.borderActive : theme.border,
+      bg: theme.canvas
+    });
+    frameRows = leftRows.map((row, index) => `${padToWidth(row, leftWidth)}${divider}${shellRows[index] ?? ""}`);
+    terminalPane = {
+      xStart: leftWidth + TERMINAL_PANE_GAP + 1,
+      xEnd: width,
+      yStart: 1,
+      yEnd: leftRows.length,
+      dividerX: leftWidth + 1,
+      cols: layout.terminalWidth,
+      rows: leftRows.length
+    };
+  }
+  const shellCursor = terminalPane && state.terminalPaneFocused && extras.shell?.cursor ? {
+    x: terminalPane.xStart + extras.shell.cursor.x,
+    y: terminalPane.yStart + extras.shell.cursor.y
+  } : null;
+  const cursor = state.terminalPaneFocused && terminalPane ? shellCursor : composer.cursor && cursorY <= height ? { x: Math.min(composer.cursor.x, width), y: cursorY } : overlayCursor && overlayCursor.y <= height ? overlayCursor : null;
   return {
-    frame: linkifyUrls([...body, ...decision, ...composer.lines, ...footer].slice(0, height).join(`
+    frame: linkifyUrls(frameRows.join(`
 `)),
     cursor,
-    codeCopyTargets
+    codeCopyTargets,
+    topicPickerTargets,
+    sidePanelTracks,
+    sideColumnBounds,
+    sidePanelResizeHandle,
+    conversationBounds: {
+      xStart: conversationXStart,
+      xEnd: conversationXStart + layout.conversationWidth - 1
+    },
+    terminalPane
   };
 }
+function padToWidth(row, width) {
+  const visible = displayWidth(stripAnsi(row));
+  return visible >= width ? row : `${row}${paint(" ".repeat(width - visible), { bg: theme.canvas })}`;
+}
+function shellColorCode(color, background, fallback) {
+  if (color.kind === "rgb")
+    return background ? bg(color.rgb) : fg(color.rgb);
+  if (color.kind === "palette") {
+    const index = color.index;
+    if (index < 8)
+      return `${ESC}${(background ? 40 : 30) + index}m`;
+    if (index < 16)
+      return `${ESC}${(background ? 100 : 90) + index - 8}m`;
+    return `${ESC}${background ? 48 : 38};5;${index}m`;
+  }
+  return background ? bg(fallback) : fg(fallback);
+}
+function paintShellRun(run) {
+  if (colorDepth === "none")
+    return run.text;
+  const fgColor = run.inverse ? run.bg : run.fg;
+  const bgColor = run.inverse ? run.fg : run.bg;
+  const fgFallback = run.inverse ? theme.canvas : theme.text;
+  const bgFallback = run.inverse ? theme.text : theme.canvas;
+  return `${shellColorCode(fgColor, false, fgFallback)}${shellColorCode(bgColor, true, bgFallback)}${run.bold ? `${ESC}1m` : ""}${run.dim ? `${ESC}2m` : ""}${run.italic ? `${ESC}3m` : ""}${run.underline ? `${ESC}4m` : ""}${run.text}${RESET}`;
+}
+function shellPaneRows(snapshot, width, height) {
+  const rows = [];
+  for (let index = 0;index < height; index += 1) {
+    const runs = snapshot?.lines[index];
+    if (!runs) {
+      const text3 = !snapshot && index === 0 ? fit(" starting shell\u2026", width) : " ".repeat(width);
+      rows.push(paint(text3, { fg: theme.muted, bg: theme.canvas }));
+      continue;
+    }
+    let used = 0;
+    let row = "";
+    for (const run of runs) {
+      if (used >= width)
+        break;
+      if (used + run.width > width) {
+        row += paintShellRun({
+          ...run,
+          text: sliceWidth(run.text, width - used),
+          width: width - used
+        });
+        used = width;
+        break;
+      }
+      row += paintShellRun(run);
+      used += run.width;
+    }
+    if (used < width)
+      row += paint(" ".repeat(width - used), { bg: theme.canvas });
+    rows.push(row);
+  }
+  return rows;
+}
 function maxConversationScrollOffset(state, columns, rows) {
   const width = Math.max(1, columns);
   const height = Math.max(14, rows);
@@ -44761,9 +45275,9 @@ function maxConversationScrollOffset(state, columns, rows) {
   }
   if (state.overlay)
     return 0;
-  const bodyHeight = Math.max(3, height - footerLines(state, width).length - decisionPane(state, width).length - vaultRequestPane(state, width).length - composerPane(state, width).lines.length);
   const layout = terminalBodyLayout(state, width);
-  const lineCount = conversationContentLines(state, layout.conversationWidth, 0, terminalNowMs(), !layout.showTaskSidebar).length;
+  const bodyHeight = Math.max(3, height - footerLines(state, width).length - decisionPane(state, width).length - vaultRequestPane(state, width).length - composerPane(state, layout.conversationWidth).lines.length);
+  const lineCount = conversationContentLines(state, layout.conversationWidth, 0, terminalNowMs(), !layout.showTaskPanel).length;
   return conversationViewport(lineCount, bodyHeight, state.scrollOffset).maxOffset;
 }
 function preserveConversationScrollAnchor(previous, next, columns, rows) {
@@ -44801,7 +45315,7 @@ var theme, WORKING_FRAMES, CODE_COPY_MARKER = "\u29C9", WORKING_FRAME_INTERVAL_M
     default:
       return `${ESC}48;2;${rgb[0]};${rgb[1]};${rgb[2]}m`;
   }
-}, BARE_URL_PATTERN, URL_TRAILING_PUNCTUATION, RENDERED_TAB_WIDTH = 4, CIRCLED_DIGIT_START = 9312, CIRCLED_DIGIT_END = 9331, CIRCLED_ZERO = 9450, isWrapSpace = (character) => character === " " || character === "\t", isWideBreak = (character) => runeWidth(character) === 2, NO_ROW_START, NO_ROW_END, WRAP_MIN_WIDTH = 2, FRAME_MIN_INNER_WIDTH = 4, FRAME_TITLE_MIN_INNER_WIDTH = 8, TABLE_MAX_WIDTH_FRACTION = 0.92, TABLE_MIN_COL_WIDTH = 4, FILE_PREVIEW_MAX_LINES = 12, messageLayoutCache, INLINE_TASK_LIMIT = 5, TASK_SIDEBAR_MIN_WIDTH = 110, TASK_SIDEBAR_WIDTH = 36, TASK_SIDEBAR_GAP = 1, TOPIC_FILTER_ROW_INDEX = 2, TOPIC_FILTER_LABEL = "  Filter: ", COMPOSER_GUTTER = 4, COMPOSER_RIGHT_MARGIN = 1, COMPOSER_MIN_CONTENT_WIDTH = 4, NOTICE_STYLE;
+}, BARE_URL_PATTERN, URL_TRAILING_PUNCTUATION, RENDERED_TAB_WIDTH = 4, CIRCLED_DIGIT_START = 9312, CIRCLED_DIGIT_END = 9331, CIRCLED_ZERO = 9450, isWrapSpace = (character) => character === " " || character === "\t", isWideBreak = (character) => runeWidth(character) === 2, NO_ROW_START, NO_ROW_END, WRAP_MIN_WIDTH = 2, FRAME_MIN_INNER_WIDTH = 4, FRAME_TITLE_MIN_INNER_WIDTH = 8, TABLE_MAX_WIDTH_FRACTION = 0.92, TABLE_MIN_COL_WIDTH = 4, TOOL_PREVIEW_MAX_LINES = 12, messageLayoutCache, INLINE_TASK_LIMIT = 5, SIDE_PANEL_MIN_WIDTH = 110, SIDE_PANEL_GAP = 1, CONVERSATION_MIN_WIDTH = 60, TERMINAL_PANE_GAP = 1, TOPIC_FILTER_ROW_INDEX = 2, TOPIC_FILTER_LABEL = "  Filter: ", POPUP_PANE_MAX_WIDTH = 72, COMPOSER_GUTTER = 4, COMPOSER_RIGHT_MARGIN = 1, COMPOSER_MIN_CONTENT_WIDTH = 4, SHORTCUT_HINTS, NOTICE_STYLE;
 var init_render = __esm(async () => {
   init_color_depth();
   init_commands();
@@ -44842,6 +45356,11 @@ var init_render = __esm(async () => {
   NO_ROW_START = new Set(Array.from(".,;:!?)]}>\xBB\u201D\u2019\u3001\u3002\uFF0C\uFF0E\uFF01\uFF1F\uFF1A\uFF1B\uFF09\uFF3D\uFF5D\u3009\u300B\u300D\u300F\u3011\u3015\u30FB\u2026\u30FC"));
   NO_ROW_END = new Set(Array.from("([{<\xAB\u201C\u2018\uFF08\uFF3B\uFF5B\u3008\u300A\u300C\u300E\u3010\u3014"));
   messageLayoutCache = new WeakMap;
+  SHORTCUT_HINTS = [
+    "Ctrl-O topics \xB7 Ctrl-P panel \xB7 Ctrl-T terminal \xB7 Ctrl-G subagents \xB7 Ctrl-D decisions",
+    "Ctrl-O topics \xB7 Ctrl-P panel \xB7 Ctrl-T term \xB7 Ctrl-G agents \xB7 Ctrl-D decisions",
+    "^O topics \xB7 ^P panel \xB7 ^T term \xB7 ^G agents \xB7 ^D decisions"
+  ];
   NOTICE_STYLE = {
     info: { glyph: "\xB7", fg: theme.muted },
     success: { glyph: "\u2713", fg: theme.green },
@@ -45059,6 +45578,7 @@ function consumeMouseInput(raw) {
   let scrollDelta = 0;
   let horizontalScrollDelta = 0;
   const events = [];
+  const wheelEvents = [];
   const input = raw.replace(SGR_MOUSE_PATTERN, (_sequence, rawButton, rawX, rawY, suffix) => {
     const button = Number.parseInt(rawButton, 10);
     if (Number.isFinite(button) && (button & 64) !== 0) {
@@ -45068,6 +45588,10 @@ function consumeMouseInput(raw) {
         horizontalScrollDelta += delta;
       else
         scrollDelta += delta;
+      const x = Number.parseInt(rawX, 10);
+      const y = Number.parseInt(rawY, 10);
+      if (Number.isFinite(x) && Number.isFinite(y))
+        wheelEvents.push({ x, y, delta, horizontal });
     } else {
       const x = Number.parseInt(rawX, 10);
       const y = Number.parseInt(rawY, 10);
@@ -45082,11 +45606,14 @@ function consumeMouseInput(raw) {
     }
     return "";
   });
-  return { input, scrollDelta, horizontalScrollDelta, events };
+  return { input, scrollDelta, horizontalScrollDelta, events, wheelEvents };
 }
 function codeCopyTargetAt(targets, point) {
   return targets.find((target) => target.y === point.y && point.x >= target.xStart && point.x <= target.xEnd);
 }
+function topicPickerTargetAt(targets, point) {
+  return targets.find((target) => target.y === point.y && point.x >= target.xStart && point.x <= target.xEnd);
+}
 function escapeStopsActiveTurn(state) {
   if (state.overlay || state.creatingTopic)
     return false;
@@ -46254,12 +46781,16 @@ function columnSlice(value, from2, to) {
 }
 function screenSelectionText(lines, selection) {
   const [start, end] = ordered(selection);
+  const clipFrom = selection.paneClip ? selection.paneClip.xStart - 1 : 0;
+  const clipTo = selection.paneClip ? selection.paneClip.xEnd : Number.POSITIVE_INFINITY;
   const selected = [];
   for (let row = start.y;row <= end.y; row += 1) {
     const value = lines[row - 1] ?? "";
-    const from2 = row === start.y ? Math.max(0, start.x - 1) : 0;
-    const to = row === end.y ? Math.max(from2, end.x) : Number.POSITIVE_INFINITY;
-    selected.push(columnSlice(value, from2, to).trimEnd());
+    const rowFrom = row === start.y ? Math.max(0, start.x - 1) : 0;
+    const rowTo = row === end.y ? Math.max(rowFrom, end.x) : Number.POSITIVE_INFINITY;
+    const from2 = Math.max(rowFrom, clipFrom);
+    const to = Math.min(rowTo, clipTo);
+    selected.push(to > from2 ? columnSlice(value, from2, to).trimEnd() : "");
   }
   return selected.join(`
 `).replace(/\n+$/, "");
@@ -46300,14 +46831,18 @@ function highlightRow(value, from2, to) {
 }
 function highlightScreenSelection(frame, selection) {
   const [start, end] = ordered(selection);
+  const clipFrom = selection.paneClip ? selection.paneClip.xStart - 1 : 0;
+  const clipTo = selection.paneClip ? selection.paneClip.xEnd : Number.POSITIVE_INFINITY;
   return frame.split(`
 `).map((line2, index) => {
     const row = index + 1;
     if (row < start.y || row > end.y)
       return line2;
-    const from2 = row === start.y ? Math.max(0, start.x - 1) : 0;
-    const to = row === end.y ? Math.max(from2, end.x) : Number.POSITIVE_INFINITY;
-    return highlightRow(line2, from2, to);
+    const rowFrom = row === start.y ? Math.max(0, start.x - 1) : 0;
+    const rowTo = row === end.y ? Math.max(rowFrom, end.x) : Number.POSITIVE_INFINITY;
+    const from2 = Math.max(rowFrom, clipFrom);
+    const to = Math.min(rowTo, clipTo);
+    return to > from2 ? highlightRow(line2, from2, to) : line2;
   }).join(`
 `);
 }
@@ -46317,6 +46852,210 @@ var init_selection = __esm(() => {
   ANSI_PATTERN = new RegExp("\\u001b\\]8;[^\\u0007\\u001b]*(?:\\u0007|\\u001b\\\\)|\\u001b\\[[0-?]*[ -/]*[@-~]", "y");
 });
 
+// ../../adapters/terminal/src/shell-pane.ts
+import xterm from "@xterm/headless";
+function ptySupport() {
+  const candidate = globalThis.Bun?.Terminal;
+  return typeof candidate === "function" ? candidate : null;
+}
+function cellColor(isDefault, isPalette, isRgb, value) {
+  if (isDefault)
+    return DEFAULT_COLOR;
+  if (isPalette)
+    return { kind: "palette", index: value };
+  if (isRgb) {
+    return {
+      kind: "rgb",
+      rgb: [value >> 16 & 255, value >> 8 & 255, value & 255]
+    };
+  }
+  return DEFAULT_COLOR;
+}
+function sameColor(a, b) {
+  if (a.kind !== b.kind)
+    return false;
+  if (a.kind === "palette" && b.kind === "palette")
+    return a.index === b.index;
+  if (a.kind === "rgb" && b.kind === "rgb") {
+    return a.rgb[0] === b.rgb[0] && a.rgb[1] === b.rgb[1] && a.rgb[2] === b.rgb[2];
+  }
+  return true;
+}
+function sameStyle(a, b) {
+  return sameColor(a.fg, b.fg) && sameColor(a.bg, b.bg) && a.bold === b.bold && a.dim === b.dim && a.italic === b.italic && a.underline === b.underline && a.inverse === b.inverse;
+}
+function blankRun(width) {
+  return {
+    text: " ".repeat(width),
+    width,
+    fg: DEFAULT_COLOR,
+    bg: DEFAULT_COLOR,
+    bold: false,
+    dim: false,
+    italic: false,
+    underline: false,
+    inverse: false
+  };
+}
+function shellPastePayload(text3, bracketed) {
+  const safe = text3.replaceAll("\x1B[201~", "");
+  return bracketed ? `\x1B[200~${safe}\x1B[201~` : safe;
+}
+
+class ShellPane {
+  #xterm;
+  #pty;
+  #process;
+  #cols;
+  #rows;
+  #disposed = false;
+  constructor(options) {
+    const Pty = ptySupport();
+    if (!Pty)
+      throw new Error("the shell pane needs Bun >= 1.3.5 (Bun.Terminal)");
+    this.#cols = Math.max(2, options.cols);
+    this.#rows = Math.max(1, options.rows);
+    const Terminal = xterm.Terminal;
+    this.#xterm = new Terminal({
+      cols: this.#cols,
+      rows: this.#rows,
+      scrollback: 5000,
+      allowProposedApi: true
+    });
+    this.#pty = new Pty({
+      cols: this.#cols,
+      rows: this.#rows,
+      data: (_terminal, data) => {
+        if (this.#disposed)
+          return;
+        this.#xterm.write(data, options.onChange);
+      }
+    });
+    this.#xterm.onData((data) => {
+      if (!this.#disposed)
+        this.#pty.write(data);
+    });
+    const shell2 = options.shell || process.env.SHELL || "/bin/zsh";
+    const env = { ...options.env ?? process.env };
+    env.TERM = "xterm-256color";
+    env.COLORTERM = "truecolor";
+    delete env.TERM_SESSION_ID;
+    const spawn9 = globalThis.Bun.spawn;
+    this.#process = spawn9([shell2, "-l"], {
+      cwd: options.cwd ?? process.cwd(),
+      env,
+      terminal: this.#pty
+    });
+    this.#process.exited.then((code) => {
+      if (this.#disposed)
+        return;
+      this.dispose();
+      options.onExit(code);
+    });
+  }
+  get cols() {
+    return this.#cols;
+  }
+  get rows() {
+    return this.#rows;
+  }
+  get disposed() {
+    return this.#disposed;
+  }
+  write(data) {
+    if (this.#disposed || !data)
+      return;
+    this.#xterm.scrollToBottom();
+    this.#pty.write(data);
+  }
+  paste(text3) {
+    this.write(shellPastePayload(text3, this.#xterm.modes.bracketedPasteMode));
+  }
+  scroll(delta) {
+    if (this.#disposed || delta === 0)
+      return;
+    this.#xterm.scrollLines(-delta);
+  }
+  resize(cols, rows) {
+    const nextCols = Math.max(2, cols);
+    const nextRows = Math.max(1, rows);
+    if (this.#disposed || nextCols === this.#cols && nextRows === this.#rows)
+      return;
+    this.#cols = nextCols;
+    this.#rows = nextRows;
+    this.#xterm.resize(nextCols, nextRows);
+    this.#pty.resize(nextCols, nextRows);
+  }
+  snapshot() {
+    const buffer = this.#xterm.buffer.active;
+    const lines = [];
+    let reusable;
+    for (let y = 0;y < this.#rows; y += 1) {
+      const line2 = buffer.getLine(buffer.viewportY + y);
+      const runs = [];
+      let used = 0;
+      if (line2) {
+        for (let x = 0;x < this.#cols; x += 1) {
+          const cell = line2.getCell(x, reusable);
+          if (!cell)
+            break;
+          reusable = cell;
+          const width = cell.getWidth();
+          if (width === 0)
+            continue;
+          if (used + width > this.#cols)
+            break;
+          const style = {
+            fg: cellColor(cell.isFgDefault(), cell.isFgPalette(), cell.isFgRGB(), cell.getFgColor()),
+            bg: cellColor(cell.isBgDefault(), cell.isBgPalette(), cell.isBgRGB(), cell.getBgColor()),
+            bold: cell.isBold() !== 0,
+            dim: cell.isDim() !== 0,
+            italic: cell.isItalic() !== 0,
+            underline: cell.isUnderline() !== 0,
+            inverse: cell.isInverse() !== 0
+          };
+          const text3 = cell.getChars() || " ";
+          const last = runs[runs.length - 1];
+          if (last && sameStyle(last, style)) {
+            last.text += text3;
+            last.width += width;
+          } else {
+            runs.push({ text: text3, width, ...style });
+          }
+          used += width;
+        }
+      }
+      if (used < this.#cols)
+        runs.push(blankRun(this.#cols - used));
+      lines.push(runs);
+    }
+    const atLiveScreen = buffer.viewportY === buffer.baseY;
+    const hidden = this.#xterm._core?.coreService?.isCursorHidden;
+    return {
+      cols: this.#cols,
+      rows: this.#rows,
+      lines,
+      cursor: atLiveScreen && !hidden ? { x: Math.min(buffer.cursorX, this.#cols - 1), y: buffer.cursorY } : null
+    };
+  }
+  dispose() {
+    if (this.#disposed)
+      return;
+    this.#disposed = true;
+    try {
+      this.#process.kill();
+    } catch {}
+    try {
+      this.#pty.close();
+    } catch {}
+    this.#xterm.dispose();
+  }
+}
+var DEFAULT_COLOR;
+var init_shell_pane = __esm(() => {
+  DEFAULT_COLOR = { kind: "default" };
+});
+
 // ../../adapters/terminal/src/terminal-restore.ts
 import { writeSync } from "fs";
 function isRetryable(error2) {
@@ -46790,6 +47529,7 @@ class InputHistory {
 }
 
 // ../../adapters/terminal/src/app.ts
+import { hostname as hostname2 } from "os";
 function kittyKeyboardEnabled(env = process.env) {
   const value = env.NEGOTIUM_TUI_DISABLE_KITTY_KEYBOARD;
   return value !== "1" && value !== "true" && value !== "yes";
@@ -46808,18 +47548,20 @@ function canvasFill(depth2) {
       return `\x1B[48;2;${CANVAS_RGB[0]};${CANVAS_RGB[1]};${CANVAS_RGB[2]}m`;
   }
 }
-function altScreenSequences(env = process.env, savedDepth) {
+function workingDirectoryReport(cwd, host2 = hostname2()) {
+  const path = cwd.split("/").map((segment) => encodeURIComponent(segment)).join("/");
+  return `\x1B]7;file://${host2}${path}\x07`;
+}
+function altScreenSequences(env = process.env, savedDepth, cwd = process.cwd()) {
   const push = kittyKeyboardEnabled(env) ? KITTY_KEYBOARD_PUSH : "";
   const pop = kittyKeyboardEnabled(env) ? KITTY_KEYBOARD_POP : "";
   const depth2 = detectColorDepth({ env, isTty: true, savedDepth });
-  const colored = depth2 !== "none";
-  const setBackground = colored ? "\x1B]11;#0a0b0f\x07" : "";
   const fillCanvas = canvasFill(depth2);
-  const resetBackground = colored ? "\x1B]111\x07" : "";
-  const modeResets = "\x1B[0m\x1B[?7h\x1B[?1l\x1B[?1006l\x1B[?1002l\x1B[?2004l\x1B[?25h\x1B[?1049l";
+  const reportCwd = workingDirectoryReport(cwd);
+  const modeResets = "\x1B[0m\x1B[?7h\x1B[?1l\x1B[?1006l\x1B[?1003l\x1B[?2004l\x1B[?25h\x1B[?1049l";
   return {
-    enter: `${setBackground}\x1B[?1049h${fillCanvas}\x1B[2J\x1B[H\x1B[?25l\x1B[?2004h\x1B[?1002h\x1B[?1006h\x1B[?1l${push}`,
-    exit: `${END_SYNCHRONIZED_UPDATE}${pop}${modeResets}${resetBackground}`,
+    enter: `${reportCwd}\x1B[?1049h${fillCanvas}\x1B[2J\x1B[H\x1B[?25l\x1B[?2004h\x1B[?1003h\x1B[?1006h\x1B[?1l${push}`,
+    exit: `${END_SYNCHRONIZED_UPDATE}${pop}${modeResets}${reportCwd}`,
     abortEnter: `${END_SYNCHRONIZED_UPDATE}${modeResets}`
   };
 }
@@ -46858,9 +47600,19 @@ class TerminalApp {
   #messageHistory = new Map;
   #queuedRuntimeEvents = new Map;
   #selection = null;
+  #selectionDragging = false;
   #subagentGraphDragPoint = null;
   #plainFrameLines = [];
   #codeCopyTargets = [];
+  #topicPickerTargets = [];
+  #sidePanelTracks = [];
+  #sideColumnBounds = null;
+  #sidePanelResizeHandle = null;
+  #sidePanelDrag = null;
+  #sidePanelResizeDrag = null;
+  #shell = null;
+  #terminalPane = null;
+  #conversationBounds = null;
   #lastInterruptAt = 0;
   #subagentGraphGeneration = 0;
   #subagentGraphAbortController = null;
@@ -46981,8 +47733,9 @@ class TerminalApp {
     }
   }
   #handleRuntimeEvent(event) {
-    if (runtimeEventInvalidatesSelection(this.#state, event))
+    if (!this.#selectionDragging && runtimeEventInvalidatesSelection(this.#state, event)) {
       this.#selection = null;
+    }
     if (this.#messageLoadGeneration.has(event.topicId) && runtimeEventWaitsForMessageLoad(event)) {
       const queued = this.#queuedRuntimeEvents.get(event.topicId) ?? [];
       queued.push(event);
@@ -47234,8 +47987,19 @@ class TerminalApp {
   #render() {
     const columns = process.stdout.columns ?? 100;
     const rows = process.stdout.rows ?? 30;
-    const rendered = renderAppFrame(this.#state, columns, rows, this.#animationFrame);
+    const rendered = renderAppFrame(this.#state, columns, rows, this.#animationFrame, undefined, {
+      shell: this.#shell?.snapshot() ?? null
+    });
     this.#codeCopyTargets = rendered.codeCopyTargets;
+    this.#topicPickerTargets = rendered.topicPickerTargets;
+    this.#sidePanelTracks = rendered.sidePanelTracks;
+    this.#sideColumnBounds = rendered.sideColumnBounds;
+    this.#sidePanelResizeHandle = rendered.sidePanelResizeHandle;
+    this.#terminalPane = rendered.terminalPane;
+    this.#conversationBounds = rendered.conversationBounds;
+    if (this.#shell && rendered.terminalPane) {
+      this.#shell.resize(rendered.terminalPane.cols, rendered.terminalPane.rows);
+    }
     const baseFrame = rendered.frame;
     this.#plainFrameLines = stripAnsi(baseFrame).split(`
 `);
@@ -47602,6 +48366,10 @@ class TerminalApp {
   }
   #commitPaste(payload) {
     this.#selection = null;
+    if (this.#state.terminalPaneFocused && this.#shell) {
+      this.#shell.paste(payload);
+      return;
+    }
     if (this.#state.overlay === "topics") {
       const filterText = topicFilterPasteText(payload);
       if (filterText) {
@@ -47623,24 +48391,41 @@ class TerminalApp {
   }
   #handleKeySegment(segment) {
     const mouse = consumeMouseInput(segment);
-    if (mouse.horizontalScrollDelta !== 0 && (this.#state.overlay === "subagents" || this.#state.overlay === "decisions")) {
+    const { scrollDelta, horizontalScrollDelta } = this.#routeWheelEvents(mouse.wheelEvents);
+    if (horizontalScrollDelta !== 0 && (this.#state.overlay === "subagents" || this.#state.overlay === "decisions")) {
       this.#selection = null;
-      this.#panActiveGraph(-mouse.horizontalScrollDelta, 0);
+      this.#panActiveGraph(-horizontalScrollDelta, 0);
     }
-    if (mouse.scrollDelta !== 0) {
+    if (scrollDelta !== 0) {
       this.#selection = null;
-      this.#scroll(mouse.scrollDelta);
+      this.#scroll(scrollDelta);
     }
     for (const event of mouse.events) {
       if (this.#state.overlay === "subagents" || this.#state.overlay === "decisions") {
         this.#handleGraphMouse(event);
-      } else
-        this.#handleMouseSelection(event);
+        continue;
+      }
+      if (this.#handleSidePanelResizeDrag(event))
+        continue;
+      this.#focusPaneUnderPress(event);
+      if (this.#handleSidePanelScrollbarDrag(event))
+        continue;
+      if (this.#handlePickableRowMouse(event))
+        continue;
+      this.#handleMouseSelection(event);
     }
     const chunk = normalizeKeySequences(mouse.input);
     if (!chunk)
       return;
     this.#selection = null;
+    if (chunk === TERMINAL_PANE_KEY) {
+      this.#toggleTerminalPane();
+      return;
+    }
+    if (this.#state.terminalPaneFocused && this.#shell) {
+      this.#shell.write(chunk);
+      return;
+    }
     if (chunk === "\x03") {
       this.#handleInterrupt();
       return;
@@ -47674,10 +48459,17 @@ class TerminalApp {
       this.#toggleDecisionGraph();
       return;
     }
-    if (chunk === "\x14") {
+    if (chunk === "\x10") {
+      if (editingVaultSecret)
+        return;
+      this.#state = toggleTopicsPanel(this.#state);
+      this.#queueRender();
+      return;
+    }
+    if (chunk === "\x12") {
       if (editingVaultSecret)
         return;
-      this.#state = toggleTaskSidebar(this.#state);
+      this.#state = cycleTopicsPanelSort(this.#state);
       this.#queueRender();
       return;
     }
@@ -48099,7 +48891,7 @@ class TerminalApp {
       notice: undefined,
       noticeLevel: undefined
     };
-    if (text3.startsWith("/")) {
+    if (isKnownTerminalCommand(text3)) {
       await this.#runCommand(text3);
       return;
     }
@@ -48815,24 +49607,283 @@ class TerminalApp {
     }
     this.#queueRender();
   }
+  #routeWheelEvents(events) {
+    let scrollDelta = 0;
+    let horizontalScrollDelta = 0;
+    if (events.length === 0)
+      return { scrollDelta, horizontalScrollDelta };
+    const bounds = this.#sideColumnBounds;
+    const pane = this.#terminalPane;
+    let touchedPanel = false;
+    for (const event of events) {
+      if (pane && this.#shell && event.x >= pane.xStart && event.x <= pane.xEnd && !event.horizontal) {
+        this.#shell.scroll(event.delta);
+        touchedPanel = true;
+        continue;
+      }
+      const section = bounds && event.x >= bounds.xStart && event.x <= bounds.xEnd ? bounds.sections.find((s) => event.y >= s.yStart && event.y <= s.yEnd) : undefined;
+      if (!section) {
+        if (event.horizontal)
+          horizontalScrollDelta += event.delta;
+        else
+          scrollDelta += event.delta;
+        continue;
+      }
+      touchedPanel = true;
+      const columns = process.stdout.columns ?? 100;
+      const rows = process.stdout.rows ?? 30;
+      this.#state = section.panel === "topics" ? scrollTopicsPanel(this.#state, -event.delta, maxTopicsPanelScrollOffset(this.#state, columns, rows)) : scrollTaskPanel(this.#state, -event.delta, maxTaskPanelScrollOffset(this.#state, columns, rows));
+    }
+    if (touchedPanel)
+      this.#queueRender();
+    return { scrollDelta, horizontalScrollDelta };
+  }
+  #toggleTerminalPane() {
+    if (this.#state.terminalPaneOpen) {
+      const shell2 = this.#shell;
+      this.#shell = null;
+      shell2?.dispose();
+      this.#state = closeTerminalPane(this.#state);
+      this.#queueRender();
+      return;
+    }
+    if (!this.#shell) {
+      if (!ptySupport()) {
+        this.#state = {
+          ...this.#state,
+          notice: "Shell pane needs Bun >= 1.3.5 (bun upgrade)",
+          noticeLevel: "warn"
+        };
+        this.#queueRender();
+        return;
+      }
+      try {
+        const columns2 = process.stdout.columns ?? 100;
+        const rows = process.stdout.rows ?? 30;
+        const shell2 = new ShellPane({
+          cols: Math.max(30, Math.floor(columns2 * 0.3)),
+          rows: Math.max(1, rows),
+          cwd: process.cwd(),
+          onChange: () => this.#queueRender(),
+          onExit: () => {
+            if (this.#shell !== shell2)
+              return;
+            this.#shell = null;
+            this.#state = {
+              ...closeTerminalPane(this.#state),
+              notice: "Shell exited",
+              noticeLevel: "info"
+            };
+            this.#queueRender();
+          }
+        });
+        this.#shell = shell2;
+      } catch (error2) {
+        this.#state = {
+          ...this.#state,
+          notice: `Shell pane failed: ${error2 instanceof Error ? error2.message : String(error2)}`,
+          noticeLevel: "error"
+        };
+        this.#queueRender();
+        return;
+      }
+    }
+    this.#state = openTerminalPane(this.#state);
+    const columns = process.stdout.columns ?? 100;
+    if (maxTerminalPaneWidth(this.#state, columns) < 30 || columns < 92) {
+      this.#state = {
+        ...this.#state,
+        notice: "Window too narrow for the shell pane \u2014 widen it to see the pane",
+        noticeLevel: "warn"
+      };
+    }
+    this.#queueRender();
+  }
+  #focusPaneUnderPress(event) {
+    if (event.kind !== "press" || (event.button & 3) !== 0)
+      return;
+    const pane = this.#terminalPane;
+    const inside = !!pane && event.x >= pane.xStart && event.x <= pane.xEnd;
+    const next = focusTerminalPane(this.#state, inside && !!this.#shell);
+    if (next !== this.#state) {
+      this.#state = next;
+      this.#queueRender();
+    }
+  }
+  #handleSidePanelResizeDrag(event) {
+    if (event.kind === "press" && (event.button & 3) === 0) {
+      const pane = this.#terminalPane;
+      if (pane && event.x === pane.dividerX && event.y >= pane.yStart && event.y <= pane.yEnd) {
+        this.#sidePanelResizeDrag = { target: "terminal", startX: event.x, startWidth: pane.cols };
+        return true;
+      }
+      const handle = this.#sidePanelResizeHandle;
+      if (!handle || event.x < handle.xStart || event.x > handle.xEnd || event.y < handle.yStart || event.y > handle.yEnd) {
+        this.#sidePanelResizeDrag = null;
+        return false;
+      }
+      this.#sidePanelResizeDrag = {
+        target: "side",
+        startX: event.x,
+        startWidth: this.#state.sidePanelWidth
+      };
+      return true;
+    }
+    const drag = this.#sidePanelResizeDrag;
+    if (!drag)
+      return false;
+    if (event.kind === "release") {
+      this.#sidePanelResizeDrag = null;
+      return true;
+    }
+    const columns = process.stdout.columns ?? 100;
+    if (drag.target === "terminal") {
+      const nextWidth2 = drag.startWidth - (event.x - drag.startX);
+      this.#state = setTerminalPaneWidth(this.#state, nextWidth2, maxTerminalPaneWidth(this.#state, columns));
+      this.#queueRender();
+      return true;
+    }
+    const nextWidth = drag.startWidth + (event.x - drag.startX);
+    this.#state = setSidePanelWidth(this.#state, nextWidth, maxSidePanelWidth(columns));
+    this.#queueRender();
+    return true;
+  }
+  #handleSidePanelScrollbarDrag(event) {
+    if (event.kind === "press" && (event.button & 3) === 0) {
+      const track2 = this.#sidePanelTracks.find((t) => event.x === t.x && event.y >= t.yStart && event.y < t.yStart + t.viewportRows);
+      if (!track2) {
+        this.#sidePanelDrag = null;
+        return false;
+      }
+      const current3 = track2.panel === "topics" ? this.#state.topicsPanelScrollOffset : this.#state.taskPanelScrollOffset;
+      const thumb = scrollbarThumb(track2.rowCount, track2.viewportRows, current3);
+      this.#sidePanelDrag = {
+        panel: track2.panel,
+        track: track2,
+        grabRowOffset: event.y - (track2.yStart + thumb.top)
+      };
+      return true;
+    }
+    const drag = this.#sidePanelDrag;
+    if (!drag)
+      return false;
+    if (event.kind === "release") {
+      this.#sidePanelDrag = null;
+      return true;
+    }
+    const { track, grabRowOffset, panel } = drag;
+    const offset = scrollOffsetFromDragRow(track.rowCount, track.viewportRows, event.y - track.yStart, grabRowOffset);
+    const columns = process.stdout.columns ?? 100;
+    const rows = process.stdout.rows ?? 30;
+    this.#state = panel === "topics" ? setTopicsPanelScrollOffset(this.#state, offset, maxTopicsPanelScrollOffset(this.#state, columns, rows)) : setTaskPanelScrollOffset(this.#state, offset, maxTaskPanelScrollOffset(this.#state, columns, rows));
+    this.#queueRender();
+    return true;
+  }
+  #handlePickableRowMouse(event) {
+    const inOverlay = this.#state.overlay === "topics";
+    const hovering = event.kind === "drag" && (event.button & 3) === 3;
+    const isClick = event.kind === "press" && (event.button & 3) === 0;
+    if (!inOverlay && !hovering && !isClick)
+      return false;
+    const target = topicPickerTargetAt(this.#topicPickerTargets, { x: event.x, y: event.y });
+    if (inOverlay) {
+      if (!target)
+        return true;
+      const highlighted = this.#highlightPickedTarget(target);
+      if (!hovering && highlighted)
+        this.#selectPickedTopic();
+      return true;
+    }
+    if (target?.backgroundSessionId !== undefined) {
+      const sessionId = target.backgroundSessionId;
+      if (hovering) {
+        this.#setSidePanelHover(undefined, sessionId);
+        return true;
+      }
+      this.#setSidePanelHover(undefined, undefined);
+      this.#state = {
+        ...this.#state,
+        overlay: "background-session",
+        topicPickerBackgroundId: sessionId,
+        backgroundScrollOffset: 0,
+        notice: undefined,
+        noticeLevel: undefined
+      };
+      this.#queueRender();
+      return true;
+    }
+    if (target?.topicIndex === undefined) {
+      this.#setSidePanelHover(undefined, undefined);
+      return false;
+    }
+    const topic = this.#state.topics[target.topicIndex];
+    if (!topic)
+      return false;
+    if (hovering) {
+      this.#setSidePanelHover(topic.id, undefined);
+      return true;
+    }
+    this.#setSidePanelHover(undefined, undefined);
+    if (topic.id !== this.#state.activeTopicId)
+      this.#activateTopic(topic.id);
+    return true;
+  }
+  #setSidePanelHover(topicId, backgroundSessionId) {
+    if (this.#state.sidePanelHoverTopicId === topicId && this.#state.sidePanelHoverBackgroundSessionId === backgroundSessionId) {
+      return;
+    }
+    this.#state = {
+      ...this.#state,
+      sidePanelHoverTopicId: topicId,
+      sidePanelHoverBackgroundSessionId: backgroundSessionId
+    };
+    this.#queueRender();
+  }
+  #highlightPickedTarget(target) {
+    if (target.backgroundSessionId !== undefined) {
+      if (this.#state.topicPickerBackgroundId === target.backgroundSessionId)
+        return true;
+      this.#state = { ...this.#state, topicPickerBackgroundId: target.backgroundSessionId };
+    } else if (target.topicIndex !== undefined) {
+      if (!this.#state.topicPickerBackgroundId && this.#state.topicPickerIndex === target.topicIndex) {
+        return true;
+      }
+      this.#state = {
+        ...this.#state,
+        topicPickerIndex: target.topicIndex,
+        topicPickerBackgroundId: undefined
+      };
+    } else {
+      return false;
+    }
+    this.#queueRender();
+    return true;
+  }
   #handleMouseSelection(event) {
     if ((event.button & 3) !== 0 && event.kind !== "release")
       return;
-    const point = { x: event.x, y: event.y };
     if (event.kind === "press") {
+      const point = { x: event.x, y: event.y };
       const codeTarget = codeCopyTargetAt(this.#codeCopyTargets, point);
       if (codeTarget) {
         this.#selection = null;
         this.#copyCodeBlock(codeTarget.text);
         return;
       }
-      this.#selection = { anchor: point, focus: point };
+      const bounds = this.#sideColumnBounds;
+      const pane = this.#terminalPane;
+      const conversation = this.#conversationBounds;
+      const paneClip = bounds && point.x >= bounds.xStart && point.x <= bounds.xEnd ? { xStart: bounds.xStart, xEnd: bounds.xEnd } : pane && point.x >= pane.xStart && point.x <= pane.xEnd ? { xStart: pane.xStart, xEnd: pane.xEnd } : (bounds || pane) && conversation ? { xStart: conversation.xStart, xEnd: conversation.xEnd } : undefined;
+      this.#selection = { anchor: point, focus: point, paneClip };
+      this.#selectionDragging = true;
       this.#queueRender();
       return;
     }
+    if (event.kind === "release")
+      this.#selectionDragging = false;
     if (!this.#selection)
       return;
-    this.#selection = { ...this.#selection, focus: point };
+    this.#selection = { ...this.#selection, focus: { x: event.x, y: event.y } };
     if (event.kind === "drag") {
       this.#queueRender();
       return;
@@ -49073,6 +50124,8 @@ class TerminalApp {
     this.#finishRun = null;
   }
   async#cleanup(clientStartAttempted, uiActive) {
+    this.#shell?.dispose();
+    this.#shell = null;
     this.#subagentGraphGeneration += 1;
     this.#subagentGraphAbortController?.abort();
     this.#subagentGraphAbortController = null;
@@ -49114,7 +50167,7 @@ class TerminalApp {
       await this.#client.stop();
   }
 }
-var KITTY_KEYBOARD_PUSH = "\x1B[>1u", KITTY_KEYBOARD_POP = "\x1B[<u", CANVAS_RGB, ENTER_ALT_SCREEN, EXIT_ALT_SCREEN, ABORT_ENTER_ALT_SCREEN, NEW_TOPIC_KEY = "\x0E", DELETE_TOPIC_KEY = "\x04", FILTER_BACKSPACE_KEYS, CONFIRM_KEYS, CANCEL_KEYS, INPUT_CARRY_FLUSH_MS = 15;
+var KITTY_KEYBOARD_PUSH = "\x1B[>1u", KITTY_KEYBOARD_POP = "\x1B[<u", CANVAS_RGB, ENTER_ALT_SCREEN, EXIT_ALT_SCREEN, ABORT_ENTER_ALT_SCREEN, NEW_TOPIC_KEY = "\x0E", DELETE_TOPIC_KEY = "\x04", TERMINAL_PANE_KEY = "\x14", FILTER_BACKSPACE_KEYS, CONFIRM_KEYS, CANCEL_KEYS, INPUT_CARRY_FLUSH_MS = 15;
 var init_app = __esm(async () => {
   init_color_depth();
   init_commands();
@@ -49122,6 +50175,7 @@ var init_app = __esm(async () => {
   init_path_suggest();
   init_screen_renderer();
   init_selection();
+  init_shell_pane();
   init_subagent_graph();
   init_terminal_restore();
   await __promiseAll([
@@ -52518,8 +53572,8 @@ var init_canonical_mcp_bridge = __esm(async () => {
 });
 
 // ../../adapters/otium/src/secure-transport.ts
-function isLoopbackHostname(hostname2) {
-  const normalized = hostname2.toLowerCase();
+function isLoopbackHostname(hostname3) {
+  const normalized = hostname3.toLowerCase();
   if (normalized === "localhost" || normalized === "::1" || normalized === "[::1]")
     return true;
   const octets = normalized.split(".");
@@ -55727,7 +56781,7 @@ __export(exports_join_cli, {
   localNodeNameDefault: () => localNodeNameDefault,
   joinCommand: () => joinCommand
 });
-import { hostname as hostname2 } from "os";
+import { hostname as hostname3 } from "os";
 function option2(args, name) {
   const index = args.indexOf(`--${name}`);
   return index >= 0 ? args[index + 1]?.trim() : undefined;
@@ -55749,7 +56803,7 @@ function localNodeNameDefault() {
     if (normalized)
       return normalized;
   }
-  return normalizeNodeNameCandidate(hostname2());
+  return normalizeNodeNameCandidate(hostname3());
 }
 async function confirmEnrollment(message2) {
   if (!process.stdin.isTTY)
@@ -59178,4 +60232,4 @@ switch (command) {
   }
 }
 
-//# debugId=CF7D25563A652B9264756E2164756E21
+//# debugId=3A2E1C01E70CD8A864756E2164756E21