pi-cockpit 0.14.0 → 0.15.0

package/README.md

@@ -66,6 +66,7 @@ Cockpit has no package dependency on `pi-maestro-flow`. It observes optional pro
   "agentsMode": "list",
   "todoMode": "list",
   "todoExpanded": false,
+  "stackStyle": "classic",
   "hideNativeAgents": true,
   "icons": { "mode": "auto" },
   "sidebar": {
@@ -91,6 +92,7 @@ Cockpit has no package dependency on `pi-maestro-flow`. It observes optional pro
 - `quietSymbols`: `"check"` (✓/✗/⋯) or `"dot"` (●/○/◌) lifecycle glyphs for quiet tool rows.
 - `agentsMode` / `todoMode`: `"list"` or `"compact"`.
 - `todoExpanded`: when `true`, expands the todo widget by default.
+- `stackStyle`: `"classic"` keeps the separate Todo/Agent widgets; `"zen"` projects MISSION, WORK, and ACTORS into one borderless stack. The default remains `"classic"`.
 - `hideNativeAgents`: when `true`, clears the teammate extension's own `teammate-agents` widget (it draws a similar list *below* the editor) so the two don't duplicate. On by default.
 - `sidebar.mode`: `"auto"` or `"on"` enables the dock when at least 72 main columns plus 32 sidebar columns fit; `"off"` always uses widgets.
 - `sidebar.width`: persisted dock width, rounded and clamped to `32..56`; default `40`.
@@ -114,11 +116,12 @@ The tab title is `frame + pi - <session> - <working state>`. The session part fo
 - `/cockpit` — opens the settings overlay.
 - `/maestro-settings` — opens the unified settings shell (Cockpit, Flow, Teammate and integrations).
 - `Alt+J` — opens the background Bash jobs overlay (live status, command, cwd, duration, output tail).
+- `Alt+L` — browses the visible Cockpit surface. In Zen widget mode, arrows or `j/k` select rows, first Enter expands inline details, second Enter opens the entity sheet/overlay, and Esc steps back. In the Agent overlay, `m` makes the selected agent the editor input target.
 - `/cockpit sidebar` — reports the current sidebar mode, width, and density.
 - `/cockpit sidebar auto|on|off` — selects dock behavior.
 - `/cockpit sidebar resize` or `Ctrl+Shift+R` — enters temporary Resize mode. Left/Right adjusts one column, Shift+Left/Shift+Right adjusts four, Enter accepts, and Escape rolls back. Mouse reporting is active only during Resize mode.
 - `/cockpit quiet` — toggles quiet mode; `/cockpit bg` shows background jobs.
-- `/theme` — switch theme with live preview; `/theme <name>` applies directly. Pi ships no standalone theme command; cockpit provides one.
+- `/theme` — switch theme with live preview; `/theme <name>` applies directly. `cockpit-zen` is the restrained warm-gold theme designed for the Zen stack; selecting it does not change `stackStyle`. Pi ships no standalone theme command; cockpit provides one.
 
 ## Sidebar compatibility
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-cockpit",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "description": "Responsive Maestro operations sidebar, fallback status widgets, and footer for Pi.",
   "type": "module",
   "keywords": [
@@ -18,7 +18,7 @@
     "README.md"
   ],
   "scripts": {
-    "test": "node --test --experimental-transform-types tests/config.test.ts tests/public-events.test.ts tests/maestro-store.test.ts tests/split-pane.test.ts tests/editor-bottom.test.ts tests/sidebar-render.test.ts tests/sidebar-controller.test.ts tests/viewport-stability.test.ts tests/quiet-tools.test.ts tests/edit-guard.test.ts tests/agents-store.test.ts tests/endpoint-store.test.ts tests/session-ui-state.test.ts tests/session-tabs.test.ts tests/agent-bar.test.ts tests/supervision-store.test.ts tests/bash-bg-store.test.ts tests/bash-bg-widget.test.ts tests/bash-bg-overlay.test.ts tests/agent-overlay.test.ts tests/todo-store.test.ts tests/render.test.ts tests/agent-scroll.test.ts tests/session-bar.test.ts tests/session-detail.test.ts tests/footer.test.ts tests/extension-status.test.ts tests/input-routing.test.ts tests/integration-contract.test.ts tests/stack-widget.test.ts tests/settings-view.test.ts tests/thinking-fold.test.ts tests/thinking-timer.test.ts tests/tick-policy.test.ts tests/ambient.test.ts tests/viewport.test.ts tests/theme-picker.test.ts tests/model-picker.test.ts tests/title-gen.test.ts tests/title-llm.test.ts tests/settings-registry.test.ts tests/settings-coordinator.test.ts tests/settings-locale.test.ts tests/tui-i18n.test.ts tests/settings-shell.test.ts tests/settings-cockpit-provider.test.ts tests/settings-cross-package.test.ts tests/ui-primitives.test.ts tests/settings-shell-secret.test.ts tests/settings-shell-listcrud.test.ts tests/capturing-overlay.test.ts tests/claude-editor.test.ts tests/fullscreen-controller.test.ts tests/transcript-selection.test.ts tests/terminal-cleanup.test.ts tests/terminal-capability.test.ts",
+    "test": "node --test --experimental-transform-types tests/config.test.ts tests/public-events.test.ts tests/maestro-store.test.ts tests/split-pane.test.ts tests/editor-bottom.test.ts tests/sidebar-render.test.ts tests/sidebar-controller.test.ts tests/viewport-stability.test.ts tests/quiet-tools.test.ts tests/edit-guard.test.ts tests/agents-store.test.ts tests/endpoint-store.test.ts tests/session-ui-state.test.ts tests/session-tabs.test.ts tests/agent-bar.test.ts tests/supervision-store.test.ts tests/bash-bg-store.test.ts tests/bash-bg-widget.test.ts tests/bash-bg-overlay.test.ts tests/agent-overlay.test.ts tests/todo-store.test.ts tests/render.test.ts tests/agent-scroll.test.ts tests/session-bar.test.ts tests/session-detail.test.ts tests/footer.test.ts tests/extension-status.test.ts tests/input-routing.test.ts tests/integration-contract.test.ts tests/stack-widget.test.ts tests/zen-render.test.ts tests/zen-browse.test.ts tests/zen-sheet.test.ts tests/settings-view.test.ts tests/thinking-fold.test.ts tests/thinking-timer.test.ts tests/tick-policy.test.ts tests/ambient.test.ts tests/viewport.test.ts tests/theme-picker.test.ts tests/model-picker.test.ts tests/title-gen.test.ts tests/title-llm.test.ts tests/settings-registry.test.ts tests/settings-coordinator.test.ts tests/settings-locale.test.ts tests/tui-i18n.test.ts tests/settings-shell.test.ts tests/settings-cockpit-provider.test.ts tests/settings-cross-package.test.ts tests/ui-primitives.test.ts tests/settings-shell-secret.test.ts tests/settings-shell-listcrud.test.ts tests/capturing-overlay.test.ts tests/claude-editor.test.ts tests/fullscreen-controller.test.ts tests/transcript-selection.test.ts tests/terminal-cleanup.test.ts tests/terminal-capability.test.ts",
     "typecheck": "tsc --noEmit",
     "prepack": "node ../../scripts/bundle-settings-core.mjs",
     "postpack": "node ../../scripts/bundle-settings-core.mjs --clean"
@@ -72,7 +72,7 @@
     "@earendil-works/pi-coding-agent": "0.83.0",
     "@earendil-works/pi-tui": "0.83.0",
     "@types/node": "^22.0.0",
-    "pi-maestro-teammate": "1.12.0",
+    "pi-maestro-teammate": "1.13.0",
     "typebox": "1.3.7",
     "typescript": "^5.5.0"
   },

package/src/agent-overlay.ts

@@ -9,7 +9,7 @@ import {
 	truncateToWidth,
 	visibleWidth,
 } from "@earendil-works/pi-tui";
-import { effectiveAgentStatus, type AgentDisplayStatus } from "./agents-store.ts";
+import { effectiveAgentStatus, isExpertLeader, type AgentDisplayStatus } from "./agents-store.ts";
 import { scrollBy, type AgentScrollState } from "./agent-scroll.ts";
 import type { IconGlyphs } from "./icons.ts";
 import { visibleStart } from "./layout.ts";
@@ -28,6 +28,8 @@ export interface AgentOverlayParams {
 	getAgents: () => readonly AgentRow[];
 	getViewingId: () => string | undefined;
 	onSelect: (correlationId: string) => void;
+	/** Set the selected agent as the editor input target without closing the overlay. */
+	onTarget?: (correlationId: string) => void;
 	onCommand: (correlationId: string, action: "interrupt" | "steer", message?: string) => void;
 	requestRender: () => void;
 	close: () => void;
@@ -289,6 +291,11 @@ export class AgentOverlay implements Component, Focusable {
 			this.scrollOutput(Math.max(1, this.detailRows - 2));
 			return;
 		}
+		if (commandInput === "m" && this.selectedId && this.params.onTarget) {
+			this.params.onTarget(this.selectedId);
+			this.ack(tuiT("overlay.agents.targetAck", { agent: this.agentName(this.selectedId) }));
+			return;
+		}
 		if (commandInput === "i" && this.selectedId) {
 			// Interrupt (打断): abort the current turn/tool; the agent stays alive
 			// and is told to report and continue.
@@ -444,8 +451,11 @@ export class AgentOverlay implements Component, Focusable {
 			const visual = agentVisual(status, this.params.glyphs);
 			const marker = row.correlationId === this.selectedId ? this.params.glyphs.selectMarker : " ";
 			const task = row.task ? ` · ${row.task}` : "";
+			const expertTag = isExpertLeader(row)
+				? `${this.params.theme.fg("accent", tuiT("widget.agent.expert"))} `
+				: "";
 			return fit(
-				`${prefix}${marker} ${this.params.theme.fg(visual.color, visual.glyph)} ${this.params.theme.bold(agentLabel(row))}${task}`,
+				`${prefix}${marker} ${this.params.theme.fg(visual.color, visual.glyph)} ${expertTag}${this.params.theme.bold(agentLabel(row))}${task}`,
 				width,
 			);
 		});

package/src/agents-store.ts

@@ -5,7 +5,7 @@ import type {
 } from "pi-maestro-teammate/v1/events";
 import type { AgentProgressSnapshot } from "pi-maestro-teammate/v1/types";
 import { sanitizeExtensionStatusText } from "./extension-status.ts";
-import type { AgentRow, AgentStatus } from "./types.ts";
+import { EXPERT_LEADER_NAME, type AgentRow, type AgentStatus } from "./types.ts";
 
 const STATUS_TEXT_MAX = 48;
 const TEAMMATE_STALL_TIMEOUT_MS = 30_000;
@@ -99,6 +99,16 @@ function deriveRole(agent: string | undefined, name: string | undefined): string
 	return clean(name) || "agent";
 }
 
+/**
+ * True when the row is the workflow Leader of an expert-mode dispatch
+ * (pi-maestro-teammate EXPERT_MODE_LEADER_NAME). The Leader keeps the same
+ * tree + dependency-arrow presentation as parallel/DAG runs; this only adds
+ * its strategy marker.
+ */
+export function isExpertLeader(row: { name: string | undefined }): boolean {
+	return row.name === EXPERT_LEADER_NAME;
+}
+
 export function mapAgentStatus(status: unknown): AgentStatus {
 	switch (status) {
 		case "pending":

package/src/bash-bg-overlay.ts

@@ -25,6 +25,8 @@ export interface BashBgOverlayParams {
 	close: () => void;
 	theme: Theme;
 	glyphs: IconGlyphs;
+	/** Select this job when the overlay first renders. */
+	initialJobId?: string;
 	/** Wall-clock snapshot supplied by the owner and advanced through tick(). */
 	now: number;
 	/** Live terminal height, so the card can use the space it already reserves. */
@@ -57,6 +59,7 @@ export class BashBgOverlay implements Component, Focusable {
 	constructor(private readonly params: BashBgOverlayParams) {
 		this.now = params.now;
 		this.liveTickKey = this.tickKey(params.now);
+		this.selectedId = params.initialJobId;
 	}
 
 	invalidate(): void {}

package/src/config.ts

@@ -1,7 +1,7 @@
 import { existsSync, mkdirSync, readFileSync, renameSync, rmSync, writeFileSync } from "node:fs";
 import { join } from "node:path";
 import { getAgentDir } from "@earendil-works/pi-coding-agent";
-import { type CockpitConfig, type CurrencyMode, DEFAULT_CONFIG } from "./types.ts";
+import { type CockpitConfig, type CurrencyMode, DEFAULT_CONFIG, type StackStyle } from "./types.ts";
 
 const SIDEBAR_MIN_WIDTH = 32;
 const SIDEBAR_MAX_WIDTH = 56;
@@ -19,6 +19,7 @@ export function mergeConfig(base: CockpitConfig, over: unknown): CockpitConfig {
 	const isToolPaletteMode = (v: unknown): v is "classic" | "family" | "readwrite" | "search" | "mono" =>
 		v === "classic" || v === "family" || v === "readwrite" || v === "search" || v === "mono";
 	const isIconMode = (v: unknown): v is "auto" | "nerd" | "ascii" => v === "auto" || v === "nerd" || v === "ascii";
+	const isStackStyle = (v: unknown): v is StackStyle => v === "classic" || v === "zen";
 const isCurrencyMode = (v: unknown): v is CurrencyMode => v === "usd" || v === "cny";
 	const isSidebarMode = (v: unknown): v is "auto" | "on" | "off" => v === "auto" || v === "on" || v === "off";
 	const isSidebarDensity = (v: unknown): v is "comfortable" | "compact" => v === "comfortable" || v === "compact";
@@ -47,6 +48,7 @@ const isCurrencyMode = (v: unknown): v is CurrencyMode => v === "usd" || v === "
 		agentsMode: isMode(o.agentsMode) ? o.agentsMode : base.agentsMode,
 		todoMode: isMode(o.todoMode) ? o.todoMode : base.todoMode,
 		todoExpanded: typeof o.todoExpanded === "boolean" ? o.todoExpanded : base.todoExpanded,
+		stackStyle: isStackStyle(o.stackStyle) ? o.stackStyle : base.stackStyle,
 		hideNativeAgents: typeof o.hideNativeAgents === "boolean" ? o.hideNativeAgents : base.hideNativeAgents,
 		pinEditorBottom: typeof o.pinEditorBottom === "boolean" ? o.pinEditorBottom : base.pinEditorBottom,
 		doubleEscapeClearInput: typeof o.doubleEscapeClearInput === "boolean" ? o.doubleEscapeClearInput : base.doubleEscapeClearInput,
@@ -133,6 +135,7 @@ export function mergeConfigDocument(raw: unknown, config: CockpitConfig): Record
 		agentsMode: config.agentsMode,
 		todoMode: config.todoMode,
 		todoExpanded: config.todoExpanded,
+		stackStyle: config.stackStyle,
 		hideNativeAgents: config.hideNativeAgents,
 		pinEditorBottom: config.pinEditorBottom,
 		doubleEscapeClearInput: config.doubleEscapeClearInput,

package/src/index.ts

@@ -13,7 +13,7 @@ import { SupervisionStore } from "./supervision-store.ts";
 import { MaestroStore } from "./maestro-store.ts";
 import { createSidebarController, type SidebarController } from "./sidebar-controller.ts";
 import { COCKPIT_SPLIT_PANE_MARKER } from "./split-pane.ts";
-import { attachViewportStability } from "./viewport-stability.ts";
+import { attachViewportStability, type ViewportStabilityPatch } from "./viewport-stability.ts";
 import {
 	COCKPIT_EDITOR_BOTTOM_MARKER,
 	EDITOR_BOTTOM_WIDGET_KEY,
@@ -54,7 +54,17 @@ import { SessionUiState } from "./session-ui-state.ts";
 import { nextSessionTabId } from "./session-tabs.ts";
 import { renderWindowBar, windowSessionColor } from "./window-bar.ts";
 import { makeWindowThreadWidget } from "./window-thread-view.ts";
-import { agentPanelRows } from "./viewport.ts";
+import { agentPanelRows, panelRows } from "./viewport.ts";
+import { createZenBrowseController, type ZenBrowseController } from "./zen-browse.ts";
+import { enumerateZenNavRows, renderZenStack } from "./zen-render.ts";
+import {
+	ZenSheet,
+	buildZenMissionSheet,
+	buildZenRunSheet,
+	buildZenSwarmSheet,
+	buildZenTaskSheet,
+	type ZenSheetDocument,
+} from "./zen-sheet.ts";
 import { routeAgentInput } from "./input-routing.ts";
 import { activeThemeName, ThemePicker } from "./theme-picker.ts";
 import { ModelPicker, type ModelPickerEntry } from "./model-picker.ts";
@@ -323,6 +333,7 @@ export default function (pi: ExtensionAPI): void {
 	// Independent of the split-pane attach: the sidebar can be off while the
 	// thinking label / teammate tree still stream above the visible viewport.
 	let stabilityTui: TUI | undefined;
+	let viewportStabilityPatch: ViewportStabilityPatch | undefined;
 	// True while Cockpit owns a capturing overlay (bash jobs, theme picker,
 	// settings panel). Split-pane resize must yield to the overlay's focus and
 	// refuse to start while one is open; otherwise the resize listener — a
@@ -331,6 +342,7 @@ export default function (pi: ExtensionAPI): void {
 	/** Extra repaint target while the Agent modal is consuming the live store. */
 	let activeAgentOverlayRender: (() => void) | undefined;
 	let activeAgentOverlay: { finalize(): void } | undefined;
+	let activeZenSheet: { finalize(): void } | undefined;
 	let activeBashBgOverlay: BashBgOverlay | undefined;
 	/** Agent activity temporarily wins vertical space without rewriting Todo preference. */
 	let agentPriorityActive = false;
@@ -340,6 +352,8 @@ export default function (pi: ExtensionAPI): void {
 	// component.dispose() (MW-2).
 	let activeSettingsOverlay: { finalize(): void } | undefined;
 	let sidebarController: SidebarController | undefined;
+	let zenBrowseController: ZenBrowseController | undefined;
+	let zenNavRows: string[] = [];
 	let editorBottomController: EditorBottomController | undefined;
 	// Whether Cockpit installed its custom editor this session (reload-gated).
 	// Tracks ownership so teardown restores the default editor only when ours.
@@ -676,14 +690,17 @@ export default function (pi: ExtensionAPI): void {
 
 	const ensureViewportStability = (tui: TUI): void => {
 		if (stabilityTui === tui) return;
+		viewportStabilityPatch?.detach();
+		viewportStabilityPatch = attachViewportStability(tui);
 		stabilityTui = tui;
-		attachViewportStability(tui);
 	};
 
 	const sessionListOverlayActive = (): boolean =>
 		capturingOverlayActive || ambientKeysShouldYield(capturedTui);
 
 	const clearWidgets = (ctx: ExtensionContext): void => {
+		zenBrowseController?.end();
+		zenNavRows = [];
 		ctx.ui.setWidget(STACK_WIDGET_KEY, undefined);
 		ctx.ui.setWidget(AGENT_WIDGET_KEY, undefined);
 	};
@@ -926,7 +943,10 @@ export default function (pi: ExtensionAPI): void {
 			capturedTui = tui;
 			ensureViewportStability(tui);
 			return makeAgentWidget({
-				getAgents: () => sessionUi.mode === "window" ? [] : agents.snapshot(),
+				// The Zen stack absorbs the roster into its ACTORS section; an empty
+				// roster makes makeAgentWidget render zero rows, so the widget slot
+				// stays registered (placement bookkeeping) without duplicating rows.
+				getAgents: () => config.stackStyle === "zen" || sessionUi.mode === "window" ? [] : agents.snapshot(),
 				getConfig: () => config,
 				isRunning: () => running,
 				isAnimating,
@@ -1019,18 +1039,63 @@ export default function (pi: ExtensionAPI): void {
 		);
 	};
 
+	const ensureZenBrowseController = (ctx: ExtensionContext): ZenBrowseController => {
+		if (zenBrowseController) return zenBrowseController;
+		zenBrowseController = createZenBrowseController({
+			getNavRows: () => zenNavRows,
+			subscribeInput: (handler) => ctx.ui.onTerminalInput(handler),
+			requestRender: () => req(),
+			onActivate: (id) => {
+				void activateZenRow(ctx, id).catch((error) => {
+					ctx.ui.notify(error instanceof Error ? error.message : String(error), "warning");
+				});
+			},
+			shouldYield: () => capturingOverlayActive || ambientKeysShouldYield(capturedTui),
+			onWarning: (message) => ctx.ui.notify(message, "warning"),
+			emptyNotice: () => tuiT("notice.sidebarNothing"),
+		});
+		return zenBrowseController;
+	};
+
 	const installWidgets = (ctx: ExtensionContext): void => {
+		const browseController = ensureZenBrowseController(ctx);
 		ctx.ui.setWidget(
 			STACK_WIDGET_KEY,
 			(tui, theme) => {
 				capturedTui = tui;
 				ensureViewportStability(tui);
-				return makeTodoWidget({
+				const todoWidget = makeTodoWidget({
 					getTodos: () => todos.snapshot(),
 					getConfig: () => config,
 					getExpanded: effectiveTodoExpanded,
 					isAnimating,
 				})(tui, theme);
+				// stackStyle is dispatched per render, not per install, so a settings
+				// toggle switches the projection live without re-registering widgets.
+				return {
+					render(width: number): string[] {
+						if (config.stackStyle !== "zen") {
+							zenNavRows = [];
+							return todoWidget.render(width);
+						}
+						const input = {
+							maestro: maestro.snapshot(),
+							todos: todos.snapshot(),
+							agents: sessionUi.mode === "window" ? [] : visibleAgentRows(agents.snapshot()),
+							jobs: bashBg.snapshot(),
+							config: { ...config, todoExpanded: effectiveTodoExpanded() },
+							width,
+							theme,
+							now: Date.now(),
+							maxRows: panelRows(terminalRows(tui)),
+							browse: browseController.state(),
+						};
+						zenNavRows = enumerateZenNavRows(input);
+						return renderZenStack(input);
+					},
+					invalidate(): void { todoWidget.invalidate(); },
+					dispose(): void { todoWidget.dispose(); },
+				};
 			},
 			{ placement: "aboveEditor" },
 		);
@@ -1135,6 +1200,9 @@ export default function (pi: ExtensionAPI): void {
 			sidebarController?.dispose();
 			editorBottomController?.dispose();
 		}
+		zenBrowseController?.dispose();
+		zenBrowseController = undefined;
+		zenNavRows = [];
 		sidebarController = undefined;
 		editorBottomController = undefined;
 		fullscreenController = undefined;
@@ -1148,6 +1216,12 @@ export default function (pi: ExtensionAPI): void {
 		}
 		activeAgentOverlay = undefined;
 		activeAgentOverlayRender = undefined;
+		try {
+			activeZenSheet?.finalize();
+		} catch {
+			// best effort
+		}
+		activeZenSheet = undefined;
 		dockEffectiveVisible = false;
 		clearClaudeEditor(ctx);
 		clearFullscreen(ctx);
@@ -1172,6 +1246,9 @@ export default function (pi: ExtensionAPI): void {
 			// ambient surfaces are best-effort
 		}
 		stopTick();
+		viewportStabilityPatch?.detach();
+		viewportStabilityPatch = undefined;
+		stabilityTui = undefined;
 		lastPublishedInputTarget = "@main";
 		pi.events.emit(COCKPIT_INPUT_TARGET_EVENT, { version: 1 } satisfies CockpitInputTargetV1);
 		capturedTui = undefined;
@@ -1500,15 +1577,14 @@ export default function (pi: ExtensionAPI): void {
 			}),
 			pi.events.on(COCKPIT_PREEMPT_RESIZE_EVENT, () => {
 				// A capturing overlay opened by another extension (teammate attach,
-				// control center, model mapping) must preempt an active sidebar resize
-				// or browse mode: both are global terminal-input hooks that would
-				// otherwise swallow the overlay's first arrow/Enter/Esc.
+				// control center, model mapping) must preempt every global input hook.
 				try {
 					sidebarController?.cancelResize();
 					sidebarController?.endFocus();
-			} catch {
-				// best effort
-			}
+					zenBrowseController?.end();
+				} catch {
+					// best effort
+				}
 			}),
 		);
 	};
@@ -1832,6 +1908,7 @@ export default function (pi: ExtensionAPI): void {
 
 	const enterCapturingOverlay = (): void => {
 		capturingOverlayActive = true;
+		zenBrowseController?.end();
 		req();
 		try {
 			sidebarController?.cancelResize();
@@ -1844,7 +1921,71 @@ export default function (pi: ExtensionAPI): void {
 		req();
 	};
 
-	const openAgentOverlay = async (ctx: ExtensionContext): Promise<void> => {
+	const openZenSheet = async (
+		ctx: ExtensionContext,
+		getDocument: () => ZenSheetDocument | undefined,
+	): Promise<void> => {
+		if (!ctx.hasUI || capturingOverlayActive) return;
+		let ownedSheet: { finalize(): void } | undefined;
+		enterCapturingOverlay();
+		try {
+			await ctx.ui.custom<void>((tui, theme, _kb, done) => {
+				let settled = false;
+				const finalize = (): void => {
+					if (settled) return;
+					settled = true;
+					done(undefined);
+				};
+				ownedSheet = { finalize };
+				activeZenSheet = ownedSheet;
+				return new ZenSheet({
+					getDocument,
+					requestRender: () => tui.requestRender(),
+					close: finalize,
+					theme,
+					glyphs: resolveGlyphs(config.icons.mode),
+					getTerminalRows: () => terminalRows(tui),
+				});
+			}, {
+				overlay: true,
+				overlayOptions: { anchor: "center", width: "72%", maxHeight: "85%" },
+			});
+		} finally {
+			if (activeZenSheet === ownedSheet) activeZenSheet = undefined;
+			exitCapturingOverlay();
+		}
+	};
+
+	const activateZenRow = async (ctx: ExtensionContext, id: string): Promise<void> => {
+		if (id === "mission") {
+			await openZenSheet(ctx, () => buildZenMissionSheet(maestro.snapshot()));
+			return;
+		}
+		if (id === "run") {
+			await openZenSheet(ctx, () => buildZenRunSheet(maestro.snapshot()));
+			return;
+		}
+		if (id === "swarm") {
+			await openZenSheet(ctx, () => buildZenSwarmSheet(maestro.snapshot()));
+			return;
+		}
+		if (id.startsWith("task:")) {
+			const taskId = id.slice("task:".length);
+			await openZenSheet(ctx, () => buildZenTaskSheet(todos.snapshot().find((item) => item.id === taskId)));
+			return;
+		}
+		if (id.startsWith("agent:")) {
+			const correlationId = id.slice("agent:".length);
+			selectAgent(correlationId);
+			await openAgentOverlay(ctx, correlationId);
+			return;
+		}
+		if (id.startsWith("job:")) {
+			await openBashBgOverlay(ctx, id.slice("job:".length));
+		}
+	};
+
+	const openAgentOverlay = async (ctx: ExtensionContext, initialCorrelationId?: string): Promise<void> => {
 		if (!ctx.hasUI) return;
 		if (capturingOverlayActive) {
 			ctx.ui.notify(tuiT("notice.closeOverlayAgents"), "warning");
@@ -1854,6 +1995,7 @@ export default function (pi: ExtensionAPI): void {
 			ctx.ui.notify(tuiT("notice.noAgents"), "info");
 			return;
 		}
+		if (initialCorrelationId) selectAgent(initialCorrelationId);
 		let ownedOverlay: { finalize(): void } | undefined;
 		let ownedRender: (() => void) | undefined;
 		enterCapturingOverlay();
@@ -1871,8 +2013,9 @@ export default function (pi: ExtensionAPI): void {
 				activeAgentOverlayRender = ownedRender;
 				return new AgentOverlay({
 					getAgents: () => agents.snapshot(),
-					getViewingId: selectedAgentCorrelationId,
+					getViewingId: () => initialCorrelationId ?? selectedAgentCorrelationId(),
 					onSelect: (correlationId) => selectAgent(correlationId),
+					onTarget: (correlationId) => selectAgent(correlationId),
 					onCommand: (correlationId, action, message) => {
 						pi.events.emit(TEAMMATE_AGENT_COMMAND_EVENT, { correlationId, action, ...(message !== undefined ? { message } : {}) });
 					},
@@ -1955,7 +2098,7 @@ export default function (pi: ExtensionAPI): void {
 		});
 	});
 
-	const openBashBgOverlay = async (ctx: ExtensionContext): Promise<void> => {
+	const openBashBgOverlay = async (ctx: ExtensionContext, initialJobId?: string): Promise<void> => {
 		if (!ctx.hasUI) return;
 		let ownedOverlay: BashBgOverlay | undefined;
 		enterCapturingOverlay();
@@ -1970,6 +2113,7 @@ export default function (pi: ExtensionAPI): void {
 					glyphs: resolveGlyphs(config.icons.mode),
 					now: Date.now(),
 					hideLiveDuration: config.staticMode,
+					...(initialJobId ? { initialJobId } : {}),
 					getTerminalRows: () => terminalRows(tui),
 				});
 				activeBashBgOverlay = ownedOverlay;
@@ -2145,6 +2289,10 @@ export default function (pi: ExtensionAPI): void {
 				else clearEditorBottom(ctx);
 			}
 			if (changedKeys.some((key) => key.startsWith("sidebar."))) syncSidebarMode(ctx);
+			if (previous.stackStyle !== nextConfig.stackStyle && nextConfig.stackStyle !== "zen") {
+				zenBrowseController?.end();
+				zenNavRows = [];
+			}
 			publishUiOwnership();
 			req();
 		},
@@ -2231,7 +2379,7 @@ export default function (pi: ExtensionAPI): void {
 	});
 
 	pi.registerShortcut(SIDEBAR_FOCUS_KEY, {
-		description: "Browse the Cockpit sidebar with the keyboard (↑↓/j/k/PageUp/PageDown/Home/End, Esc to leave)",
+		description: "Browse the visible Cockpit surface with the keyboard (↑↓/j/k/Home/End, Enter, Esc)",
 		handler(ctx) {
 			if (!config.enabled) {
 				ctx.ui.notify(tuiT("notice.cockpitDisabled"), "warning");
@@ -2241,6 +2389,10 @@ export default function (pi: ExtensionAPI): void {
 				ctx.ui.notify(tuiT("notice.closeOverlayBrowse"), "warning");
 				return;
 			}
+			if (config.stackStyle === "zen" && surfaceState === "widgets") {
+				ensureZenBrowseController(ctx).begin();
+				return;
+			}
 			sidebarController?.beginFocus();
 		},
 	});

package/src/render.ts

@@ -1,5 +1,5 @@
 import type { Theme, ThemeColor } from "@earendil-works/pi-coding-agent";
-import { effectiveAgentStatus, type AgentDisplayStatus } from "./agents-store.ts";
+import { effectiveAgentStatus, isExpertLeader, type AgentDisplayStatus } from "./agents-store.ts";
 import type { AgentRow, TodoItem, ViewMode } from "./types.ts";
 import type { IconGlyphs } from "./icons.ts";
 import { composeByPriority, fitLineByPriority, type PriorityGroup, type PrioritizedSegment, type WidthUtils } from "./layout.ts";
@@ -237,7 +237,9 @@ export function renderAgents(
 			+ (stalled ? theme.fg("error", `${g.separator}${tuiT("common.stalled", { count: stalled })}`) : "");
 		const tails = rows
 			.filter((r) => r.tail)
-			.map((r) => `${theme.fg(roleColor(r.role), r.role)}${theme.fg("dim", ":")} ${theme.fg("dim", r.tail)}`);
+			.map((r) => isExpertLeader(r)
+				? `${theme.fg("accent", tuiT("widget.agent.expert"))}${theme.fg("dim", ":")} ${theme.fg("dim", r.tail)}`
+				: `${theme.fg(roleColor(r.role), r.role)}${theme.fg("dim", ":")} ${theme.fg("dim", r.tail)}`);
 		const parts = opts.withHead === false ? tails : [head, ...tails];
 		if (parts.length === 0) return [];
 		return [utils.clip(parts.join(theme.fg("dim", g.separator)), width, ell)];
@@ -292,6 +294,11 @@ export function renderAgents(
 			{ text: theme.fg(status.color, status.glyph), priority: 99, clippable: false },
 		];
 		if (status.label) segs.push({ text: theme.fg(status.color, status.label), priority: 95, clippable: false });
+		// Expert mode marks its workflow Leader row; the row keeps the same
+		// tree/dependency presentation as parallel and DAG dispatches.
+		if (isExpertLeader(r)) {
+			segs.push({ text: theme.fg("accent", tuiT("widget.agent.expert")), priority: 93, clippable: false });
+		}
 		if (r.phase && !(r.phase === "tool-execution" && r.activeTool)) {
 			segs.push({ text: theme.fg("dim", r.phase), priority: 92, minWidth: 6 });
 		}

package/src/settings/cockpit-provider.ts

@@ -67,6 +67,7 @@ const CONFIG_KEYS = [
 	"agentsMode",
 	"todoMode",
 	"todoExpanded",
+	"stackStyle",
 	"hideNativeAgents",
 	"toolPalette",
 	"icons.mode",
@@ -155,6 +156,7 @@ const CATALOGS = {
 		"cockpit.agentsMode": "Agent display",
 		"cockpit.todoMode": "Todo display",
 		"cockpit.todoExpanded": "Todo expanded",
+		"cockpit.stackStyle": "Stack projection",
 		"cockpit.hideNativeAgents": "Hide native agent widget",
 		"cockpit.icons.mode": "Icon mode",
 		"cockpit.sidebar.mode": "Sidebar mode",
@@ -175,6 +177,7 @@ const CATALOGS = {
 		"cockpit.title.maxLength": "Title max length",
 		"cockpit.title.maxLength.description": "Hard cap on the composed tab title (the middle is ellided).",
 		"cockpit.option.classic": "Classic",
+		"cockpit.option.zen": "Zen",
 		"cockpit.option.family": "Family",
 		"cockpit.option.readwrite": "Read/Write",
 		"cockpit.option.search": "Search",
@@ -225,6 +228,7 @@ const CATALOGS = {
 		"cockpit.agentsMode": "Agent 显示",
 		"cockpit.todoMode": "Todo 显示",
 		"cockpit.todoExpanded": "展开 Todo",
+		"cockpit.stackStyle": "栈投影",
 		"cockpit.hideNativeAgents": "隐藏原生 Agent 面板",
 		"cockpit.icons.mode": "图标模式",
 		"cockpit.sidebar.mode": "侧边栏模式",
@@ -245,6 +249,7 @@ const CATALOGS = {
 		"cockpit.title.maxLength": "标题最大长度",
 		"cockpit.title.maxLength.description": "组合标签页标题的硬上限（中间省略）。",
 		"cockpit.option.classic": "经典",
+		"cockpit.option.zen": "Zen",
 		"cockpit.option.family": "族",
 		"cockpit.option.readwrite": "读写",
 		"cockpit.option.search": "搜索",
@@ -322,6 +327,7 @@ const DEFINITIONS: readonly SettingDefinition[] = [
 	enumDefinition("agentsMode", "cockpit.group.panels", 0, "cockpit.agentsMode", ["list", "compact"], "live"),
 	enumDefinition("todoMode", "cockpit.group.panels", 1, "cockpit.todoMode", ["list", "compact"], "live"),
 	booleanDefinition("todoExpanded", "cockpit.group.panels", 2, "cockpit.todoExpanded", "live"),
+	enumDefinition("stackStyle", "cockpit.group.layout", 4, "cockpit.stackStyle", ["classic", "zen"], "live"),
 	booleanDefinition("hideNativeAgents", "cockpit.group.panels", 3, "cockpit.hideNativeAgents", "live"),
 	enumDefinition("sidebar.mode", "cockpit.group.sidebar", 0, "cockpit.sidebar.mode", ["auto", "on", "off"], "live"),
 	{
@@ -688,6 +694,7 @@ function validValue(key: CockpitSettingKey, value: JsonValue): boolean {
 	if (key === "title.generationModel") return typeof value === "string";
 	if (key.startsWith("title.")) return typeof value === "boolean";
 	if (key === "quietSymbols") return value === "check" || value === "dot";
+	if (key === "stackStyle") return value === "classic" || value === "zen";
 	if (key === "toolPalette") return ["classic", "family", "readwrite", "search", "mono"].includes(String(value));
 	if (key === "agentsMode" || key === "todoMode") return value === "list" || value === "compact";
 	if (key === "icons.mode") return value === "auto" || value === "nerd" || value === "ascii";

package/src/settings-view.ts

@@ -12,6 +12,7 @@ import type {
 	QuietSymbolMode,
 	SidebarDensity,
 	SidebarMode,
+	StackStyle,
 	ViewMode,
 } from "./types.ts";
 import { tuiT } from "./tui-i18n.ts";
@@ -39,6 +40,7 @@ const QUIET_SYMBOL_MODES: QuietSymbolMode[] = ["check", "dot"];
 const ICON_MODES: IconMode[] = ["auto", "nerd", "ascii"];
 const SIDEBAR_MODES: SidebarMode[] = ["auto", "on", "off"];
 const SIDEBAR_DENSITIES: SidebarDensity[] = ["comfortable", "compact"];
+const STACK_STYLES: StackStyle[] = ["classic", "zen"];
 
 function cycle<T>(values: readonly T[], current: T): T {
 	const index = values.indexOf(current);
@@ -65,6 +67,8 @@ const LEGACY_VALUE_KEYS: Readonly<Record<string, string>> = {
 	compact: "common.value.compact",
 	auto: "common.value.auto",
 	comfortable: "common.value.comfortable",
+	classic: "common.value.classic",
+	zen: "common.value.zen",
 	"picker…": "common.value.picker",
 	[NO_THEME_LABEL]: "legacy.piSettings",
 	"(rule-based)": "common.ruleBased",
@@ -170,6 +174,13 @@ export function buildRows(config: CockpitConfig, live?: LiveRowState): SettingsR
 			value: config.todoExpanded ? "yes" : "no",
 			next: config.todoExpanded ? "no" : "yes",
 		},
+		{
+			key: "stackStyle",
+			accel: "p",
+			label: "stack style",
+			value: config.stackStyle,
+			next: cycle(STACK_STYLES, config.stackStyle),
+		},
 		{
 			key: "hideNativeAgents",
 			accel: "n",
@@ -314,6 +325,8 @@ export function applyRow(config: CockpitConfig, key: string, textValue?: string)
 			return { ...config, todoMode: cycle(VIEW_MODES, config.todoMode) };
 		case "todoExpanded":
 			return { ...config, todoExpanded: !config.todoExpanded };
+		case "stackStyle":
+			return { ...config, stackStyle: cycle(STACK_STYLES, config.stackStyle) };
 		case "hideNativeAgents":
 			return { ...config, hideNativeAgents: !config.hideNativeAgents };
 		case "sidebarMode":