@agimon-ai/po-team 0.0.0-alpha.2 → 0.0.0-alpha.21

package/dist/extensions/web.mjs

@@ -1,7 +1,7 @@
 import { defineActivityGroup, defineChannelFile, defineContextAction, defineFill, defineLeaderBinding, defineSessionStore, defineSlot, defineSlotFile, defineToolRenderer, defineWebPlugin, pluginApiUrl, sessionApiAddress } from "@agimon-ai/po-core/web";
-import { ArrowRightIcon, Badge, Button, CloseIcon, Dialog, DialogBody, DialogContent, DialogFooter, DialogHeader, DialogTitle, Dot, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, EmptyState, Input, Kbd, KebabIcon, MessageItem, MessageItemBody, MessageItemHeader, MessageItemStatus, Panel, STATUS_EDGE, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Sheet, SheetBody, SheetContent, SheetHeader, SheetTitle, StatusBadge, Textarea, UsersIcon, cn, toolTone } from "@agimon-ai/po-web-components";
+import { AgentAvatar, ArrowRightIcon, Badge, Button, ChevronDownIcon, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, Input, KebabIcon, MessageItem, MessageItemBody, MessageItemHeader, MessageItemStatus, Panel, STATUS_EDGE, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, SendIcon, Sheet, SheetBody, SheetContent, SheetHeader, SheetTitle, StatusBadge, Textarea, UsersIcon, cn, toolTone } from "@agimon-ai/po-web-components";
 import { useStore } from "@tanstack/react-store";
-import { useEffect, useState } from "react";
+import { useEffect, useId, useRef, useState } from "react";
 import { sealedTransport } from "@agimon-ai/po-web-security/browser";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/types/webSubagents.ts
@@ -124,40 +124,6 @@ function closeCatalog(sessionId) {
 		launch: void 0
 	}));
 }
-function setCatalogFilter(sessionId, filter) {
-	catalog.update(sessionId, (current) => ({
-		...current,
-		filter
-	}));
-}
-function selectAgent(sessionId, name) {
-	catalog.update(sessionId, (current) => ({
-		...current,
-		selected: name
-	}));
-}
-function toggleInspect(sessionId, name) {
-	catalog.update(sessionId, (current) => ({
-		...current,
-		inspected: current.inspected === name ? void 0 : name
-	}));
-}
-function openLaunch(sessionId, agent, fork) {
-	catalog.update(sessionId, (current) => ({
-		...current,
-		selected: agent,
-		launch: {
-			agent,
-			fork
-		}
-	}));
-}
-function closeLaunch(sessionId) {
-	catalog.update(sessionId, (current) => ({
-		...current,
-		launch: void 0
-	}));
-}
 /** Each drawer opening owns one request and cancels it when the drawer leaves. */
 function loadCatalog(sessionId) {
 	const controller = new AbortController();
@@ -238,18 +204,26 @@ function abbreviateCwd(cwd) {
 	if (!match) return cwd;
 	return `~${cwd.slice(match[0].length)}`;
 }
-/**
-* What to call a run on screen.
-*
-* Prefers the generated identity, because a fan-out of one agent otherwise
-* renders as N rows reading the same word. Falls back to the agent name for a
-* run projected before identities existed. Duplicated rather than imported
-* from `services/agentIdentity`, which reaches for `node:fs` and so cannot be
-* pulled into the browser bundle; that module owns minting, this owns display.
-*/
+/** What to call a run on screen: the identity's first name, else the agent name. Never a run id. */
 function agentRunLabel(run) {
-	const base = run.identity ?? run.agent;
-	return run.inline ? `${base} (inline)` : base;
+	return agentDisplay(run).name;
+}
+function capitalize(word) {
+	return word.charAt(0).toUpperCase() + word.slice(1);
+}
+/** `faris-c-6` reads "Faris"; a run without an identity reads as its agent name. */
+function agentDisplay(run) {
+	const first = run.identity?.split("-")[0];
+	if (!run.identity || !first) return {
+		name: run.agent,
+		role: "",
+		seed: run.agent
+	};
+	return {
+		name: capitalize(first),
+		role: run.agent,
+		seed: run.identity
+	};
 }
 //#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/_lib/runActionsSlot.ts
@@ -376,7 +350,6 @@ const subagentRunsChannel = subagents.channel({
 });
 //#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/_lib/launchCommand.ts
-const META_TOOL_LIMIT = 3;
 /** Rows whose name, source, package, description or a tool contains the filter, case-insensitively. */
 function filterCatalog(agents, filter) {
 	const needle = filter.trim().toLowerCase();
@@ -389,28 +362,6 @@ function filterCatalog(agents, filter) {
 		...agent.tools
 	].some((field) => field.toLowerCase().includes(needle)));
 }
-const SECTION_LABEL = {
-	project: "PROJECT",
-	user: "USER",
-	plugin: "PACKAGES"
-};
-/** The catalog's sections, nearest source first, keeping the payload's order inside each; empty ones are left out. */
-function groupCatalog(agents) {
-	const sections = [];
-	for (const source of [
-		"project",
-		"user",
-		"plugin"
-	]) {
-		const members = agents.filter((agent) => agent.source === source);
-		if (members.length > 0) sections.push({
-			source,
-			label: SECTION_LABEL[source],
-			agents: members
-		});
-	}
-	return sections;
-}
 /** What the picker offers: the agent's own model and fallbacks first, then the team's, without repeats. */
 function modelChoices(agent, models) {
 	const seen = /* @__PURE__ */ new Set();
@@ -426,255 +377,440 @@ function modelChoices(agent, models) {
 	}
 	return choices;
 }
-/** The row's one-liner: what tools it may use, how many skills, and how it starts. */
-function agentMeta(agent) {
-	return `${agent.tools.length === 0 ? "all tools" : `tools ${agent.tools.slice(0, META_TOOL_LIMIT).join(", ")}${agent.tools.length > META_TOOL_LIMIT ? ` +${agent.tools.length - META_TOOL_LIMIT}` : ""}`}${agent.skills.length > 0 ? ` · ${agent.skills.length} skill${agent.skills.length === 1 ? "" : "s"}` : ""} · ${agent.defaultContext === "fork" ? "forks the session" : "fresh context"}`;
-}
 //#endregion
-//#region src/extensions/workspaces/sessions/(frontend)/_components/AgentCatalogDrawer.tsx
-const INPUT_TAG = "INPUT";
-function shortModel(model) {
-	return model.split("/").pop() ?? model;
-}
-/** The unfolded row: what the definition names, read-only, the way the TUI catalog's tabs show it. */
-function Resources({ agent }) {
-	const rows = [
-		["tools", agent.tools.length > 0 ? agent.tools.join(", ") : "every tool the session has"],
-		["skills", agent.skills.length > 0 ? agent.skills.join(", ") : "none named"],
-		["extensions", agent.extensions.length > 0 ? agent.extensions.join(", ") : "none named"],
-		["model", agent.model ?? "runtime default"],
-		["file", agent.filePath]
-	];
-	return /* @__PURE__ */ jsx("dl", {
-		"data-testid": `catalog-resources-${agent.name}`,
-		className: "flex flex-col gap-1 pt-1 text-sm",
-		children: rows.map(([label, value]) => /* @__PURE__ */ jsxs("div", {
-			className: "flex gap-2",
-			children: [/* @__PURE__ */ jsx("dt", {
-				className: "w-16 shrink-0 text-doom-dim",
-				children: label
-			}), /* @__PURE__ */ jsx("dd", {
-				className: "min-w-0 break-words text-doom-dim",
-				children: value
-			})]
-		}, label))
-	});
-}
-function AgentRow({ agent, selected, inspected, onSelect, onLaunch, onInspect }) {
-	return /* @__PURE__ */ jsxs("div", {
-		role: "option",
-		"aria-selected": selected,
-		tabIndex: -1,
-		"data-testid": `catalog-agent-${agent.name}`,
-		"data-selected": selected,
-		onClick: onSelect,
-		onDoubleClick: () => onLaunch(false),
-		className: `flex cursor-pointer flex-col gap-1 border-l-2 px-4 py-2 ${selected ? "border-doom-blue bg-doom-panel" : "border-transparent hover:bg-doom-panel/60"}`,
-		children: [
-			/* @__PURE__ */ jsxs("div", {
-				className: "flex min-w-0 items-center gap-2",
-				children: [
-					/* @__PURE__ */ jsx("span", {
-						className: "truncate text-base font-semibold text-doom-hi",
-						children: agent.name
-					}),
-					/* @__PURE__ */ jsx(Badge, {
-						size: "xs",
-						className: "shrink-0",
-						children: agent.packageName ?? agent.source
-					}),
-					/* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1" }),
-					/* @__PURE__ */ jsx("span", {
-						className: `shrink-0 text-sm ${agent.model ? "text-doom-cyan" : "text-doom-dim"}`,
-						children: agent.model ? shortModel(agent.model) : "agent default"
-					})
-				]
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "truncate text-sm text-doom-dim",
-				children: agent.description
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "truncate text-sm text-doom-dim",
-				children: agentMeta(agent)
-			}),
-			selected ? /* @__PURE__ */ jsxs("div", {
-				className: "flex items-center gap-3 pt-0.5",
-				children: [
-					/* @__PURE__ */ jsxs(Button, {
-						variant: "link",
-						size: "xs",
-						"data-testid": `catalog-launch-${agent.name}`,
-						className: "px-0",
-						onClick: (event) => {
-							event.stopPropagation();
-							onLaunch(false);
-						},
-						children: ["launch ", /* @__PURE__ */ jsx(Kbd, { children: "↵" })]
-					}),
-					/* @__PURE__ */ jsxs(Button, {
-						variant: "link",
-						size: "xs",
-						"data-testid": `catalog-fork-${agent.name}`,
-						className: "px-0 text-doom-dim",
-						onClick: (event) => {
-							event.stopPropagation();
-							onLaunch(true);
-						},
-						children: ["fork session ", /* @__PURE__ */ jsx(Kbd, { children: "f" })]
-					}),
-					/* @__PURE__ */ jsxs(Button, {
-						variant: "link",
-						size: "xs",
-						"data-testid": `catalog-inspect-${agent.name}`,
-						className: "px-0 text-doom-dim",
-						onClick: (event) => {
-							event.stopPropagation();
-							onInspect();
-						},
-						children: ["inspect ", /* @__PURE__ */ jsx(Kbd, { children: "i" })]
-					})
-				]
-			}) : null,
-			selected && inspected ? /* @__PURE__ */ jsx(Resources, { agent }) : null
-		]
+//#region src/extensions/workspaces/sessions/(frontend)/_components/AgentLauncherView.tsx
+const SOURCE_LABEL = {
+	project: "Project",
+	user: "User",
+	plugin: "Package"
+};
+function Choice({ label, value, onChange, options, disabled }) {
+	return /* @__PURE__ */ jsxs(Select, {
+		disabled,
+		value,
+		onValueChange: onChange,
+		children: [/* @__PURE__ */ jsx(SelectTrigger, {
+			"aria-label": label,
+			className: "h-9 w-full",
+			children: /* @__PURE__ */ jsx(SelectValue, {})
+		}), /* @__PURE__ */ jsx(SelectContent, { children: options.map(([key, text]) => /* @__PURE__ */ jsx(SelectItem, {
+			value: key,
+			children: text
+		}, key)) })]
 	});
 }
-/**
-* The agent catalog, in the subagents tab's drawer: every agent the session's
-* directory can launch, nearest definition first, with a filter and keys the
-* TUI catalog also answers to. Launching hands the chosen agent to the dialog.
-*/
-function AgentCatalogDrawer({ sessionId, onClose, onLaunch }) {
-	const state = useStore(catalog.store, (current) => catalog.select(current, sessionId));
-	const shown = filterCatalog(state.agents, state.filter);
-	const sections = groupCatalog(shown);
-	const selected = shown.find((agent) => agent.name === state.selected) ?? shown[0];
-	const move = (delta) => {
-		if (shown.length === 0) return;
-		const index = selected === void 0 ? -1 : shown.findIndex((agent) => agent.name === selected.name);
-		const next = shown[(index + delta + shown.length) % shown.length];
-		if (next) selectAgent(sessionId, next.name);
+/** Shared production presentation. The caller owns transport and session state. */
+function AgentLauncherView({ agents, models, initialSearch = "", initialSelected, initialTask = "", initialFork, loading = false, warning, cwd = "", catalogNote, runNote, onClose, onLaunch, onSource }) {
+	const [search, setSearch] = useState(initialSearch);
+	const [source, setSource] = useState("all");
+	const [selected, setSelected] = useState(initialSelected);
+	const [task, setTask] = useState(initialTask);
+	const [context, setContext] = useState(initialFork === void 0 ? void 0 : initialFork ? "fork" : "fresh");
+	const [model, setModel] = useState("default");
+	const [busy, setBusy] = useState(false);
+	const pending = useRef(false);
+	const [error, setError] = useState();
+	const shown = filterCatalog(agents, search).filter((agent) => source === "all" || agent.source === source);
+	const agent = selected === void 0 ? shown[0] : shown.find((item) => item.name === selected);
+	const runContext = context ?? agent?.defaultContext ?? "fresh";
+	const choose = (item) => {
+		setSelected(item.name);
+		setContext(item.defaultContext);
+		setModel("default");
+		setError(void 0);
 	};
-	const onKeyDown = (event) => {
-		const typing = event.target.tagName === INPUT_TAG;
-		if (event.key === "ArrowDown" || event.key === "ArrowUp") {
-			event.preventDefault();
-			move(event.key === "ArrowDown" ? 1 : -1);
-			return;
-		}
-		if (event.key === "Escape") {
-			event.preventDefault();
-			onClose();
-			return;
-		}
-		if (selected === void 0) return;
-		if (event.key === "Enter") {
-			event.preventDefault();
-			onLaunch(selected, false);
-			return;
+	const launch = async () => {
+		if (!agent || loading || pending.current) return;
+		pending.current = true;
+		setBusy(true);
+		setError(void 0);
+		try {
+			await onLaunch({
+				agent: agent.name,
+				task,
+				fork: runContext === "fork",
+				...model === "default" ? {} : { model }
+			});
+		} catch (cause) {
+			setError(cause instanceof Error ? cause.message : String(cause));
+		} finally {
+			pending.current = false;
+			setBusy(false);
 		}
-		if (typing) return;
-		if (event.key === "f") onLaunch(selected, true);
-		if (event.key === "i") toggleInspect(sessionId, selected.name);
 	};
-	return /* @__PURE__ */ jsxs("aside", {
-		"data-testid": "catalog-drawer",
-		tabIndex: 0,
-		onKeyDown,
-		className: "flex w-[min(440px,calc(100vw-24px))] shrink-0 flex-col overflow-hidden border-l border-doom-border bg-doom-rail outline-none",
+	const modelLabel = model === "default" ? agent?.model ?? "Runtime default" : model;
+	const contextLabel = runContext === "fresh" ? "Fresh context" : "This conversation";
+	return /* @__PURE__ */ jsxs(DialogContent, {
+		"data-testid": "launch-dialog",
+		className: "w-6xl",
+		"aria-describedby": "launcher-description",
 		children: [
+			/* @__PURE__ */ jsx(DialogHeader, {
+				dismissible: true,
+				closeLabel: "Close new agent run",
+				className: "p-6 sm:px-6",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "space-y-1",
+					children: [/* @__PURE__ */ jsx(DialogTitle, { children: "New agent run" }), /* @__PURE__ */ jsx(DialogDescription, {
+						id: "launcher-description",
+						children: "Choose an agent, review its setup, then give it a task."
+					})]
+				})
+			}),
 			/* @__PURE__ */ jsxs("div", {
-				className: "flex h-11 shrink-0 items-center gap-2.5 border-b border-doom-border px-4",
+				className: "grid min-h-0 overflow-y-auto md:grid-cols-3",
+				children: [/* @__PURE__ */ jsxs("aside", {
+					"aria-label": "Agent catalog",
+					onKeyDown: (event) => {
+						if (busy || event.target.getAttribute("role") === "combobox") return;
+						if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+							event.preventDefault();
+							const index = shown.findIndex((item) => item.name === agent?.name);
+							const next = shown[(index + (event.key === "ArrowDown" ? 1 : -1) + shown.length) % shown.length];
+							if (next) choose(next);
+						}
+						if (event.target.tagName === "INPUT") return;
+						if (event.key === "f") setContext("fork");
+						if (event.key === "i") {
+							const details = event.currentTarget.parentElement?.querySelector("details");
+							if (details) details.open = !details.open;
+						}
+					},
+					className: "flex flex-col gap-3 border-b border-po-border p-5 md:border-r md:border-b-0",
+					children: [
+						/* @__PURE__ */ jsx(Input, {
+							autoFocus: true,
+							"data-testid": "catalog-filter",
+							disabled: busy,
+							"aria-label": "Find an agent",
+							placeholder: "Find an agent…",
+							value: search,
+							onChange: (event) => setSearch(event.target.value)
+						}),
+						/* @__PURE__ */ jsx(Choice, {
+							disabled: busy,
+							label: "Source filter",
+							value: source,
+							onChange: setSource,
+							options: [
+								["all", "All sources"],
+								["project", "Project"],
+								["user", "User"],
+								["plugin", "Package"]
+							]
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex flex-col gap-1 py-2",
+							children: [
+								loading ? /* @__PURE__ */ jsx("p", {
+									role: "status",
+									className: "text-sm text-po-dim",
+									children: "Loading agents…"
+								}) : null,
+								warning ? /* @__PURE__ */ jsx("p", {
+									role: "alert",
+									className: "text-sm text-po-red",
+									children: warning
+								}) : null,
+								shown.map((item) => /* @__PURE__ */ jsxs(Button, {
+									variant: "ghost",
+									size: "card",
+									"aria-pressed": agent?.name === item.name,
+									className: agent?.name === item.name ? "border-l-4 border-po-green bg-po-selected/15" : "border-l-4 border-transparent",
+									disabled: busy,
+									onClick: () => {
+										choose(item);
+									},
+									children: [
+										/* @__PURE__ */ jsx("span", {
+											className: "font-semibold text-po-hi",
+											children: item.name
+										}),
+										/* @__PURE__ */ jsx("span", {
+											className: "text-sm text-po-dim",
+											children: item.description.split(".")[0]
+										}),
+										/* @__PURE__ */ jsxs("span", {
+											className: "text-sm text-po-dim",
+											children: [
+												SOURCE_LABEL[item.source],
+												" · ",
+												item.model ?? "Default model"
+											]
+										})
+									]
+								}, item.name)),
+								shown.length === 0 && !loading ? /* @__PURE__ */ jsxs("div", {
+									className: "space-y-3 py-6",
+									children: [
+										/* @__PURE__ */ jsx("p", {
+											className: "text-base text-po-hi",
+											children: "No matching agents"
+										}),
+										/* @__PURE__ */ jsx("p", {
+											className: "text-sm text-po-dim",
+											children: "Try another name or source."
+										}),
+										/* @__PURE__ */ jsx(Button, {
+											onClick: () => {
+												setSearch("");
+												setSource("all");
+											},
+											children: "Clear filters"
+										})
+									]
+								}) : null
+							]
+						}),
+						/* @__PURE__ */ jsxs("p", {
+							className: "mt-auto text-sm text-po-dim",
+							children: [
+								shown.length,
+								" agents",
+								catalogNote ? ` · ${catalogNote}` : ""
+							]
+						})
+					]
+				}), /* @__PURE__ */ jsx("section", {
+					className: "space-y-5 p-6 md:col-span-2",
+					"aria-label": "Agent definition and run",
+					children: agent ? /* @__PURE__ */ jsxs(Fragment, { children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "space-y-2",
+							children: [
+								/* @__PURE__ */ jsx("p", {
+									className: "text-sm text-po-dim",
+									children: "Agent definition"
+								}),
+								/* @__PURE__ */ jsxs("div", {
+									className: "flex items-center gap-3",
+									children: [/* @__PURE__ */ jsx("h2", {
+										className: "text-2xl font-semibold text-po-hi",
+										children: agent.name
+									}), /* @__PURE__ */ jsx(Badge, { children: SOURCE_LABEL[agent.source] })]
+								}),
+								/* @__PURE__ */ jsx("p", {
+									className: "text-base text-po-text",
+									children: agent.description
+								}),
+								/* @__PURE__ */ jsx("p", {
+									className: "break-all font-mono text-sm text-po-dim",
+									children: onSource?.(agent) ? /* @__PURE__ */ jsx("button", {
+										type: "button",
+										className: "text-left text-po-green underline",
+										onClick: onSource(agent),
+										children: agent.filePath
+									}) : agent.filePath
+								}),
+								agent.packageName ? /* @__PURE__ */ jsx("p", {
+									className: "text-sm text-po-dim",
+									children: agent.packageName
+								}) : null,
+								/* @__PURE__ */ jsxs("details", {
+									className: "text-base text-po-text",
+									children: [/* @__PURE__ */ jsx("summary", {
+										className: "cursor-pointer text-po-green",
+										children: "View instructions"
+									}), /* @__PURE__ */ jsx("p", {
+										className: "mt-2 whitespace-pre-wrap rounded-md bg-po-deep p-3 text-sm",
+										children: onSource?.(agent) ? /* @__PURE__ */ jsx(Button, {
+											variant: "link",
+											onClick: onSource(agent),
+											children: "Open source instructions"
+										}) : "Instructions stay in the source definition. File viewing is not available in this host."
+									})]
+								})
+							]
+						}),
+						/* @__PURE__ */ jsx("dl", {
+							className: "grid gap-x-6 gap-y-3 text-base sm:grid-cols-2",
+							children: [
+								["Model", agent.model ?? "Runtime default"],
+								["Tools", agent.tools.length ? agent.tools.join(" · ") : "All session tools (not narrowed)"],
+								["Fallback models", agent.fallbackModels.join(" · ") || "None specified"],
+								["Skills", agent.skills.join(" · ") || "None specified"],
+								["Default context", agent.defaultContext === "fresh" ? "Fresh" : "This conversation"],
+								["Extensions", agent.extensions.join(" · ") || "None specified"]
+							].map(([label, value]) => /* @__PURE__ */ jsxs("div", {
+								className: "space-y-1",
+								children: [/* @__PURE__ */ jsx("dt", {
+									className: "text-sm text-po-dim",
+									children: label
+								}), /* @__PURE__ */ jsx("dd", {
+									className: "break-words text-po-text",
+									children: value
+								})]
+							}, label))
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "space-y-3 border-t border-po-border pt-4",
+							children: [
+								/* @__PURE__ */ jsx("h3", {
+									className: "text-lg font-semibold text-po-hi",
+									children: "This run"
+								}),
+								/* @__PURE__ */ jsxs("label", {
+									className: "flex flex-col gap-1 text-base text-po-text",
+									children: ["Task", /* @__PURE__ */ jsx(Textarea, {
+										"data-testid": "launch-task",
+										disabled: busy,
+										placeholder: "What should the agent do? Leave empty to use its own prompt.",
+										onKeyDown: (event) => {
+											if (event.key === "Enter" && !event.shiftKey && !event.nativeEvent.isComposing) {
+												event.preventDefault();
+												launch();
+											}
+										},
+										rows: 3,
+										value: task,
+										onChange: (event) => {
+											setTask(event.target.value);
+											setError(void 0);
+										}
+									})]
+								}),
+								/* @__PURE__ */ jsxs("div", {
+									className: "grid gap-4 sm:grid-cols-2",
+									children: [/* @__PURE__ */ jsxs("div", {
+										className: "space-y-1",
+										children: [
+											/* @__PURE__ */ jsx("p", {
+												className: "text-base text-po-text",
+												children: "Context"
+											}),
+											/* @__PURE__ */ jsx(Choice, {
+												disabled: busy,
+												label: "Context",
+												value: runContext,
+												onChange: setContext,
+												options: [["fresh", "Fresh context"], ["fork", "This conversation"]]
+											}),
+											/* @__PURE__ */ jsx("p", {
+												className: "text-sm text-po-dim",
+												children: "Start clean, or include this conversation."
+											})
+										]
+									}), /* @__PURE__ */ jsxs("div", {
+										className: "space-y-1",
+										children: [
+											/* @__PURE__ */ jsx("p", {
+												className: "text-base text-po-text",
+												children: "Model override"
+											}),
+											/* @__PURE__ */ jsx(Choice, {
+												disabled: busy,
+												label: "Model override",
+												value: model,
+												onChange: setModel,
+												options: [["default", "Use agent default"], ...modelChoices(agent, models).map((choice) => [choice, choice])]
+											}),
+											/* @__PURE__ */ jsx("p", {
+												className: "text-sm text-po-dim",
+												children: "Changes apply only to this run."
+											})
+										]
+									})]
+								})
+							]
+						})
+					] }) : /* @__PURE__ */ jsx("p", {
+						className: "py-12 text-base text-po-dim",
+						children: "Choose an agent to review its definition. Clear the filters if no agents match."
+					})
+				})]
+			}),
+			/* @__PURE__ */ jsxs(DialogFooter, {
+				variant: "bar",
+				className: "gap-3 p-4 sm:px-6 sm:py-4",
 				children: [
-					/* @__PURE__ */ jsx("span", {
-						className: "text-lg font-semibold text-doom-hi",
-						children: "agent catalog"
-					}),
-					/* @__PURE__ */ jsxs(Badge, {
-						size: "xs",
-						"data-testid": "catalog-count",
+					/* @__PURE__ */ jsxs("div", {
+						className: "min-w-0 flex-1 space-y-1 text-sm text-po-dim",
 						children: [
-							state.agents.length,
-							" agent",
-							state.agents.length === 1 ? "" : "s"
+							/* @__PURE__ */ jsx("p", {
+								className: "break-words",
+								children: agent ? `${agent.name} · ${contextLabel} · ${modelLabel}` : "No agent selected"
+							}),
+							/* @__PURE__ */ jsx("p", {
+								role: "status",
+								children: runNote ?? `Enter starts the run · Shift+Enter for a new line${cwd ? ` · ${cwd}` : ""}`
+							}),
+							error ? /* @__PURE__ */ jsx("p", {
+								role: "alert",
+								className: "text-po-red",
+								children: error
+							}) : null
 						]
 					}),
-					/* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1" }),
-					/* @__PURE__ */ jsx(Kbd, { children: "SPC a l" }),
 					/* @__PURE__ */ jsx(Button, {
-						variant: "ghost",
-						size: "icon",
-						"data-testid": "catalog-close",
-						title: "close the catalog",
+						"data-testid": "launch-cancel",
 						onClick: onClose,
-						children: /* @__PURE__ */ jsx(CloseIcon, { className: "h-3 w-3" })
+						children: "Cancel"
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						"data-testid": "launch-submit",
+						variant: "primary",
+						disabled: !agent || busy || loading,
+						onClick: () => void launch(),
+						children: busy ? "Starting…" : "Start run"
 					})
 				]
-			}),
-			/* @__PURE__ */ jsx("div", {
-				className: "px-4 pt-2.5 pb-1.5",
-				children: /* @__PURE__ */ jsx(Input, {
-					"data-testid": "catalog-filter",
-					value: state.filter,
-					placeholder: "filter by name, source, or tool…",
-					autoFocus: true,
-					onChange: (event) => setCatalogFilter(sessionId, event.target.value)
-				})
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				role: "listbox",
-				className: "flex min-h-0 flex-1 flex-col overflow-y-auto pb-2",
-				children: [
-					state.loading ? /* @__PURE__ */ jsx("p", {
-						role: "status",
-						className: "px-4 py-3 text-sm text-doom-dim",
-						children: "loading agents..."
-					}) : null,
-					state.warning ? /* @__PURE__ */ jsx("p", {
-						role: "alert",
-						className: "px-4 py-3 text-sm text-doom-red",
-						children: state.warning
-					}) : null,
-					shown.length === 0 && !state.loading && !state.warning ? /* @__PURE__ */ jsx("p", {
-						"data-testid": "catalog-empty",
-						className: "px-4 py-3 text-sm text-doom-dim",
-						children: state.agents.length === 0 ? "no agents found for this session; add one under .po/agents or ~/.po/agent/agents" : "nothing matches the filter"
-					}) : null,
-					sections.map((section) => /* @__PURE__ */ jsxs("div", {
-						className: "flex flex-col",
-						children: [/* @__PURE__ */ jsx("span", {
-							className: "px-4 pt-2.5 pb-1 text-lg font-semibold text-doom-hi",
-							children: section.label
-						}), section.agents.map((agent) => /* @__PURE__ */ jsx(AgentRow, {
-							agent,
-							selected: selected?.name === agent.name,
-							inspected: state.inspected === agent.name,
-							onSelect: () => selectAgent(sessionId, agent.name),
-							onLaunch: (fork) => onLaunch(agent, fork),
-							onInspect: () => toggleInspect(sessionId, agent.name)
-						}, agent.name))]
-					}, section.source))
-				]
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "flex h-8 shrink-0 items-center justify-between border-t border-doom-border-soft bg-doom-deep px-4",
-				children: [/* @__PURE__ */ jsx("span", {
-					className: "text-sm text-doom-dim",
-					children: "↑↓ choose · enter launch · f fork · i inspect · esc close"
-				}), /* @__PURE__ */ jsxs("span", {
-					className: "text-sm text-doom-dim",
-					children: [
-						sections.length,
-						" source",
-						sections.length === 1 ? "" : "s"
-					]
-				})]
 			})
 		]
 	});
 }
 //#endregion
+//#region src/extensions/workspaces/sessions/(frontend)/_components/LaunchAgentDialog.tsx
+function LaunchAgentDialog({ sessionId, agent, agents, loading, warning, onSource, cwd, models, fork: initialFork, initialTask, onClose, onLaunched }) {
+	return /* @__PURE__ */ jsx(Dialog, {
+		open: true,
+		onOpenChange: (open) => {
+			if (!open) onClose();
+		},
+		children: /* @__PURE__ */ jsx(AgentLauncherView, {
+			agents: agents ?? (agent ? [agent] : []),
+			models,
+			initialSelected: agent?.name,
+			initialTask,
+			initialFork,
+			loading,
+			warning,
+			cwd,
+			onSource,
+			onClose,
+			onLaunch: async (request) => {
+				requestLaunch(sessionId, request.agent);
+				try {
+					await launchAgent(sessionId, request);
+					onLaunched();
+				} catch (cause) {
+					clearPendingLaunch(sessionId);
+					throw cause;
+				}
+			}
+		})
+	});
+}
+//#endregion
+//#region src/extensions/workspaces/sessions/(frontend)/_components/AgentCatalogDrawer.tsx
+/** The catalog now opens inside the centered launcher, retaining the session store. */
+function AgentCatalogDrawer({ sessionId, onClose, onSource }) {
+	const state = useStore(catalog.store, (current) => catalog.select(current, sessionId));
+	return /* @__PURE__ */ jsx(LaunchAgentDialog, {
+		sessionId,
+		agents: state.agents,
+		agent: state.agents.find((agent) => agent.name === (state.launch?.agent ?? state.selected)),
+		cwd: state.cwd,
+		models: state.models,
+		fork: state.launch?.fork,
+		initialTask: state.task,
+		loading: state.loading,
+		warning: state.warning,
+		onSource,
+		onClose,
+		onLaunched: onClose
+	});
+}
+//#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/_components/RunControl.tsx
 /** One run state, in the host's shared outcome vocabulary. */
 const RUN_BADGE = {
@@ -732,7 +868,7 @@ function RunControl({ sessionId, run, stopping }) {
 		role: "alert",
 		"data-testid": `run-stop-error-${run.runId}`,
 		title: error,
-		className: "min-w-0 truncate text-sm text-doom-red",
+		className: "min-w-0 truncate text-sm text-po-red",
 		children: error
 	}) : null, /* @__PURE__ */ jsx(Button, {
 		variant: stopping ? "outline" : "danger-outline",
@@ -746,370 +882,373 @@ function RunControl({ sessionId, run, stopping }) {
 	})] });
 }
 //#endregion
-//#region src/extensions/workspaces/sessions/(frontend)/_components/AgentThreadPanel.tsx
-const TICK_MS$2 = 1e4;
-/** The tab id doubles as the URL segment, so it stays plain and unique across plugins. */
-const TAB_ID_PREFIX = "subagents-run-";
-/** The temporary tab for one run; the host keeps this panel for as long as the tab is open. */
-function agentThreadTab(run) {
-	const runId = run.runId;
-	return {
-		id: `${TAB_ID_PREFIX}${runId}`,
-		label: agentRunLabel(run),
-		panel: (props) => /* @__PURE__ */ jsx(AgentThreadPanel, {
-			...props,
-			runId
+//#region src/extensions/workspaces/sessions/(frontend)/_components/AgentThreadView.tsx
+const NOT_REPORTED = "Not reported";
+const END_NOTE = {
+	done: "This run has finished. Start a new run from Agents.",
+	failed: "This run failed. Start a new run from Agents.",
+	stopped: "This run was stopped. Start a new run from Agents."
+};
+function InfoRow({ label, children }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex gap-3",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "w-24 shrink-0 text-sm text-po-dim",
+			children: label
+		}), /* @__PURE__ */ jsx("div", {
+			className: "min-w-0 flex-1 break-words text-base text-po-text",
+			children
+		})]
+	});
+}
+/** What the run is: the agent, what it was asked, and how it thinks. Only what the runtime recorded. */
+function RunInfo({ run }) {
+	const usage = [run?.toolCount === void 0 ? void 0 : `${run.toolCount} tools`, run?.tokens === void 0 ? void 0 : `${run.tokens.toLocaleString()} tokens`].filter(Boolean).join(" · ");
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsxs(InfoRow, {
+			label: "Agent",
+			children: [
+				/* @__PURE__ */ jsx("span", {
+					className: "font-semibold text-po-hi",
+					children: run?.agent ?? NOT_REPORTED
+				}),
+				run?.agentDescription ? /* @__PURE__ */ jsx("p", {
+					className: "text-po-dim",
+					children: run.agentDescription
+				}) : null,
+				run?.agentFilePath ? /* @__PURE__ */ jsx("p", {
+					className: "font-mono text-sm text-po-dim",
+					children: run.agentFilePath
+				}) : null
+			]
+		}),
+		/* @__PURE__ */ jsxs(InfoRow, {
+			label: "Model",
+			children: [run?.model ?? NOT_REPORTED, run?.model && run.modelSource === "configured" ? /* @__PURE__ */ jsx("span", {
+				className: "text-po-dim",
+				children: " · configured, not confirmed by the runtime"
+			}) : null]
+		}),
+		/* @__PURE__ */ jsx(InfoRow, {
+			label: "Thinking",
+			children: /* @__PURE__ */ jsx("span", {
+				className: "capitalize",
+				children: run?.thinking ?? NOT_REPORTED
+			})
+		}),
+		/* @__PURE__ */ jsx(InfoRow, {
+			label: "Prompt",
+			children: run?.promptWithheld ? /* @__PURE__ */ jsx("span", {
+				className: "text-po-dim",
+				children: "Withheld: this task was marked sensitive."
+			}) : /* @__PURE__ */ jsx("pre", {
+				className: "max-h-40 overflow-y-auto rounded-md bg-po-deep px-3 py-2 font-sans whitespace-pre-wrap break-words",
+				children: run?.task || NOT_REPORTED
+			})
+		}),
+		run?.taskRef ? /* @__PURE__ */ jsx(InfoRow, {
+			label: "Task",
+			children: /* @__PURE__ */ jsx(Badge, {
+				tone: "violet",
+				size: "xs",
+				className: "rounded-sm bg-po-violet/10",
+				children: run.taskRef
+			})
+		}) : null,
+		/* @__PURE__ */ jsx(InfoRow, {
+			label: "Folder",
+			children: /* @__PURE__ */ jsx("span", {
+				className: "font-mono text-sm",
+				children: run?.cwd ? abbreviateCwd(run.cwd) : NOT_REPORTED
+			})
+		}),
+		/* @__PURE__ */ jsx(InfoRow, {
+			label: "Usage",
+			children: /* @__PURE__ */ jsx("span", {
+				className: "text-po-dim",
+				children: usage || NOT_REPORTED
+			})
 		})
-	};
+	] });
 }
 /**
-* A run's own conversation on the host's transcript, under a header with
-* what the grid card knows: state, elapsed, model, the prompt's first line,
-* and stop while the run is going. The run can leave the fleet feed before
-* the reader is done; the thread stays, and the header says so.
+* One run's thread, read like the Conversation tab: a thin run strip, the
+* host transcript, a guidance composer while the run can hear it, and
+* read-only chips that all open the same run info. The container supplies
+* the transcript, the stop control and the real actions.
 */
-function AgentThreadPanel({ sessionId, runId, renderThread }) {
-	const { runs, stopRequested } = useStore(subagents.store, (state) => subagents.select(state, sessionId));
-	const run = runs.find((candidate) => candidate.runId === runId);
-	const [now, setNow] = useState(() => Date.now());
-	const [guidance, setGuidance] = useState("");
-	const [sending, setSending] = useState(false);
-	const [error, setError] = useState();
-	const [notice, setNotice] = useState();
-	useEffect(() => {
-		const timer = setInterval(() => setNow(Date.now()), TICK_MS$2);
-		return () => clearInterval(timer);
-	}, []);
-	const firstLine = run?.task.split("\n").find((line) => line.trim() !== "") ?? "";
-	const canSteer = sessionId !== null && run !== void 0 && !isTerminalRun(run);
-	const submitGuidance = async (event) => {
-		event.preventDefault();
-		const message = guidance.trim();
-		if (!canSteer || !message || sending) return;
-		setSending(true);
-		setError(void 0);
-		setNotice(void 0);
-		try {
-			const result = await steerRun(sessionId, runId, message);
-			if (result.state === "failed") {
-				setError(result.message);
-				return;
-			}
-			setGuidance("");
-			if (result.state === "pending") setNotice(result.message);
-		} catch (cause) {
-			setError(cause instanceof Error ? cause.message : String(cause));
-		} finally {
-			setSending(false);
-		}
+function AgentThreadView({ run, gone, elapsed, stopControl, thread, canSteer, stopping, guidance, sending, error, notice, onGuidanceChange, onSubmit, initialInfoOpen = false }) {
+	const [open, setOpen] = useState(initialInfoOpen);
+	const infoId = useId();
+	const badge = run ? RUN_BADGE[run.state] : void 0;
+	const chip = {
+		variant: "outline",
+		size: "md",
+		className: "min-w-0 max-w-full gap-2",
+		"aria-expanded": open,
+		"aria-controls": infoId,
+		onClick: () => setOpen((current) => !current)
 	};
+	const endNote = run && isTerminalRun(run) ? END_NOTE[run.state] : run?.canSteer === false && !gone ? "This runtime does not take guidance while it runs." : "Guidance is unavailable for this run.";
 	return /* @__PURE__ */ jsxs("div", {
 		"data-testid": "agent-thread-panel",
-		className: "flex min-h-0 flex-1 flex-col",
+		className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden bg-po-bg",
 		children: [
-			/* @__PURE__ */ jsx("div", {
+			/* @__PURE__ */ jsxs("div", {
 				"data-testid": "agent-thread-header",
-				className: "flex h-10 shrink-0 items-center gap-2.5 border-b border-doom-border-soft px-[26px]",
-				children: run ? /* @__PURE__ */ jsxs(Fragment, { children: [
+				className: "flex h-11 shrink-0 items-center gap-2.5 border-b border-po-border-soft bg-po-rail px-[26px]",
+				children: [
+					run ? /* @__PURE__ */ jsx(AgentAvatar, {
+						name: agentDisplay(run).name,
+						seed: agentDisplay(run).seed,
+						size: "sm"
+					}) : null,
 					/* @__PURE__ */ jsx("span", {
 						"data-testid": "agent-thread-agent",
-						className: "shrink-0 truncate text-base font-semibold text-doom-hi",
-						children: agentRunLabel(run)
+						className: "min-w-0 shrink truncate text-base font-semibold text-po-hi",
+						children: run ? agentRunLabel(run) : "Agent run"
 					}),
-					/* @__PURE__ */ jsx(StatusBadge, {
-						tone: RUN_BADGE[run.state].tone,
+					run && agentDisplay(run).role ? /* @__PURE__ */ jsx("span", {
+						className: "min-w-0 shrink truncate text-sm text-po-dim",
+						children: agentDisplay(run).role
+					}) : null,
+					badge ? /* @__PURE__ */ jsx(StatusBadge, {
+						tone: badge.tone,
 						"data-testid": "agent-thread-state",
-						children: RUN_BADGE[run.state].label
-					}),
-					/* @__PURE__ */ jsx("span", {
-						className: "shrink-0 text-sm text-doom-dim",
-						children: elapsedRun(run, now)
-					}),
-					run.model ? /* @__PURE__ */ jsx("span", {
-						className: "shrink-0 text-sm text-doom-dim",
-						children: run.model.split("/").pop() ?? run.model
+						className: "shrink-0",
+						children: stopping && run && !isTerminalRun(run) ? "STOPPING…" : badge.label
 					}) : null,
 					/* @__PURE__ */ jsx("span", {
-						"data-testid": "agent-thread-task",
-						className: "min-w-0 flex-1 truncate text-sm text-doom-dim",
-						children: firstLine
+						className: "min-w-0 flex-1 truncate text-sm text-po-dim",
+						children: elapsed
 					}),
-					sessionId !== null && !isTerminalRun(run) ? /* @__PURE__ */ jsx(RunControl, {
-						sessionId,
-						run,
-						stopping: stopRequested.includes(run.runId)
-					}) : null
-				] }) : /* @__PURE__ */ jsxs("span", {
-					"data-testid": "agent-thread-gone",
-					className: "text-sm text-doom-dim",
-					children: [
-						"run ",
-						runId.slice(0, 8),
-						" is no longer listed; its transcript stays readable"
-					]
-				})
+					stopControl
+				]
+			}),
+			gone ? /* @__PURE__ */ jsx("div", {
+				"data-testid": "agent-thread-gone",
+				className: "shrink-0 border-b border-po-border-soft px-[26px] py-2 text-sm text-po-dim",
+				children: "This run is no longer listed. Its thread stays readable."
+			}) : null,
+			/* @__PURE__ */ jsx("div", {
+				className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden",
+				children: thread
+			}),
+			/* @__PURE__ */ jsx("section", {
+				id: infoId,
+				"aria-label": "Run info",
+				"data-testid": "run-info",
+				hidden: !open,
+				className: "mx-[26px] mb-2 flex max-h-[40vh] shrink-0 flex-col gap-3 overflow-y-auto rounded-lg border border-po-border bg-po-panel px-4 py-3",
+				children: /* @__PURE__ */ jsx(RunInfo, { run })
 			}),
-			renderThread(runId),
 			canSteer ? /* @__PURE__ */ jsx("form", {
 				"data-testid": "agent-steer-composer",
-				className: "shrink-0 border-t border-doom-border-soft bg-doom-rail px-[26px] pt-3 pb-2.5",
-				onSubmit: (event) => void submitGuidance(event),
+				className: "shrink-0 px-[26px] pt-2 pb-2",
+				onSubmit: (event) => {
+					event.preventDefault();
+					onSubmit();
+				},
 				children: /* @__PURE__ */ jsxs("div", {
-					className: "rounded-lg border border-doom-border bg-doom-deep transition-colors focus-within:border-doom-blue/60",
+					className: "rounded-lg border border-po-border bg-po-panel transition-colors focus-within:border-po-blue/60",
 					children: [
-						/* @__PURE__ */ jsxs("div", {
-							className: "flex min-w-0 items-start gap-2.5 px-3.5 pt-3",
-							children: [/* @__PURE__ */ jsx("span", {
-								className: "mt-[3px] shrink-0 select-none text-base leading-none text-doom-green",
-								children: ">"
-							}), /* @__PURE__ */ jsx(Textarea, {
-								variant: "bare",
-								"data-testid": "agent-steer-input",
-								"aria-label": "Steering guidance",
-								rows: 2,
-								value: guidance,
-								readOnly: sending,
-								placeholder: "Guide this agent…",
-								className: "min-w-0 flex-1 text-base leading-relaxed",
-								onChange: (event) => setGuidance(event.target.value)
-							})]
+						/* @__PURE__ */ jsx(Textarea, {
+							variant: "bare",
+							"data-testid": "agent-steer-input",
+							"aria-label": "Steering guidance",
+							rows: 2,
+							value: guidance,
+							readOnly: sending,
+							disabled: stopping,
+							placeholder: stopping ? "Stopping, guidance paused" : "Guide this agent · it reads this at its next step",
+							className: "w-full px-4 pt-3 text-lg leading-relaxed",
+							onChange: (event) => onGuidanceChange(event.target.value),
+							onKeyDown: (event) => {
+								if (event.key !== "Enter" || event.shiftKey || event.nativeEvent.isComposing) return;
+								event.preventDefault();
+								event.currentTarget.form?.requestSubmit();
+							}
 						}),
 						error ? /* @__PURE__ */ jsx("p", {
 							role: "alert",
 							"data-testid": "agent-steer-error",
-							className: "px-3.5 pt-2 text-sm text-doom-red",
+							className: "px-4 pt-1 text-sm text-po-red",
 							children: error
 						}) : null,
 						/* @__PURE__ */ jsxs("div", {
-							className: "flex items-center gap-2 px-3.5 pt-2 pb-2.5",
+							className: "flex items-center gap-3 px-4 pt-1 pb-3",
 							children: [
+								/* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1" }),
 								/* @__PURE__ */ jsx("span", {
 									role: "status",
 									"data-testid": "agent-steer-hint",
-									className: "min-w-0 truncate text-sm text-doom-dim",
-									children: notice ?? "guidance reaches this run while it is still working"
+									title: notice,
+									className: "min-w-0 truncate text-sm text-po-dim",
+									children: notice ?? "Shift + Enter for a new line"
 								}),
-								/* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1" }),
-								/* @__PURE__ */ jsx(Button, {
+								/* @__PURE__ */ jsxs(Button, {
 									"data-testid": "agent-steer-submit",
 									type: "submit",
 									variant: "primary",
-									size: "md",
-									className: "px-3.5",
-									disabled: sending || guidance.trim() === "",
-									children: sending ? "sending…" : "send"
+									size: "lg",
+									className: "shrink-0 gap-2",
+									disabled: stopping || sending || guidance.trim() === "",
+									children: [/* @__PURE__ */ jsx(SendIcon, { className: "size-4" }), sending ? "Sending…" : "Send"]
 								})
 							]
 						})
 					]
 				})
-			}) : null
+			}) : /* @__PURE__ */ jsx("div", {
+				"data-testid": "agent-thread-end",
+				className: "shrink-0 px-[26px] pt-3 pb-2 text-sm text-po-dim",
+				children: endNote
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex shrink-0 flex-wrap items-center gap-2 px-[26px] pb-4",
+				children: [
+					/* @__PURE__ */ jsxs(Button, {
+						...chip,
+						"data-testid": "run-chip-agent",
+						children: [
+							/* @__PURE__ */ jsx("span", {
+								"aria-hidden": true,
+								className: "size-1.5 shrink-0 rounded-full bg-po-magenta"
+							}),
+							/* @__PURE__ */ jsx("span", {
+								className: "truncate",
+								children: run?.agent ?? "Agent"
+							}),
+							/* @__PURE__ */ jsx(ChevronDownIcon, {
+								"aria-hidden": true,
+								className: "size-3.5 shrink-0"
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs(Button, {
+						...chip,
+						"data-testid": "run-chip-model",
+						children: [
+							/* @__PURE__ */ jsx("span", {
+								"aria-hidden": true,
+								className: "size-1.5 shrink-0 rounded-full bg-po-green"
+							}),
+							/* @__PURE__ */ jsx("span", {
+								className: "truncate",
+								children: run?.model ? run.model.split("/").pop() ?? run.model : "Model not reported"
+							}),
+							run?.thinking ? /* @__PURE__ */ jsx("span", {
+								className: "shrink-0 text-po-dim",
+								children: run.thinking
+							}) : null,
+							/* @__PURE__ */ jsx(ChevronDownIcon, {
+								"aria-hidden": true,
+								className: "size-3.5 shrink-0"
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs(Button, {
+						...chip,
+						"data-testid": "run-chip-prompt",
+						children: [
+							/* @__PURE__ */ jsx("span", {
+								"aria-hidden": true,
+								className: "size-1.5 shrink-0 rounded-full bg-po-blue"
+							}),
+							"Prompt",
+							/* @__PURE__ */ jsx(ChevronDownIcon, {
+								"aria-hidden": true,
+								className: "size-3.5 shrink-0"
+							})
+						]
+					})
+				]
+			})
 		]
 	});
 }
 //#endregion
-//#region src/extensions/workspaces/sessions/(frontend)/_components/LaunchAgentDialog.tsx
-/** The picker's stand-in for "no override"; a Radix item cannot carry an empty value. */
-const AGENT_DEFAULT = "agent-default";
-const TASK_ROWS = 4;
-function FieldLabel({ children }) {
-	return /* @__PURE__ */ jsx("span", {
-		className: "text-base font-medium st text-doom-dim",
-		children
-	});
+//#region src/extensions/workspaces/sessions/(frontend)/_components/AgentThreadPanel.tsx
+const TICK_MS$2 = 1e4;
+/** The tab id doubles as the URL segment, so it stays plain and unique across plugins. */
+const TAB_ID_PREFIX = "subagents-run-";
+/** The temporary tab for one run; the host keeps this panel for as long as the tab is open. */
+function agentThreadTab(run) {
+	const runId = run.runId;
+	return {
+		id: `${TAB_ID_PREFIX}${runId}`,
+		label: agentRunLabel(run),
+		panel: (props) => /* @__PURE__ */ jsx(AgentThreadPanel, {
+			...props,
+			runId
+		}, `${props.sessionId}:${runId}`)
+	};
 }
 /**
-* Launches one agent from the catalog: the task, whether the child forks
-* this session, and a model override. The session server starts the child.
+* A run's own conversation on the host's transcript, with its live actions.
+* The run can leave the fleet feed before the reader is done; the thread and
+* what the run last reported stay, and the panel says so.
 */
-function LaunchAgentDialog({ sessionId, agent, cwd, models, fork: initialFork, initialTask, onClose, onLaunched }) {
-	const [task, setTask] = useState(initialTask);
-	const [fork, setFork] = useState(initialFork);
-	const [model, setModel] = useState(AGENT_DEFAULT);
-	const [busy, setBusy] = useState(false);
+function AgentThreadPanel({ sessionId, runId, renderThread }) {
+	const { runs, stopRequested } = useStore(subagents.store, (state) => subagents.select(state, sessionId));
+	const listed = runs.find((candidate) => candidate.runId === runId);
+	const [seen, setSeen] = useState(listed);
+	if (listed !== void 0 && listed !== seen) setSeen(listed);
+	const run = listed ?? seen;
+	const gone = listed === void 0;
+	const [now, setNow] = useState(() => Date.now());
+	const [guidance, setGuidance] = useState("");
+	const [sending, setSending] = useState(false);
 	const [error, setError] = useState();
-	const request = {
-		agent: agent.name,
-		task,
-		fork,
-		...model === AGENT_DEFAULT ? {} : { model }
-	};
-	const launch = async () => {
-		if (busy) return;
-		setBusy(true);
+	const [notice, setNotice] = useState();
+	useEffect(() => {
+		const timer = setInterval(() => setNow(Date.now()), TICK_MS$2);
+		return () => clearInterval(timer);
+	}, []);
+	const live = sessionId !== null && listed !== void 0 && !isTerminalRun(listed);
+	const stopping = stopRequested.includes(runId);
+	const canSteer = live && listed.canSteer !== false;
+	const submitGuidance = async () => {
+		const message = guidance.trim();
+		if (!canSteer || stopping || !message || sending) return;
+		setSending(true);
 		setError(void 0);
-		requestLaunch(sessionId, agent.name);
+		setNotice(void 0);
 		try {
-			await launchAgent(sessionId, request);
-			onLaunched();
+			const result = await steerRun(sessionId, runId, message);
+			if (result.state === "failed") {
+				setError(result.message);
+				return;
+			}
+			setGuidance("");
+			if (result.state === "pending") setNotice(result.message);
 		} catch (cause) {
-			clearPendingLaunch(sessionId);
 			setError(cause instanceof Error ? cause.message : String(cause));
 		} finally {
-			setBusy(false);
-		}
-	};
-	const onTaskKeyDown = (event) => {
-		if (event.key === "Enter" && !event.shiftKey) {
-			event.preventDefault();
-			launch();
+			setSending(false);
 		}
 	};
-	return /* @__PURE__ */ jsx(Dialog, {
-		open: true,
-		onOpenChange: (open) => {
-			if (!open) onClose();
-		},
-		children: /* @__PURE__ */ jsxs(DialogContent, {
-			width: "lg",
-			"data-testid": "launch-dialog",
-			"aria-describedby": void 0,
-			children: [/* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsxs("div", {
-				className: "flex min-w-0 flex-col items-start gap-1 sm:flex-row sm:items-center sm:gap-2.5",
-				children: [
-					/* @__PURE__ */ jsx("span", {
-						className: "text-sm text-doom-dim",
-						children: "launch subagent"
-					}),
-					/* @__PURE__ */ jsx(DialogTitle, {
-						"data-testid": "launch-agent",
-						className: "max-w-full break-words",
-						children: agent.name
-					}),
-					/* @__PURE__ */ jsx(Badge, {
-						size: "xs",
-						className: "max-w-full truncate",
-						children: agent.packageName ?? agent.source
-					})
-				]
-			}) }), /* @__PURE__ */ jsxs(DialogBody, { children: [
-				/* @__PURE__ */ jsx("p", {
-					className: "text-base leading-relaxed text-doom-dim",
-					children: agent.description
-				}),
-				/* @__PURE__ */ jsxs("div", {
-					className: "flex flex-col gap-1.5",
-					children: [
-						/* @__PURE__ */ jsx(FieldLabel, { children: "TASK" }),
-						/* @__PURE__ */ jsx(Textarea, {
-							"data-testid": "launch-task",
-							autoFocus: true,
-							rows: TASK_ROWS,
-							value: task,
-							placeholder: "what should the agent do? empty runs its own prompt",
-							onChange: (event) => setTask(event.target.value),
-							onKeyDown: onTaskKeyDown
-						}),
-						/* @__PURE__ */ jsx("span", {
-							className: "text-sm text-doom-dim",
-							children: "enter launches · shift+enter for a new line · @ for files"
-						})
-					]
-				}),
-				/* @__PURE__ */ jsxs("div", {
-					className: "flex flex-wrap gap-5",
-					children: [
-						/* @__PURE__ */ jsxs("div", {
-							className: "flex flex-col gap-1.5",
-							children: [
-								/* @__PURE__ */ jsx(FieldLabel, { children: "CONTEXT" }),
-								/* @__PURE__ */ jsxs("div", {
-									className: "flex flex-wrap gap-1.5",
-									children: [/* @__PURE__ */ jsx(Button, {
-										variant: fork ? "outline" : "primary",
-										size: "xs",
-										"data-testid": "launch-fresh",
-										"data-active": !fork,
-										onClick: () => setFork(false),
-										children: "fresh"
-									}), /* @__PURE__ */ jsx(Button, {
-										variant: fork ? "primary" : "outline",
-										size: "xs",
-										"data-testid": "launch-fork",
-										"data-active": fork,
-										onClick: () => setFork(true),
-										children: "fork this session"
-									})]
-								}),
-								/* @__PURE__ */ jsx("span", {
-									className: "text-sm text-doom-dim",
-									children: "fork shares the conversation so far"
-								})
-							]
-						}),
-						/* @__PURE__ */ jsxs("div", {
-							className: "flex flex-col gap-1.5",
-							children: [
-								/* @__PURE__ */ jsx(FieldLabel, { children: "MODEL" }),
-								/* @__PURE__ */ jsxs(Select, {
-									value: model,
-									onValueChange: setModel,
-									children: [/* @__PURE__ */ jsx(SelectTrigger, {
-										"data-testid": "launch-model",
-										className: "h-7 w-full min-w-0 sm:min-w-[200px]",
-										children: /* @__PURE__ */ jsx(SelectValue, {})
-									}), /* @__PURE__ */ jsxs(SelectContent, { children: [/* @__PURE__ */ jsxs(SelectItem, {
-										value: AGENT_DEFAULT,
-										children: ["agent default", agent.model ? ` · ${agent.model}` : ""]
-									}), modelChoices(agent, models).map((choice) => /* @__PURE__ */ jsx(SelectItem, {
-										value: choice,
-										children: choice
-									}, choice))] })]
-								}),
-								/* @__PURE__ */ jsx("span", {
-									className: "text-sm text-doom-dim",
-									children: "leave unset to use the agent's default"
-								})
-							]
-						}),
-						/* @__PURE__ */ jsxs("div", {
-							className: "flex flex-col gap-1.5",
-							children: [
-								/* @__PURE__ */ jsx(FieldLabel, { children: "CWD" }),
-								/* @__PURE__ */ jsx("span", {
-									className: "flex h-7 items-center text-sm text-doom-dim",
-									children: abbreviateCwd(cwd)
-								}),
-								/* @__PURE__ */ jsx("span", {
-									className: "text-sm text-doom-dim",
-									children: "the session's directory"
-								})
-							]
-						})
-					]
-				}),
-				error ? /* @__PURE__ */ jsx("p", {
-					role: "alert",
-					className: "text-sm text-doom-red",
-					children: error
-				}) : null,
-				/* @__PURE__ */ jsxs(DialogFooter, {
-					className: "flex-wrap sm:flex-nowrap",
-					children: [
-						/* @__PURE__ */ jsx("span", {
-							className: "w-full text-sm text-doom-dim sm:w-auto",
-							children: "the run opens in its own tab once it starts"
-						}),
-						/* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1" }),
-						/* @__PURE__ */ jsx(Button, {
-							variant: "outline",
-							size: "xs",
-							"data-testid": "launch-cancel",
-							onClick: onClose,
-							children: "cancel"
-						}),
-						/* @__PURE__ */ jsx(Button, {
-							variant: "primary",
-							size: "xs",
-							"data-testid": "launch-submit",
-							disabled: busy,
-							onClick: () => void launch(),
-							children: busy ? "launching…" : "launch"
-						})
-					]
-				})
-			] })]
-		})
+	return /* @__PURE__ */ jsx(AgentThreadView, {
+		run,
+		gone,
+		elapsed: run ? elapsedRun(gone ? {
+			...run,
+			endedAt: run.endedAt ?? run.lastUpdate
+		} : run, now) : void 0,
+		stopControl: live ? /* @__PURE__ */ jsx(RunControl, {
+			sessionId,
+			run: listed,
+			stopping
+		}) : void 0,
+		thread: renderThread(runId),
+		canSteer,
+		stopping,
+		guidance,
+		sending,
+		error,
+		notice,
+		onGuidanceChange: setGuidance,
+		onSubmit: () => void submitGuidance()
 	});
 }
 //#endregion
@@ -1131,22 +1270,22 @@ function WorkLine({ run }) {
 		children: [/* @__PURE__ */ jsxs(Badge, {
 			tone: "violet",
 			size: "xs",
-			className: "shrink-0 rounded-sm bg-doom-violet/10",
+			className: "shrink-0 rounded-sm bg-po-violet/10",
 			children: ["TASK ", run.taskRef]
 		}), /* @__PURE__ */ jsx("span", {
 			"data-testid": "run-work",
-			className: "min-w-0 truncate text-base text-doom-hi",
+			className: "min-w-0 truncate text-base text-po-hi",
 			children: firstLine
 		})]
 	});
 	return /* @__PURE__ */ jsxs("div", {
 		className: "flex items-center gap-2 px-3 pb-2.5",
 		children: [/* @__PURE__ */ jsx("span", {
-			className: "shrink-0 text-base font-medium text-doom-dim",
+			className: "shrink-0 text-base font-medium text-po-dim",
 			children: "Prompt"
 		}), /* @__PURE__ */ jsx("span", {
 			"data-testid": "run-work",
-			className: "min-w-0 truncate text-base text-doom-dim",
+			className: "min-w-0 truncate text-base text-po-dim",
 			children: firstLine
 		})]
 	});
@@ -1168,7 +1307,7 @@ function RunMenu({ sessionId, run, stopping, onOpenThread, onOpenDetail }) {
 		role: "alert",
 		"data-testid": `run-menu-stop-error-${run.runId}`,
 		title: error,
-		className: "min-w-0 truncate text-sm text-doom-red",
+		className: "min-w-0 truncate text-sm text-po-red",
 		children: error
 	}) : null, /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
 		asChild: true,
@@ -1219,6 +1358,7 @@ function RunMenu({ sessionId, run, stopping, onOpenThread, onOpenDetail }) {
 */
 function RunCard({ sessionId, run, now, stopping, renderThread, onOpenThread, onOpenDetail }) {
 	const badge = RUN_BADGE[run.state];
+	const who = agentDisplay(run);
 	const onKeyDown = (event) => {
 		if (event.target !== event.currentTarget) return;
 		if (event.key === "Enter" || event.key === " ") {
@@ -1228,7 +1368,7 @@ function RunCard({ sessionId, run, now, stopping, renderThread, onOpenThread, on
 	};
 	return /* @__PURE__ */ jsx(Panel, {
 		asChild: true,
-		className: cn("flex h-[280px] min-w-0 flex-col text-left transition-colors outline-none hover:border-doom-blue/50 focus-within:border-doom-blue", STATUS_EDGE[badge.tone]),
+		className: cn("flex h-[280px] min-w-0 flex-col text-left transition-colors outline-none hover:border-po-blue/50 focus-within:border-po-blue", STATUS_EDGE[badge.tone]),
 		children: /* @__PURE__ */ jsxs("div", {
 			"data-testid": `run-card-${run.runId}`,
 			"data-run-state": run.state,
@@ -1244,14 +1384,23 @@ function RunCard({ sessionId, run, now, stopping, renderThread, onOpenThread, on
 					/* @__PURE__ */ jsxs("div", {
 						className: "flex items-center gap-2 px-3 pt-2.5 pb-1.5",
 						children: [
+							/* @__PURE__ */ jsx(AgentAvatar, {
+								name: who.name,
+								seed: who.seed,
+								size: "sm"
+							}),
 							/* @__PURE__ */ jsx("span", {
 								"data-testid": "run-agent",
-								className: "truncate text-base font-semibold text-doom-hi",
-								children: agentRunLabel(run)
+								className: "truncate text-base font-semibold text-po-hi",
+								children: who.name
 							}),
+							who.role ? /* @__PURE__ */ jsx("span", {
+								className: "truncate text-sm text-po-dim",
+								children: who.role
+							}) : null,
 							/* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1" }),
 							/* @__PURE__ */ jsx("span", {
-								className: "shrink-0 text-sm text-doom-dim",
+								className: "shrink-0 text-sm text-po-dim",
 								children: elapsedRun(run, now)
 							}),
 							/* @__PURE__ */ jsx(StatusBadge, {
@@ -1264,7 +1413,7 @@ function RunCard({ sessionId, run, now, stopping, renderThread, onOpenThread, on
 					/* @__PURE__ */ jsx(WorkLine, { run }),
 					/* @__PURE__ */ jsx("div", {
 						"data-testid": "run-stream",
-						className: "pointer-events-none flex min-h-0 flex-1 flex-col overflow-hidden border-t border-doom-border-soft bg-doom-deep",
+						className: "pointer-events-none flex min-h-0 flex-1 flex-col overflow-hidden border-t border-po-border-soft bg-po-deep",
 						children: renderThread(run.runId, {
 							limit: CARD_THREAD_ENTRIES,
 							compact: true
@@ -1272,15 +1421,15 @@ function RunCard({ sessionId, run, now, stopping, renderThread, onOpenThread, on
 					}),
 					run.state === "failed" && run.error ? /* @__PURE__ */ jsx("span", {
 						"data-testid": "run-error",
-						className: "truncate border-t border-doom-border-soft px-3 py-1.5 text-sm text-doom-red",
+						className: "truncate border-t border-po-border-soft px-3 py-1.5 text-sm text-po-red",
 						children: run.error
 					}) : null
 				]
 			}), /* @__PURE__ */ jsxs("div", {
-				className: "flex shrink-0 items-center gap-3 border-t border-doom-border-soft px-3 py-1.5",
+				className: "flex shrink-0 items-center gap-3 border-t border-po-border-soft px-3 py-1.5",
 				children: [
 					/* @__PURE__ */ jsxs("span", {
-						className: "truncate text-sm text-doom-dim",
+						className: "truncate text-sm text-po-dim",
 						children: [
 							run.toolCount !== void 0 ? `${run.toolCount} tools` : "—",
 							run.tokens !== void 0 ? ` · ${run.tokens.toLocaleString()} tk` : "",
@@ -1300,11 +1449,11 @@ function RunCard({ sessionId, run, now, stopping, renderThread, onOpenThread, on
 		})
 	});
 }
-function SheetRow({ label, value, tone = "text-doom-dim" }) {
+function SheetRow({ label, value, tone = "text-po-dim" }) {
 	return /* @__PURE__ */ jsxs("div", {
 		className: "flex gap-2.5",
 		children: [/* @__PURE__ */ jsx("span", {
-			className: "w-11 shrink-0 text-sm text-doom-dim",
+			className: "w-11 shrink-0 text-sm text-po-dim",
 			children: label
 		}), /* @__PURE__ */ jsx("span", {
 			className: `min-w-0 break-words text-base ${tone}`,
@@ -1314,13 +1463,13 @@ function SheetRow({ label, value, tone = "text-doom-dim" }) {
 }
 function SheetBlock({ label, text, testId, tone }) {
 	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-1 rounded-md border border-doom-border bg-doom-deep px-3 py-2.5",
+		className: "flex flex-col gap-1 rounded-md border border-po-border bg-po-deep px-3 py-2.5",
 		children: [/* @__PURE__ */ jsx("span", {
-			className: "text-base font-medium text-doom-dim",
+			className: "text-base font-medium text-po-dim",
 			children: label
 		}), /* @__PURE__ */ jsx("pre", {
 			"data-testid": testId,
-			className: `overflow-x-auto whitespace-pre-wrap break-words text-base leading-relaxed ${tone ?? "text-doom-text"}`,
+			className: `overflow-x-auto whitespace-pre-wrap break-words text-base leading-relaxed ${tone ?? "text-po-text"}`,
 			children: text
 		})]
 	});
@@ -1353,7 +1502,7 @@ function RunDetailSheet({ sessionId, run, now, stopping, renderSlot, onClose })
 					}),
 					/* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1" }),
 					/* @__PURE__ */ jsx("span", {
-						className: "text-sm text-doom-dim",
+						className: "text-sm text-po-dim",
 						children: elapsedRun(run, now)
 					}),
 					renderSlot(RUN_ACTIONS_SLOT.slot),
@@ -1374,7 +1523,7 @@ function RunDetailSheet({ sessionId, run, now, stopping, renderSlot, onClose })
 						run.taskRef ? /* @__PURE__ */ jsx(SheetRow, {
 							label: "task",
 							value: run.taskRef,
-							tone: "text-doom-violet"
+							tone: "text-po-violet"
 						}) : null,
 						/* @__PURE__ */ jsx(SheetRow, {
 							label: "model",
@@ -1404,7 +1553,7 @@ function RunDetailSheet({ sessionId, run, now, stopping, renderSlot, onClose })
 					label: "FAILURE",
 					testId: "sheet-error",
 					text: run.error,
-					tone: "text-doom-red"
+					tone: "text-po-red"
 				}) : null
 			] })]
 		})
@@ -1413,14 +1562,14 @@ function RunDetailSheet({ sessionId, run, now, stopping, renderSlot, onClose })
 /**
 * The subagents tab: the focused session's fleet as a computed grid.
 *
-* Columns come from the available width (auto-fill over a 420px minimum), and
-* every card is the same height with the run's own live conversation
-* absorbing the slack, so the grid reads as a fleet rather than a ragged list.
+* Two columns when the tab is wide enough, one when narrow (a container query,
+* so the activity rail's width counts), and every card is the same height with
+* the run's own live conversation absorbing the slack, so the grid reads as a
+* fleet rather than a ragged list.
 * A card opens the run's tab; its menu opens the detail sheet over the grid.
-* The catalog to launch from still takes the right rail, because picking an
-* agent is a list beside the fleet rather than a thing about one run.
+* The catalog and run settings share a centered dialog over the unchanged fleet.
 */
-function SubagentsPanel({ sessionId, renderSlot, renderThread, openTransientTab }) {
+function SubagentsPanel({ sessionId, renderSlot, renderThread, openTransientTab, fileTabFor }) {
 	const runs = useStore(subagents.store, (state) => visibleRuns(subagents.select(state, sessionId)));
 	const { openRunId, stopRequested, autoOpenRunId } = useStore(subagents.store, (state) => subagents.select(state, sessionId));
 	const shelf = useStore(catalog.store, (state) => catalog.select(state, sessionId));
@@ -1445,7 +1594,6 @@ function SubagentsPanel({ sessionId, renderSlot, renderThread, openTransientTab
 		openTransientTab
 	]);
 	const shownRun = openRunId === void 0 ? void 0 : runs.find((run) => run.runId === openRunId);
-	const launching = shelf.launch === void 0 ? void 0 : shelf.agents.find((agent) => agent.name === shelf.launch?.agent);
 	const stopping = (run) => stopRequested.includes(run.runId);
 	const runningTally = runs.filter((run) => run.state === "running" || run.state === "queued").length;
 	const doneTally = runs.filter((run) => run.state === "done").length;
@@ -1460,37 +1608,43 @@ function SubagentsPanel({ sessionId, renderSlot, renderThread, openTransientTab
 		className: "flex min-h-0 min-w-0 flex-1 overflow-hidden",
 		children: [
 			/* @__PURE__ */ jsxs("div", {
-				className: "flex min-w-0 flex-1 flex-col overflow-y-auto px-3 py-3 sm:px-[26px] sm:py-[18px]",
+				className: "@container flex min-w-0 flex-1 flex-col overflow-y-auto px-3 py-3 sm:px-[26px] sm:py-[18px]",
 				children: [/* @__PURE__ */ jsxs("div", {
 					className: "flex flex-wrap items-center gap-x-3 gap-y-2 pb-3",
 					children: [
 						/* @__PURE__ */ jsx("span", {
-							className: "text-lg font-semibold text-doom-hi",
-							children: "Subagents · this session"
+							className: "text-lg font-semibold text-po-hi",
+							children: "Agents · this session"
 						}),
 						/* @__PURE__ */ jsx("span", { className: "hidden min-w-0 flex-1 sm:block" }),
 						/* @__PURE__ */ jsx("span", {
 							"data-testid": "subagents-tally",
-							className: "order-3 w-full text-sm text-doom-dim sm:order-none sm:w-auto",
+							className: "order-3 w-full text-sm text-po-dim sm:order-none sm:w-auto",
 							children: runs.length === 0 ? "no runs yet" : `${runningTally} running · ${doneTally} done · ${failedTally} failed`
 						}),
-						/* @__PURE__ */ jsxs(Button, {
-							variant: "outline",
-							size: "xs",
+						/* @__PURE__ */ jsx(Button, {
+							variant: "primary",
 							className: "ml-auto sm:ml-0",
 							"data-testid": "subagents-launch",
 							title: "pick an agent from the catalog and launch it",
 							onClick: showCatalog,
-							children: ["launch agent ", /* @__PURE__ */ jsx(Kbd, { children: "a l" })]
+							children: "New agent run"
 						})
 					]
-				}), runs.length === 0 ? /* @__PURE__ */ jsx(EmptyState, {
+				}), runs.length === 0 ? /* @__PURE__ */ jsxs("div", {
 					"data-testid": "subagents-empty",
-					title: "no subagent runs yet",
-					description: "pick an agent from the catalog to launch one yourself, or let the main agent delegate with its subagent tool."
+					className: "text-base text-po-dim",
+					children: [
+						/* @__PURE__ */ jsx("p", { children: "No runs yet" }),
+						/* @__PURE__ */ jsx("p", { children: "Start an agent run to get help with your work." }),
+						/* @__PURE__ */ jsx("p", {
+							className: "py-32 text-center text-sm",
+							children: "Agent runs will appear here once you start one."
+						})
+					]
 				}) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
 					"data-testid": "subagents-grid",
-					className: "grid grid-cols-[repeat(auto-fill,minmax(min(420px,100%),1fr))] gap-4",
+					className: "grid grid-cols-1 gap-4 @2xl:grid-cols-2",
 					children: sessionId === null ? null : runs.map((run) => /* @__PURE__ */ jsx(RunCard, {
 						sessionId,
 						run,
@@ -1507,14 +1661,20 @@ function SubagentsPanel({ sessionId, renderSlot, renderThread, openTransientTab
 						}
 					}, run.runId))
 				}), /* @__PURE__ */ jsx("span", {
-					className: "pt-3 text-sm text-doom-dim",
+					className: "pt-3 text-sm text-po-dim",
 					children: "click a card to open the run's thread · the card menu holds details, stop and clear · finished runs leave the grid after 10m"
 				})] })]
 			}),
 			sessionId !== null && shelf.open ? /* @__PURE__ */ jsx(AgentCatalogDrawer, {
 				sessionId,
 				onClose: () => closeCatalog(sessionId),
-				onLaunch: (agent, fork) => openLaunch(sessionId, agent.name, fork)
+				onSource: (agent) => {
+					const tab = fileTabFor(agent.filePath);
+					return tab ? () => {
+						closeCatalog(sessionId);
+						openTransientTab(tab);
+					} : void 0;
+				}
 			}) : null,
 			shownRun && sessionId !== null ? /* @__PURE__ */ jsx(RunDetailSheet, {
 				sessionId,
@@ -1523,17 +1683,7 @@ function SubagentsPanel({ sessionId, renderSlot, renderThread, openTransientTab
 				stopping: stopping(shownRun),
 				renderSlot,
 				onClose: () => openRun(sessionId, void 0)
-			}) : null,
-			sessionId !== null && launching !== void 0 && shelf.launch !== void 0 ? /* @__PURE__ */ jsx(LaunchAgentDialog, {
-				sessionId,
-				agent: launching,
-				cwd: shelf.cwd,
-				models: shelf.models,
-				fork: shelf.launch.fork,
-				initialTask: shelf.task,
-				onClose: () => closeLaunch(sessionId),
-				onLaunched: () => closeCatalog(sessionId)
-			}, launching.name) : null
+			}) : null
 		]
 	});
 }
@@ -1541,7 +1691,7 @@ function SubagentsPanel({ sessionId, renderSlot, renderThread, openTransientTab
 function subagentsTab() {
 	return {
 		id: SUBAGENTS_TAB_ID,
-		label: "subagents",
+		label: "Agents",
 		panel: SubagentsPanel
 	};
 }
@@ -1568,7 +1718,7 @@ var launch_agent_web_default = defineContextAction({
 var agents_web_default = defineActivityGroup({
 	keys: "a r",
 	icon: UsersIcon,
-	statusKey: "doom-team-agents",
+	statusKey: "po-team-agents",
 	activeSource: {
 		subscribe(listener) {
 			const subscription = subagents.store.subscribe(listener);
@@ -1583,21 +1733,21 @@ var agents_web_default = defineActivityGroup({
 });
 //#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/channel/subagent-catalog.web.ts
-/** The agent catalog the session facet publishes. The filename is the frame type. */
+/** The agent catalog the session's server plugin publishes. The filename is the frame type. */
 var subagent_catalog_web_default = defineChannelFile(subagentCatalogChannel);
 //#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/channel/subagent-runs.web.ts
-/** The run graph the session facet publishes. The filename is the frame type. */
+/** The run graph the session's server plugin publishes. The filename is the frame type. */
 var subagent_runs_web_default = defineChannelFile(subagentRunsChannel);
 //#endregion
 //#region src/extensions/workspaces/sessions/(frontend)/fill/_components/AgentsActivitySection.tsx
 const TICK_MS = 1e4;
-const STATE_TONE = {
-	queued: "muted",
-	running: "yellow",
-	done: "green",
-	failed: "red",
-	stopped: "muted"
+const AVATAR_STATE = {
+	queued: "waiting",
+	running: "running",
+	done: "done",
+	failed: "failed",
+	stopped: "done"
 };
 function elapsed(run, now) {
 	const end = run.endedAt ?? (isTerminalRun(run) ? run.lastUpdate : now);
@@ -1607,7 +1757,7 @@ function elapsed(run, now) {
 function detail(run) {
 	if (run.state === "failed" && run.error) return run.error;
 	if (run.summary) return run.summary.split("\n").find((line) => line.trim() !== "") ?? "";
-	return run.currentTool ?? run.tail.at(-1) ?? run.state;
+	return run.currentTool ?? run.tail.at(-1) ?? (run.state === "running" ? "" : run.state);
 }
 /**
 * The agents group's body in the activity dock: the session's runs, each a
@@ -1625,13 +1775,13 @@ function AgentsActivitySection({ sessionId, openTransientTab }) {
 		className: "flex flex-wrap items-center gap-x-4 gap-y-1",
 		children: [/* @__PURE__ */ jsx("p", {
 			"data-testid": "activity-summary-agents",
-			className: "text-sm text-doom-dim",
+			className: "text-sm text-po-dim",
 			children: "Idle"
 		}), /* @__PURE__ */ jsxs(Button, {
 			variant: "link",
 			size: "sm",
 			"data-testid": "activity-agents-launch",
-			className: "h-auto gap-1 px-0 text-sm text-doom-green",
+			className: "h-auto gap-1 px-0 text-sm text-po-green",
 			onClick: () => {
 				if (sessionId === null) return;
 				openCatalog(sessionId);
@@ -1646,38 +1796,53 @@ function AgentsActivitySection({ sessionId, openTransientTab }) {
 	return /* @__PURE__ */ jsx("div", {
 		"data-testid": "activity-agent-runs",
 		className: "flex flex-col gap-0.5",
-		children: runs.map((run) => /* @__PURE__ */ jsxs(Button, {
-			variant: "ghost",
-			size: "card",
-			"data-testid": `activity-run-${run.runId}`,
-			"data-run-state": run.state,
-			title: "open this run's conversation",
-			onClick: () => {
-				if (sessionId === null) return;
-				openTransientTab(agentThreadTab(run));
-			},
-			className: "min-w-0 gap-0.5 rounded-md px-1 py-1 hover:bg-doom-panel",
-			children: [/* @__PURE__ */ jsxs("span", {
-				className: "flex min-w-0 items-center gap-1.5",
-				children: [
-					/* @__PURE__ */ jsx(Dot, {
-						tone: STATE_TONE[run.state],
-						pulse: run.state === "running"
-					}),
-					/* @__PURE__ */ jsx("span", {
-						className: `min-w-0 flex-1 truncate text-base font-semibold ${isTerminalRun(run) ? "text-doom-hi" : "text-doom-hi"}`,
-						children: agentRunLabel(run)
-					}),
-					/* @__PURE__ */ jsxs("span", {
-						className: "shrink-0 text-sm text-doom-dim",
-						children: [elapsed(run, now), run.toolCount !== void 0 ? ` · ${run.toolCount} tools` : ""]
-					})
-				]
-			}), /* @__PURE__ */ jsx("span", {
-				className: `truncate pl-3 text-sm ${run.state === "failed" ? "text-doom-red" : "text-doom-dim"}`,
-				children: detail(run)
-			})]
-		}, run.runId))
+		children: runs.map((run) => {
+			const who = agentDisplay(run);
+			const description = detail(run);
+			return /* @__PURE__ */ jsx(Button, {
+				variant: "ghost",
+				size: "card",
+				"data-testid": `activity-run-${run.runId}`,
+				"data-run-state": run.state,
+				title: "open this run's conversation",
+				onClick: () => {
+					if (sessionId === null) return;
+					openTransientTab(agentThreadTab(run));
+				},
+				className: "min-w-0 gap-0.5 rounded-md px-1 py-1 hover:bg-po-panel",
+				children: /* @__PURE__ */ jsxs("span", {
+					className: "flex min-w-0 items-center gap-2",
+					children: [
+						/* @__PURE__ */ jsx(AgentAvatar, {
+							name: who.name,
+							seed: who.seed,
+							state: AVATAR_STATE[run.state],
+							size: "sm"
+						}),
+						/* @__PURE__ */ jsxs("span", {
+							className: "flex min-w-0 flex-1 flex-col text-left",
+							children: [/* @__PURE__ */ jsxs("span", {
+								className: "flex min-w-0 items-baseline gap-1.5",
+								children: [/* @__PURE__ */ jsx("span", {
+									className: "truncate text-base font-semibold text-po-hi",
+									children: who.name
+								}), who.role ? /* @__PURE__ */ jsx("span", {
+									className: "truncate text-sm text-po-dim",
+									children: who.role
+								}) : null]
+							}), description ? /* @__PURE__ */ jsx("span", {
+								className: `truncate text-sm ${run.state === "failed" ? "text-po-red" : "text-po-dim"}`,
+								children: description
+							}) : null]
+						}),
+						/* @__PURE__ */ jsxs("span", {
+							className: "shrink-0 text-sm text-po-dim",
+							children: [elapsed(run, now), run.toolCount !== void 0 ? ` · ${run.toolCount} tools` : ""]
+						})
+					]
+				})
+			}, run.runId);
+		})
 	});
 }
 //#endregion
@@ -1750,11 +1915,7 @@ function subagentCallDetail(args) {
 			const count = `${requests.length} agent${requests.length === 1 ? "" : "s"}`;
 			return agents.length > 0 ? `${count} · ${agents.join(", ")}` : count;
 		}
-		case "status": return asString(args.id) || "fleet";
-		case "steer":
-		case "stop":
-		case "restore": return asString(args.id);
-		case "suspended": return "runs";
+		case "status": return args.id ? "run" : "fleet";
 		default: return "";
 	}
 }
@@ -1808,8 +1969,11 @@ function records(value) {
 function parts(values) {
 	return values.filter((value) => typeof value === "string" && value.trim() !== "").join(" · ");
 }
-function firstLine(value) {
-	return asString(value).split("\n")[0] ?? "";
+function stateAvatar(state) {
+	if (state === "failed" || state === "error") return "failed";
+	if (state === "running" || state === "starting") return "running";
+	if (state === "queued") return "waiting";
+	if (state === "complete" || state === "completed" || state === "stopped") return "done";
 }
 function stateTone(state) {
 	if (state === "failed" || state === "error") return "error";
@@ -1824,6 +1988,7 @@ function agentsView(value) {
 	const rows = records(value).map((agent, index) => ({
 		key: `${asString(agent.name)}-${index}`,
 		label: asString(agent.name),
+		seed: asString(agent.name),
 		detail: preview(asString(agent.description)),
 		state: asString(agent.source),
 		tone: "idle"
@@ -1841,7 +2006,9 @@ function runView(value) {
 		return {
 			key: runId || `${asString(outcome.agent)}-${index}`,
 			label: asString(outcome.agent),
-			detail: runId || preview(asString(outcome.error)) || "unknown error",
+			seed: asString(outcome.agent),
+			avatar: runId ? "running" : "failed",
+			detail: preview(runId ? asString(outcome.task) : asString(outcome.error)) || (runId ? "" : "unknown error"),
 			state: runId ? "started" : "failed",
 			tone: runId ? "ok" : "error"
 		};
@@ -1858,12 +2025,17 @@ function runView(value) {
 function fleetView(value) {
 	const rows = records(value).map((job, index) => {
 		const state = asString(job.status) || "starting";
+		const who = agentDisplay({
+			agent: asString(job.agent),
+			identity: asString(job.identity) || void 0
+		});
 		return {
 			key: asString(job.runId) || `run-${index}`,
-			label: asString(job.runId),
+			label: who.name,
+			seed: who.seed,
+			avatar: stateAvatar(state),
 			detail: preview(parts([
-				job.identity ? job.inline ? `${asString(job.identity)} (inline)` : job.identity : void 0,
-				job.agent,
+				who.role,
 				job.currentTool,
 				job.activityState,
 				job.attentionReason,
@@ -1880,24 +2052,6 @@ function fleetView(value) {
 		tone: "idle"
 	};
 }
-function suspendedView(value) {
-	const rows = (isRecord(value) ? [value] : records(value)).map((run, index) => {
-		const resumable = run.resumable;
-		return {
-			key: asString(run.runId) || `suspended-${index}`,
-			label: asString(run.runId),
-			detail: preview(parts([run.agent, firstLine(run.task)])),
-			state: resumable === false ? "not resumable" : resumable === true ? "resumable" : "suspended",
-			tone: resumable === false ? "error" : "idle"
-		};
-	});
-	return {
-		kind: "suspended",
-		rows,
-		summary: countSummary(rows.length, "suspended run"),
-		tone: "idle"
-	};
-}
 function statusView(details) {
 	const runId = asString(details.runId);
 	const status = isRecord(details.status) ? details.status : void 0;
@@ -1905,16 +2059,22 @@ function statusView(details) {
 	if (!state) return {
 		kind: "status",
 		rows: [],
-		summary: `${runId} has no status yet`,
+		summary: "no status yet",
 		tone: "idle"
 	};
+	const who = agentDisplay({
+		agent: asString(status?.agent),
+		identity: asString(status?.identity) || void 0
+	});
 	return {
 		kind: "status",
 		rows: [{
 			key: runId,
-			label: runId,
+			label: who.name,
+			seed: who.seed,
+			avatar: stateAvatar(state),
 			detail: preview(parts([
-				status?.agent,
+				who.role,
 				status?.activityState,
 				status?.summary,
 				status?.error
@@ -1946,27 +2106,23 @@ function subagentResultView(details) {
 	if (isRecord(details.spawn) && Array.isArray(details.spawn.outcomes)) return runView(details.spawn.outcomes);
 	if (Array.isArray(details.runs)) return fleetView(details.runs);
 	if (Array.isArray(details.fleet)) return fleetView(details.fleet);
-	if (details.suspended !== void 0) return suspendedView(details.suspended);
-	if (isRecord(details.control)) return controlView(`stop requested for ${asString(details.runId)}`, "ok");
+	if (isRecord(details.control)) return controlView("stop requested", "ok");
 	if (isRecord(details.steer)) {
 		const state = asString(details.steer.state);
 		return controlView(`steer ${state}${details.steer.message ? `: ${preview(asString(details.steer.message))}` : ""}`, state === "failed" ? "error" : "ok");
 	}
-	if (isRecord(details.restore)) {
-		const restore = details.restore;
-		return controlView(`restored ${asString(restore.restoredFrom)} as ${asString(restore.runId)}`, "ok");
-	}
 	if (typeof details.runId === "string") return statusView(details);
 	return null;
 }
-/** The intercom call header: action, its target, and what is being said. */
-function intercomCallSummary(args) {
+/** The intercom call header: action, its resolved target name, and what is being said. */
+function intercomCallSummary(args, details) {
 	const action = asString(args.action);
+	const toName = isRecord(details) ? asString(details.toName).trim() : "";
 	switch (action) {
 		case "send":
 		case "ask": return {
 			action,
-			target: asString(args.to),
+			target: toName || asString(args.to),
 			message: preview(asString(args.message))
 		};
 		case "reply": return {
@@ -1989,27 +2145,33 @@ function intercomCallSummary(args) {
 function intercomOutcome(details) {
 	if (!isRecord(details)) return {
 		outcome: "none",
-		who: ""
+		who: "",
+		reply: ""
 	};
 	if (details.delivered === true) return {
 		outcome: "delivered",
-		who: asString(details.to)
+		who: asString(details.to),
+		reply: ""
 	};
 	if (details.state === "queued") return {
 		outcome: "queued",
-		who: asString(details.to)
+		who: asString(details.to),
+		reply: ""
 	};
 	if (typeof details.reply === "string") return {
 		outcome: "answered",
-		who: asString(details.from)
+		who: asString(details.from),
+		reply: details.reply
 	};
 	if (typeof details.requestId === "string" && typeof details.to === "string") return {
 		outcome: "replied",
-		who: details.to
+		who: details.to,
+		reply: ""
 	};
 	return {
 		outcome: "none",
-		who: ""
+		who: "",
+		reply: ""
 	};
 }
 //#endregion
@@ -2017,28 +2179,29 @@ function intercomOutcome(details) {
 const OUTCOME_LINE = {
 	delivered: {
 		tone: "ok",
-		text: "delivered to"
+		text: "Delivered"
 	},
 	queued: {
 		tone: "running",
-		text: "queued, delivery unconfirmed, for"
+		text: "Queued, not yet confirmed"
 	},
 	replied: {
 		tone: "ok",
-		text: "replied to"
+		text: "Replied"
 	},
 	answered: {
 		tone: "ok",
-		text: "answered by"
+		text: "Answered"
 	}
 };
 /**
-* The intercom tool's timeline item. Intercom has no TUI renderer; the
-* header names the action, its member or request, and the message, and the
-* body shows the result text with the outcome the details report.
+* The intercom tool's timeline item, drawn as a conversation: what was said
+* as a bubble to the right, the answer as a bubble from its sender, and how
+* the delivery went beneath. Actions with no message (members, pending) show
+* the result text as before.
 */
 function IntercomToolMessage({ args, result, output, running, isError }) {
-	const summary = intercomCallSummary(args);
+	const summary = intercomCallSummary(args, result?.details);
 	const collapsed = shapeResult(output, {
 		expanded: false,
 		isPartial: running,
@@ -2046,9 +2209,12 @@ function IntercomToolMessage({ args, result, output, running, isError }) {
 	});
 	const outcome = running || isError ? {
 		outcome: "none",
-		who: ""
+		who: "",
+		reply: ""
 	} : intercomOutcome(result?.details);
 	const line = outcome.outcome === "none" ? null : OUTCOME_LINE[outcome.outcome];
+	const message = typeof args.message === "string" ? args.message.trim() : "";
+	const recipient = summary.action === "reply" ? outcome.who : summary.target;
 	return /* @__PURE__ */ jsx(MessageItem, {
 		tone: toolTone({
 			running,
@@ -2066,47 +2232,61 @@ function IntercomToolMessage({ args, result, output, running, isError }) {
 				children: /* @__PURE__ */ jsxs("span", {
 					"data-testid": "tool-call-intercom",
 					className: "flex min-w-0 flex-1 items-center gap-2",
-					children: [
-						/* @__PURE__ */ jsx("span", {
-							className: "text-doom-hi",
-							children: summary.action
-						}),
-						summary.target ? /* @__PURE__ */ jsxs("span", {
-							className: "shrink-0 text-doom-cyan",
-							children: ["→ ", summary.target]
-						}) : null,
-						summary.message ? /* @__PURE__ */ jsx("span", {
-							className: "min-w-0 truncate text-doom-dim",
-							children: summary.message
-						}) : null
-					]
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-po-hi",
+						children: summary.action
+					}), recipient ? /* @__PURE__ */ jsxs("span", {
+						className: "shrink-0 text-po-cyan",
+						children: ["→ ", recipient]
+					}) : null]
 				})
 			}), /* @__PURE__ */ jsxs(MessageItemBody, {
 				"data-testid": "tool-result-intercom",
-				className: "flex flex-col gap-1",
+				className: "flex flex-col gap-3",
 				children: [
-					shaped.lines.length > 0 ? /* @__PURE__ */ jsx("pre", {
-						className: `${expanded ? "whitespace-pre-wrap break-words" : "truncate"} text-doom-dim`,
-						children: shaped.lines.join("\n")
+					message ? /* @__PURE__ */ jsxs("div", {
+						"data-testid": "intercom-outgoing",
+						className: "flex flex-col items-end gap-1",
+						children: [
+							/* @__PURE__ */ jsx("p", {
+								className: "max-w-xl rounded-lg bg-po-tint-green px-3 py-2 text-base break-words whitespace-pre-wrap text-po-hi",
+								children: message
+							}),
+							line && outcome.outcome !== "answered" ? /* @__PURE__ */ jsx(MessageItemStatus, {
+								tone: line.tone,
+								children: line.text
+							}) : null,
+							running ? /* @__PURE__ */ jsxs(MessageItemStatus, {
+								tone: "running",
+								children: ["Waiting for ", recipient || "a reply"]
+							}) : null
+						]
 					}) : null,
-					running ? /* @__PURE__ */ jsx(MessageItemStatus, {
-						tone: "running",
-						children: "waiting"
+					outcome.outcome === "answered" ? /* @__PURE__ */ jsxs("div", {
+						"data-testid": "intercom-incoming",
+						className: "flex items-start gap-2",
+						children: [/* @__PURE__ */ jsx(AgentAvatar, {
+							name: outcome.who,
+							size: "sm"
+						}), /* @__PURE__ */ jsxs("div", {
+							className: "flex min-w-0 flex-col gap-1",
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "text-sm text-po-dim",
+								children: outcome.who
+							}), /* @__PURE__ */ jsx("p", {
+								className: "max-w-xl rounded-lg bg-po-rail px-3 py-2 text-base break-words whitespace-pre-wrap text-po-hi",
+								children: outcome.reply
+							})]
+						})]
 					}) : null,
-					isError ? /* @__PURE__ */ jsx(MessageItemStatus, {
-						tone: "error",
-						children: "failed"
+					isError ? /* @__PURE__ */ jsx("p", {
+						role: "alert",
+						className: "rounded-md border border-po-edge-red bg-po-tint-red px-3 py-2 text-base text-po-red",
+						children: shaped.lines.join("\n") || "Failed"
 					}) : null,
-					line ? /* @__PURE__ */ jsxs(MessageItemStatus, {
-						tone: line.tone,
-						children: [
-							line.text,
-							" ",
-							/* @__PURE__ */ jsx("span", {
-								className: "text-doom-cyan",
-								children: outcome.who
-							})
-						]
+					!message && !isError && shaped.lines.length > 0 ? /* @__PURE__ */ jsx("p", {
+						className: `${expanded ? "whitespace-pre-wrap break-words" : "truncate"} text-po-dim`,
+						children: shaped.lines.join("\n")
 					}) : null,
 					shaped.glyph === "more" ? /* @__PURE__ */ jsxs(MessageItemStatus, {
 						expands: true,
@@ -2155,18 +2335,25 @@ function SubagentRowLine({ row }) {
 		"data-testid": "tool-result-subagent-row",
 		className: "flex items-center gap-3 rounded-md px-2 py-1.5",
 		children: [
-			/* @__PURE__ */ jsx("span", {
-				className: "shrink-0 text-base font-semibold text-doom-hi",
-				children: row.label
+			/* @__PURE__ */ jsx(AgentAvatar, {
+				name: row.label,
+				seed: row.seed,
+				state: row.avatar
 			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "min-w-0 flex-1 truncate text-doom-dim",
-				children: row.detail
+			/* @__PURE__ */ jsxs("span", {
+				className: "flex min-w-0 flex-1 flex-col",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "truncate text-base font-semibold text-po-hi",
+					children: row.label
+				}), row.detail ? /* @__PURE__ */ jsx("span", {
+					className: "truncate text-sm text-po-dim",
+					children: row.detail
+				}) : null]
 			}),
 			row.state ? /* @__PURE__ */ jsx(StatusBadge, {
 				tone: ROW_BADGE[row.tone],
 				size: "md",
-				className: ROW_BADGE[row.tone] === "neutral" ? "bg-doom-rail" : void 0,
+				className: ROW_BADGE[row.tone] === "neutral" ? "bg-po-rail" : void 0,
 				children: row.state
 			}) : null
 		]
@@ -2209,10 +2396,10 @@ function SubagentToolMessage({ args, result, output, running, isError, openTrans
 					"data-testid": "tool-call-subagent",
 					className: "flex min-w-0 flex-1 items-center gap-2",
 					children: [/* @__PURE__ */ jsx("span", {
-						className: "text-doom-dim",
+						className: "text-po-dim",
 						children: action
 					}), detail ? /* @__PURE__ */ jsx("span", {
-						className: "min-w-0 truncate text-doom-dim",
+						className: "min-w-0 truncate text-po-dim",
 						children: detail
 					}) : null]
 				})
@@ -2225,7 +2412,7 @@ function SubagentToolMessage({ args, result, output, running, isError, openTrans
 						children: rows.map((row) => /* @__PURE__ */ jsx(SubagentRowLine, { row }, row.key))
 					}) : null,
 					shaped && shaped.lines.length > 0 ? /* @__PURE__ */ jsx("pre", {
-						className: `${expanded ? "whitespace-pre-wrap break-words" : "truncate"} text-doom-dim`,
+						className: `${expanded ? "whitespace-pre-wrap break-words" : "truncate"} text-po-dim`,
 						children: shaped.lines.join("\n")
 					}) : null,
 					!expanded && hiddenRows > 0 ? /* @__PURE__ */ jsxs(MessageItemStatus, {
@@ -2241,7 +2428,7 @@ function SubagentToolMessage({ args, result, output, running, isError, openTrans
 						children: [shaped.hidden, " more line(s)"]
 					}) : null,
 					/* @__PURE__ */ jsxs("div", {
-						className: `flex flex-wrap items-center gap-x-4 gap-y-1 ${rows.length > 0 ? "mt-1 border-t border-doom-border-soft pt-2.5" : ""}`,
+						className: `flex flex-wrap items-center gap-x-4 gap-y-1 ${rows.length > 0 ? "mt-1 border-t border-po-border-soft pt-2.5" : ""}`,
 						children: [view && view.summary ? /* @__PURE__ */ jsx(MessageItemStatus, {
 							"data-testid": "tool-result-subagent-summary",
 							tone: STATUS_TONE[view.tone],
@@ -2251,7 +2438,7 @@ function SubagentToolMessage({ args, result, output, running, isError, openTrans
 							size: "sm",
 							"data-testid": "tool-result-subagent-open",
 							onClick: () => openTransientTab(subagentsTab()),
-							className: "h-auto gap-1 px-0 text-sm text-doom-green",
+							className: "h-auto gap-1 px-0 text-sm text-po-green",
 							children: ["Open subagents", /* @__PURE__ */ jsx(ArrowRightIcon, {
 								"aria-hidden": true,
 								className: "size-3.5"