perstack 0.0.124 → 0.0.127

package/dist/bin/cli.js

@@ -5,7 +5,7 @@ import { t as require_token_error } from "../token-error-Bru5BVnt.js";
 import fs, { constants, lstat, mkdir, open, readFile, stat, writeFile } from "node:fs/promises";
 import path, { dirname, extname } from "node:path";
 import * as fs$2 from "node:fs";
-import fs$1, { existsSync, readFileSync, readdirSync, realpathSync, statSync } from "node:fs";
+import fs$1, { closeSync, existsSync, openSync, readFileSync, readSync, readdirSync, realpathSync, statSync } from "node:fs";
 import os from "node:os";
 import { execFile, execFileSync } from "node:child_process";
 import { promisify } from "node:util";
@@ -20157,20 +20157,59 @@ function getCheckpointsByJobId$1(jobId) {
 	const checkpointDir = getCheckpointDir(jobId);
 	if (!existsSync(checkpointDir)) return [];
 	const files = readdirSync(checkpointDir).filter((file) => file.endsWith(".json"));
-	const checkpoints = [];
+	const fileEntries = [];
 	for (const file of files) try {
+		const mtime = statSync(path.resolve(checkpointDir, file)).mtimeMs;
+		fileEntries.push({
+			file,
+			mtime
+		});
+	} catch {
+		fileEntries.push({
+			file,
+			mtime: 0
+		});
+	}
+	fileEntries.sort((a, b) => a.mtime - b.mtime);
+	const checkpoints = [];
+	for (const { file } of fileEntries) try {
 		const content = readFileSync(path.resolve(checkpointDir, file), "utf-8");
 		checkpoints.push(checkpointSchema.parse(JSON.parse(content)));
 	} catch {}
-	return checkpoints.sort((a, b) => {
+	return checkpoints;
+}
+function getCheckpointsByRunId(jobId, runId) {
+	const checkpointDir = getCheckpointDir(jobId);
+	if (!existsSync(checkpointDir)) return [];
+	const files = readdirSync(checkpointDir).filter((file) => file.endsWith(".json"));
+	const runIdPattern = `"runId":"${runId}"`;
+	const matchingFiles = [];
+	const headerBuf = Buffer.alloc(256);
+	for (const file of files) {
+		const filePath = path.resolve(checkpointDir, file);
 		try {
-			const aStat = statSync(path.resolve(checkpointDir, `${a.id}.json`));
-			const bStat = statSync(path.resolve(checkpointDir, `${b.id}.json`));
-			return aStat.mtimeMs - bStat.mtimeMs;
-		} catch {
-			return 0;
-		}
-	});
+			const fd = openSync(filePath, "r");
+			try {
+				const bytesRead = readSync(fd, headerBuf, 0, 256, 0);
+				if (headerBuf.toString("utf-8", 0, bytesRead).includes(runIdPattern)) {
+					const mtime = statSync(filePath).mtimeMs;
+					matchingFiles.push({
+						file,
+						mtime
+					});
+				}
+			} finally {
+				closeSync(fd);
+			}
+		} catch {}
+	}
+	matchingFiles.sort((a, b) => a.mtime - b.mtime);
+	const checkpoints = [];
+	for (const { file } of matchingFiles) try {
+		const content = readFileSync(path.resolve(checkpointDir, file), "utf-8");
+		checkpoints.push(checkpointSchema.parse(JSON.parse(content)));
+	} catch {}
+	return checkpoints;
 }
 //#endregion
 //#region ../../packages/filesystem/src/run-setting.ts
@@ -20207,7 +20246,7 @@ async function defaultStoreEvent(event) {
 	await mkdir(runDir, { recursive: true });
 	await writeFile(eventPath, JSON.stringify(event));
 }
-function getEventContents(jobId, runId, maxStepNumber) {
+function getEventContents(jobId, runId, maxStepNumber, typeFilter) {
 	const runDir = defaultGetRunDir(jobId, runId);
 	if (!existsSync(runDir)) return [];
 	const eventFiles = readdirSync(runDir).filter((file) => file.startsWith("event-")).map((file) => {
@@ -20218,7 +20257,7 @@ function getEventContents(jobId, runId, maxStepNumber) {
 			stepNumber: Number(step),
 			type
 		};
-	}).filter((e) => maxStepNumber === void 0 || e.stepNumber <= maxStepNumber).sort((a, b) => a.timestamp - b.timestamp);
+	}).filter((e) => maxStepNumber === void 0 || e.stepNumber <= maxStepNumber).filter((e) => !typeFilter || typeFilter.has(e.type)).sort((a, b) => a.timestamp - b.timestamp);
 	const events = [];
 	for (const { file } of eventFiles) try {
 		const content = readFileSync(path.resolve(runDir, file), "utf-8");
@@ -20226,6 +20265,44 @@ function getEventContents(jobId, runId, maxStepNumber) {
 	} catch {}
 	return events;
 }
+/**
+* Get a single event by type from a run (returns the first match by timestamp).
+* Much faster than loading all events when you only need one.
+*/
+function getFirstEvent(jobId, runId, typeFilter) {
+	const runDir = defaultGetRunDir(jobId, runId);
+	if (!existsSync(runDir)) return;
+	const files = readdirSync(runDir).filter((file) => file.startsWith("event-") && file.includes(`-${typeFilter}.json`)).sort();
+	if (files.length === 0) return void 0;
+	try {
+		const content = readFileSync(path.resolve(runDir, files[0]), "utf-8");
+		return JSON.parse(content);
+	} catch {
+		return;
+	}
+}
+/**
+* Get event stats from filenames only (no file content reading).
+* Returns total event count and max step number.
+*/
+function getEventStats(jobId, runId) {
+	const runDir = defaultGetRunDir(jobId, runId);
+	if (!existsSync(runDir)) return {
+		eventCount: 0,
+		maxStep: 0
+	};
+	const eventFiles = readdirSync(runDir).filter((file) => file.startsWith("event-"));
+	let maxStep = 0;
+	for (const file of eventFiles) {
+		const parts = file.split(".")[0].split("-");
+		const step = Number(parts[2]);
+		if (step > maxStep) maxStep = step;
+	}
+	return {
+		eventCount: eventFiles.length,
+		maxStep
+	};
+}
 function getRunIdsByJobId(jobId) {
 	const runsDir = path.resolve(getJobDir(jobId), "runs");
 	if (!existsSync(runsDir)) return [];
@@ -20284,6 +20361,9 @@ function createLogDataFetcher(storage) {
 		async getCheckpoints(jobId) {
 			return storage.getCheckpointsByJobId(jobId);
 		},
+		async getCheckpointsForRun(jobId, runId) {
+			return storage.getCheckpointsByRunId(jobId, runId);
+		},
 		async getCheckpoint(jobId, checkpointId) {
 			return storage.retrieveCheckpoint(jobId, checkpointId);
 		},
@@ -20292,12 +20372,23 @@ function createLogDataFetcher(storage) {
 		},
 		async getAllEventsForJob(jobId) {
 			const runs = await this.getRuns(jobId);
-			const allEvents = [];
-			for (const run of runs) {
-				const events = await storage.getEventContents(jobId, run.runId);
-				allEvents.push(...events);
-			}
-			return allEvents.sort((a, b) => a.timestamp - b.timestamp);
+			return (await Promise.all(runs.map((run) => storage.getEventContents(jobId, run.runId)))).flat().sort((a, b) => a.timestamp - b.timestamp);
+		},
+		async getTreeEventsForJob(jobId) {
+			const treeEventTypes = new Set([
+				"startRun",
+				"resumeFromStop",
+				"stopRunByDelegate",
+				"callTools",
+				"completeRun",
+				"stopRunByError",
+				"retry"
+			]);
+			const runIds = storage.getRunIdsByJobId(jobId);
+			return (await Promise.all(runIds.map((runId) => storage.getEventContents(jobId, runId, void 0, treeEventTypes)))).flat().sort((a, b) => a.timestamp - b.timestamp);
+		},
+		async getFirstEventForRun(jobId, runId, typeFilter) {
+			return storage.getFirstEvent(jobId, runId, typeFilter);
 		}
 	};
 }
@@ -20316,9 +20407,13 @@ function createStorageAdapter(basePath) {
 		getAllJobs: async () => getAllJobs$1(),
 		retrieveJob: async (jobId) => retrieveJob(jobId),
 		getCheckpointsByJobId: async (jobId) => getCheckpointsByJobId$1(jobId),
+		getCheckpointsByRunId: async (jobId, runId) => getCheckpointsByRunId(jobId, runId),
 		retrieveCheckpoint: async (jobId, checkpointId) => defaultRetrieveCheckpoint(jobId, checkpointId),
-		getEventContents: async (jobId, runId, maxStep) => getEventContents(jobId, runId, maxStep),
+		getEventContents: async (jobId, runId, maxStep, typeFilter) => getEventContents(jobId, runId, maxStep, typeFilter),
+		getFirstEvent: async (jobId, runId, typeFilter) => getFirstEvent(jobId, runId, typeFilter),
+		getEventStats: (jobId, runId) => getEventStats(jobId, runId),
 		getAllRuns: async () => getAllRuns$1(),
+		getRunIdsByJobId: (jobId) => getRunIdsByJobId(jobId),
 		getJobIds: () => {
 			const jobsDir = path.join(basePath, "jobs");
 			if (!existsSync(jobsDir)) return [];
@@ -20613,7 +20708,7 @@ function formatSummarySection(summary) {
 }
 function formatEvent(event, verbose) {
 	const lines = [];
-	const time = formatTime(event.timestamp);
+	const time = formatTime$1(event.timestamp);
 	const header = `[Step ${event.stepNumber}] ${event.type}${" ".repeat(Math.max(0, 24 - event.type.length))}${time}`;
 	lines.push(header);
 	if (event.type === "startRun" && "inputMessages" in event) {
@@ -20674,7 +20769,7 @@ function extractTextContent$1(contents) {
 function formatTimestamp$2(ts) {
 	return new Date(ts).toISOString().replace("T", " ").replace(/\.\d{3}Z$/, "");
 }
-function formatTime(ts) {
+function formatTime$1(ts) {
 	return new Date(ts).toISOString().slice(11, 19);
 }
 //#endregion
@@ -20997,7 +21092,7 @@ async function expertVersionsHandler(scopeName, options) {
 }
 //#endregion
 //#region ../../packages/runtime/package.json
-var version$1 = "0.0.136";
+var version$1 = "0.0.138";
 //#endregion
 //#region ../../packages/runtime/src/helpers/usage.ts
 function createEmptyUsage() {
@@ -92386,22 +92481,22 @@ var import_dist = (/* @__PURE__ */ __commonJSMin(((exports) => {
 	}
 	exports.dedent = dedent;
 })))();
-function getEnvironmentSection(startedAt) {
-	const lines = [`- Current time: ${new Date(startedAt).toISOString()}`, `- Working directory: ${process.cwd()}`];
+function getEnvironmentSection() {
+	const lines = [`- Platform: ${os.platform()} ${os.release()} (${os.arch()})`];
 	if (process.env.PERSTACK_SANDBOX === "1") lines.push("- Sandbox: This is an isolated container environment (Ubuntu). You can freely install packages with `sudo apt-get install` and run arbitrary commands without affecting the host system.");
 	return `Environment:\n${lines.join("\n")}`;
 }
-function getDelegateMetaInstruction(startedAt) {
+function getDelegateMetaInstruction() {
 	return import_dist.dedent`
     Before starting work, investigate the workspace and understand the current state. Then use the todo tool to create a plan of action. Work through the todos step by step, marking each completed as you go.
 
     When the task is complete, call attemptCompletion with a result parameter containing your final response.
     When you cannot help, call attemptCompletion without a result.
 
-    ${getEnvironmentSection(startedAt)}
+    ${getEnvironmentSection()}
   `;
 }
-function getCoordinatorMetaInstruction(startedAt) {
+function getCoordinatorMetaInstruction() {
 	return import_dist.dedent`
     Your role:
     - Act as the coordinator for the given task: define the task, set goals, and delegate.
@@ -92437,14 +92532,14 @@ function getCoordinatorMetaInstruction(startedAt) {
     When the task is complete, call attemptCompletion with a result parameter containing your final response.
     When you cannot help, call attemptCompletion without a result.
 
-    ${getEnvironmentSection(startedAt)}
+    ${getEnvironmentSection()}
   `;
 }
-function createInstructionMessage(expert, startedAt) {
+function createInstructionMessage(expert) {
 	const preamble = import_dist.dedent`
     You are Perstack, an AI expert that tackles tasks requested by users by utilizing all available tools.
 
-    ${isCoordinatorExpert(expert.name) ? getCoordinatorMetaInstruction(startedAt) : getDelegateMetaInstruction(startedAt)}
+    ${isCoordinatorExpert(expert.name) ? getCoordinatorMetaInstruction() : getDelegateMetaInstruction()}
   `;
 	const contents = [{
 		id: createId(),
@@ -92502,7 +92597,7 @@ async function initLogic({ setting, checkpoint }) {
 			if (!setting.model) throw new Error("Model is not resolved");
 			return startRun(setting, checkpoint, {
 				initialCheckpoint: checkpoint,
-				inputMessages: [createInstructionMessage(expert, setting.startedAt), createUserMessage([{
+				inputMessages: [createInstructionMessage(expert), createUserMessage([{
 					type: "textPart",
 					text: setting.input.text
 				}])],
@@ -93264,8 +93359,12 @@ var DelegationExecutor = class {
 				}
 			});
 			if (parentOptions?.storeEvent) {
-				await parentOptions.storeEvent(startRunEvent).catch(() => {});
-				await parentOptions.storeEvent(stopRunByErrorEvent).catch(() => {});
+				await parentOptions.storeEvent(startRunEvent).catch((e) => {
+					console.warn(`Failed to store startRun event for ${expert.key}: ${e}`);
+				});
+				await parentOptions.storeEvent(stopRunByErrorEvent).catch((e) => {
+					console.warn(`Failed to store stopRunByError event for ${expert.key}: ${e}`);
+				});
 			}
 			if (parentOptions?.eventListener) {
 				parentOptions.eventListener(startRunEvent);
@@ -93280,14 +93379,17 @@ var DelegationExecutor = class {
 				deltaUsage: createEmptyUsage()
 			};
 		}
-		if (resultCheckpoint.status !== "completed") return {
-			toolCallId,
-			toolName,
-			expertKey: expert.key,
-			text: `Delegation to ${expert.key} ended with status: ${resultCheckpoint.status}`,
-			stepNumber: resultCheckpoint.stepNumber,
-			deltaUsage: resultCheckpoint.usage
-		};
+		if (resultCheckpoint.status !== "completed") {
+			const errorDetail = resultCheckpoint.error ? `: ${resultCheckpoint.error.name}: ${resultCheckpoint.error.message}` : "";
+			return {
+				toolCallId,
+				toolName,
+				expertKey: expert.key,
+				text: `Delegation to ${expert.key} ended with status: ${resultCheckpoint.status}${errorDetail}`,
+				stepNumber: resultCheckpoint.stepNumber,
+				deltaUsage: resultCheckpoint.usage
+			};
+		}
 		return this.extractDelegationResult(resultCheckpoint, toolCallId, toolName, expert.key);
 	}
 	extractDelegationResult(checkpoint, toolCallId, toolName, expertKey) {
@@ -118997,6 +119099,12 @@ const useInput = (inputHandler, options = {}) => {
 */
 const useApp = () => (0, import_react.useContext)(AppContext);
 //#endregion
+//#region ../../node_modules/.bun/ink@6.8.0+26a211c426f3f87c/node_modules/ink/build/hooks/use-stdout.js
+/**
+`useStdout` is a React hook that exposes the stdout stream where Ink renders your app.
+*/
+const useStdout = () => (0, import_react.useContext)(StdoutContext);
+//#endregion
 //#region ../../packages/tui-components/src/utils/event-queue.ts
 const defaultErrorLogger = (message, error) => {
 	console.error(message, error);
@@ -120979,7 +121087,10 @@ function processDelegationTreeEvent(state, event) {
 				model: event.model,
 				parentRunId,
 				childRunIds: [],
-				totalTokens: 0
+				totalTokens: 0,
+				inputTokens: 0,
+				outputTokens: 0,
+				cachedInputTokens: 0
 			};
 			state.nodes.set(event.runId, node);
 			if (parentRunId) {
@@ -121035,6 +121146,9 @@ function processDelegationTreeEvent(state, event) {
 				node.actionLabel = label;
 				node.actionFileArg = fileArg;
 				node.totalTokens += event.usage.totalTokens;
+				node.inputTokens += event.usage.inputTokens;
+				node.outputTokens += event.usage.outputTokens;
+				node.cachedInputTokens += event.usage.cachedInputTokens;
 				state.jobTotalTokens += event.usage.totalTokens;
 				state.jobReasoningTokens += event.usage.reasoningTokens;
 				state.jobInputTokens += event.usage.inputTokens;
@@ -121062,6 +121176,9 @@ function processDelegationTreeEvent(state, event) {
 				node.actionLabel = "Completed";
 				node.actionFileArg = void 0;
 				node.totalTokens += event.usage.totalTokens;
+				node.inputTokens += event.usage.inputTokens;
+				node.outputTokens += event.usage.outputTokens;
+				node.cachedInputTokens += event.usage.cachedInputTokens;
 				state.jobTotalTokens += event.usage.totalTokens;
 				state.jobReasoningTokens += event.usage.reasoningTokens;
 				state.jobInputTokens += event.usage.inputTokens;
@@ -121095,6 +121212,9 @@ function processDelegationTreeEvent(state, event) {
 			const node = state.nodes.get(nodeId);
 			if (node) {
 				node.totalTokens += event.usage.totalTokens;
+				node.inputTokens += event.usage.inputTokens;
+				node.outputTokens += event.usage.outputTokens;
+				node.cachedInputTokens += event.usage.cachedInputTokens;
 				state.jobTotalTokens += event.usage.totalTokens;
 				state.jobReasoningTokens += event.usage.reasoningTokens;
 				state.jobInputTokens += event.usage.inputTokens;
@@ -121123,7 +121243,7 @@ function useDelegationTree() {
 		formattedCachedInputTokens: formatTokenCount(state.jobCachedInputTokens),
 		formattedOutputTokens: formatTokenCount(state.jobOutputTokens),
 		providerName: state.providerName,
-		cacheHitRate: state.jobInputTokens + state.jobCachedInputTokens > 0 ? (state.jobCachedInputTokens / (state.jobInputTokens + state.jobCachedInputTokens) * 100).toFixed(2) : "0.00"
+		cacheHitRate: state.jobInputTokens > 0 ? (state.jobCachedInputTokens / state.jobInputTokens * 100).toFixed(2) : "0.00"
 	};
 }
 //#endregion
@@ -121154,7 +121274,7 @@ const useSpinner = ({ isActive }) => {
 };
 //#endregion
 //#region ../../packages/tui-components/src/execution/components/delegation-tree.tsx
-function getUsageIcon(percent) {
+function getUsageIcon$2(percent) {
 	if (percent >= 75) return USAGE_INDICATORS.FULL;
 	if (percent >= 50) return USAGE_INDICATORS.HIGH;
 	if (percent >= 25) return USAGE_INDICATORS.MEDIUM;
@@ -121199,7 +121319,7 @@ function TreeNodeLine({ flatNode, spinner }) {
 			break;
 	}
 	const usagePercent = (node.contextWindowUsage * 100).toFixed(1);
-	const usageIcon = getUsageIcon(node.contextWindowUsage * 100);
+	const usageIcon = getUsageIcon$2(node.contextWindowUsage * 100);
 	const showUsage = node.status !== "completed";
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
 		wrap: "truncate",
@@ -121252,14 +121372,13 @@ const DelegationTree = ({ state }) => {
 	}, flatNode.node.runId)) });
 };
 //#endregion
-//#region ../../packages/tui-components/src/execution/components/interface-panel.tsx
-const InterfacePanel = ({ query, runStatus, onSubmit, delegationTreeState, runningCount, waitingCount, formattedReasoningTokens, formattedInputTokens, formattedCachedInputTokens, formattedOutputTokens, providerName, cacheHitRate, elapsedTime }) => {
+//#region ../../packages/tui-components/src/components/bottom-panel.tsx
+const BottomPanel = ({ children, onSubmit, canSubmit = true, inputPlaceholder }) => {
 	const { input, handleInput } = useTextInput({
 		onSubmit,
-		canSubmit: runStatus !== "running"
+		canSubmit
 	});
 	useInput(handleInput);
-	const isWaiting = runStatus === "waiting";
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
 		flexDirection: "column",
 		borderStyle: "single",
@@ -121268,64 +121387,75 @@ const InterfacePanel = ({ query, runStatus, onSubmit, delegationTreeState, runni
 		borderBottom: false,
 		borderLeft: false,
 		borderRight: false,
-		children: [
-			isWaiting ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+		children: [children, /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.muted,
+			children: "> "
+		}), input ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: input }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.accent,
+			children: "_"
+		})] }) : inputPlaceholder ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			color: colors.muted,
+			children: [inputPlaceholder, /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
 				color: colors.accent,
-				children: "Waiting for query..."
-			}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
-					color: colors.success,
-					wrap: "truncate",
-					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
-						bold: true,
-						children: "Query: "
-					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: query || "–" })]
-				}),
-				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
-					dimColor: true,
-					children: [
-						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [runningCount, " running"] }),
-						waitingCount > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [
-							" · ",
-							waitingCount,
-							" waiting"
-						] }) : null,
-						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: " · " }),
-						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: elapsedTime }),
-						providerName ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [" · ", providerName] }) : null
-					]
-				}),
-				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
-					dimColor: true,
-					children: [
-						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: "Tokens: " }),
-						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: ["In ", formattedInputTokens] }),
-						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [" · Out ", formattedOutputTokens] }),
-						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [
-							" ",
-							"· Cache ",
-							formattedCachedInputTokens,
-							"/",
-							cacheHitRate,
-							"%"
-						] }),
-						formattedReasoningTokens !== "0" ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [" · Reasoning ", formattedReasoningTokens] }) : null
-					]
-				})
-			] }),
-			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(DelegationTree, { state: delegationTreeState }),
-			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [
-				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
-					color: colors.muted,
-					children: "> "
-				}),
-				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: input }),
-				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
-					color: colors.accent,
-					children: "_"
-				})
-			] })
-		]
+				children: "_"
+			})]
+		}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.accent,
+			children: "_"
+		})] })]
+	});
+};
+//#endregion
+//#region ../../packages/tui-components/src/execution/components/interface-panel.tsx
+const InterfacePanel = ({ query, runStatus, onSubmit, delegationTreeState, runningCount, waitingCount, formattedReasoningTokens, formattedInputTokens, formattedCachedInputTokens, formattedOutputTokens, providerName, cacheHitRate, elapsedTime }) => {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(BottomPanel, {
+		onSubmit,
+		canSubmit: runStatus !== "running",
+		children: [runStatus === "waiting" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.accent,
+			children: "Waiting for query..."
+		}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+				color: colors.success,
+				wrap: "truncate",
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					bold: true,
+					children: "Query: "
+				}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: query || "–" })]
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+				dimColor: true,
+				children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [runningCount, " running"] }),
+					waitingCount > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [
+						" · ",
+						waitingCount,
+						" waiting"
+					] }) : null,
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: " · " }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: elapsedTime }),
+					providerName ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [" · ", providerName] }) : null
+				]
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+				dimColor: true,
+				children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: "Tokens: " }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [
+						"In ",
+						formattedInputTokens,
+						" (Cached ",
+						formattedCachedInputTokens,
+						", Cache Hit",
+						" ",
+						cacheHitRate,
+						"%)"
+					] }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [" · Out ", formattedOutputTokens] }),
+					formattedReasoningTokens !== "0" ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [" · Reasoning ", formattedReasoningTokens] }) : null
+				]
+			})
+		] }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DelegationTree, { state: delegationTreeState })]
 	});
 };
 //#endregion
@@ -121585,6 +121715,2500 @@ function renderExecution(params) {
 	};
 }
 //#endregion
+//#region ../../packages/tui-components/src/log-viewer/build-run-tree.ts
+function parseExpertName(expertKey) {
+	try {
+		return parseExpertKey(expertKey).name;
+	} catch {
+		return expertKey;
+	}
+}
+function createTreeNode(runId, expertKey, model, parentRunId) {
+	return {
+		runId,
+		expertName: parseExpertName(expertKey),
+		expertKey,
+		status: "running",
+		actionLabel: "",
+		actionFileArg: void 0,
+		contextWindowUsage: 0,
+		model,
+		parentRunId,
+		childRunIds: [],
+		totalTokens: 0,
+		inputTokens: 0,
+		outputTokens: 0,
+		cachedInputTokens: 0
+	};
+}
+function addNodeToTree(state, node) {
+	state.nodes.set(node.runId, node);
+	if (node.parentRunId) {
+		const parent = state.nodes.get(node.parentRunId);
+		if (parent && !parent.childRunIds.includes(node.runId)) parent.childRunIds.push(node.runId);
+	} else if (!state.rootRunId) state.rootRunId = node.runId;
+}
+function accumulateTokens(node, usage) {
+	node.totalTokens += usage.totalTokens;
+	node.inputTokens += usage.inputTokens;
+	node.outputTokens += usage.outputTokens;
+	node.cachedInputTokens += usage.cachedInputTokens;
+}
+function extractQueryFromStartRun(event) {
+	if (event.type !== "startRun") return void 0;
+	for (const msg of event.inputMessages) if (msg.type === "userMessage") {
+		for (const part of msg.contents) if ("text" in part && part.text) return part.text.replace(/\n/g, " ");
+	}
+}
+/**
+* Build a delegation tree from a list of RunEvents.
+*
+* Unlike the live execution tree (use-delegation-tree.ts), this does NOT merge
+* resume runs into their original runs. Each resume run becomes a separate node
+* in the tree, so that its checkpoints and events are individually accessible.
+*
+* The tree structure for a delegate-and-resume cycle looks like:
+*
+*   Coordinator (initial run)
+*   ├── Worker-A (delegate)
+*   └── Worker-B (delegate)
+*   Coordinator (resumed run) ← separate node, same expertKey
+*
+* Resume nodes are tracked in `resumeNodes` so the graph renderer can draw
+* merge lines (`|/`) before them.
+*/
+function buildRunTreeFromEvents(events) {
+	const treeState = createInitialDelegationTreeState();
+	const runQueries = /* @__PURE__ */ new Map();
+	const runStats = /* @__PURE__ */ new Map();
+	const delegationGroups = /* @__PURE__ */ new Map();
+	const currentDelegatingParent = /* @__PURE__ */ new Map();
+	const parentToChildren = /* @__PURE__ */ new Map();
+	const parentCompletedChildren = /* @__PURE__ */ new Map();
+	const awaitingResume = /* @__PURE__ */ new Set();
+	const resumeNodes = /* @__PURE__ */ new Map();
+	const runIdToNodeId = /* @__PURE__ */ new Map();
+	function resolveParentNodeId(runId) {
+		return runIdToNodeId.get(runId) ?? runId;
+	}
+	function recordStats(runId, stepNumber) {
+		const stats = runStats.get(runId) ?? {
+			eventCount: 0,
+			stepCount: 0
+		};
+		stats.eventCount++;
+		if (stepNumber > stats.stepCount) stats.stepCount = stepNumber;
+		runStats.set(runId, stats);
+	}
+	function onChildCompleted(childRunId) {
+		const childNode = treeState.nodes.get(childRunId);
+		if (!childNode?.parentRunId) return;
+		const parentRunId = childNode.parentRunId;
+		const count = (parentCompletedChildren.get(parentRunId) ?? 0) + 1;
+		parentCompletedChildren.set(parentRunId, count);
+		if (count >= (parentToChildren.get(parentRunId)?.size ?? 0)) awaitingResume.add(parentRunId);
+	}
+	for (const event of events) {
+		recordStats(event.runId, event.stepNumber);
+		switch (event.type) {
+			case "startRun": {
+				const parentRawRunId = event.initialCheckpoint.delegatedBy?.runId;
+				const parentRunId = parentRawRunId ? resolveParentNodeId(parentRawRunId) : void 0;
+				const node = createTreeNode(event.runId, event.expertKey, event.model, parentRunId);
+				node.contextWindowUsage = event.initialCheckpoint.contextWindowUsage ?? 0;
+				addNodeToTree(treeState, node);
+				runIdToNodeId.set(event.runId, event.runId);
+				if (parentRunId) {
+					const children = parentToChildren.get(parentRunId) ?? /* @__PURE__ */ new Set();
+					children.add(event.runId);
+					parentToChildren.set(parentRunId, children);
+					const currentGroup = currentDelegatingParent.get(parentRunId);
+					if (currentGroup) currentGroup.push(event.runId);
+				}
+				const query = extractQueryFromStartRun(event);
+				if (query) runQueries.set(event.runId, query);
+				break;
+			}
+			case "resumeFromStop": {
+				let originalRunId;
+				for (const candidateRunId of awaitingResume) {
+					const candidateNode = treeState.nodes.get(candidateRunId);
+					if (candidateNode && candidateNode.expertKey === event.expertKey) {
+						originalRunId = candidateRunId;
+						break;
+					}
+				}
+				if (!originalRunId) {
+					for (const [nodeId, node] of treeState.nodes) if (node.expertKey === event.expertKey && node.status === "suspending") {
+						originalRunId = nodeId;
+						break;
+					}
+				}
+				if (originalRunId) awaitingResume.delete(originalRunId);
+				const parentRunId = (originalRunId ? treeState.nodes.get(originalRunId) : void 0)?.parentRunId;
+				const node = createTreeNode(event.runId, event.expertKey, event.model, parentRunId);
+				if (event.checkpoint.contextWindowUsage !== void 0) node.contextWindowUsage = event.checkpoint.contextWindowUsage;
+				addNodeToTree(treeState, node);
+				if (!parentRunId && originalRunId) {
+					const origNode = treeState.nodes.get(originalRunId);
+					if (origNode && !origNode.childRunIds.includes(event.runId)) origNode.childRunIds.push(event.runId);
+				}
+				runIdToNodeId.set(event.runId, event.runId);
+				if (originalRunId) resumeNodes.set(event.runId, originalRunId);
+				if (originalRunId) currentDelegatingParent.delete(originalRunId);
+				break;
+			}
+			case "stopRunByDelegate": {
+				const node = treeState.nodes.get(event.runId);
+				if (node) {
+					node.status = "suspending";
+					if (event.checkpoint.contextWindowUsage !== void 0) node.contextWindowUsage = event.checkpoint.contextWindowUsage;
+					const newGroup = [];
+					const groups = delegationGroups.get(event.runId) ?? [];
+					groups.push(newGroup);
+					delegationGroups.set(event.runId, groups);
+					currentDelegatingParent.set(event.runId, newGroup);
+				}
+				break;
+			}
+			case "callTools": {
+				const node = treeState.nodes.get(event.runId);
+				if (node) accumulateTokens(node, event.usage);
+				break;
+			}
+			case "completeRun": {
+				const node = treeState.nodes.get(event.runId);
+				if (node) {
+					node.status = "completed";
+					accumulateTokens(node, event.usage);
+					if (event.checkpoint.contextWindowUsage !== void 0) node.contextWindowUsage = event.checkpoint.contextWindowUsage;
+				}
+				onChildCompleted(event.runId);
+				break;
+			}
+			case "stopRunByError": {
+				const node = treeState.nodes.get(event.runId);
+				if (node) {
+					node.status = "error";
+					if (event.checkpoint.contextWindowUsage !== void 0) node.contextWindowUsage = event.checkpoint.contextWindowUsage;
+				}
+				onChildCompleted(event.runId);
+				break;
+			}
+			case "retry": {
+				const node = treeState.nodes.get(event.runId);
+				if (node) accumulateTokens(node, event.usage);
+				break;
+			}
+			case "continueToNextStep": {
+				const node = treeState.nodes.get(event.runId);
+				if (node && event.nextCheckpoint.contextWindowUsage !== void 0) node.contextWindowUsage = event.nextCheckpoint.contextWindowUsage;
+				break;
+			}
+			case "resolveToolResults": break;
+		}
+	}
+	return {
+		treeState,
+		runQueries,
+		runStats,
+		delegationGroups,
+		resumeNodes
+	};
+}
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/components/log-info-content.tsx
+function formatDuration$1(startedAt, finishedAt) {
+	const end = finishedAt ?? Date.now();
+	const seconds = Math.floor((end - startedAt) / 1e3);
+	if (seconds < 60) return `${seconds}s`;
+	const minutes = Math.floor(seconds / 60);
+	const remainingSeconds = seconds % 60;
+	if (minutes < 60) return `${minutes}m ${remainingSeconds}s`;
+	return `${Math.floor(minutes / 60)}h ${minutes % 60}m`;
+}
+function formatShortDate$1(timestamp) {
+	const d = new Date(timestamp);
+	return `${d.getMonth() + 1}/${d.getDate()} ${String(d.getHours()).padStart(2, "0")}:${String(d.getMinutes()).padStart(2, "0")}`;
+}
+function getUsageIcon$1(ratio) {
+	const percent = ratio * 100;
+	if (percent >= 75) return USAGE_INDICATORS.FULL;
+	if (percent >= 50) return USAGE_INDICATORS.HIGH;
+	if (percent >= 25) return USAGE_INDICATORS.MEDIUM;
+	if (percent >= 5) return USAGE_INDICATORS.LOW;
+	return USAGE_INDICATORS.EMPTY;
+}
+function statusColor$3(status) {
+	if (status === "completed") return colors.primary;
+	if (status === "error") return colors.destructive;
+	if (status === "suspending") return colors.primary;
+	return colors.muted;
+}
+function JobInfoContent({ job }) {
+	const duration = formatDuration$1(job.startedAt, job.finishedAt);
+	const cacheRate = job.usage.inputTokens > 0 ? (job.usage.cachedInputTokens ?? 0) / job.usage.inputTokens * 100 : 0;
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			wrap: "truncate",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					bold: true,
+					children: job.coordinatorExpertKey
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					dimColor: true,
+					children: " · "
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: statusColor$3(job.status),
+					children: job.status
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					dimColor: true,
+					children: " · "
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: job.id })
+			]
+		}),
+		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: [
+				job.totalSteps,
+				" steps · ",
+				duration,
+				" · Started ",
+				formatShortDate$1(job.startedAt),
+				job.finishedAt ? ` · Finished ${formatShortDate$1(job.finishedAt)}` : ""
+			]
+		}),
+		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: [
+				"Tokens: In ",
+				formatTokenCount(job.usage.inputTokens),
+				(job.usage.cachedInputTokens ?? 0) > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+					" ",
+					"(Cached ",
+					formatTokenCount(job.usage.cachedInputTokens ?? 0),
+					", Cache Hit",
+					" ",
+					cacheRate.toFixed(2),
+					"%)"
+				] }) : null,
+				" · Out ",
+				formatTokenCount(job.usage.outputTokens)
+			]
+		})
+	] });
+}
+function RunInfoContent({ run, treeNode, providerName, checkpointCount, eventCount }) {
+	const parts = [];
+	if (providerName) parts.push(providerName);
+	if (treeNode?.model) parts.push(treeNode.model);
+	if (checkpointCount !== void 0) parts.push(`${checkpointCount} steps`);
+	if (eventCount !== void 0) parts.push(`${eventCount} events`);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			wrap: "truncate",
+			children: [
+				run.expertKey ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					bold: true,
+					children: run.expertKey
+				}) : null,
+				run.expertKey ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					dimColor: true,
+					children: " · "
+				}) : null,
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: treeNode ? statusColor$3(treeNode.status) : void 0,
+					children: treeNode ? treeNode.status : "unknown"
+				})
+			]
+		}),
+		parts.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: parts.join(" · ")
+		}) : null,
+		treeNode ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: [
+				"Tokens: In ",
+				formatTokenCount(treeNode.inputTokens),
+				treeNode.cachedInputTokens > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+					" ",
+					"(Cached ",
+					formatTokenCount(treeNode.cachedInputTokens),
+					", Cache Hit",
+					" ",
+					(treeNode.inputTokens > 0 ? treeNode.cachedInputTokens / treeNode.inputTokens * 100 : 0).toFixed(2),
+					"%)"
+				] }) : null,
+				" · Out ",
+				formatTokenCount(treeNode.outputTokens)
+			]
+		}) : null
+	] });
+}
+function CheckpointInfoContent({ checkpoint }) {
+	const cp = checkpoint;
+	const usageIcon = cp.contextWindowUsage !== void 0 ? ` ${getUsageIcon$1(cp.contextWindowUsage)}` : "";
+	const usagePercent = cp.contextWindowUsage !== void 0 ? ` ${(cp.contextWindowUsage * 100).toFixed(1)}%` : "";
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			wrap: "truncate",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+					bold: true,
+					children: ["Step ", cp.stepNumber]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					dimColor: true,
+					children: " · "
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: statusColor$3(cp.status),
+					children: cp.status
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					dimColor: true,
+					children: " · "
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: cp.expert.key }),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					dimColor: true,
+					children: " · "
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: cp.id })
+			]
+		}),
+		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: [
+				cp.messages.length,
+				" msgs",
+				usageIcon ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+					" ·",
+					usageIcon,
+					usagePercent
+				] }) : null,
+				" · ",
+				"Tokens: In ",
+				formatTokenCount(cp.usage.inputTokens),
+				" · Out",
+				" ",
+				formatTokenCount(cp.usage.outputTokens)
+			]
+		}),
+		cp.error ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			color: colors.destructive,
+			wrap: "truncate",
+			children: [
+				"Error: ",
+				cp.error.name,
+				": ",
+				cp.error.message
+			]
+		}) : null,
+		cp.delegateTo && cp.delegateTo.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: ["Delegates: ", cp.delegateTo.map((d) => d.expert.key).join(", ")]
+		}) : null
+	] });
+}
+function EventInfoContent({ event }) {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			wrap: "truncate",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					bold: true,
+					children: event.type
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					dimColor: true,
+					children: " · "
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: ["Step ", event.stepNumber] }),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					dimColor: true,
+					children: " · "
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.expertKey }),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					dimColor: true,
+					children: " · "
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.id })
+			]
+		}),
+		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: [
+				formatShortDate$1(event.timestamp),
+				" · run:",
+				event.runId
+			]
+		}),
+		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(EventSummaryLine, { event })
+	] });
+}
+function EventSummaryLine({ event }) {
+	switch (event.type) {
+		case "callTools": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: ["Tools: ", event.toolCalls.map((tc) => `${tc.skillName}/${tc.toolName}`).join(", ")]
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: [
+				"Tokens: In ",
+				formatTokenCount(event.usage.inputTokens),
+				" · Out",
+				" ",
+				formatTokenCount(event.usage.outputTokens)
+			]
+		})] });
+		case "completeRun": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: ["Result: ", event.text]
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: [
+				"Tokens: In ",
+				formatTokenCount(event.usage.inputTokens),
+				" · Out",
+				" ",
+				formatTokenCount(event.usage.outputTokens)
+			]
+		})] });
+		case "stopRunByError": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			color: colors.destructive,
+			wrap: "truncate",
+			children: [
+				"Error: ",
+				event.error.name,
+				": ",
+				event.error.message
+			]
+		});
+		case "retry": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			color: colors.warn,
+			wrap: "truncate",
+			children: ["Reason: ", event.reason]
+		});
+		case "startRun": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: [
+				"Model: ",
+				event.model,
+				" · ",
+				event.inputMessages.length,
+				" input messages"
+			]
+		});
+		case "stopRunByDelegate": return event.checkpoint.delegateTo ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: ["Delegates: ", event.checkpoint.delegateTo.map((d) => d.expert.key).join(", ")]
+		}) : null;
+		case "startGeneration": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			dimColor: true,
+			wrap: "truncate",
+			children: [event.messages.length, " messages"]
+		});
+		default: return null;
+	}
+}
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/screens/checkpoint-detail.tsx
+const CheckpointDetailScreen = ({ checkpoint, onBack }) => {
+	useInput((char, key) => {
+		if (key.escape || char === "b") onBack();
+	});
+	const cp = checkpoint;
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.accent,
+			bold: true,
+			children: "Checkpoint Detail"
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.muted,
+			children: " b:Back q:Quit"
+		})] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+			flexDirection: "column",
+			paddingX: 1,
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "ID:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: cp.id })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Status:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: cp.status === "completed" ? colors.success : cp.status === "proceeding" ? colors.accent : colors.destructive,
+						children: cp.status
+					})]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Step:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: cp.stepNumber })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Expert:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [
+						cp.expert.name,
+						" (",
+						cp.expert.key,
+						"@",
+						cp.expert.version,
+						")"
+					] })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Messages:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: cp.messages.length })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Input Tokens:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: cp.usage.inputTokens.toLocaleString() })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Output Tokens:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: cp.usage.outputTokens.toLocaleString() })]
+				}),
+				cp.contextWindow && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Context Window:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: cp.contextWindow.toLocaleString() })]
+				}),
+				cp.contextWindowUsage !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Context Usage:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [(cp.contextWindowUsage * 100).toFixed(1), "%"] })]
+				}),
+				cp.error && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					flexDirection: "column",
+					children: [
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+							color: colors.destructive,
+							bold: true,
+							children: "Error:"
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+							color: colors.destructive,
+							children: [
+								cp.error.name,
+								": ",
+								truncateText(cp.error.message, 100)
+							]
+						}),
+						cp.error.statusCode && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+							color: colors.muted,
+							children: ["Status Code: ", cp.error.statusCode]
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+							color: colors.muted,
+							children: ["Retryable: ", cp.error.isRetryable ? "yes" : "no"]
+						})
+					]
+				}),
+				cp.delegateTo && cp.delegateTo.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					flexDirection: "column",
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						bold: true,
+						children: "Delegating to:"
+					}), cp.delegateTo.map((d) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+						color: colors.muted,
+						children: [
+							"- ",
+							d.expert.key,
+							": ",
+							truncateText(d.query, 60)
+						]
+					}, d.toolCallId))]
+				}),
+				cp.delegatedBy && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					flexDirection: "column",
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						bold: true,
+						children: "Delegated by:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+						color: colors.muted,
+						children: [
+							cp.delegatedBy.expert.key,
+							" via ",
+							cp.delegatedBy.toolName
+						]
+					})]
+				}),
+				cp.pendingToolCalls && cp.pendingToolCalls.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Pending Tool Calls:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: cp.pendingToolCalls.length })]
+				})
+			]
+		})]
+	});
+};
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/screens/event-detail.tsx
+const EventDetailScreen = ({ event, onBack }) => {
+	useInput((char, key) => {
+		if (key.escape || char === "b") onBack();
+	});
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.accent,
+			bold: true,
+			children: "Event Detail"
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.muted,
+			children: " b:Back q:Quit"
+		})] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+			flexDirection: "column",
+			paddingX: 1,
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "ID:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.id })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Type:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						bold: true,
+						children: event.type
+					})]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Step:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.stepNumber })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Expert:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.expertKey })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Run:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.runId })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Job:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.jobId })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Timestamp:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: formatTimestamp$1(event.timestamp) })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Box, {
+					marginTop: 1,
+					children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						bold: true,
+						children: "Payload:"
+					})
+				}),
+				renderEventPayload(event)
+			]
+		})]
+	});
+};
+function renderEventPayload(event) {
+	switch (event.type) {
+		case "startRun": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+			flexDirection: "column",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Model:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.model })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Input Messages:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.inputMessages.length })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Checkpoint Status:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.initialCheckpoint.status })]
+				})
+			]
+		});
+		case "callTools": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+			flexDirection: "column",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Tool Calls:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.toolCalls.length })]
+				}),
+				event.toolCalls.map((tc) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					flexDirection: "column",
+					marginLeft: 2,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+						color: colors.primary,
+						children: [
+							tc.skillName,
+							"/",
+							tc.toolName,
+							" (",
+							tc.id,
+							")"
+						]
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: truncateText(JSON.stringify(tc.args), 120)
+					})]
+				}, tc.id)),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Input Tokens:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.usage.inputTokens.toLocaleString() })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Output Tokens:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.usage.outputTokens.toLocaleString() })]
+				})
+			]
+		});
+		case "completeRun": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+			flexDirection: "column",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Result:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: truncateText(event.text, 200) })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Input Tokens:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.usage.inputTokens.toLocaleString() })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Output Tokens:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.usage.outputTokens.toLocaleString() })]
+				})
+			]
+		});
+		case "stopRunByError": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+			flexDirection: "column",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.destructive,
+						children: "Error:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+						color: colors.destructive,
+						children: [
+							event.error.name,
+							": ",
+							event.error.message
+						]
+					})]
+				}),
+				event.error.statusCode && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Status Code:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.error.statusCode })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.muted,
+						children: "Retryable:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.error.isRetryable ? "yes" : "no" })]
+				})
+			]
+		});
+		case "retry": return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Box, {
+			flexDirection: "column",
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+				gap: 1,
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: colors.warn,
+					children: "Reason:"
+				}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.reason })]
+			})
+		});
+		case "startGeneration": return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Box, {
+			flexDirection: "column",
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+				gap: 1,
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: colors.muted,
+					children: "Messages:"
+				}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.messages.length })]
+			})
+		});
+		case "stopRunByDelegate": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+			flexDirection: "column",
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+				gap: 1,
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: colors.muted,
+					children: "Step:"
+				}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: event.step.stepNumber })]
+			}), event.checkpoint.delegateTo && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+				flexDirection: "column",
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: colors.muted,
+					children: "Delegates:"
+				}), event.checkpoint.delegateTo.map((d) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+					color: colors.primary,
+					children: [
+						"- ",
+						d.expert.key,
+						": ",
+						truncateText(d.query, 60)
+					]
+				}, d.toolCallId))]
+			})]
+		});
+		default: return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.muted,
+			children: truncateText(JSON.stringify(event, null, 2), 500)
+		});
+	}
+}
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/screens/job-detail.tsx
+const JobDetailScreen = ({ job, onBack, onViewRuns }) => {
+	useInput((char, key) => {
+		if (key.escape || char === "b") {
+			onBack();
+			return;
+		}
+		if (key.return || char === "r") onViewRuns(job);
+	});
+	const statusColor = job.status === "completed" ? colors.success : job.status === "running" ? colors.accent : colors.destructive;
+	const duration = job.finishedAt && job.startedAt ? `${((job.finishedAt - job.startedAt) / 1e3).toFixed(1)}s` : "running...";
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.accent,
+			bold: true,
+			children: "Job Detail"
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.muted,
+			children: " Enter/r:View Runs b:Back q:Quit"
+		})] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+			flexDirection: "column",
+			paddingX: 1,
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "ID:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: job.id })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Status:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: statusColor,
+						children: job.status
+					})]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Expert:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: job.coordinatorExpertKey })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Version:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: job.runtimeVersion })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Steps:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: job.totalSteps })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Duration:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: duration })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Started:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: formatTimestamp$1(job.startedAt) })]
+				}),
+				job.finishedAt && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Finished:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: formatTimestamp$1(job.finishedAt) })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Input Tokens:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: job.usage.inputTokens.toLocaleString() })]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					gap: 1,
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: colors.accent,
+						children: "Output Tokens:"
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: job.usage.outputTokens.toLocaleString() })]
+				})
+			]
+		})]
+	});
+};
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/screens/job-list.tsx
+const MAX_VISIBLE = 10;
+function formatDuration(startedAt, finishedAt) {
+	const end = finishedAt ?? Date.now();
+	const seconds = Math.floor((end - startedAt) / 1e3);
+	if (seconds < 60) return `${seconds}s`;
+	const minutes = Math.floor(seconds / 60);
+	const remainingSeconds = seconds % 60;
+	if (minutes < 60) return `${minutes}m ${remainingSeconds}s`;
+	return `${Math.floor(minutes / 60)}h ${minutes % 60}m`;
+}
+function formatShortDate(timestamp) {
+	const d = new Date(timestamp);
+	return `${d.getMonth() + 1}/${d.getDate()} ${String(d.getHours()).padStart(2, "0")}:${String(d.getMinutes()).padStart(2, "0")}`;
+}
+function statusColor$2(status) {
+	if (status === "completed") return colors.success;
+	if (status === "running" || status === "proceeding" || status === "init") return colors.accent;
+	return colors.destructive;
+}
+const JobListScreen = ({ items, onSelectJob, onViewJobDetail, onSelectedChange }) => {
+	const { selectedIndex, handleNavigation } = useListNavigation({
+		items,
+		onSelect: (item) => onSelectJob(item.job)
+	});
+	useInput((char, key) => {
+		if (char === "d" && items[selectedIndex]) {
+			onViewJobDetail(items[selectedIndex].job);
+			return;
+		}
+		handleNavigation(char, key);
+	});
+	const selectedItem = items[selectedIndex];
+	(0, import_react.useEffect)(() => {
+		onSelectedChange(selectedItem?.job);
+	}, [selectedItem, onSelectedChange]);
+	const { scrollOffset, displayItems } = (0, import_react.useMemo)(() => {
+		const offset = Math.max(0, Math.min(selectedIndex - MAX_VISIBLE + 1, items.length - MAX_VISIBLE));
+		return {
+			scrollOffset: offset,
+			displayItems: items.slice(offset, offset + MAX_VISIBLE)
+		};
+	}, [items, selectedIndex]);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: colors.accent,
+					bold: true,
+					children: "Jobs"
+				}),
+				items.length > MAX_VISIBLE && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+					color: colors.muted,
+					children: [
+						" ",
+						"(",
+						selectedIndex + 1,
+						"/",
+						items.length,
+						")"
+					]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: colors.muted,
+					children: " Enter:Select d:Detail q:Quit"
+				})
+			] }),
+			scrollOffset > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "..."
+			}),
+			displayItems.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "No jobs found"
+			}) : displayItems.map((item, i) => {
+				const isSelected = scrollOffset + i === selectedIndex;
+				const { job, query } = item;
+				return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					flexDirection: "column",
+					children: [
+						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+							color: isSelected ? colors.accent : colors.muted,
+							children: isSelected ? " ▸ " : "   "
+						}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+							wrap: "truncate",
+							children: [
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+									bold: true,
+									children: job.coordinatorExpertKey
+								}),
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+									dimColor: true,
+									children: " · "
+								}),
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+									color: statusColor$2(job.status),
+									children: job.status
+								}),
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+									dimColor: true,
+									children: " · "
+								}),
+								/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [job.totalSteps, " steps"] }),
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+									dimColor: true,
+									children: " · "
+								}),
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: formatDuration(job.startedAt, job.finishedAt) }),
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+									dimColor: true,
+									children: "  "
+								}),
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+									dimColor: true,
+									children: formatShortDate(job.startedAt)
+								})
+							]
+						})] }),
+						query ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Box, {
+							paddingLeft: 3,
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+								dimColor: true,
+								wrap: "truncate",
+								children: [
+									">",
+									" ",
+									query
+								]
+							})
+						}) : null,
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Box, {
+							paddingLeft: 3,
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+								dimColor: true,
+								wrap: "truncate",
+								children: [
+									"Tokens: In ",
+									formatTokenCount(job.usage.inputTokens),
+									" · Out",
+									" ",
+									formatTokenCount(job.usage.outputTokens)
+								]
+							})
+						})
+					]
+				}, job.id);
+			}),
+			scrollOffset + MAX_VISIBLE < items.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "..."
+			})
+		]
+	});
+};
+//#endregion
+//#region ../../packages/tui-components/src/hooks/use-terminal-height.ts
+/**
+* Returns the current terminal height in rows and updates on resize.
+*/
+function useTerminalHeight() {
+	const { stdout } = useStdout();
+	const [height, setHeight] = (0, import_react.useState)(() => stdout?.rows ?? 24);
+	(0, import_react.useEffect)(() => {
+		if (!stdout) return;
+		const onResize = () => {
+			setHeight(stdout.rows);
+		};
+		stdout.on("resize", onResize);
+		return () => {
+			stdout.off("resize", onResize);
+		};
+	}, [stdout]);
+	return height;
+}
+/**
+* Compute the number of list items that fit on screen.
+*
+* @param terminalHeight - Total terminal rows
+* @param reservedLines - Lines used by headers, tab bars, bottom panel, etc.
+* @param linesPerItem - How many terminal lines each list item occupies
+* @param minItems - Minimum items to show regardless of terminal size
+*/
+function computeVisibleItems(terminalHeight, reservedLines, linesPerItem, minItems = 3) {
+	const available = terminalHeight - reservedLines;
+	return Math.max(minItems, Math.floor(available / linesPerItem));
+}
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/screens/activity-list.tsx
+function buildActivities(events) {
+	const activities = [];
+	for (const event of events) switch (event.type) {
+		case "startRun":
+			activities.push({
+				label: `Started run with model ${event.model}`,
+				detail: `${event.inputMessages.length} input messages`,
+				color: colors.accent,
+				timestamp: event.timestamp,
+				event
+			});
+			break;
+		case "callTools": {
+			const toolNames = event.toolCalls.map((tc) => tc.toolName).join(", ");
+			const totalTokens = event.usage.inputTokens + event.usage.outputTokens;
+			activities.push({
+				label: `Called tools: ${toolNames}`,
+				detail: `${event.toolCalls.length} call(s) · ${formatTokenCount(totalTokens)} tokens`,
+				color: "magenta",
+				timestamp: event.timestamp,
+				event
+			});
+			break;
+		}
+		case "completeRun": {
+			const resultPreview = event.text.length > 80 ? `${event.text.slice(0, 80)}...` : event.text;
+			activities.push({
+				label: "Run completed",
+				detail: resultPreview,
+				color: colors.success,
+				timestamp: event.timestamp,
+				event
+			});
+			break;
+		}
+		case "stopRunByError":
+			activities.push({
+				label: `Error: ${event.error.name}`,
+				detail: event.error.message,
+				color: colors.destructive,
+				timestamp: event.timestamp,
+				event
+			});
+			break;
+		case "stopRunByDelegate": {
+			const delegates = event.checkpoint.delegateTo?.map((d) => d.expert.key).join(", ");
+			activities.push({
+				label: `Delegated to ${delegates ?? "unknown"}`,
+				color: colors.warn,
+				timestamp: event.timestamp,
+				event
+			});
+			break;
+		}
+		case "retry":
+			activities.push({
+				label: `Retried: ${event.reason}`,
+				color: colors.warn,
+				timestamp: event.timestamp,
+				event
+			});
+			break;
+		case "resumeFromStop":
+			activities.push({
+				label: "Resumed from delegation",
+				detail: `Step ${event.checkpoint.stepNumber}`,
+				color: colors.accent,
+				timestamp: event.timestamp,
+				event
+			});
+			break;
+		case "resolveToolResults":
+			activities.push({
+				label: `Resolved ${event.toolResults.length} tool result(s)`,
+				color: colors.primary,
+				timestamp: event.timestamp,
+				event
+			});
+			break;
+		default: break;
+	}
+	return activities;
+}
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/screens/run-detail.tsx
+const TAB_ORDER = [
+	"activities",
+	"checkpoints",
+	"events"
+];
+const TAB_LABELS = {
+	activities: "Activities",
+	checkpoints: "Checkpoints",
+	events: "Events"
+};
+const RESERVED_LINES$1 = 11;
+const LINES_PER_ITEM$1 = 2;
+function statusColor$1(status) {
+	if (status === "completed") return colors.success;
+	if (status === "proceeding" || status === "init") return colors.accent;
+	return colors.destructive;
+}
+function getUsageIcon(ratio) {
+	const percent = ratio * 100;
+	if (percent >= 75) return USAGE_INDICATORS.FULL;
+	if (percent >= 50) return USAGE_INDICATORS.HIGH;
+	if (percent >= 25) return USAGE_INDICATORS.MEDIUM;
+	if (percent >= 5) return USAGE_INDICATORS.LOW;
+	return USAGE_INDICATORS.EMPTY;
+}
+function eventTypeColor(type) {
+	switch (type) {
+		case "startRun": return colors.accent;
+		case "completeRun": return colors.success;
+		case "stopRunByError": return colors.destructive;
+		case "stopRunByDelegate":
+		case "stopRunByInteractiveTool": return colors.warn;
+		case "callTools": return "magenta";
+		case "retry": return colors.destructive;
+		default: return colors.muted;
+	}
+}
+function formatTime(timestamp) {
+	const d = new Date(timestamp);
+	return `${String(d.getHours()).padStart(2, "0")}:${String(d.getMinutes()).padStart(2, "0")}:${String(d.getSeconds()).padStart(2, "0")}`;
+}
+function getEventSummary(event) {
+	switch (event.type) {
+		case "callTools": return `Tools: ${event.toolCalls.map((tc) => `${tc.skillName}/${tc.toolName}`).join(", ")}`;
+		case "completeRun": return `Result: ${event.text}`;
+		case "stopRunByError": return `${event.error.name}: ${event.error.message}`;
+		case "retry": return `Reason: ${event.reason}`;
+		case "startRun": return `Model: ${event.model}`;
+		case "stopRunByDelegate": return event.checkpoint.delegateTo ? `Delegates: ${event.checkpoint.delegateTo.map((d) => d.expert.key).join(", ")}` : void 0;
+		default: return;
+	}
+}
+const RunDetailScreen = ({ run, checkpoints, events, initialTab, onSelectCheckpoint, onSelectEvent, onBack, onTabChange, onSelectedCheckpointChange, onSelectedEventChange }) => {
+	const [activeTab, setActiveTab] = (0, import_react.useState)(initialTab);
+	const maxVisible = computeVisibleItems(useTerminalHeight(), RESERVED_LINES$1, LINES_PER_ITEM$1);
+	const activities = (0, import_react.useMemo)(() => buildActivities(events), [events]);
+	const checkpointNav = useListNavigation({
+		items: checkpoints,
+		onSelect: onSelectCheckpoint,
+		onBack
+	});
+	const eventNav = useListNavigation({
+		items: events,
+		onSelect: onSelectEvent,
+		onBack
+	});
+	const activityNav = useListNavigation({
+		items: activities,
+		onSelect: (activity) => onSelectEvent(activity.event),
+		onBack
+	});
+	const selectedCheckpoint = checkpoints[checkpointNav.selectedIndex];
+	const selectedEvent = events[eventNav.selectedIndex];
+	const selectedActivity = activities[activityNav.selectedIndex];
+	(0, import_react.useEffect)(() => {
+		if (activeTab === "checkpoints") {
+			onSelectedCheckpointChange(selectedCheckpoint);
+			onSelectedEventChange(void 0);
+		} else if (activeTab === "events") {
+			onSelectedEventChange(selectedEvent);
+			onSelectedCheckpointChange(void 0);
+		} else {
+			onSelectedEventChange(selectedActivity?.event);
+			onSelectedCheckpointChange(void 0);
+		}
+	}, [
+		activeTab,
+		selectedCheckpoint,
+		selectedEvent,
+		selectedActivity,
+		onSelectedCheckpointChange,
+		onSelectedEventChange
+	]);
+	const switchTab = (0, import_react.useCallback)((tab) => {
+		setActiveTab(tab);
+		onTabChange(tab);
+	}, [onTabChange]);
+	useInput((char, key) => {
+		if (char === "1") {
+			switchTab("activities");
+			return;
+		}
+		if (char === "2") {
+			switchTab("checkpoints");
+			return;
+		}
+		if (char === "3") {
+			switchTab("events");
+			return;
+		}
+		if (key.tab) {
+			const currentIndex = TAB_ORDER.indexOf(activeTab);
+			switchTab(TAB_ORDER[key.shift ? (currentIndex - 1 + TAB_ORDER.length) % TAB_ORDER.length : (currentIndex + 1) % TAB_ORDER.length]);
+			return;
+		}
+		if (activeTab === "checkpoints") checkpointNav.handleNavigation(char, key);
+		else if (activeTab === "events") eventNav.handleNavigation(char, key);
+		else activityNav.handleNavigation(char, key);
+	});
+	const shortRunId = run.runId.length > 12 ? `${run.runId.slice(0, 12)}...` : run.runId;
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: colors.accent,
+					bold: true,
+					children: "Run"
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+					color: colors.muted,
+					children: [
+						" (",
+						shortRunId,
+						")"
+					]
+				}),
+				run.expertKey ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+					color: colors.muted,
+					children: [" ", run.expertKey]
+				}) : null
+			] }),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [TAB_ORDER.map((tab, i) => {
+				const isActive = tab === activeTab;
+				return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [i > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: colors.muted,
+					children: " | "
+				}) : null, /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+					color: isActive ? colors.accent : colors.muted,
+					bold: isActive,
+					children: [
+						i + 1,
+						":",
+						TAB_LABELS[tab]
+					]
+				})] }, tab);
+			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: " Tab:Switch Enter:Select b:Back q:Quit"
+			})] }),
+			activeTab === "activities" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActivitiesContent, {
+				activities,
+				selectedIndex: activityNav.selectedIndex,
+				maxVisible
+			}),
+			activeTab === "checkpoints" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckpointsContent, {
+				checkpoints,
+				selectedIndex: checkpointNav.selectedIndex,
+				maxVisible
+			}),
+			activeTab === "events" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EventsContent, {
+				events,
+				selectedIndex: eventNav.selectedIndex,
+				maxVisible
+			})
+		]
+	});
+};
+function ActivitiesContent({ activities, selectedIndex, maxVisible }) {
+	const { scrollOffset, displayItems } = (0, import_react.useMemo)(() => {
+		const offset = Math.max(0, Math.min(selectedIndex - maxVisible + 1, activities.length - maxVisible));
+		return {
+			scrollOffset: offset,
+			displayItems: activities.slice(offset, offset + maxVisible)
+		};
+	}, [
+		activities,
+		selectedIndex,
+		maxVisible
+	]);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [
+			activities.length > maxVisible && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+				color: colors.muted,
+				children: [
+					"[",
+					selectedIndex + 1,
+					"/",
+					activities.length,
+					"]"
+				]
+			}),
+			scrollOffset > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "..."
+			}),
+			displayItems.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "No activities found"
+			}) : displayItems.map((activity, i) => {
+				const isSelected = scrollOffset + i === selectedIndex;
+				return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					flexDirection: "column",
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: isSelected ? colors.accent : colors.muted,
+						children: isSelected ? " ▸ " : "   "
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+						wrap: "truncate",
+						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+							color: activity.color,
+							bold: isSelected,
+							children: activity.label
+						}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+							dimColor: true,
+							children: ["  ", formatTime(activity.timestamp)]
+						})]
+					})] }), activity.detail ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Box, {
+						paddingLeft: 3,
+						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+							dimColor: true,
+							wrap: "truncate",
+							children: activity.detail
+						})
+					}) : null]
+				}, activity.event.id);
+			}),
+			scrollOffset + maxVisible < activities.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "..."
+			})
+		]
+	});
+}
+function CheckpointsContent({ checkpoints, selectedIndex, maxVisible }) {
+	const { scrollOffset, displayItems } = (0, import_react.useMemo)(() => {
+		const offset = Math.max(0, Math.min(selectedIndex - maxVisible + 1, checkpoints.length - maxVisible));
+		return {
+			scrollOffset: offset,
+			displayItems: checkpoints.slice(offset, offset + maxVisible)
+		};
+	}, [
+		checkpoints,
+		selectedIndex,
+		maxVisible
+	]);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [
+			checkpoints.length > maxVisible && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+				color: colors.muted,
+				children: [
+					"[",
+					selectedIndex + 1,
+					"/",
+					checkpoints.length,
+					"]"
+				]
+			}),
+			scrollOffset > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "..."
+			}),
+			displayItems.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "No checkpoints found"
+			}) : displayItems.map((cp, i) => {
+				const isSelected = scrollOffset + i === selectedIndex;
+				const hasUsage = cp.contextWindowUsage !== void 0;
+				const hasDelegates = cp.delegateTo && cp.delegateTo.length > 0;
+				const hasError = !!cp.error;
+				return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					flexDirection: "column",
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: isSelected ? colors.accent : colors.muted,
+						children: isSelected ? " ▸ " : "   "
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+						wrap: "truncate",
+						children: [
+							/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+								bold: true,
+								children: ["Step ", cp.stepNumber]
+							}),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								dimColor: true,
+								children: " · "
+							}),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								color: statusColor$1(cp.status),
+								children: cp.status
+							}),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								dimColor: true,
+								children: " · "
+							}),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: cp.expert.key }),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								dimColor: true,
+								children: " · "
+							}),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [cp.messages.length, " msgs"] }),
+							hasUsage ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								dimColor: true,
+								children: " · "
+							}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, { children: [
+								getUsageIcon(cp.contextWindowUsage),
+								" ",
+								(cp.contextWindowUsage * 100).toFixed(0),
+								"%"
+							] })] }) : null
+						]
+					})] }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Box, {
+						paddingLeft: 3,
+						children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+							dimColor: true,
+							wrap: "truncate",
+							children: [
+								"Tokens: In ",
+								formatTokenCount(cp.usage.inputTokens),
+								" · Out",
+								" ",
+								formatTokenCount(cp.usage.outputTokens),
+								hasDelegates ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [" · Delegates: ", cp.delegateTo.map((d) => d.expert.key).join(", ")] }) : null,
+								hasError ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+									color: colors.destructive,
+									children: [" · ", cp.error.name]
+								}) : null
+							]
+						})
+					})]
+				}, cp.id);
+			}),
+			scrollOffset + maxVisible < checkpoints.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "..."
+			})
+		]
+	});
+}
+function EventsContent({ events, selectedIndex, maxVisible }) {
+	const { scrollOffset, displayItems } = (0, import_react.useMemo)(() => {
+		const offset = Math.max(0, Math.min(selectedIndex - maxVisible + 1, events.length - maxVisible));
+		return {
+			scrollOffset: offset,
+			displayItems: events.slice(offset, offset + maxVisible)
+		};
+	}, [
+		events,
+		selectedIndex,
+		maxVisible
+	]);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [
+			events.length > maxVisible && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+				color: colors.muted,
+				children: [
+					"[",
+					selectedIndex + 1,
+					"/",
+					events.length,
+					"]"
+				]
+			}),
+			scrollOffset > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "..."
+			}),
+			displayItems.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "No events found"
+			}) : displayItems.map((ev, i) => {
+				const isSelected = scrollOffset + i === selectedIndex;
+				const summary = getEventSummary(ev);
+				const hasUsage = "usage" in ev && ev.usage;
+				return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+					flexDirection: "column",
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+						color: isSelected ? colors.accent : colors.muted,
+						children: isSelected ? " ▸ " : "   "
+					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+						wrap: "truncate",
+						children: [
+							/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+								bold: true,
+								children: ["Step ", ev.stepNumber]
+							}),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								dimColor: true,
+								children: " · "
+							}),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								color: eventTypeColor(ev.type),
+								children: ev.type
+							}),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								dimColor: true,
+								children: " · "
+							}),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: ev.expertKey }),
+							hasUsage ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								dimColor: true,
+								children: " · "
+							}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+								dimColor: true,
+								children: [
+									"In",
+									" ",
+									formatTokenCount(ev.usage.inputTokens),
+									" ",
+									"· Out",
+									" ",
+									formatTokenCount(ev.usage.outputTokens)
+								]
+							})] }) : null,
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								dimColor: true,
+								children: "  "
+							}),
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+								dimColor: true,
+								children: formatTime(ev.timestamp)
+							})
+						]
+					})] }), summary ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Box, {
+						paddingLeft: 3,
+						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+							dimColor: true,
+							wrap: "truncate",
+							children: summary
+						})
+					}) : null]
+				}, ev.id);
+			}),
+			scrollOffset + maxVisible < events.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "..."
+			})
+		]
+	});
+}
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/build-graph-lines.ts
+/**
+* Build git-graph style lines from a DelegationTreeState.
+*
+* Uses delegation groups to distinguish sequential vs parallel delegations.
+* Uses resumeNodes to show resume runs as separate nodes after merge points.
+* Each column/lane gets a stable `colorIndex` so the renderer can color
+* parent and child lanes differently.
+*/
+function buildGraphLines(treeState, runQueries, delegationGroups, resumeNodes) {
+	if (!treeState.rootRunId) return [];
+	const root = treeState.nodes.get(treeState.rootRunId);
+	if (!root) return [];
+	const resumeSet = resumeNodes ? new Set(resumeNodes.keys()) : /* @__PURE__ */ new Set();
+	const lines = [];
+	let nextCol = 0;
+	const freePool = [];
+	function allocCol() {
+		if (freePool.length > 0) {
+			freePool.sort((a, b) => a - b);
+			return freePool.shift();
+		}
+		return nextCol++;
+	}
+	function freeCol(col) {
+		freePool.push(col);
+	}
+	const activeCols = /* @__PURE__ */ new Set();
+	const colColors = /* @__PURE__ */ new Map();
+	let nextColorIndex = 0;
+	function assignColor(col) {
+		const ci = nextColorIndex++;
+		colColors.set(col, ci);
+		return ci;
+	}
+	function getColor(col) {
+		return colColors.get(col) ?? -1;
+	}
+	/** Get the max column index we need to render. */
+	function maxCol(extraCols) {
+		let max = -1;
+		for (const c of activeCols) if (c > max) max = c;
+		if (extraCols) {
+			for (const c of extraCols) if (c > max) max = c;
+		}
+		return max;
+	}
+	/** Render a line given active columns, with optional special markers. */
+	function render(markers) {
+		const mc = maxCol(markers?.keys());
+		if (mc < 0) return {
+			graph: "",
+			segments: []
+		};
+		let graph = "";
+		const segments = [];
+		for (let c = 0; c <= mc; c++) {
+			const marker = markers?.get(c);
+			if (marker) {
+				const text = `${marker} `;
+				graph += text;
+				segments.push({
+					text,
+					colorIndex: getColor(c)
+				});
+			} else if (activeCols.has(c)) {
+				const text = "| ";
+				graph += text;
+				segments.push({
+					text,
+					colorIndex: getColor(c)
+				});
+			} else {
+				const text = "  ";
+				graph += text;
+				segments.push({
+					text,
+					colorIndex: -1
+				});
+			}
+		}
+		return {
+			graph,
+			segments
+		};
+	}
+	/**
+	* Split a node's children into:
+	* - delegateGroups: groups of children delegated together (from delegationGroups)
+	* - resumeChildren: children that are resume runs (process in order after delegate groups)
+	* - otherChildren: children that are neither delegated nor resume (ungrouped)
+	*/
+	const resumeChildrenOf = /* @__PURE__ */ new Map();
+	if (resumeNodes) for (const [resumeId, originalId] of resumeNodes) {
+		const list = resumeChildrenOf.get(originalId) ?? [];
+		list.push(resumeId);
+		resumeChildrenOf.set(originalId, list);
+	}
+	function splitChildren(node) {
+		const allGrouped = /* @__PURE__ */ new Set();
+		const delegateGroups = [];
+		if (delegationGroups) {
+			const groups = delegationGroups.get(node.runId);
+			if (groups) for (const group of groups) {
+				delegateGroups.push(group);
+				for (const id of group) allGrouped.add(id);
+			}
+		}
+		const resumeChildren = resumeChildrenOf.get(node.runId) ?? [];
+		const allResumeIds = new Set(resumeSet);
+		const otherChildren = [];
+		for (const childId of node.childRunIds) {
+			if (allGrouped.has(childId)) continue;
+			if (allResumeIds.has(childId)) continue;
+			otherChildren.push(childId);
+		}
+		if (delegateGroups.length === 0 && otherChildren.length > 0) {
+			delegateGroups.push(otherChildren);
+			return {
+				delegateGroups,
+				resumeChildren,
+				otherChildren: []
+			};
+		}
+		return {
+			delegateGroups,
+			resumeChildren,
+			otherChildren
+		};
+	}
+	/**
+	* Emit lines for a node on a shared lane without freeing the column afterward.
+	* Used when multiple children share a single lane (commit-chain style).
+	*/
+	function emitSubtreeInline(node, col) {
+		activeCols.add(col);
+		const isResume = resumeSet.has(node.runId);
+		const { graph, segments } = render(new Map([[col, "*"]]));
+		lines.push({
+			kind: "node",
+			node,
+			graph,
+			graphSegments: segments,
+			query: runQueries.get(node.runId),
+			isResume
+		});
+		const { delegateGroups, resumeChildren, otherChildren } = splitChildren(node);
+		if (!(delegateGroups.some((g) => g.length > 0) || resumeChildren.length > 0 || otherChildren.length > 0)) return;
+		emitChildGroups(node, col, delegateGroups, resumeChildren, otherChildren);
+	}
+	/**
+	* Shared logic for processing delegate groups, resume children, and other children.
+	*/
+	function emitChildGroups(_node, col, delegateGroups, resumeChildren, otherChildren) {
+		for (const group of delegateGroups) {
+			const children = group.map((id) => treeState.nodes.get(id)).filter((n) => n !== void 0);
+			if (children.length === 0) continue;
+			const cc = allocCol();
+			assignColor(cc);
+			activeCols.add(cc);
+			const forkMarkers = /* @__PURE__ */ new Map();
+			forkMarkers.set(cc, "\\");
+			const fork = render(forkMarkers);
+			lines.push({
+				kind: "connector",
+				graph: fork.graph,
+				graphSegments: fork.segments
+			});
+			for (const child of children) emitSubtreeInline(child, cc);
+			activeCols.add(cc);
+			const mergeMarkers = /* @__PURE__ */ new Map();
+			mergeMarkers.set(cc, "/");
+			const merge = render(mergeMarkers);
+			lines.push({
+				kind: "connector",
+				graph: merge.graph,
+				graphSegments: merge.segments
+			});
+			activeCols.delete(cc);
+			if (!freePool.includes(cc)) freeCol(cc);
+		}
+		for (const resumeId of resumeChildren) {
+			const resumeNode = treeState.nodes.get(resumeId);
+			if (!resumeNode) continue;
+			emitSubtreeInline(resumeNode, col);
+		}
+		if (otherChildren.length > 0) {
+			const children = otherChildren.map((id) => treeState.nodes.get(id)).filter((n) => n !== void 0);
+			const cc = allocCol();
+			assignColor(cc);
+			activeCols.add(cc);
+			const forkMarkers = /* @__PURE__ */ new Map();
+			forkMarkers.set(cc, "\\");
+			const fork = render(forkMarkers);
+			lines.push({
+				kind: "connector",
+				graph: fork.graph,
+				graphSegments: fork.segments
+			});
+			for (const child of children) emitSubtreeInline(child, cc);
+			activeCols.add(cc);
+			const mergeMarkers = /* @__PURE__ */ new Map();
+			mergeMarkers.set(cc, "/");
+			const merge = render(mergeMarkers);
+			lines.push({
+				kind: "connector",
+				graph: merge.graph,
+				graphSegments: merge.segments
+			});
+			activeCols.delete(cc);
+			if (!freePool.includes(cc)) freeCol(cc);
+		}
+	}
+	/**
+	* Recursively emit lines for a subtree (top-level entry point that frees column on exit).
+	*/
+	function emitSubtree(node, col) {
+		emitSubtreeInline(node, col);
+		activeCols.delete(col);
+		if (!freePool.includes(col)) freeCol(col);
+	}
+	const rootCol = allocCol();
+	assignColor(rootCol);
+	emitSubtree(root, rootCol);
+	for (const [nodeId, node] of treeState.nodes) if (!lines.some((l) => l.kind === "node" && l.node.runId === nodeId)) lines.push({
+		kind: "node",
+		node,
+		graph: "* ",
+		graphSegments: [{
+			text: "* ",
+			colorIndex: -1
+		}],
+		query: runQueries.get(nodeId),
+		isResume: resumeSet.has(nodeId)
+	});
+	return lines;
+}
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/screens/run-list.tsx
+const RESERVED_LINES = 9;
+const LINES_PER_ITEM = 1;
+/**
+* Color palette for graph lanes. Each lane gets a color by its colorIndex mod palette length.
+* These are chosen to be distinct and readable on both dark and light terminals.
+*/
+const LANE_COLORS = [
+	"cyan",
+	"magenta",
+	"yellow",
+	"blue",
+	"green",
+	"red",
+	"white"
+];
+function laneColor(colorIndex) {
+	if (colorIndex < 0) return colors.muted;
+	return LANE_COLORS[colorIndex % LANE_COLORS.length];
+}
+function statusIcon(status) {
+	switch (status) {
+		case "completed": return "✓";
+		case "error": return "✗";
+		case "running": return "○";
+		case "suspending": return "⎇";
+		default: return " ";
+	}
+}
+function statusColor(status) {
+	switch (status) {
+		case "completed": return colors.primary;
+		case "error": return colors.destructive;
+		case "suspending": return colors.primary;
+		default: return colors.muted;
+	}
+}
+/** Render graph segments as colored <Text> elements. */
+function GraphPrefix({ segments, nodeStatus }) {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: segments.map((seg, i) => {
+		if (seg.text.startsWith("*") && nodeStatus) {
+			const icon = statusIcon(nodeStatus);
+			return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+				color: statusColor(nodeStatus),
+				children: [icon, seg.text.slice(1)]
+			}, i);
+		}
+		return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: laneColor(seg.colorIndex),
+			children: seg.text
+		}, i);
+	}) });
+}
+const RunListScreen = ({ job, treeState, runQueries, delegationGroups, resumeNodes, onSelectRun, onBack, onSelectedChange }) => {
+	const maxVisible = computeVisibleItems(useTerminalHeight(), RESERVED_LINES, LINES_PER_ITEM);
+	const graphLines = (0, import_react.useMemo)(() => buildGraphLines(treeState, runQueries, delegationGroups, resumeNodes), [
+		treeState,
+		runQueries,
+		delegationGroups,
+		resumeNodes
+	]);
+	const selectableIndices = (0, import_react.useMemo)(() => graphLines.map((line, idx) => line.kind === "node" ? idx : -1).filter((idx) => idx >= 0), [graphLines]);
+	const [selectedPos, setSelectedPos] = (0, import_react.useState)(0);
+	const selectedLineIndex = selectableIndices[selectedPos];
+	const selectedLine = selectedLineIndex !== void 0 ? graphLines[selectedLineIndex] : void 0;
+	const selectedNode = selectedLine?.kind === "node" ? selectedLine.node : void 0;
+	(0, import_react.useEffect)(() => {
+		onSelectedChange(selectedNode);
+	}, [selectedNode, onSelectedChange]);
+	const handleSelect = (0, import_react.useCallback)(() => {
+		if (selectedNode) onSelectRun(selectedNode);
+	}, [selectedNode, onSelectRun]);
+	useInput((char, key) => {
+		if (key.upArrow && selectableIndices.length > 0) {
+			setSelectedPos((prev) => Math.max(0, prev - 1));
+			return;
+		}
+		if (key.downArrow && selectableIndices.length > 0) {
+			setSelectedPos((prev) => Math.min(selectableIndices.length - 1, prev + 1));
+			return;
+		}
+		if (key.return) {
+			handleSelect();
+			return;
+		}
+		if (key.escape || char === "b") onBack();
+	});
+	const { scrollOffset, displayLines } = (0, import_react.useMemo)(() => {
+		if (graphLines.length <= maxVisible) return {
+			scrollOffset: 0,
+			displayLines: graphLines
+		};
+		const rawOffset = (selectedLineIndex ?? 0) - Math.floor(maxVisible / 2);
+		const offset = Math.max(0, Math.min(rawOffset, graphLines.length - maxVisible));
+		return {
+			scrollOffset: offset,
+			displayLines: graphLines.slice(offset, offset + maxVisible)
+		};
+	}, [
+		graphLines,
+		selectedLineIndex,
+		maxVisible
+	]);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, { children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: colors.accent,
+					bold: true,
+					children: "Runs"
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+					color: colors.muted,
+					children: [
+						" (",
+						job.coordinatorExpertKey,
+						")"
+					]
+				}),
+				selectableIndices.length > maxVisible && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+					color: colors.muted,
+					children: [
+						" ",
+						"[",
+						selectedPos + 1,
+						"/",
+						selectableIndices.length,
+						"]"
+					]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+					color: colors.muted,
+					children: " Enter:Select b:Back q:Quit"
+				})
+			] }),
+			scrollOffset > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "..."
+			}),
+			displayLines.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "No runs found"
+			}) : displayLines.map((line, i) => {
+				const actualIndex = scrollOffset + i;
+				if (line.kind === "connector") return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+					wrap: "truncate",
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { children: "   " }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GraphPrefix, { segments: line.graphSegments })]
+				}, `c-${actualIndex}`);
+				const isSelected = actualIndex === selectedLineIndex;
+				const nameColor = statusColor(line.node.status);
+				return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+					wrap: "truncate",
+					children: [
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+							color: isSelected ? colors.accent : colors.muted,
+							children: isSelected ? " > " : "   "
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(GraphPrefix, {
+							segments: line.graphSegments,
+							nodeStatus: line.node.status
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+							bold: true,
+							color: nameColor,
+							children: line.node.expertName
+						}),
+						line.isResume ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+							color: colors.muted,
+							children: " (resumed)"
+						}) : null,
+						line.query ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+							dimColor: true,
+							children: [" ", line.query]
+						}) : null
+					]
+				}, line.node.runId);
+			}),
+			scrollOffset + maxVisible < graphLines.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "..."
+			})
+		]
+	});
+};
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/app.tsx
+async function extractJobQuery(fetcher, job) {
+	try {
+		const runs = await fetcher.getRuns(job.id);
+		if (runs.length === 0) return void 0;
+		const firstRun = runs[0];
+		const startRunEvent = await fetcher.getFirstEventForRun(job.id, firstRun.runId, "startRun");
+		if (!startRunEvent) return void 0;
+		return extractQueryFromStartRun(startRunEvent);
+	} catch {
+		return;
+	}
+}
+async function buildRunTree(fetcher, jobId) {
+	return buildRunTreeFromEvents(await fetcher.getTreeEventsForJob(jobId));
+}
+const LogViewerApp = ({ fetcher, initialJobId, initialRunId }) => {
+	const { exit } = useApp();
+	const [screen, setScreen] = (0, import_react.useState)({ type: "jobList" });
+	const [jobItems, setJobItems] = (0, import_react.useState)([]);
+	const [loading, setLoading] = (0, import_react.useState)(true);
+	const [error, setError] = (0, import_react.useState)();
+	const [selectedJob, setSelectedJob] = (0, import_react.useState)();
+	const [selectedRun, setSelectedRun] = (0, import_react.useState)();
+	const [selectedTreeNode, setSelectedTreeNode] = (0, import_react.useState)();
+	const [selectedCheckpoint, setSelectedCheckpoint] = (0, import_react.useState)();
+	const [selectedEvent, setSelectedEvent] = (0, import_react.useState)();
+	useInput((char) => {
+		if (char === "q") exit();
+	});
+	(0, import_react.useEffect)(() => {
+		const loadInitial = async () => {
+			try {
+				setLoading(true);
+				if (initialJobId && initialRunId) {
+					const job = await fetcher.getJob(initialJobId);
+					if (!job) {
+						setError(`Job ${initialJobId} not found`);
+						setLoading(false);
+						return;
+					}
+					const [runCheckpoints, runEvents] = await Promise.all([fetcher.getCheckpointsForRun(initialJobId, initialRunId), fetcher.getEvents(initialJobId, initialRunId)]);
+					setScreen({
+						type: "runDetail",
+						job,
+						run: {
+							jobId: initialJobId,
+							runId: initialRunId
+						},
+						checkpoints: runCheckpoints,
+						events: runEvents,
+						tab: "activities"
+					});
+					setLoading(false);
+					return;
+				}
+				if (initialJobId) {
+					const job = await fetcher.getJob(initialJobId);
+					if (!job) {
+						setError(`Job ${initialJobId} not found`);
+						setLoading(false);
+						return;
+					}
+					const { treeState, runQueries, runStats, delegationGroups, resumeNodes } = await buildRunTree(fetcher, initialJobId);
+					setScreen({
+						type: "runList",
+						job,
+						treeState,
+						runQueries,
+						runStats,
+						delegationGroups,
+						resumeNodes
+					});
+					setLoading(false);
+					return;
+				}
+				const latest = await fetcher.getLatestJob();
+				if (latest) setJobItems([{
+					job: latest,
+					query: await extractJobQuery(fetcher, latest)
+				}]);
+				else setJobItems([]);
+				setLoading(false);
+			} catch (err) {
+				setError(err instanceof Error ? err.message : String(err));
+				setLoading(false);
+			}
+		};
+		loadInitial();
+	}, [
+		fetcher,
+		initialJobId,
+		initialRunId
+	]);
+	const handleChatSubmit = (0, import_react.useCallback)((_query) => {}, []);
+	const navigateToJobDetail = (0, import_react.useCallback)((job) => {
+		setScreen({
+			type: "jobDetail",
+			job
+		});
+	}, []);
+	const navigateToRunList = (0, import_react.useCallback)(async (job) => {
+		setLoading(true);
+		try {
+			const { treeState, runQueries, runStats, delegationGroups, resumeNodes } = await buildRunTree(fetcher, job.id);
+			setScreen({
+				type: "runList",
+				job,
+				treeState,
+				runQueries,
+				runStats,
+				delegationGroups,
+				resumeNodes
+			});
+		} catch (err) {
+			setError(err instanceof Error ? err.message : String(err));
+		}
+		setLoading(false);
+	}, [fetcher]);
+	const navigateToRunDetail = (0, import_react.useCallback)(async (job, run, tab = "activities") => {
+		setLoading(true);
+		try {
+			const [runCheckpoints, runEvents] = await Promise.all([fetcher.getCheckpointsForRun(job.id, run.runId), fetcher.getEvents(job.id, run.runId)]);
+			setScreen({
+				type: "runDetail",
+				job,
+				run,
+				checkpoints: runCheckpoints,
+				events: runEvents,
+				tab
+			});
+		} catch (err) {
+			setError(err instanceof Error ? err.message : String(err));
+		}
+		setLoading(false);
+	}, [fetcher]);
+	const navigateToCheckpointDetail = (0, import_react.useCallback)((job, run, checkpoint) => {
+		setScreen({
+			type: "checkpointDetail",
+			job,
+			run,
+			checkpoint
+		});
+	}, []);
+	const navigateToEventDetail = (0, import_react.useCallback)((job, run, event) => {
+		setScreen({
+			type: "eventDetail",
+			job,
+			run,
+			event
+		});
+	}, []);
+	const screenRef = (0, import_react.useRef)(screen);
+	screenRef.current = screen;
+	const handleRunSelectedChange = (0, import_react.useCallback)((node) => {
+		const currentScreen = screenRef.current;
+		if (currentScreen.type !== "runList") return;
+		setSelectedTreeNode(node);
+		setSelectedRun(node ? {
+			jobId: currentScreen.job.id,
+			runId: node.runId,
+			expertKey: node.expertKey
+		} : void 0);
+	}, []);
+	const renderInfoContent = () => {
+		switch (screen.type) {
+			case "jobList": return selectedJob ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(JobInfoContent, { job: selectedJob }) : null;
+			case "jobDetail": return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(JobInfoContent, { job: screen.job });
+			case "runList": {
+				if (!selectedTreeNode) return null;
+				const stats = screen.runStats.get(selectedTreeNode.runId);
+				return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RunInfoContent, {
+					job: screen.job,
+					run: selectedRun,
+					treeNode: selectedTreeNode,
+					providerName: screen.treeState.providerName,
+					checkpointCount: stats?.stepCount,
+					eventCount: stats?.eventCount
+				});
+			}
+			case "runDetail":
+				if (screen.tab === "checkpoints" && selectedCheckpoint) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckpointInfoContent, { checkpoint: selectedCheckpoint });
+				if ((screen.tab === "events" || screen.tab === "activities") && selectedEvent) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EventInfoContent, { event: selectedEvent });
+				return null;
+			case "checkpointDetail": return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckpointInfoContent, { checkpoint: screen.checkpoint });
+			case "eventDetail": return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EventInfoContent, { event: screen.event });
+			default: return null;
+		}
+	};
+	if (error) return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Text, {
+			color: colors.destructive,
+			children: ["Error: ", error]
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+			color: colors.muted,
+			children: "Press q to quit"
+		})]
+	});
+	if (loading) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+		color: colors.muted,
+		children: "Loading..."
+	});
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Box, {
+			flexDirection: "column",
+			flexGrow: 1,
+			children: [
+				screen.type === "jobList" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(JobListScreen, {
+					items: jobItems,
+					onSelectJob: (job) => navigateToRunList(job),
+					onViewJobDetail: navigateToJobDetail,
+					onSelectedChange: setSelectedJob
+				}),
+				screen.type === "jobDetail" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(JobDetailScreen, {
+					job: screen.job,
+					onBack: () => setScreen({ type: "jobList" }),
+					onViewRuns: navigateToRunList
+				}),
+				screen.type === "runList" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RunListScreen, {
+					job: screen.job,
+					treeState: screen.treeState,
+					runQueries: screen.runQueries,
+					delegationGroups: screen.delegationGroups,
+					resumeNodes: screen.resumeNodes,
+					onSelectRun: (node) => {
+						const run = {
+							jobId: screen.job.id,
+							runId: node.runId,
+							expertKey: node.expertKey
+						};
+						navigateToRunDetail(screen.job, run);
+					},
+					onBack: () => setScreen({ type: "jobList" }),
+					onSelectedChange: handleRunSelectedChange
+				}),
+				screen.type === "runDetail" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RunDetailScreen, {
+					job: screen.job,
+					run: screen.run,
+					checkpoints: screen.checkpoints,
+					events: screen.events,
+					initialTab: screen.tab,
+					onSelectCheckpoint: (cp) => navigateToCheckpointDetail(screen.job, screen.run, cp),
+					onSelectEvent: (ev) => navigateToEventDetail(screen.job, screen.run, ev),
+					onBack: () => navigateToRunList(screen.job),
+					onTabChange: (tab) => {
+						setScreen({
+							...screen,
+							tab
+						});
+					},
+					onSelectedCheckpointChange: setSelectedCheckpoint,
+					onSelectedEventChange: setSelectedEvent
+				}),
+				screen.type === "checkpointDetail" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckpointDetailScreen, {
+					job: screen.job,
+					run: screen.run,
+					checkpoint: screen.checkpoint,
+					onBack: () => navigateToRunDetail(screen.job, screen.run, "checkpoints")
+				}),
+				screen.type === "eventDetail" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EventDetailScreen, {
+					job: screen.job,
+					run: screen.run,
+					event: screen.event,
+					onBack: () => navigateToRunDetail(screen.job, screen.run, "events")
+				})
+			]
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BottomPanel, {
+			onSubmit: handleChatSubmit,
+			inputPlaceholder: "Ask AI about this log...",
+			children: renderInfoContent() ?? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, {
+				color: colors.muted,
+				children: "Select an item to view details"
+			})
+		})]
+	});
+};
+//#endregion
+//#region ../../packages/tui-components/src/log-viewer/render.tsx
+async function renderLogViewer(params) {
+	const { waitUntilExit } = render(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(LogViewerApp, {
+		fetcher: params.fetcher,
+		initialJobId: params.initialJobId,
+		initialRunId: params.initialRunId
+	}));
+	await waitUntilExit();
+}
+//#endregion
 //#region ../../packages/tui-components/src/selection/app.tsx
 const selectionReducer = (_state, action) => {
 	switch (action.type) {
@@ -121891,7 +124515,7 @@ async function startHandler(expertKey, query, options, handlerOptions) {
 //#endregion
 //#region package.json
 var name = "perstack";
-var version = "0.0.124";
+var version = "0.0.127";
 var description = "PerStack CLI";
 //#endregion
 //#region bin/cli.ts
@@ -121926,7 +124550,16 @@ program.command("run").description("Run Perstack with JSON output").argument("<e
 		lockfile
 	});
 });
-program.command("log").description("View execution history and events for debugging").option("--job <jobId>", "Show events for a specific job").option("--run <runId>", "Show events for a specific run").option("--checkpoint <checkpointId>", "Show checkpoint details").option("--step <step>", "Filter by step number (e.g., 5, >5, 1-10)").option("--type <type>", "Filter by event type").option("--errors", "Show error-related events only").option("--tools", "Show tool call events only").option("--delegations", "Show delegation events only").option("--filter <expression>", "Simple filter expression").option("--json", "Output as JSON").option("--pretty", "Pretty-print JSON output").option("--verbose", "Show full event details").option("--take <n>", "Number of events to display (default: 100, use 0 for all)", (val) => parsePositiveInt(val, "--take")).option("--offset <n>", "Number of events to skip (default: 0)", (val) => parsePositiveInt(val, "--offset")).option("--context <n>", "Include N events before/after matches", (val) => parsePositiveInt(val, "--context")).option("--messages", "Show message history for checkpoint").option("--summary", "Show summarized view").action((options) => logHandler(options));
+program.command("log").description("View execution history and events for debugging").option("--job <jobId>", "Show events for a specific job").option("--run <runId>", "Show events for a specific run").option("--checkpoint <checkpointId>", "Show checkpoint details").option("--step <step>", "Filter by step number (e.g., 5, >5, 1-10)").option("--type <type>", "Filter by event type").option("--errors", "Show error-related events only").option("--tools", "Show tool call events only").option("--delegations", "Show delegation events only").option("--filter <expression>", "Simple filter expression").option("--json", "Output as JSON").option("--pretty", "Pretty-print JSON output").option("--verbose", "Show full event details").option("--take <n>", "Number of events to display (default: 100, use 0 for all)", (val) => parsePositiveInt(val, "--take")).option("--offset <n>", "Number of events to skip (default: 0)", (val) => parsePositiveInt(val, "--offset")).option("--context <n>", "Include N events before/after matches", (val) => parsePositiveInt(val, "--context")).option("--messages", "Show message history for checkpoint").option("--summary", "Show summarized view").option("--text", "Force text output mode (skip interactive TUI)").action(async (options) => {
+	const hasOutputFlags = options.json || options.pretty || options.summary || options.messages || options.text;
+	const hasFilterFlags = options.step || options.type || options.errors || options.tools || options.delegations || options.filter || options.verbose || options.take !== void 0 || options.offset !== void 0 || options.context !== void 0;
+	if (hasOutputFlags || hasFilterFlags) await logHandler(options);
+	else await renderLogViewer({
+		fetcher: createLogDataFetcher(createStorageAdapter(process.env.PERSTACK_STORAGE_PATH ?? `${process.cwd()}/perstack`)),
+		initialJobId: options.job,
+		initialRunId: options.run
+	});
+});
 program.command("install").description("Generate perstack.lock with tool definitions for faster startup").option("--config <configPath>", "Path to perstack.toml config file").option("--env-path <path>", "Path to the environment file (can be specified multiple times)", (value, previous) => previous.concat(value), []).action(async (options) => {
 	await installHandler({
 		configPath: await findConfigPath(options.config),